/* These controls exist in the source DOM but are mobile-only. */
.mobile-profile-toggle, .mobile-profile-scrim, .mobile-profile-close { display: none; }
/* PUBLIC r5 mobile layout layer. Desktop rules remain untouched. */
@media (max-width: 768px) {
  *, *::before, *::after { box-sizing: border-box; }
  html, body { width: 100%; max-width: 100%; min-width: 0 !important; overflow-x: hidden !important; }
  body { font-size: 14px; }
  img, video, svg { max-width: 100%; height: auto; }
  .b-site, .site-shell, .archive-shell { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-inline: 0 !important; }

  /* HOME: readable old-web controls, while decorative rails stop squeezing content. */
  .utility-bar { min-height: 44px; height: auto; }
  .utility-bar b { font-size: 12px !important; }
  .utility-bar > a { min-width: 44px; min-height: 38px; font-size: 12px !important; }
  .main-nav { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; min-height: 0; padding: 4px; overflow: visible; }
  .main-nav a, .kuro-public-mode .main-nav a:nth-child(6) { display: flex !important; align-items: center; justify-content: center; min-width: 0; min-height: 44px; height: 44px; padding: 4px; font-size: 14px !important; text-align: center; }
  .world-grid { display: flex; flex-direction: column; width: 100%; max-width: 100%; padding-inline: 4px; }
  .hero-poster, .manga-editorial, .item-wall, .snap-archive, .shop-entry, .right-top, .right-middle, .right-lower { width: 100%; max-width: 100%; overflow: hidden; }
  .hero-poster { height: 700px; }
  .hero-look { max-width: none; object-fit: contain; object-position: center bottom; }
  .hero-logo, .poster-candy, .poster-error, .poster-danger, .poster-real, .scene-lines { max-width: 92%; }
  .floating-download, .right-junk, .sidebar-scrap-trail, .rail-late, .archive-junk, .game-trash, .item-trash { display: none !important; }
  .mobile-persona-b { font-size: 13px; }
  .mobile-persona-b nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-persona-b a { min-height: 44px; font-size: 14px; }

  /* Product files become a normal, readable single column. */
  .item-wall { min-height: 0 !important; }
  .item-files { position: static; display: grid; height: auto !important; min-height: 0; gap: 12px; padding: 10px 6px; }
  .item-files article, .item-files article.wide, .item-files article.wide + article,
  .item-files article:nth-child(n) { position: relative !important; inset: auto !important; display: grid; grid-template-columns: 118px minmax(0, 1fr); width: 100% !important; min-height: 220px; height: auto !important; margin: 0; transform: none !important; }
  .item-files img, .item-files article:nth-child(n) img { width: 110px !important; height: 198px; }
  .item-files h3 { margin-top: 44px; font-size: 14px; }
  .item-files p { font-size: 15px; }
  .item-files span { font-size: 11px; }
  .item-files a { min-height: 44px; font-size: 13px; }

  /* Dress-up keeps its 1060 x 1484 drawing coordinates and only scales the display. */
  .dress-game { height: auto !important; min-height: 0; }
  .game-title, .game-status { min-height: 40px; height: auto; padding: 7px; font-size: 12px; }
  .game-layout { display: grid !important; grid-template-columns: 1fr !important; grid-template-rows: auto !important; height: auto !important; gap: 8px; padding: 6px; }
  .look-tabs, .character-stage, .inventory-panel { grid-column: auto !important; grid-row: auto !important; width: 100%; min-width: 0; height: auto !important; }
  .look-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; max-height: 380px; overflow-y: auto; }
  .look-tabs > b { grid-column: 1 / -1; position: static; font-size: 12px; }
  .look-tabs button { width: auto; height: 154px; margin: 0; padding: 5px; font-size: 12px; }
  .look-tabs img { width: 100%; height: 112px; object-fit: contain; }
  .character-stage { position: relative; aspect-ratio: 1060 / 1484; overflow: hidden; }
  .dressup-canvas, .dressup-render { width: 100%; height: 100%; }
  .inventory-panel { min-height: 360px; padding: 6px; }
  .item-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
  .item-tabs button { min-height: 44px; height: 44px; font-size: 12px; }
  .item-tabs button small { font-size: 9px; }
  .inventory-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 430px; overflow-y: auto; }
  .inventory-slots .dressup-item { min-height: 118px; height: 118px; }
  .inventory-slots .dressup-item img { height: 86px; }
  .inventory-slots .dressup-item span { height: 22px; font-size: 10px; }
  .game-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); height: auto; gap: 5px; overflow: visible; padding: 6px; }
  .game-controls button, .game-controls a { min-width: 0; min-height: 44px; height: 44px; font-size: 12px; }
  .game-controls strong { grid-column: 1 / -1; margin: 0; text-align: center; }

  /* ARCHIVE: undo the desktop-only 960px minimum and put the resident card before the profile. */
  .archive-shell { overflow: hidden !important; }
  .archive-grid, .archive-editing .archive-grid { display: flex !important; flex-direction: column; grid-template-columns: none !important; width: 100%; }
  .archive-left { order: 1; width: 100%; }
  .archive-main { order: 2; width: 100%; }
  .archive-right { order: 3; display: grid; grid-template-columns: 1fr; width: 100%; }
  .archive-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-nav a, .archive-nav button { min-height: 44px; font-size: 13px; }
  .resident-file-body, .file-facts dl > div { grid-template-columns: 1fr; }
  .file-facts dd input, .file-facts dd select, .answer-grid input, .answer-grid textarea { width: 100%; min-width: 0; font-size: 16px; }
  .profile-actions, .profile-photo-actions { display: grid; grid-template-columns: 1fr; }
  .profile-actions button, .profile-photo-actions button, .yearbook-edit-button, .yearbook-save-button { min-height: 44px; font-size: 14px; }
  .answer-grid { grid-template-columns: 1fr; }
  .looks-board, .closet-files { grid-template-columns: 1fr; }

  /* Shop and shared pages already stack most content; this protects forms and actions from shrinking. */
  .site-nav a, .filter-console button, .web-button, .add-cart-button, .checkout-button { min-height: 44px; font-size: 14px; }
  .inventory-list { display: grid !important; grid-template-columns: 1fr !important; }
  .inventory-item, .inventory-item:nth-child(n) { width: 100%; transform: none; }
  .page-main, .product-layout, .about-layout, .checkout-layout { min-width: 0; }
}


/* KURO PUBLIC r6: information-first home flow. Only active below 900px. */
@media (max-width: 900px), (orientation: landscape) and (max-height: 500px) and (max-width: 1100px) {
  html, body { width:100%; max-width:100%; min-width:0!important; overflow-x:hidden!important; }
  body[data-page="home"] .b-site { width:100%!important; max-width:100%!important; min-width:0!important; overflow:clip; }
  body[data-page="home"] .utility-bar { min-height:34px; height:auto; padding:3px 5px; }
  body[data-page="home"] .utility-bar > span:not(.window-controls), body[data-page="home"] .window-controls { display:none!important; }
  body[data-page="home"] .utility-bar > a { min-height:30px; height:30px; margin-left:3px; padding:4px 6px; font-size:10px!important; }
  body[data-page="home"] .main-nav { display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important; height:auto; min-height:40px; padding:3px; gap:3px; overflow:visible; }
  body[data-page="home"] .main-nav > a { display:none!important; min-width:0; height:36px; min-height:36px; padding:3px; font-size:11px!important; text-align:center; }
  body[data-page="home"] .main-nav > a[href="#top"], body[data-page="home"] .main-nav > a[href="#dress-up"], body[data-page="home"] .main-nav > a[href="archive.html"], body[data-page="home"] .main-nav > a[href="about.html"], body[data-page="home"] .main-nav > a[href="cart.html"] { display:flex!important; }
  body[data-page="home"] .main-nav > a[href="lookbook.html"], body[data-page="home"] .main-nav > a[href="shop.html"], body[data-page="home"] .main-nav > a[href="#files"] { display:none!important; }
  body[data-page="home"] .kuro-language-switch { grid-column:1 / -1; display:flex; justify-content:center; align-items:center; min-height:30px; gap:5px; font-size:11px; }
  body[data-page="home"] .kuro-language-switch button { min-width:48px; min-height:28px; font-size:11px; }

  /* Original left rail, now an on-demand drawer. */
  .mobile-profile-toggle { position:fixed; right:8px; bottom:8px; z-index:810; display:flex; align-items:center; justify-content:center; min-height:44px; padding:7px 10px; border:3px outset #fff; background:#fff500; color:#111; box-shadow:3px 3px 0 #111; font:bold 13px Tahoma,Arial,sans-serif; }
  .mobile-profile-scrim { display:block; position:fixed; z-index:790; inset:0; background:rgba(0,0,0,.52); }
  .personal-sidebar { display:block!important; position:fixed!important; z-index:800; top:0; left:0; grid-column:auto!important; grid-row:auto!important; width:min(330px,calc(100vw - 24px))!important; height:100dvh; max-height:100dvh; padding:42px 5px 16px!important; overflow-y:auto; transform:translateX(calc(-100% - 12px))!important; transition:transform .16s steps(2,end); border:3px ridge #fff!important; box-shadow:8px 0 0 #111; }
  .mobile-profile-open .personal-sidebar { transform:translateX(0)!important; }
  .mobile-profile-close { display:block; position:absolute; top:7px; right:7px; z-index:2; min-height:29px; border:2px outset #fff; background:#ff1493; color:#fff; font:bold 11px Tahoma,Arial,sans-serif; }

  /* Main visual → LOOK track → product track → dress-up. */
  body[data-page="home"] .world-grid { display:grid!important; grid-template-columns:minmax(0,1fr)!important; grid-template-areas:"hero" "looks" "products" "game" "snaps" "shop" "manga"; gap:12px; width:100%; max-width:100%; padding:6px; }
  body[data-page="home"] .hero-poster { grid-area:hero; justify-self:stretch; width:100%!important; max-width:100%!important; height:clamp(510px,155vw,680px)!important; min-height:0; overflow:hidden; }
  body[data-page="home"] .hero-look { left:18%!important; top:2%!important; width:79%!important; height:95%!important; max-width:none!important; object-fit:cover!important; object-position:50% 48%!important; }
  body[data-page="home"] .hero-logo { left:3px!important; top:48px!important; width:min(55%,235px)!important; }
  body[data-page="home"] .scene-lines { left:10px!important; top:50%!important; width:70%!important; }
  body[data-page="home"] .scene-lines b { font-size:clamp(12px,4vw,16px); }
  body[data-page="home"] .visual-pack-hero .pack-character, body[data-page="home"] .visual-pack-hero .pack-hello-bones, body[data-page="home"] .hero-trash, body[data-page="home"] .poster-cat { display:none!important; }

  /* Former right rail: swipeable LOOK and product tracks in normal flow. */
  body[data-page="home"] .right-top { display:contents!important; }
  body[data-page="home"] .right-top .lookbook-mini { grid-area:looks; position:static!important; width:100%!important; height:auto!important; margin:0; transform:none!important; overflow:hidden; }
  body[data-page="home"] .lookbook-mini > div { display:flex!important; gap:8px; overflow-x:auto; overscroll-behavior-x:contain; padding:7px; scroll-snap-type:x proximity; }
  body[data-page="home"] .lookbook-mini button { flex:0 0 118px; width:118px!important; height:156px!important; scroll-snap-align:start; }
  body[data-page="home"] .lookbook-mini img { width:100%; height:100%; object-fit:cover; }
  body[data-page="home"] .right-top .flash-box { grid-area:products; height:auto!important; width:100%; overflow:hidden; }
  body[data-page="home"] .flash-box { display:block; white-space:nowrap; overflow-x:auto; scroll-snap-type:x proximity; }
  body[data-page="home"] .flash-box h2, body[data-page="home"] .flash-box > a { display:block; white-space:normal; }
  body[data-page="home"] .flash-box h2 { margin:0; }
  body[data-page="home"] .flash-box article { display:inline-grid; grid-template-columns:1fr!important; vertical-align:top; width:118px; height:174px; margin:7px 0 7px 7px; border:2px outset #fff; background:#fff8dd; scroll-snap-align:start; }
  body[data-page="home"] .flash-box article img { width:114px; height:122px; object-fit:cover; }
  body[data-page="home"] .flash-box article p { margin:0; padding:5px; font-size:10px; }
  body[data-page="home"] .flash-box > a { min-height:36px; padding:9px; font-size:12px; }
  body[data-page="home"] .icon-pile, body[data-page="home"] .floating-download, body[data-page="home"] .right-junk { display:none!important; }

  body[data-page="home"] .dress-game { grid-area:game; grid-column:auto!important; grid-row:auto!important; width:100%; min-width:0; }
  body[data-page="home"] .snap-archive { grid-area:snaps; grid-column:auto!important; grid-row:auto!important; width:100%; height:auto!important; overflow:hidden; }
  body[data-page="home"] .snap-archive > div { display:flex; gap:8px; height:auto!important; padding:8px; overflow-x:auto; }
  body[data-page="home"] .snap-archive figure, body[data-page="home"] .snap-archive figure:nth-child(n) { position:relative!important; inset:auto!important; flex:0 0 110px; width:110px!important; height:155px!important; transform:none!important; }
  body[data-page="home"] .shop-entry { grid-area:shop; grid-column:auto!important; grid-row:auto!important; width:100%; height:154px; }
  body[data-page="home"] .manga-editorial { grid-area:manga; grid-column:auto!important; grid-row:auto!important; width:100%; height:420px; }
  body[data-page="home"] .right-middle, body[data-page="home"] .right-lower, body[data-page="home"] .item-wall, body[data-page="home"] .mobile-persona-b { display:none!important; }

  @media (orientation:landscape) {
    body[data-page="home"] .hero-poster { justify-self:center; width:min(78vw,720px)!important; height:min(560px,78vw)!important; }
    body[data-page="home"] .lookbook-mini button { flex-basis:104px; width:104px!important; }
  }
}