/* Mobile reference rebuild. All legacy mobile rail rules are replaced here.
   These rules apply only to the three landing screens; desktop stays locked. */
.mobile-browser-brand, .mobile-tagline { display: none; }
@media (max-width: 820px) and (orientation: portrait),
       (max-width: 1100px) and (max-height: 700px) and (orientation: landscape) {
  #tablabMobile:has(#introPanel).homepage {
    --chrome-height: 104px;
    --action-top: calc(var(--chrome-height) + (100dvh - var(--chrome-height)) * .46);
    --content-left: 11%;
    --content-width: 73%;
    --button-height: 54px;
    margin: 0 !important; overflow: hidden !important; color: #080807;
  }
  #tablabMobile:has(#introPanel) .tablab-browserbar { height: 48px !important; background: linear-gradient(110deg,#cbb9a6,#d8cabc) !important; }
  #tablabMobile:has(#introPanel) .tablab-browserbar::before, #tablabMobile:has(#introPanel) .tablab-browserbar::after { display: none !important; }
  #tablabMobile:has(#introPanel) .mobile-browser-brand {
    position: fixed; z-index: 160; inset: 0 auto auto 0; height: 48px;
    display: flex; align-items: end; font-family: Arial,sans-serif; color: #080807;
  }
  #tablabMobile:has(#introPanel) .mobile-lights { display:flex; align-self:center; gap:10px; padding:0 16px 0 20px; }
  #tablabMobile:has(#introPanel) .mobile-lights i { width:14px; height:14px; border-radius:50%; background:#ff4035; }
  #tablabMobile:has(#introPanel) .mobile-lights i:nth-child(2) { background:#f6a400; }
  #tablabMobile:has(#introPanel) .mobile-lights i:nth-child(3) { background:#00bb19; }
  #tablabMobile:has(#introPanel) .mobile-brand-name { display:grid; place-items:center; height:40px; width:122px; border-radius:12px 12px 0 0; background:linear-gradient(#fffaf2,#f4ecdf); font-size:20px; font-weight:600; }
  #tablabMobile:has(#introPanel) .mobile-brand-plus { display:grid; place-items:center; width:54px; height:40px; border-radius:12px 12px 0 0; background:linear-gradient(#e0d3c3,#cbbbA7); font-size:30px; font-weight:300; }
  #tablabMobile:has(#introPanel) .foundry-global-nav {
    position:fixed !important; z-index:10020 !important; inset:48px 0 auto !important; width:100% !important; min-width:0 !important;
    height:56px !important; box-sizing:border-box !important; display:flex !important;
    flex-direction:row !important; align-items:center !important; gap:12px !important;
    padding:6px 28px !important; margin:0 !important; border:0 !important; border-radius:0 !important;
    background:#fbf3e6 !important; box-shadow:0 1px 0 #e0cfb9 !important;
    transform:none !important; clip-path:none !important; backdrop-filter:none !important; overflow:visible !important;
  }
  #tablabMobile:has(#introPanel) .foundry-global-nav .foundry-global-control {
    position:static !important; inset:auto !important; display:flex !important; flex:1 1 0 !important;
    justify-content:center !important; align-items:center !important; width:auto !important; min-width:0 !important;
    height:44px !important; min-height:44px !important; padding:0 !important; margin:0 !important;
    border:1px solid #d3bea6 !important; border-radius:10px !important;
    background:linear-gradient(#fffaf2,#f3e7d5) !important; color:#080807 !important;
    box-shadow:inset 0 1px 1px #fff,0 2px 1px #c8b297,0 5px 7px #72523226 !important;
    transform:none !important; filter:none !important; clip-path:none !important;
  }
  #tablabMobile:has(#introPanel) .foundry-global-control svg { visibility:visible !important; width:28px !important; height:28px !important; fill:none !important; stroke:#080807 !important; filter:none !important; }
  #tablabMobile:has(#introPanel) .foundry-global-back svg path { fill:none !important; stroke:#080807 !important; stroke-width:3 !important; }
  #tablabMobile:has(#introPanel) .foundry-global-home svg path { fill:#080807 !important; stroke:none !important; }
  /* Reuse the drawer's existing open state for the original uneven-cross motion. */
  #tablabMobile:has(#introPanel) .foundry-global-nav .foundry-global-menu { position:relative !important; }
  #tablabMobile:has(#introPanel) .foundry-global-menu::after { content:none !important; display:none !important; }
  #tablabMobile:has(#introPanel) .foundry-global-menu span {
    display:block !important; visibility:visible !important; position:absolute !important;
    top:50% !important; left:50% !important; right:auto !important; bottom:auto !important;
    width:26px !important; height:3px !important; margin:0 !important; padding:0 !important;
    border:0 !important; border-radius:2px !important; background:#080807 !important;
    box-shadow:none !important; filter:none !important; opacity:1 !important;
    transform:translate(-50%,-50%) !important; transform-origin:center !important;
    transition:transform 420ms cubic-bezier(.2,.8,.2,1),opacity 220ms ease,width 320ms ease !important;
  }
  #tablabMobile:has(#introPanel) .foundry-global-menu span:nth-child(1) { transform:translate(-50%,calc(-50% - 8px)) !important; }
  #tablabMobile:has(#introPanel) .foundry-global-menu span:nth-child(3) { transform:translate(-50%,calc(-50% + 8px)) !important; }
  #tablabMobile:has(#introPanel).foundry-global-open .foundry-global-menu span:nth-child(1) { width:24px !important; transform:translate(calc(-50% + 1px),-50%) rotate(46deg) !important; }
  #tablabMobile:has(#introPanel).foundry-global-open .foundry-global-menu span:nth-child(2) { opacity:0 !important; transform:translate(-50%,-50%) scaleX(.2) !important; }
  #tablabMobile:has(#introPanel).foundry-global-open .foundry-global-menu span:nth-child(3) { width:27px !important; transform:translate(calc(-50% - 2px),-50%) rotate(-43deg) !important; }
  #tablabMobile:has(#introPanel) .foundry-global-control:focus-visible, #tablabMobile:has(#introPanel) .hero-button:focus-visible, #tablabMobile:has(#introPanel) .explore-choice:focus-visible { outline:3px solid #a64523 !important; outline-offset:3px !important; }
  #tablabMobile:has(#introPanel) .landing {
    position:fixed !important; inset:var(--chrome-height) 0 0 !important; width:100% !important;
    height:calc(100dvh - var(--chrome-height)) !important; min-height:0 !important;
    background:#fbf1e2 url('../assets/backgrounds/tablab-mobile-portrait.png') center bottom / cover no-repeat !important;
    overflow:hidden !important;
  }
  #tablabMobile:has(#introPanel) .landing::before, #tablabMobile:has(#introPanel) .landing::after, #tablabMobile:has(#introPanel) .fm-home-v2, #tablabMobile:has(#introPanel) .tablab-monitor-shadow { display:none !important; }
  #tablabMobile:has(#introPanel) .tablab-monitor-peek { display:none !important; }
  #tablabMobile:has(#introPanel) .hero { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; margin:0 !important; transform:none !important; overflow:visible !important; }
  #tablabMobile:has(#introPanel) #introPanel, #tablabMobile:has(#introPanel) #sortPanel { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; padding:0 !important; display:block !important; transform:none !important; }
  #tablabMobile:has(#introPanel) #introPanel .hero-title, #tablabMobile:has(#introPanel) #introPanel .hero-lines { display:none !important; }
  #tablabMobile:has(#introPanel) .mobile-tagline {
    display:block; position:absolute; left:var(--content-left); top:calc((100dvh - var(--chrome-height)) * .16);
    width:84%; color:#080807; font:500 clamp(40px,12.4vw,74px)/1.12 'Bodoni Moda',Georgia,serif; letter-spacing:-.055em; text-align:left;
  }
  #tablabMobile:has(#introPanel) .mobile-tagline > div { white-space:nowrap; }
  #tablabMobile:has(#introPanel) #introPanel .hero-actions, #tablabMobile:has(#introPanel) #sortPanel .sort-actions {
    position:fixed !important; inset:var(--action-top) auto auto var(--content-left) !important;
    width:var(--content-width) !important; max-width:none !important; display:grid !important; grid-template-columns:1fr !important;
    gap:12px !important; margin:0 !important; padding:0 !important; transform:none !important;
  }
  #tablabMobile:has(#introPanel) #introPanel .hero-button, #tablabMobile:has(#introPanel) #sortPanel .hero-button {
    display:flex !important; justify-content:center !important; align-items:center !important;
    width:100% !important; max-width:none !important; height:var(--button-height) !important; min-height:var(--button-height) !important;
    padding:8px !important; box-sizing:border-box !important; border:1px solid #ba6b49 !important; border-radius:10px !important;
    background:linear-gradient(115deg,#b9512a,#a53a1b) !important; color:#fffaf5 !important; -webkit-text-fill-color:currentColor !important;
    font:500 16px/1.2 Arial,sans-serif !important; letter-spacing:.08em !important; text-transform:uppercase !important;
    text-shadow:none !important; clip-path:none !important; filter:none !important; transform:none !important;
    box-shadow:inset 0 1px 2px #ffffff80,0 2px 1px #8c512f70,0 6px 8px #72523230 !important;
  }
  #tablabMobile:has(#introPanel) #introPanel #exploreButton { color:#080807 !important; background:linear-gradient(#fffaf3,#f6eadb) !important; border:1px solid #39261b !important; }
  #tablabMobile:has(#introPanel) .hero-button::before, #tablabMobile:has(#introPanel) .hero-button::after { display:none !important; }
  #tablabMobile:has(#introPanel) #sortPanel .sort-copy { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; align-self:stretch !important; display:block !important; padding:0 !important; transform:none !important; }
  #tablabMobile:has(#introPanel) #sortPanel .sort-title { position:absolute !important; top:17% !important; left:var(--content-left) !important; width:84% !important; margin:0 !important; font:500 clamp(36px,10vw,65px)/1.1 'Bodoni Moda',Georgia,serif !important; color:#080807 !important; -webkit-text-fill-color:currentColor !important; text-align:left !important; }
  #tablabMobile:has(#introPanel) #sortPanel .sort-lines { position:absolute !important; top:calc(17% + clamp(39.6px,11vw,71.5px) + 8px) !important; left:var(--content-left) !important; margin:0 !important; font:500 clamp(36px,10vw,65px)/1.1 'Bodoni Moda',Georgia,serif !important; text-align:left !important; color:#080807 !important; width:84% !important; min-height:0 !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; box-sizing:border-box !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:none !important; box-shadow:none !important; }
  #tablabMobile:has(#introPanel) #exploreScreen { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; min-height:0 !important; padding:26px 28px 32px !important; box-sizing:border-box !important; overflow:auto !important; background:none !important; }
  #tablabMobile:has(#introPanel) #exploreScreen::before, #tablabMobile:has(#introPanel) #exploreScreen::after, #tablabMobile:has(#introPanel) .explore-wordmark, #tablabMobile:has(#introPanel) .explore-blueprint, #tablabMobile:has(#introPanel) .explore-anvil-rule { display:none !important; }
  #tablabMobile:has(#introPanel).explore-open #exploreScreen { display:grid !important; grid-template-columns:1fr !important; align-content:start !important; gap:22px !important; }
  #tablabMobile:has(#introPanel) .explore-boardroom, #tablabMobile:has(#introPanel) .explore-choices { position:static !important; inset:auto !important; width:100% !important; height:auto !important; margin:0 !important; transform:none !important; }
  #tablabMobile:has(#introPanel) .explore-kicker { color:#6b412b !important; font-size:14px !important; }
  #tablabMobile:has(#introPanel) .explore-boardroom h2 { color:#080807 !important; -webkit-text-fill-color:currentColor !important; font:500 36px/1.08 'Bodoni Moda',Georgia,serif !important; margin:12px 0 !important; text-shadow:none !important; }
  #tablabMobile:has(#introPanel) .explore-boardroom p { color:#35271d !important; font:400 16px/1.4 Arial,sans-serif !important; }
  #tablabMobile:has(#introPanel) .explore-choices { display:grid !important; grid-template-rows:repeat(4,auto) !important; gap:12px !important; }
  #tablabMobile:has(#introPanel) #exploreScreen .explore-choice { display:flex !important; justify-content:center !important; align-items:center !important; min-height:52px !important; padding:10px !important; box-sizing:border-box !important; border:1px solid #bda58b !important; border-radius:10px !important; background:linear-gradient(#fffaf3,#f4e5d1) !important; color:#080807 !important; font:500 16px/1.25 Arial,sans-serif !important; letter-spacing:0 !important; box-shadow:inset 0 1px 1px #fff,0 2px 1px #c8b297,0 5px 7px #72523226 !important; }
  #tablabMobile:has(#introPanel) #exploreScreen .explore-choice[href="./boardroom/"] { background:linear-gradient(115deg,#984122,#783019) !important; color:#fffaf5 !important; -webkit-text-fill-color:currentColor !important; border-color:#71351f !important; font-weight:600 !important; box-shadow:inset 0 1px 2px #ffffff60,0 2px 1px #66301980,0 6px 8px #72523240 !important; }
  #tablabMobile:has(#introPanel) .explore-choice::before, #tablabMobile:has(#introPanel) .explore-choice::after { display:none !important; }
  #tablabMobile:has(#introPanel) .foundry-global-drawer { top:var(--chrome-height) !important; max-width:calc(100vw - 24px) !important; max-height:calc(100dvh - var(--chrome-height) - 12px) !important; overflow:auto !important; }
}
@media (max-width:1100px) and (max-height:700px) and (orientation:landscape) {
  #tablabMobile:has(#introPanel).homepage { --chrome-height:52px; --content-left:49.5%; --content-width:32.8%; --action-top:calc(52px + (100dvh - 52px) * .34); --button-height:54px; }
  #tablabMobile:has(#introPanel) .tablab-browserbar { height:52px !important; }
  #tablabMobile:has(#introPanel) .mobile-browser-brand { height:52px; }
  #tablabMobile:has(#introPanel) .mobile-brand-name, #tablabMobile:has(#introPanel) .mobile-brand-plus { height:43px; }
  #tablabMobile:has(#introPanel) .foundry-global-nav { inset:0 2.5% auto auto !important; width:27% !important; height:52px !important; padding:4px 0 !important; background:none !important; box-shadow:none !important; gap:8px !important; }
  #tablabMobile:has(#introPanel) .foundry-global-nav .foundry-global-control { height:44px !important; }
  #tablabMobile:has(#introPanel) .mobile-tagline { top:22%; left:8%; width:40%; font-size:clamp(36px,6.9vw,76px); line-height:1.06; }
  #tablabMobile:has(#introPanel) .landing { background-image:url('../assets/backgrounds/tablab-mobile-landscape.png') !important; background-position:right center !important; }
  #tablabMobile:has(#introPanel) #sortPanel .sort-title { top:calc(var(--action-top) - var(--chrome-height) - 86px) !important; left:8% !important; width:43% !important; font-size:32px !important; }
  #tablabMobile:has(#introPanel) #sortPanel .sort-lines { top:calc(var(--action-top) - var(--chrome-height) - 42.8px) !important; left:8% !important; width:43% !important; font-size:32px !important; }
  #tablabMobile:has(#introPanel).explore-open #exploreScreen { grid-template-columns:1fr 1fr !important; gap:24px !important; padding:24px 18% 24px 7% !important; align-content:center !important; }
  #tablabMobile:has(#introPanel) .explore-boardroom h2 { font-size:32px !important; }
  #tablabMobile:has(#introPanel) .explore-boardroom p { font-size:16px !important; }
  #tablabMobile:has(#introPanel) .explore-choices { gap:8px !important; }
  #tablabMobile:has(#introPanel) #exploreScreen .explore-choice { min-height:46px !important; font-size:14px !important; }
}
@media (max-width:820px) and (orientation:portrait) and (max-height:650px) {
  #tablabMobile:has(#introPanel).homepage { --action-top:calc(104px + (100dvh - 104px) * .49); --button-height:48px; }
  #tablabMobile:has(#introPanel) .mobile-tagline { top:10%; font-size:11.8vw; }
  #tablabMobile:has(#introPanel) .landing { min-height:430px !important; }
}

@media (prefers-reduced-motion:reduce) {
  #tablabMobile:has(#introPanel) .foundry-global-menu span { transition:none !important; }
}