/* Compact layouts share the same measured scene bounds as the CRT camera. */
@media (max-width:760px), (max-height:500px) and (max-width:1100px) {
  :root { --pad:20px; }
  html { scrollbar-gutter:auto; }
  body { -webkit-text-size-adjust:100%; }
  .stage { height:100svh; min-height:0; }
  .site-header {
    position:fixed; top:0; left:0; right:0; z-index:12; background:var(--ink);
    height:78px;
    padding:calc(14px + env(safe-area-inset-top)) max(var(--pad),env(safe-area-inset-right)) 14px max(var(--pad),env(safe-area-inset-left));
  }
  .brand { min-height:44px; gap:9px; font-size:11px; }
  .brand svg { width:30px; height:30px; }
  .site-header nav { gap:16px; font-size:11px; }
  .site-header nav a,.header-cta { min-height:44px; display:inline-flex; align-items:center; }
  .site-header .nav-work,.site-header nav>a[href='#approach'] { display:none; }
  .header-cta { gap:10px; padding:6px 0; }
  .stage-copy,.hero-copy,.amber-copy,.fuel-copy {
    top:calc(94px + env(safe-area-inset-top));
    left:max(var(--pad),env(safe-area-inset-left));
    right:max(var(--pad),env(safe-area-inset-right));
    width:auto; max-width:none; transform:none;
  }
  .hero-copy h1 { font-size:clamp(43px,11.7vw,64px); line-height:.98; }
  .hero-copy h1 br:nth-of-type(2) { display:none; }
  .hero-copy h1 em { margin-left:.12em; }
  .hero-description { font-size:14px; line-height:1.55; margin-top:17px; }
  .hero-copy .text-link { margin-top:10px; min-height:44px; padding:9px 0; font-size:12px; }
  .project-copy .eyebrow { font-size:9px; letter-spacing:.08em; }
  .project-copy h2 { font-size:clamp(33px,9.5vw,52px); line-height:1.02; margin:12px 0; max-width:100%; }
  .project-copy h2 br { display:none; }
  .dudmc-copy h2 { font-size:clamp(30px,8.7vw,48px); }
  .project-description { max-width:440px; font-size:14px; line-height:1.5; text-wrap:pretty; }
  .project-meta { display:none; }
  .project-actions { gap:18px; margin-top:15px; flex-wrap:wrap; }
  .action-button { min-height:44px; padding:12px 15px; font-size:12px; gap:17px; }
  .quiet-button { min-height:44px; font-size:12px; padding:10px 0; }
  .interaction-note { font-size:8px; line-height:1.6; letter-spacing:.025em; margin-top:10px; max-width:440px; }
  .interaction-note a { display:inline-flex; align-items:center; min-height:40px; }
  .stage-footer {
    left:max(var(--pad),env(safe-area-inset-left));
    right:max(var(--pad),env(safe-area-inset-right));
    bottom:calc(5px + env(safe-area-inset-bottom));
    display:grid; grid-template-columns:1fr auto; gap:0;
  }
  .scroll-caption { display:none; }
  .chapter-nav {
    grid-column:1/-1; display:flex; justify-content:flex-start;
    gap:22px; width:100%; max-width:none; min-width:0;
    overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none;
    scroll-padding-inline:0; touch-action:pan-x;
  }
  .chapter-nav::-webkit-scrollbar { display:none; }
  .chapter-nav a {
    flex:0 0 auto; min-width:92px; min-height:58px;
    flex-direction:column; align-items:flex-start; justify-content:center;
    gap:5px; padding:9px 0; font-size:12px; line-height:1.25; white-space:nowrap;
  }
  .chapter-nav a>span:first-child { font-size:10px; font-variant-numeric:tabular-nums; }
  .motion-toggle { grid-column:2; justify-self:end; min-height:40px; min-width:84px; padding:8px 0; font-size:9px; text-align:right; }
  .motion-toggle span { min-width:22px; }
  .monitor-session {
    top:calc(10px + env(safe-area-inset-top)); left:14px; right:14px;
    padding:8px 12px 4px; gap:3px; flex-wrap:wrap;
  }
  .session-label { font-size:9px; }
  .session-hint { display:none; }
  .monitor-session>div { width:100%; margin:0; display:flex; justify-content:space-between; gap:12px; }
  .monitor-session button { min-height:44px; font-size:12px; }
  .screen-surface.is-compact .screen-glass { box-shadow:inset 0 0 12px 2px #0005; }
  .screen-surface.is-compact .screen-glass::after { opacity:.035; }
  .screen-surface.is-compact .screen-boot { padding:24px; font-size:12px; line-height:1.6; }
  .screen-surface.is-compact .screen-boot strong { font-size:26px; margin-bottom:16px; }
  .project-dialog { width:100%; height:100dvh; max-height:100dvh; border:0; }
  .dialog-topbar { height:auto; min-height:56px; padding:env(safe-area-inset-top) 14px 0; gap:12px; }
  .dialog-topbar>.mono { font-size:9px; min-width:0; line-height:1.5; }
  .dialog-topbar>div { flex-shrink:0; gap:16px; }
  .dialog-topbar button,.dialog-topbar a { min-height:48px; min-width:44px; font-size:11px; gap:7px; }
  .project-dialog[open] { display:flex; flex-direction:column; }
  .expanded-screen { height:auto; flex:1; min-height:0; padding-bottom:env(safe-area-inset-bottom); }
  .brief-dialog { width:100%; max-width:100%; max-height:100dvh; border:0; overscroll-behavior:contain; }
  .brief-dialog .dialog-topbar { position:sticky; top:0; z-index:1; }
  .brief-content { padding:24px var(--pad) calc(24px + env(safe-area-inset-bottom)); }
  .brief-content h2 { font-size:44px; }
  .brief-intro,.form-notice,.form-status { font-size:13px; line-height:1.55; }
  form label { font-size:13px; }
  input,select,textarea { font-size:16px; min-height:46px; }
  .field-row { grid-template-columns:1fr; gap:0; }
  .security-section,.approach-section,.contact-section { padding:44px var(--pad) 48px; }
  .section-kicker { font-size:9px; line-height:1.5; }
  .section-kicker>span+span { max-width:45%; text-align:right; }
  .security-intro,.approach-intro { display:block; margin-top:32px; }
  .security-intro h2,.approach-intro h2 { font-size:clamp(43px,12vw,60px); line-height:1.03; }
  .security-intro>div,.approach-intro>div { margin-top:26px; }
  .security-intro .experience-statement,.approach-intro p:first-child { font-size:22px; line-height:1.4; }
  .security-intro p,.approach-intro p+p,.security-principles p,.principles p { font-size:15px; line-height:1.65; text-wrap:pretty; }
  .security-principles,.principles { grid-template-columns:1fr; gap:28px; margin-top:32px; padding-top:26px; }
  .security-principles p,.principles p { max-width:440px; }
  .security-principles .mono,.principles article>.mono { font-size:10px; }
  .security-principles h3 { font-size:24px; margin:12px 0 10px; }
  .principles article { grid-template-columns:36px 1fr; }
  .approach-intro .text-link { min-height:44px; margin-top:18px; font-size:13px; }
  .contact-main { margin:34px 0; gap:12px; }
  .contact-main h2 { font-size:clamp(42px,13vw,76px); }
  .contact-circle { width:60px; height:60px; font-size:37px; margin:0; }
  .contact-bottom>p { font-size:15px; }
  .contact-address .mono,.placeholder-note { font-size:11px; }
  .site-footer { padding:16px var(--pad) calc(16px + env(safe-area-inset-bottom)); }
  .site-footer .mono { font-size:9px; }
  .site-footer a { min-height:44px; display:inline-flex; align-items:center; font-size:12px; }
  .security-section,.approach-section,.contact-section { scroll-margin-top:78px; }
  .scene-fallback #scene { top:var(--fallback-top,370px); bottom:115px; left:var(--pad); right:var(--pad); gap:7px; grid-template-columns:1fr 1fr; }
  .scene-fallback .fallback-project { min-height:60px; border-width:3px; border-radius:7px; padding:8px 10px; flex-direction:column; align-items:flex-start; justify-content:center; gap:5px; }
  .scene-fallback .fallback-project strong { font-size:14px; }
}

@media (max-width:760px) and (max-height:700px) {
  .stage-copy,.hero-copy,.amber-copy,.fuel-copy { top:calc(84px + env(safe-area-inset-top)); }
  .hero-copy h1 { font-size:clamp(39px,10.8vw,56px); }
  .hero-description { margin-top:12px; }
  .hero-copy .text-link { margin-top:3px; }
  .project-copy h2 { margin:9px 0; }
  .project-description { font-size:13px; }
  .project-actions { margin-top:10px; }
  .interaction-note { margin-top:5px; }
  .stage-footer { bottom:env(safe-area-inset-bottom); }
  .chapter-nav a { min-height:52px; }
}

@media (max-height:500px) and (max-width:1100px) and (min-width:600px), (max-width:760px) and (min-width:600px) and (max-height:700px) {
  .site-header { height:62px; padding-top:8px; padding-bottom:8px; }
  .stage-copy,.hero-copy,.amber-copy,.fuel-copy { top:76px; width:40%; right:auto; }
  .hero-copy h1 { font-size:clamp(30px,4.5vw,42px); }
  .hero-description { font-size:12px; margin-top:12px; }
  .hero-copy .text-link { margin-top:0; }
  .project-copy h2,.dudmc-copy h2 { font-size:29px; margin:8px 0; }
  .project-description { font-size:12px; line-height:1.4; }
  .project-actions { margin-top:8px; gap:14px; }
  .project-actions button { font-size:11px; min-height:40px; padding-block:8px; }
  .interaction-note { font-size:7px; margin-top:4px; }
  .interaction-note a { min-height:30px; }
  .stage-footer { display:flex; align-items:center; gap:20px; bottom:env(safe-area-inset-bottom); }
  .chapter-nav { flex:1; gap:20px; }
  .chapter-nav a { min-height:54px; font-size:11px; min-width:74px; }
  .motion-toggle { flex:none; }
  .monitor-session { flex-wrap:nowrap; align-items:center; padding:4px 12px; }
  .monitor-session>div { width:auto; margin-left:auto; gap:24px; }
  .scene-fallback #scene { left:46%; top:76px; bottom:70px; }
}