/* Griffey OS — mobile portrait experience layer
   Desktop is intentionally untouched. These rules activate only on phone-sized viewports. */

@media (max-width: 820px){
  :root{
    --mobile-pad:clamp(16px,4.6vw,22px);
    --mobile-top:calc(66px + env(safe-area-inset-top));
    --mobile-dock:calc(92px + env(safe-area-inset-bottom));
  }

  html{scroll-padding-top:78px;-webkit-text-size-adjust:100%;overflow-x:clip}
  body{
    width:100%;
    overflow-x:clip;
    padding-bottom:var(--mobile-dock);
    cursor:auto!important;
    overscroll-behavior-y:none;
    -webkit-font-smoothing:antialiased;
  }
  body *,body *::before,body *::after{cursor:auto!important}
  button,a,summary,[role="button"]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .cursor-ring,.cursor-glow{display:none!important}
  .grain{opacity:.075}
  .scroll-progress{height:2px}
  .parallax{transform:none!important}

  /* Boot screen */
  .boot{min-height:100svh;min-height:100dvh;padding:calc(20px + env(safe-area-inset-top)) 24px calc(20px + env(safe-area-inset-bottom));text-align:center}
  .boot__mark{width:68px;height:68px}
  .boot__title{font-size:13px;letter-spacing:.24em}
  .boot__lines{font-size:8px;letter-spacing:.12em}

  /* Mobile navigation */
  .topbar{
    height:calc(64px + env(safe-area-inset-top));
    padding:env(safe-area-inset-top) var(--mobile-pad) 0;
    gap:12px;
    background:linear-gradient(180deg,rgba(5,3,4,.95),rgba(5,3,4,.58),transparent);
  }
  .topbar.scrolled{height:calc(60px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
  .brand{gap:8px;min-width:0}
  .brand img{width:min(40vw,148px)}
  .brand>span{font-size:7px;padding:5px}
  .menu-toggle{width:46px;height:46px;border:1px solid rgba(255,255,255,.16);background:rgba(7,4,5,.74);display:grid!important;place-content:center;gap:6px;z-index:4}
  .menu-toggle span{display:block;width:20px;height:1px;background:#fff;transition:.3s var(--ease)}
  .topbar.menu-open{
    min-height:100svh;min-height:100dvh;
    padding:calc(env(safe-area-inset-top) + 17px) var(--mobile-pad) calc(env(safe-area-inset-bottom) + 22px);
    background:radial-gradient(circle at 75% 15%,rgba(217,11,32,.18),transparent 34%),#050304;
    border-bottom:0;
  }
  .topbar.menu-open .menu-toggle span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .topbar.menu-open .menu-toggle span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .topbar.menu-open .nav{inset:calc(92px + env(safe-area-inset-top)) var(--mobile-pad) auto;display:flex}
  .topbar.menu-open .nav a{font-size:clamp(30px,11vw,48px);line-height:.92;letter-spacing:-.045em;padding:18px 0;color:#f5f1ef}
  .topbar.menu-open .nav a::after{display:none}
  .topbar.menu-open .nav-buy{left:var(--mobile-pad);right:var(--mobile-pad);bottom:calc(22px + env(safe-area-inset-bottom));min-height:58px}

  .confusion-tab{
    left:10px;top:calc(72px + env(safe-area-inset-top));
    max-width:176px;padding:10px 12px 10px 30px;
    border-color:rgba(255,36,59,.62);
    box-shadow:0 12px 38px rgba(0,0,0,.58),0 0 22px rgba(222,13,36,.16);
  }
  .confusion-tab span{font-size:9px}
  .confusion-tab small{display:block;font-size:6px}

  /* Global mobile section rhythm */
  .section{padding:84px var(--mobile-pad);overflow:hidden}
  .section-label{font-size:9px;line-height:1.35;letter-spacing:.16em;gap:9px;margin-bottom:25px}
  .section-label span{padding:6px}
  .section-head{margin-bottom:40px}
  .section-head>p{font-size:14px;line-height:1.6}
  .section h2{font-size:clamp(43px,13vw,66px);line-height:.9;letter-spacing:-.06em}
  .eyebrow{font-size:8px;letter-spacing:.13em;line-height:1.5}
  .eyebrow span{width:25px}

  /* 9:16 / portrait hero */
  .hero{
    min-height:100svh;min-height:100dvh;
    padding:calc(122px + env(safe-area-inset-top)) var(--mobile-pad) calc(34px + env(safe-area-inset-bottom));
    align-items:flex-end;
  }
  .hero__backdrop{inset:0}
  .hero__backdrop img{object-position:50% 12%!important;transform:scale(1.02)}
  .hero__shade{
    background:
      linear-gradient(180deg,rgba(5,4,4,.05) 0%,rgba(5,4,4,.18) 28%,rgba(5,4,4,.76) 58%,#050404 91%),
      linear-gradient(90deg,rgba(5,4,4,.35),transparent 35%,rgba(5,4,4,.18));
  }
  .hero__grid{background-size:42px 42px;mask-image:linear-gradient(180deg,transparent 5%,black 45%,black)}
  .hero__content{width:100%;max-width:520px;margin:0;padding-top:0}
  .hero-crumble-shell{margin:18px 0 22px}
  .hero h1{font-size:clamp(60px,18.8vw,89px);line-height:.78;letter-spacing:-.078em}
  .hero__sub{font-size:13.5px;line-height:1.52;color:#d1c9c8;max-width:100%}
  .destroy-hint{width:100%;min-height:44px;justify-content:flex-start;font-size:8px;letter-spacing:.12em;padding:0 13px}
  .destroy-hint b{margin-left:auto}
  .hero__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:25px 0 22px;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
  .hero__stats>div{border-left:0;border-right:1px solid rgba(255,255,255,.1);padding:13px 8px;min-width:0}
  .hero__stats>div:last-child{border-right:0}
  .hero__stats strong{font-size:20px}
  .hero__stats span{font-size:7px;line-height:1.3;letter-spacing:.08em}
  .hero__actions{display:grid;grid-template-columns:1fr;gap:9px}
  .cta{width:100%;min-height:54px;padding:0 16px;justify-content:space-between;font-size:8.5px;letter-spacing:.11em}
  .micro{text-align:center;font-size:7.5px;line-height:1.55;letter-spacing:.09em;margin:16px 0 0}
  .hero__rail{display:none}

  /* Belief */
  .manifesto__grid{grid-template-columns:1fr;gap:42px}
  .manifesto__copy p{font-size:12px;letter-spacing:.06em;margin:0 0 7px}
  .manifesto__copy h2{font-size:clamp(38px,12.2vw,58px);margin:0 0 30px;line-height:.86}
  .manifesto__machine{padding:26px 20px}
  .manifesto__orb{width:min(63vw,238px);height:min(63vw,238px);margin-inline:auto}
  .manifesto__machine blockquote{font-size:20px;line-height:1.3}
  .manifesto__machine>p{font-size:12px}
  .manifesto__machine>strong{font-size:11px;line-height:1.5}

  /* Engine */
  .workstation.section--bleed{padding:82px var(--mobile-pad);display:grid;grid-template-columns:1fr;gap:38px;min-height:0;align-items:start}
  .workstation__image{opacity:.12;inset:0}
  .workstation__image img{object-position:48% center}
  .workstation__overlay{background:linear-gradient(180deg,#050404 0,rgba(5,4,4,.72) 30%,#050404 100%)}
  .workstation__artifact{width:100%;max-width:430px;justify-self:center}
  .workstation__artifact::after{inset:10px -10px -10px 10px}
  .workstation__copy{max-width:none}
  .workstation__copy>p{font-size:14px;line-height:1.64}
  .terminal{margin-top:28px}
  .terminal__top{padding:11px 12px}
  .terminal__top span{font-size:7.5px;margin-left:auto}
  .terminal__body{padding:18px 14px}
  .terminal__body p{font-size:9.5px;line-height:1.55;gap:10px}
  .terminal__footer{grid-template-columns:repeat(3,1fr)}
  .terminal__footer span{padding:10px 5px;border-right:1px solid rgba(255,255,255,.08)!important;border-bottom:0!important;font-size:7px;letter-spacing:.04em}
  .terminal__footer span:last-child{border-right:0!important}
  .terminal__footer b{font-size:15px}

  /* Workflow UI */
  .workflow-overview{display:grid;grid-template-columns:1fr;gap:24px;margin-bottom:56px}
  .workflow-overview__image{padding:6px;aspect-ratio:16/9;min-height:0}
  .workflow-overview__image img{width:100%;height:100%;object-fit:cover}
  .workflow-overview__image span{right:10px;bottom:10px;font-size:7px;padding:8px 9px}
  .workflow-overview__steps{gap:0;margin-top:0}
  .workflow-overview__steps article{align-items:flex-start;padding:16px 0;gap:14px}
  .workflow-overview__steps article>b{font-size:22px;min-width:32px}
  .workflow-overview__steps h3{font-size:12px;line-height:1.25;letter-spacing:.05em}
  .workflow-overview__steps p{font-size:11px;line-height:1.5}
  .workflow-gallery{grid-template-columns:1fr;min-height:0}
  .workflow-gallery__stage{min-height:0;aspect-ratio:16/9}
  .workflow-gallery__stage>button{right:9px;top:9px;padding:9px 10px;font-size:7px}
  .workflow-gallery__copy{padding:26px 18px 24px;min-height:280px}
  .workflow-gallery__copy h3{font-size:clamp(23px,7.2vw,32px);line-height:1.02;margin:12px 0}
  .workflow-gallery__copy>p:not(.stage-count){font-size:12px;line-height:1.58}
  .stage-count{font-size:9px}
  .gallery-controls{margin-top:auto;padding-top:24px;justify-content:space-between}
  .gallery-controls>button{width:48px;height:48px;font-size:20px}
  .gallery-dots{flex:1;justify-content:center}
  .gallery-dots button{height:3px;min-width:24px}
  .gallery-dots button.active{width:42px}

  /* Connected system */
  .pipeline .section-head{margin-bottom:40px}
  .pipeline .section-head h2{line-height:.96}
  .video-route-trigger{width:100%;min-height:56px;padding:0 13px;font-size:8px;letter-spacing:.09em;line-height:1.3;text-align:center}
  .pipeline-map{height:auto;display:grid;grid-template-columns:1fr;gap:10px;border:0;margin:0 0 42px;padding-left:18px;position:relative}
  .pipeline-map::before{content:"";position:absolute;left:5px;top:18px;bottom:18px;width:1px;background:linear-gradient(#e71931,rgba(231,25,49,.12),#e71931);box-shadow:0 0 14px rgba(231,25,49,.36)}
  .pipeline-map svg,.pulse-dot{display:none}
  .pipe-node,.pipe-node.optional{position:relative!important;left:auto!important;top:auto!important;transform:none;width:100%;text-align:left;border:1px solid rgba(255,255,255,.11);padding:15px 14px 15px 46px;background:linear-gradient(110deg,rgba(227,11,27,.08),rgba(255,255,255,.012))}
  .pipe-node::before{display:block;left:-19px;top:50%;transform:translate(-50%,-50%);width:10px;height:10px;background:#070405;border-color:#e51a31;box-shadow:0 0 0 6px rgba(229,26,49,.06),0 0 18px rgba(229,26,49,.32)}
  .pipe-node span{position:absolute;left:13px;top:16px;font-size:9px}
  .pipe-node b{font-size:12px;margin:0 0 5px;letter-spacing:.09em}
  .pipe-node small{font-size:9px}
  .pipe-node.optional{grid-column:auto;border-color:rgba(230,21,44,.34)}
  .routes{grid-template-columns:1fr;gap:16px}
  .route{padding:28px 20px}
  .route h3{font-size:clamp(31px,9.6vw,45px)}
  .route>p{font-size:8.5px;line-height:1.5}
  .route>strong{font-size:9px;line-height:1.55;margin-bottom:20px}
  .route li{font-size:11.5px;line-height:1.45;padding:12px 0}

  /* Inside the machine */
  .inside{grid-template-columns:1fr;gap:38px}
  .inside__visual{max-width:330px;margin:0 auto}
  .inside__copy{min-width:0}
  .feature-grid{grid-template-columns:1fr;margin-top:32px}
  .feature-grid>div{padding:20px 17px}
  .feature-grid b{font-size:12px}
  .feature-grid p{font-size:11.5px}

  /* Requirements */
  .requirements__head{display:block;margin-bottom:38px}
  .requirements__head h2{text-align:left}
  .specs{grid-template-columns:1fr;gap:14px}
  .specs article{padding:30px 20px}
  .specs article>p{font-size:9px}
  .specs h3{font-size:clamp(52px,18vw,82px)}
  .specs strong{font-size:11px}
  .specs ul{margin-top:26px}
  .specs li{font-size:11.5px}
  .fineprint{font-size:10px;line-height:1.55}

  /* Architect */
  .architect{grid-template-columns:1fr;gap:42px;min-height:0;padding-top:72px}
  .architect::after{font-size:38vw;bottom:0;right:-5vw}
  .architect__portrait{height:min(72svh,650px);min-height:500px;width:100%}
  .architect__portrait::after{transform:translate(9px,9px)}
  .architect__portrait img{object-position:center 10%}
  .architect__quote{font-size:clamp(25px,8vw,36px);margin-bottom:32px}
  .architect__copy h2{font-size:clamp(45px,13.6vw,68px)}
  .architect__copy>p:not(.architect__quote){font-size:14px;line-height:1.65}
  .copy-discord{width:100%;padding:13px 12px;gap:10px}
  .copy-discord span{font-size:7px}
  .copy-discord b{font-size:11px}

  /* FAQ */
  .faq{grid-template-columns:1fr;gap:28px}
  .faq-list{width:100%}
  .faq-list summary{padding:20px 0;font-size:18px;line-height:1.25;gap:16px}
  .faq-list details p{font-size:12.5px;line-height:1.62;padding-bottom:22px}

  /* Checkout */
  .checkout{min-height:auto;grid-template-columns:1fr;gap:30px;padding-top:96px;padding-bottom:95px}
  .checkout__bg img{object-position:56% center;filter:blur(3px);opacity:.28}
  .checkout__shade{background:linear-gradient(180deg,#050404 5%,rgba(5,4,4,.74) 40%,#050404 96%)}
  .checkout__content h2{font-size:clamp(52px,16vw,78px);line-height:.83}
  .checkout__content>p:not(.eyebrow){font-size:13.5px;line-height:1.6}
  .price{margin:22px 0 18px}
  .price strong{font-size:82px}
  .checkout__assurance{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .checkout__assurance span{padding:10px 8px;text-align:center;font-size:7.5px;line-height:1.3}
  .checkout__assurance span:last-child{grid-column:1/-1}
  .checkout__card{width:100%;padding:17px 13px;justify-self:stretch}
  .checkout__card-head{font-size:7.5px;letter-spacing:.1em}
  .stripe-shell{min-height:220px;padding:20px 0;overflow:hidden}
  .stripe-shell stripe-buy-button{transform:scale(.94);transform-origin:center}
  .stripe-fallback{font-size:7.5px;line-height:1.4;text-align:center;padding:12px 8px}
  .checkout__card>p{font-size:9.5px;line-height:1.5}
  .terms-open{font-size:8px}

  /* Footer */
  footer{grid-template-columns:1fr;gap:18px;padding:42px var(--mobile-pad) calc(28px + env(safe-area-inset-bottom));text-align:left}
  .footer__brand img{width:150px}
  footer p,footer a,footer button{font-size:10px;line-height:1.55}
  .footer__legal{justify-content:flex-start;flex-wrap:wrap;gap:16px}

  /* Persistent mobile side quests */
  .game-dock{
    position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));top:auto;
    width:auto;display:grid;grid-template-columns:1fr 1fr;transform:none;z-index:940;
    border-color:rgba(255,255,255,.22);background:rgba(6,3,4,.94);backdrop-filter:blur(18px);
    box-shadow:0 18px 60px rgba(0,0,0,.72),0 0 35px rgba(232,13,38,.15);
  }
  .game-dock__head{grid-column:1/-1;height:26px;padding:0 9px;font-size:6px}
  .game-dock button{width:auto;height:50px;padding:8px 9px;display:grid!important;grid-template-columns:24px 1fr;border-right:1px solid rgba(255,255,255,.1);border-bottom:0;justify-content:initial;text-align:left}
  .game-dock button:last-child{border-right:0}
  .game-dock button span{font-size:8px;grid-row:1/3}
  .game-dock button b{display:block!important;font-size:8px;line-height:1.2;letter-spacing:.07em}
  .game-dock button em{display:block;font-size:6px;line-height:1.2}
  body.modal-open .game-dock,body.modal-open .confusion-tab{display:none!important}

  .game-nudge{right:8px;left:8px;bottom:calc(92px + env(safe-area-inset-bottom));width:auto;padding:24px 18px}
  .game-nudge h2{font-size:34px}
  .game-nudge>span{font-size:11px}
  .game-nudge>div{display:grid;grid-template-columns:1fr auto}
  .game-nudge>div button{padding:0 12px;font-size:7px}


  /* Closed native dialogs must remain fully hidden on mobile.
     Prevents their fixed close buttons from ghosting behind the transparent top bar. */
  dialog:not([open]){display:none!important}

  /* All modal experiences become true mobile fullscreen */
  dialog.confusion-modal,dialog.video-route-modal,dialog.image-modal,dialog.game-modal,dialog.text-modal{
    width:100vw!important;max-width:none!important;height:100svh!important;height:100dvh!important;max-height:none!important;
    margin:0!important;inset:0!important;border:0!important;border-radius:0!important;
    overscroll-behavior:contain;
  }
  dialog::backdrop{background:#030203!important;backdrop-filter:none!important}
  dialog .modal-close{
    position:fixed!important;right:12px!important;top:calc(12px + env(safe-area-inset-top))!important;
    margin:0!important;width:46px!important;height:46px!important;z-index:50!important;
    background:rgba(8,5,6,.94)!important;backdrop-filter:blur(12px);font-size:27px!important;
  }

  /* Explainer */
  .confusion-modal{overflow:auto!important;padding-bottom:env(safe-area-inset-bottom)!important}
  .confusion-modal__grid{grid-template-columns:1fr;gap:30px;padding:calc(78px + env(safe-area-inset-top)) var(--mobile-pad) 34px}
  .confusion-kicker{font-size:8px;letter-spacing:.16em}
  .confusion-modal h2{font-size:clamp(47px,14.2vw,70px);line-height:.84}
  .confusion-lead{font-size:15px;line-height:1.58;margin:24px 0}
  .confusion-punch b{font-size:14px}
  .confusion-steps article{grid-template-columns:44px 1fr;gap:11px;padding:16px 0}
  .confusion-steps b{font-size:12px}
  .confusion-steps p{font-size:11px}
  .confusion-proof{grid-template-columns:1fr;gap:20px;padding:30px var(--mobile-pad)}
  .confusion-proof strong{font-size:clamp(38px,12vw,56px)}
  .confusion-proof>div:last-child>p{font-size:12.5px}
  .confusion-now{grid-template-columns:1fr;gap:18px;padding:28px var(--mobile-pad)}
  .confusion-now p{font-size:12.5px}
  .confusion-now b{font-size:16px}
  .confusion-actions{display:grid;grid-template-columns:1fr;padding:0 var(--mobile-pad) calc(32px + env(safe-area-inset-bottom))}
  .confusion-actions button{width:100%;justify-content:space-between;font-size:8px;padding:0 15px}

  /* Video route */
  .video-route-modal{overflow:auto!important;padding-bottom:env(safe-area-inset-bottom)!important}
  .video-route-modal__hero{padding:calc(78px + env(safe-area-inset-top)) var(--mobile-pad) 36px}
  .video-route-modal__hero>p{font-size:7.5px;letter-spacing:.16em}
  .video-route-modal__hero h2{font-size:clamp(48px,14.5vw,72px);line-height:.82}
  .video-route-modal__hero>strong{font-size:10px;line-height:1.55;letter-spacing:.08em}
  .video-route-modal__body{padding:0 var(--mobile-pad)}
  .video-route-modal__body section{grid-template-columns:40px 1fr;gap:12px;padding:22px 0}
  .video-route-modal__body section>span{width:34px;height:29px;font-size:8px}
  .video-route-modal__body h3{font-size:14px;line-height:1.25}
  .video-route-modal__body p{font-size:12px;line-height:1.6}
  .video-route-modal__required{margin-left:calc(var(--mobile-pad) * -1);margin-right:calc(var(--mobile-pad) * -1);padding-left:var(--mobile-pad)!important;padding-right:var(--mobile-pad)!important}
  .video-route-modal__footer{grid-template-columns:1fr;gap:10px;padding:28px var(--mobile-pad) calc(34px + env(safe-area-inset-bottom))}
  .video-route-modal__footer i{width:1px;height:25px;margin:auto;background:linear-gradient(180deg,transparent,#ee1831,transparent)}
  .video-route-modal__footer b{font-size:18px}

  /* Workflow image inspector */
  .image-modal{overflow:hidden!important;background:#030203!important}
  .image-modal__tools{position:fixed!important;left:8px!important;right:64px!important;top:calc(12px + env(safe-area-inset-top))!important;z-index:45!important;height:46px!important;padding:0!important;display:flex!important;align-items:center!important;gap:6px!important;background:rgba(7,4,5,.94)!important;border:1px solid rgba(255,255,255,.14)!important;backdrop-filter:blur(12px)}
  .image-modal__tools button{height:44px;min-width:42px;padding:0 11px}
  .image-modal__tools span{font-size:8px;min-width:42px;text-align:center}
  .image-modal__viewport{height:100dvh!important;padding:calc(72px + env(safe-area-inset-top)) 8px calc(16px + env(safe-area-inset-bottom))!important;display:block!important;overflow:auto!important;touch-action:pan-x pan-y!important}
  .image-modal__viewport img{width:100%!important;max-width:none!important;height:auto!important;transform-origin:top left!important}

  /* Games */
  .game-modal{padding:calc(74px + env(safe-area-inset-top)) var(--mobile-pad) calc(18px + env(safe-area-inset-bottom))!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
  .game-modal__head{flex:0 0 auto;padding-right:42px}
  .game-modal__head p{font-size:7px}
  .game-modal__head h2{font-size:clamp(39px,12vw,58px);line-height:.9;margin:12px 0}
  .game-modal__head span{font-size:11px;line-height:1.45}
  .game-stage{flex:1 1 auto;height:auto!important;min-height:260px;margin:18px 0 12px}
  .game-hud{flex:0 0 auto;gap:12px;padding-bottom:env(safe-area-inset-bottom);font-size:8px}
  .game-hud button{min-height:46px;padding:0 19px}
  .game-token{min-width:70px;min-height:38px;font-size:8px;padding:8px}
  .identity-grid{grid-template-columns:1fr 1fr;gap:9px;padding:9px}
  .identity-card{height:auto;aspect-ratio:3/4}

  /* Legal */
  .text-modal{overflow:auto!important;padding:calc(78px + env(safe-area-inset-top)) var(--mobile-pad) calc(38px + env(safe-area-inset-bottom))!important}
  .text-modal h2{font-size:38px;line-height:.95;padding-right:42px}
  .text-modal h3{font-size:17px;margin-top:29px}
  .text-modal p,.text-modal li{font-size:12px;line-height:1.65}
}

@media (max-width: 430px){
  .hero h1{font-size:clamp(57px,18.5vw,80px)}
  .hero__sub{font-size:13px}
  .hero__stats span{font-size:6.5px}
  .section{padding-left:16px;padding-right:16px}
  .section h2{font-size:clamp(41px,13.4vw,59px)}
  .manifesto__copy h2{font-size:clamp(37px,12.7vw,54px)}
  .workflow-gallery__copy{min-height:300px}
  .pipe-node{padding-right:10px}
  .architect__portrait{min-height:475px}
  .checkout__content h2{font-size:clamp(49px,15.7vw,69px)}
  .price strong{font-size:76px}
  .stripe-shell stripe-buy-button{transform:scale(.9)}
  .game-dock button em{display:none}
  .game-dock button{height:46px}
  .game-nudge>div{grid-template-columns:1fr}
  .game-nudge>div button{width:100%;min-height:44px}
}

@media (max-width: 360px){
  .brand img{width:132px}
  .hero{padding-left:14px;padding-right:14px}
  .hero h1{font-size:55px}
  .hero__stats strong{font-size:17px}
  .hero__stats span{font-size:6px}
  .section{padding-left:14px;padding-right:14px}
  .workflow-gallery__copy{padding:23px 14px}
  .checkout__card{padding:14px 8px}
  .stripe-shell stripe-buy-button{transform:scale(.84)}
  .game-dock{left:5px;right:5px;bottom:calc(5px + env(safe-area-inset-bottom))}
  .game-dock button b{font-size:7px}
}

@media (hover:none) and (pointer:coarse){
  .cta:hover,.route:hover,.game-dock button:hover,.confusion-tab:hover,.workflow-overview__image:hover{transform:none!important}
  .cta::before,.workflow-overview__image::after{display:none}
}

@media (orientation:landscape) and (max-height:600px) and (max-width:950px){
  body{padding-bottom:0}
  .game-dock{display:none}
  .hero{min-height:720px}
  .topbar.menu-open{overflow:auto}
  .architect__portrait{height:600px}
  .game-modal{overflow:auto!important}
  .game-stage{min-height:320px}
}

@media (max-width:820px){
  .menu-toggle span{margin:0!important;transform:none}
  .topbar.menu-open .menu-toggle span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .topbar.menu-open .menu-toggle span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
}