/* Fluid sizing. Text remains readable; smaller windows reflow and scroll. */
:root{
  --edge:clamp(1rem,4.5vw,5rem);
  --gutter:var(--edge);
  --header-height:clamp(3.5rem,8svh,5.5rem);
  --section-space:clamp(3rem,9svh,7.5rem);
  --icon-size:clamp(1rem,1.4vw,1.375rem);
  --control-size:clamp(2.75rem,4vw,3rem);
}
html{scroll-padding-top:calc(var(--header-height) + 1rem)}
body{min-inline-size:0;font-size:clamp(.875rem,calc(.82rem + .22vw),1rem)}
main,section,article,figure,nav,header,footer,div{min-inline-size:0}
p,h1,h2,h3,li,a,summary{overflow-wrap:break-word}
img,video,iframe,canvas{max-inline-size:100%}
.icon{inline-size:var(--icon-size);block-size:var(--icon-size)}
.button{min-inline-size:0;min-block-size:var(--control-size);white-space:normal;text-align:center;padding:clamp(.65rem,1.2vw,.875rem) clamp(.75rem,1.7vw,1.375rem);font-size:clamp(.75rem,calc(.7rem + .18vw),.875rem);gap:clamp(.4rem,.8vw,.75rem)}
.button .icon{inline-size:clamp(1rem,1.25vw,1.125rem);block-size:clamp(1rem,1.25vw,1.125rem)}
.icon-btn{inline-size:var(--control-size);block-size:var(--control-size);flex:none}
.icon-btn .icon{inline-size:clamp(1rem,1.3vw,1.125rem);block-size:clamp(1rem,1.3vw,1.125rem)}
.section{padding-block:var(--section-space)}
h2,.section-intro h2,.unrestricted .section-intro h2{font-size:clamp(1.9rem,4.2vw,3.75rem)}
.section-intro{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(1.25rem,4vw,3.125rem);margin-bottom:clamp(1.75rem,5svh,3.5rem)}
.section-intro>p{max-inline-size:23rem;font-size:clamp(.8125rem,1.15vw,.9375rem)}
.nav-shell{height:auto;min-block-size:var(--header-height);gap:clamp(.5rem,1.8vw,1.75rem);padding-block:.25rem}
.wordmark{font-size:clamp(1.2rem,2vw,1.5625rem)}
.desktop-nav{margin-left:clamp(0rem,4vw,5rem);gap:clamp(1rem,2.2vw,2.2rem)}
.desktop-nav a{font-size:clamp(.75rem,1vw,.875rem);white-space:nowrap}
.nav-actions{gap:clamp(.25rem,.6vw,.625rem);flex-shrink:0}
.nav-actions .button{min-block-size:2.5rem;font-size:clamp(.6875rem,.9vw,.8125rem);padding:.6rem .8rem;white-space:nowrap}
.mobile-nav{max-block-size:calc(100dvh - var(--header-height));overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(1rem,env(safe-area-inset-bottom));scrollbar-gutter:stable}
.mobile-nav a{min-block-size:2.75rem;padding:.65rem 0;font-size:clamp(.875rem,2vw,1rem)}
.hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;column-gap:clamp(1rem,2.5vw,2.5rem);row-gap:clamp(.75rem,2svh,1.5rem);min-height:0;min-block-size:min(44rem,calc(100svh - var(--header-height)));padding-block:clamp(1.5rem,6svh,5rem)}
.hero-copy{width:100%;pointer-events:auto;padding-top:0}
h1,.hero h1{font-size:clamp(2rem,min(6.2vw,10svh),5.5rem);line-height:1.08}
.headline-line{white-space:normal;overflow-wrap:anywhere}
.hero-description{font-size:clamp(.8125rem,1.05vw,.9375rem);max-inline-size:32rem;line-height:1.75;margin-top:clamp(1rem,2.7svh,1.75rem)}
.hero-description strong{font-size:clamp(.875rem,1.2vw,1.125rem);line-height:1.5}
.hero-actions,.closing-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.5rem,1vw,.875rem);max-inline-size:30rem;align-items:stretch}
.hero-actions{margin-top:clamp(1rem,3svh,2.3rem)}
.hero-actions .button,.closing-actions .button{inline-size:100%;min-block-size:3.125rem;padding:.65rem .75rem;font-size:clamp(.6875rem,.95vw,.8125rem)}
.hero-actions .button-discord>span,.closing-actions .button-discord>span{min-inline-size:0}
.hero-actions .button-discord small,.closing-actions .button-discord small{font-size:clamp(.5625rem,.7vw,.625rem);overflow-wrap:anywhere;white-space:normal}
.compatibility{font-size:clamp(.5625rem,.78vw,.6875rem);margin-top:clamp(.65rem,2svh,1.2rem)}
.compatibility span{margin-inline:clamp(.2rem,.4vw,.45rem)}
.hero-art{position:relative;inset:auto;width:100%;height:clamp(11rem,56svh,36rem);margin:0;align-self:center;max-inline-size:100%}
.hero-bottom{position:static;inset:auto;grid-column:1/-1;gap:clamp(.5rem,1.5vw,1.375rem);margin-top:clamp(.5rem,1.5svh,1rem);font-size:clamp(.4375rem,.65vw,.5625rem);letter-spacing:.1em;min-inline-size:0}
.hero-bottom>span:nth-child(2){white-space:normal;text-align:center;flex:0 1 auto}
.hero-bottom .line{min-inline-size:0}.hero-bottom a{flex:none}
.sculpture-fallback{gap:clamp(.5rem,1.5vw,1.375rem)}
.sculpture-fallback span{font-size:clamp(5rem,19vw,14rem)}
.sculpture-fallback i{inline-size:clamp(1.5rem,4vw,3.125rem);block-size:clamp(1.5rem,4vw,3.125rem)}
.unrestricted{overflow:visible}
.unrestricted-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(1.5rem,6vw,6.25rem)}
.deck-stage{container-type:inline-size;position:sticky;top:calc(var(--header-height) + 1rem);width:100%;height:min(70svh,36rem);min-height:0;max-height:none;margin:0;justify-content:center}
.code-deck{width:min(70%,27rem,65svh);height:auto;aspect-ratio:460/390;margin:0;flex:none}
.deck-card{container-type:inline-size;padding:clamp(.625rem,2.1vw,1.625rem)}
.deck-card-header{font-size:clamp(5px,2.2cqw,10px);padding-bottom:5cqw;letter-spacing:.08em}
.deck-card-header>.icon{width:clamp(.5rem,4cqw,1.0625rem);height:clamp(.5rem,4cqw,1.0625rem)}
.cheat-menu-art,.binary-visual,.patch-visual{height:48cqw;margin-block:2cqw}
.cheat-menu-art{grid-template-columns:8% minmax(0,1fr) 23%;gap:3cqw;padding-block:4cqw}
.art-menu-rail{font-size:clamp(4px,2cqw,8px);gap:4cqw;padding-right:2cqw}
.art-menu-rail>span{width:5cqw;height:6cqw}
.art-menu-title{font-size:clamp(5px,2.3cqw,9px);margin-bottom:4cqw}
.art-menu-title>span{display:inline;font-size:clamp(4px,1.8cqw,7px)}
.art-menu-row{font-size:clamp(5px,2.25cqw,9px);margin-bottom:2.8cqw}
.art-menu-row>i{height:3cqw;width:5.5cqw;min-height:5px;min-width:10px}
.art-menu-row>i:after{height:1.8cqw;width:1.8cqw;top:.6cqw;left:.6cqw}
.art-menu-row>i.on:after{left:3cqw}
.art-range-label{font-size:clamp(4px,1.7cqw,7px);margin-top:3.5cqw}
.art-range{margin-top:2cqw}.art-esp svg{height:80%;width:100%}.art-esp>span{font-size:clamp(4px,1.7cqw,7px)}
.colour-chip{width:3.5cqw;height:3cqw}
.binary-visual{padding-block:5cqw;font-size:clamp(6px,3cqw,15px);gap:2.5cqw}
.binary-highlight{font-size:clamp(5px,2.1cqw,10px);letter-spacing:.08em}
.patch-visual{padding:5cqw 1cqw;gap:3cqw}
.patch-line{height:4cqw;font-size:clamp(8px,4cqw,18px);gap:5cqw}
.patch-line i{height:1.8cqw}
.deck-card-footer{gap:2cqw}.deck-card-footer strong{font-size:clamp(11px,6.2cqw,27px);max-width:65%;overflow-wrap:normal}.deck-card-footer>span{display:block;font-size:clamp(4px,1.8cqw,9px);max-width:35%}
.case-copy{min-height:min(34rem,75svh);padding-block:clamp(2rem,7svh,4rem)}
.case-copy h3{font-size:clamp(2rem,3.8vw,3.5rem);overflow-wrap:anywhere}
.case-copy p{font-size:clamp(.8125rem,1.1vw,.9375rem)}
.case-index,.case-detail{font-size:clamp(.625rem,.85vw,.75rem)}
.intelligence-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,5vw,5rem)}
.intelligence-copy h2{font-size:clamp(2.2rem,5vw,4.5rem)}
.reasoning-demo{width:100%;min-width:0;max-width:30rem}
.dial-art{height:clamp(11rem,31svh,17.5rem);margin:0 0 .75rem}
.reasoning-switch{max-width:100%;grid-template-columns:repeat(4,minmax(0,1fr))}
.reasoning-switch button{min-width:0;min-height:2.75rem;padding:.35rem .25rem;font-size:clamp(.6875rem,.9vw,.8125rem)}
.reasoning-description{min-height:0;padding-top:1.4rem}.reasoning-description p{font-size:clamp(.75rem,1vw,.875rem)}
.plan-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.75rem,1.5vw,1.25rem)}
.plan-grid>.plan{min-width:0;padding:clamp(1.25rem,2vw,1.8rem) clamp(1rem,1.5vw,1.4rem) 1.5rem}
.plan-grid .plan-position{font-size:clamp(.75rem,.9vw,.875rem);min-height:4.5rem;max-width:none}
.plan h3{font-size:clamp(1.2rem,1.6vw,1.5rem)}
.plan-price{font-size:clamp(1.875rem,2.8vw,2.625rem)}
.plan-price>span{font-size:clamp(.625rem,.8vw,.75rem)}
.plan-grid .plan ul{font-size:clamp(.6875rem,.85vw,.8125rem);line-height:2.15}
.plan-grid .plan .button{font-size:clamp(.75rem,.85vw,.875rem);min-height:3rem;white-space:normal}
.recommended-label{top:-.75rem;left:.75rem;right:auto;max-width:calc(100% - 1.5rem);white-space:normal;font-size:clamp(.5625rem,.7vw,.625rem);line-height:1.4}
.questions{grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr);gap:clamp(1.5rem,6vw,5rem)}
.faq-intro h2{font-size:clamp(2rem,4vw,3.5rem)}
.faq-list summary{font-size:clamp(.8125rem,1vw,.9375rem);min-height:3.5rem;padding-block:1.2rem;gap:.75rem}
.faq-list summary>.icon{width:clamp(1rem,1.25vw,1.125rem);height:clamp(1rem,1.25vw,1.125rem)}
.faq-list p,.dialog-body p{font-size:clamp(.8125rem,1vw,.9375rem);overflow-wrap:anywhere}
.closing h2{font-size:clamp(2rem,5.8vw,5.125rem)}
.closing-actions{margin-inline:auto}
.footer{flex-wrap:wrap;gap:clamp(1rem,2vw,3rem);padding-block:clamp(1.5rem,4svh,2rem)}
.footer>div{min-width:0;flex-wrap:wrap;gap:.75rem 1.25rem;font-size:clamp(.625rem,.8vw,.75rem)}
.footer small,.footer button{font-size:clamp(.625rem,.75vw,.75rem)}
.tutorial-frame{width:100%;min-width:0}
.tutorial-play-icon{width:clamp(2.5rem,7vw,4.875rem);height:clamp(2.5rem,7vw,4.875rem)}
.tutorial-play-icon svg{width:42%;height:42%}
.tutorial-poster-copy{left:clamp(.75rem,2.5vw,2.375rem);right:clamp(.75rem,2.5vw,2.375rem);bottom:clamp(.65rem,2vw,1.875rem)}
.tutorial-poster-copy>strong{font-size:clamp(.9375rem,2.2vw,1.875rem)}
.tutorial-toolbar{flex-wrap:wrap;padding:.75rem;gap:.5rem;font-size:clamp(.625rem,.85vw,.75rem)}
.tutorial-toolbar>span,.tutorial-toolbar>a{min-width:0;max-width:100%;overflow-wrap:anywhere}
.tutorial-toolbar a{font-size:clamp(.625rem,.8vw,.75rem)}
.tutorial-toolbar .icon{width:1em;height:1em}
.setup-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.8vw,2.25rem)}
.setup-steps>li{gap:clamp(.75rem,1.4vw,1.1rem)}
.setup-steps h3{font-size:clamp(.875rem,1.2vw,1rem)}
.setup-steps p{font-size:clamp(.75rem,1vw,.875rem)}
.setup-download>.icon{width:1em;height:1em}
.tutorial-actions{gap:1rem;flex-wrap:wrap}
.tutorial-actions .button,.tutorial-actions .text-link{font-size:clamp(.75rem,1vw,.875rem)}
dialog{--dialog-pad:clamp(1rem,3vw,2.5rem);width:min(45.625rem,calc(100% - 2*var(--edge)));max-width:none;max-height:calc(100dvh - 2*min(var(--edge),1.5rem));padding:var(--dialog-pad);overflow-y:auto;overscroll-behavior:contain}
.dialog-header{top:calc(-1*var(--dialog-pad));margin:-.5rem -.5rem 1.5rem;padding:.5rem}
dialog h2{font-size:clamp(1.75rem,4vw,2.8125rem)}
@media(max-width:1100px){.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.25rem 1.25rem}}
@media(max-width:860px){.desktop-nav{display:none}.menu-toggle{display:inline-flex}.nav-discord{display:none}.nav-actions .nav-download{display:inline-flex}.nav-shell{gap:.5rem}}
@media(max-width:760px){
 .section-intro{grid-template-columns:1fr;gap:1.25rem}.section-intro>p{max-width:36rem;margin-top:0}
 .unrestricted-layout{display:block}.deck-stage{position:relative;top:auto;height:min(82vw,28rem);margin-block:2rem;max-height:none}.case-copy{min-height:0;padding-block:2rem}
 .intelligence-grid,.questions{display:grid;grid-template-columns:1fr}.reasoning-demo{margin:1.5rem auto 0}.setup-steps{grid-template-columns:1fr;gap:1.5rem}
 .questions{gap:2rem}.faq-list{margin-top:0}
}
@media(max-width:650px){
 .hero{grid-template-columns:1fr;min-height:0;padding-block:clamp(1.5rem,5svh,3rem);gap:1rem}
 .hero h1{font-size:clamp(1.5rem,9.2vw,3.8rem)}
 .hero-art{height:clamp(10rem,38svh,25rem);width:100%;max-width:31rem;justify-self:center;margin:0}
 .hero-bottom{margin-top:0}.hero-bottom>.line{display:block}
 .hero-actions,.closing-actions{grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));max-width:100%;gap:.6rem}
 .hero-actions .button,.closing-actions .button{min-height:3.125rem;font-size:.75rem}
 .hero-actions .button-discord small,.closing-actions .button-discord small{font-size:.5625rem}
 .hero-actions .button-primary>.icon:last-child,.closing-actions .button-primary>.icon:last-child{display:none}
 .compatibility{font-size:.625rem}
 .plan-grid{grid-template-columns:1fr;gap:0}.plan-grid>.plan-recommended{padding:2rem clamp(.875rem,4vw,1.4rem) 1.5rem!important}
 .plan-grid .plan-position{font-size:.75rem;max-width:none;min-height:0}.plan-grid>.plan .plan-price{font-size:1.875rem}
 .plan-grid .plan ul,.plan-grid>.plan-recommended ul{font-size:.6875rem;line-height:2.15}
 .recommended-label{font-size:.5625rem;max-width:calc(100% - 1.5rem)}
 .mobile-quick-actions{grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));gap:.5rem;padding-inline:var(--edge)}
 .mobile-quick-actions .button{font-size:.75rem;min-height:2.875rem}.mobile-quick-actions .icon{width:1rem;height:1rem}
 .footer{display:block}.footer>div{display:flex;margin-block:1.25rem .75rem}.footer small{display:block;text-align:left}
 .tutorial-toolbar{font-size:.625rem}.tutorial-toolbar a{font-size:.625rem}.tutorial-poster-copy>span{font-size:.4375rem}
}
@media(max-width:420px){.nav-actions .nav-download{display:none}.nav-shell{padding-inline:var(--edge)}}
@media(max-width:340px){.plan-grid .plan ul{columns:1}.tutorial-toolbar{align-items:flex-start}.tutorial-toolbar>span,.tutorial-toolbar>a{flex:1 1 100%}}
@media(max-height:520px) and (min-width:601px){
 :root{--header-height:3.5rem;--section-space:3rem}
 .hero{padding-block:1rem;row-gap:.5rem;min-height:0}.hero-description{margin-top:.75rem;line-height:1.55}.hero-description strong{margin-bottom:.35rem}.hero-actions{margin-top:.85rem}.compatibility{margin-top:.65rem}
 .hero-art{height:min(62svh,20rem)}.hero-bottom{margin-top:0}
 .deck-stage{height:70svh}.code-deck{width:min(68%,54svh,27rem)}
}
@media(max-width:340px),(max-height:480px){
 body{padding-bottom:0}html{scroll-padding-bottom:1rem}
 .mobile-quick-actions{position:static;transform:none!important;visibility:visible;pointer-events:auto;margin-top:0;padding:1rem var(--edge);transition:none}
}
/* Percentage offsets keep the resting card fan inside its container too. */
.code-deck .deck-card:nth-child(1){transform:translateZ(24px) rotateZ(-3deg)}
.code-deck .deck-card:nth-child(2){transform:translate3d(5%,-4%,-35px) rotateZ(2deg)}
.code-deck .deck-card:nth-child(3){transform:translate3d(10%,-8%,-70px) rotateZ(7deg)}
.motion-off .code-deck .deck-card:nth-child(1){transform:translateZ(24px) rotateZ(-3deg)!important}
.motion-off .code-deck .deck-card:nth-child(2){transform:translate3d(5%,-4%,-35px) rotateZ(2deg)!important}
.motion-off .code-deck .deck-card:nth-child(3){transform:translate3d(10%,-8%,-70px) rotateZ(7deg)!important}
@media(prefers-reduced-motion:reduce){.code-deck .deck-card:nth-child(1){transform:translateZ(24px) rotateZ(-3deg)!important}.code-deck .deck-card:nth-child(2){transform:translate3d(5%,-4%,-35px) rotateZ(2deg)!important}.code-deck .deck-card:nth-child(3){transform:translate3d(10%,-8%,-70px) rotateZ(7deg)!important}}
:root{--nav-offset:var(--header-height);--quick-height:4.5rem}
html{scroll-padding-top:calc(var(--nav-offset) + 1rem)}
.site-header{max-block-size:100dvh;overflow-y:auto;overflow-x:clip}
.nav-shell{flex-wrap:wrap}
.mobile-nav{max-block-size:max(6rem,calc(100dvh - var(--nav-offset)))}
.deck-stage{top:calc(var(--nav-offset) + 1rem)}
.nav-actions .button{min-block-size:var(--control-size)}
.text-link>.icon{width:1.25em;height:1.25em}
.nav-actions .button>.icon{width:1.25em;height:1.25em}
.hero-bottom .icon{width:clamp(.875rem,1.15vw,1.125rem);height:clamp(.875rem,1.15vw,1.125rem)}
.footer a .icon{width:clamp(.875rem,1vw,1rem);height:clamp(.875rem,1vw,1rem)}
.closing-code{font-size:clamp(1.125rem,1.6vw,1.5rem)}
.brand-dot{width:.16em;height:.16em}
.setup-number{font-size:clamp(.625rem,.9vw,.75rem)}
@media(max-width:650px){body{padding-bottom:calc(var(--quick-height) + .5rem)}html{scroll-padding-bottom:calc(var(--quick-height) + 1rem)}}
@media(max-width:340px),(max-height:480px){body{padding-bottom:0}html{scroll-padding-bottom:1rem}}
@media(max-width:760px){.deck-stage{top:auto}}
/* Reserve real space for the miniature menu and its captions. */
.code-deck{aspect-ratio:1}
.art-menu-content{display:flex;flex-direction:column;justify-content:space-between;min-height:0;gap:0}
.art-menu-content .art-menu-title,.art-menu-content .art-menu-row,.art-menu-content .art-range-label,.art-menu-content .art-range{margin:0}
.plan-grid>.plan{container-type:inline-size}
@container (max-width:15rem){.plan-grid>.plan .plan-price{grid-column:1/-1;grid-row:auto;text-align:left;margin-top:.5rem}}
.tutorial-toolbar a{min-block-size:2.75rem}
.section-label{font-size:clamp(.625rem,.8vw,.75rem)}
.intelligence-copy>p{font-size:clamp(.875rem,1.2vw,1.0625rem)}
.model-footnote{font-size:clamp(.6875rem,.9vw,.8125rem)}
.reasoning-description h3{font-size:clamp(1rem,1.4vw,1.25rem)}
.faq-intro>p{font-size:clamp(.8125rem,1.1vw,.9375rem)}
.faq-intro .text-link{font-size:clamp(.75rem,1vw,.875rem)}
.closing>p{font-size:clamp(.75rem,1vw,.875rem)}
.footer .wordmark{font-size:clamp(1.125rem,1.8vw,1.5rem)}
.dialog-body h3{font-size:clamp(.875rem,1.2vw,1.125rem)}
.dialog-body code{font-size:clamp(.6875rem,.9vw,.8125rem)}
.tutorial-poster-copy>span{font-size:clamp(.4375rem,.65vw,.625rem)}
.tutorial-poster-copy>small{font-size:clamp(.6875rem,.9vw,.8125rem)}
/* The complete player also fits the available height in landscape windows. */
.tutorial-frame{max-inline-size:min(70rem,max(12.5rem,calc((100svh - var(--nav-offset) - 6rem)*16/9)))}
