/* Mobile adaptation; the archived desktop rules remain unchanged. */
@media (max-width: 1023px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { margin: 0; min-width: 0 !important; font-size: 16px; }
  body:not(#body) #content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 760px;
    min-width: 0;
    margin: 0 auto;
    padding: 12px max(12px, env(safe-area-inset-left)) max(20px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-right));
  }
  body:not(#body) #content::before, body:not(#body) #content::after { content: none; display: none; }
  #content > #header { order: 0; }
  #content > #navbar { order: 1; }
  #content > .postcontainer { order: 2; }
  #content > #sidebar { order: 3; }
  #content > .adcontainer { order: 4; }
  #header, #navbar, #sidebar, .adcontainer, .postcontainer, .post_inner_container, .post {
    box-sizing: border-box;
    float: none !important;
    width: 100% !important;
    max-width: 100%;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  #header { margin-bottom: 0; padding-top: 4px; }
  #header h1 { margin: 0; font-size: clamp(32px, 8vw, 48px); line-height: 1.1; }
  #header h1 a.no_header { font-size: 1em; overflow-wrap: anywhere; }
  #content #navbar { font-size: 16px; }
  #navbar > ul { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; margin: 0; }
  #content #navbar > ul > li { position: relative; align-items: center; justify-content: center; float: none !important; display: flex; margin: 0; padding: 0; flex: 1 1 auto; }
  #navbar > ul > li > a, #navbar > ul > li > span {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    box-sizing: border-box; min-width: 44px; min-height: 44px; padding: 10px 12px;
    font-size: 16px; line-height: 1.35; white-space: normal;
  }
  #content #navbar > ul > li > svg { flex: 0 0 auto; margin-right: 8px; }
  #navbar [data-menu-target]::after { content: ""; position: absolute; inset: 0; }
  #navbar > .pane { width: 100% !important; max-width: 100%; box-sizing: border-box; }
  #navbar .pane .leftcolumn, #navbar .pane .rightcolumn,
  #navbar .pane .column, #navbar .pane .column1, #navbar .pane .column2, #navbar .pane .column3 {
    float: none !important; width: 100% !important; margin: 0; height: auto;
  }
  #navbar .pane div > div { margin: 12px; }
  #navbar .pane div > ul { padding: 0 12px; }
  #navbar .pane li { padding: 0; }
  #navbar .pane li a { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 8px; margin: 0; box-sizing: border-box; }
  #content .post { font-size: 16px; line-height: 1.65; margin-bottom: 24px; }
  .post .regular, .post .photo, .post .video, .post .conversation, .post .photoset, .post .link,
  .post .caption { box-sizing: border-box; padding: 16px !important; max-width: 100%; }
  .regular_body, .post p, .post li, .post td, .post th { font-size: 16px; line-height: 1.65; }
  .post h2 { font-size: 22px; line-height: 1.25; overflow-wrap: anywhere; }
  .post h3 { font-size: 19px; line-height: 1.3; }
  .post p, .post li, .post blockquote, .post a, .post .short_url { overflow-wrap: anywhere; }
  .post blockquote { max-width: 100%; margin-left: 0; margin-right: 0; }
  .date_and_notes a { box-sizing: border-box; min-height: 44px; padding: 10px 12px; font-size: 14px; }
  .just_notes { padding: 10px 12px; }
  .just_notes a { display: inline-flex; align-items: center; min-height: 44px; padding: 4px; }
  .post .photo a, .post .photoset a, .post .html_photoset a { display: block; max-width: 100%; }
  img, video, iframe, canvas { max-width: 100% !important; }
  img, video { height: auto !important; }
  .photo_holder { width: auto !important; max-width: 100%; height: auto !important; }
  .html_photoset, .photoset_container, .photo, .video { width: auto !important; max-width: 100%; min-width: 0; }
  .html_photoset { overflow-x: auto; }
  table { display: block; box-sizing: border-box; width: auto !important; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  pre { max-width: 100%; overflow-x: auto; }
  #sidebar #description { font-size: 16px; line-height: 1.6; }
  #sidebar #tumblr_portrait { display: block; float: none !important; margin: 0 auto 16px !important; max-width: 150px !important; }
  #sidebar .page_link, #sidebar button, #sidebar input[type=submit] { box-sizing: border-box; min-height: 44px; padding: 10px 0; }
  #sidebar input, #sidebar select, #sidebar textarea { box-sizing: border-box; max-width: 100%; font-size: 16px !important; }
  .adcontainer { margin-top: 12px; }
  .adcontainer .pwcontent { font-size: 16px; line-height: 1.6; }
  #footer_content { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
  #footer_content a, #pagination a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px; box-sizing: border-box; }
  #footer_content .page_of { float: none; }
  .short_url { overflow-wrap: anywhere; }
  .archive-banner { color: #cfc7bb !important; }
  .archive-banner a { color: #e6b877 !important; }
  /* Monthly archive captures use Tumblr's separate thumbnail theme. */
  body#body #content, .l-content { box-sizing: border-box; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 12px !important; }
  #nav_archive, body#body #nav { box-sizing: border-box; position: relative !important; width: 100% !important; min-width: 0 !important; height: auto; }
  .archive-controls-wrapper { width: auto !important; max-width: 100%; }
  .archive-controls { display: flex; flex-wrap: wrap; height: auto; }
  #nav_archive a, #nav_archive button, body#body #nav a, body#body #nav button { min-height: 44px; box-sizing: border-box; }
  #register { float: none; }
}