:root{--paper:#f6f3eb;--ink:#222721;--muted:#64675f;--line:#dcded1;--lime:#cded62;--green:#364e30}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:wait}img{max-width:100%;display:block}button:focus-visible,a:focus-visible{outline:3px solid #358d9b;outline-offset:5px}::selection{background:var(--lime);color:var(--ink)}.wrap{width:min(1440px,calc(100% - 96px));margin-inline:auto}.header{height:112px;display:flex;align-items:center;gap:40px;border-bottom:1px solid var(--line)}.brand{background:#18231e;padding:10px 16px;border-radius:4px;flex:none;width:180px}.brand img{width:100%;height:auto}.header nav{display:flex;gap:32px;margin-left:auto;font-size:14px;font-weight:600}.header nav a:hover{color:#617331}.nav-cta{padding:13px 19px;border:1px solid #b9bdac;border-radius:50px;font-size:13px;font-weight:600;display:flex;gap:20px}.nav-cta:hover{background:var(--lime);border-color:var(--lime)}.hero{display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;padding-top:45px;padding-bottom:65px;align-items:center}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;line-height:1.6;display:block}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#5c773a;margin-right:7px}.hero-copy{padding:20px 0 12px}.hero h1{font-size:clamp(48px,5.25vw,84px);font-weight:800;letter-spacing:-4.5px;line-height:.99;margin:24px 0}.hero h1 span{font-family:Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-3px;color:var(--green)}.lead{font-size:16px;line-height:1.65;color:#62685e;max-width:340px;margin:0 0 28px}.button{display:inline-flex;justify-content:center;align-items:center;gap:32px;padding:17px 25px;font-size:14px;font-weight:700;border-radius:60px;border:0;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.lime{background:var(--lime)}.lime:hover{background:#c0df57}.hero-foot{display:flex;gap:15px;align-items:center;font-size:11px;line-height:1.5;color:var(--muted);margin-top:37px}.hero-foot strong{font-weight:500;color:var(--ink)}.tiny-orbit{font-size:33px;color:#7a8a56}.experiment{align-self:center;min-width:0}.specimen{font-family:monospace;font-size:9px;letter-spacing:1.1px;display:flex;justify-content:space-between;margin-bottom:12px;color:#636c5d}.lab-scene{position:relative;aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:#e8decb;isolation:isolate}.lab-art{width:100%;height:100%;object-fit:cover}#lab-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.mug-label{position:absolute;left:18.8%;top:65.5%;font-size:clamp(5px,.7vw,10px);line-height:1.5;letter-spacing:1px;transform:rotate(-3deg);font-weight:bold;color:#615440;z-index:3;text-align:center}.sticky{position:absolute;top:37%;right:6%;padding:13px 14px;background:#f4e49a;font-family:Georgia,serif;font-size:clamp(12px,1.3vw,19px);transform:rotate(7deg);box-shadow:1px 7px 12px #2e261624;z-index:3;line-height:1.15}.sticky em{font-weight:bold}.sticky span{display:block;font-size:23px;text-align:right}.reactor-button{position:absolute;left:87%;top:68%;width:10%;height:18%;background:none;border:0;padding:0;z-index:4;min-width:34px}.button-dome{display:block;background:linear-gradient(#fa4335,#b70d09);height:29%;border-radius:50%;border:2px solid #ff776450;box-shadow:0 5px 0 #940e0a,0 8px 10px #37050140;margin:0 0 15%;transition:transform .12s}.button-label{font-size:clamp(5px,.58vw,9px);font-family:monospace;background:#b22a20;color:#fff6ec;padding:3px 2px;white-space:nowrap;display:block;font-weight:bold}.reactor-button:hover .button-dome{filter:brightness(1.2)}.reactor-button:active .button-dome,.reactor-button.running .button-dome{transform:translateY(4px);box-shadow:0 1px 0 #940e0a}.lab-console{display:flex;gap:10px;align-items:center;background:#e9eddf;border:1px solid #d7decb;padding:13px 14px;border-radius:0 0 5px 5px;margin-top:6px;min-height:49px}.console-led{width:6px;height:6px;flex:none;background:#6c8f47;box-shadow:0 0 6px #6c8f4740;border-radius:50%}.lab-console p{font-family:monospace;font-size:10px;line-height:1.5;margin:0;flex:1}.console-id{font:9px monospace;color:#818976}.scene-controls{display:flex;justify-content:space-between;margin-top:12px;font-size:10px;color:#7a7e70;align-items:center;gap:5px}.scene-controls button{border:0;border-bottom:1px solid #cfd2c4;background:none;font-size:10px;padding:8px 2px;margin-left:12px;min-height:32px}.scene-controls button:hover{color:#1f3216}.fallback-core{position:absolute;left:47%;top:34%;width:20%;height:22%;display:grid;grid-template-columns:1fr 1fr;gap:8px;transform:rotate(-8deg);z-index:1}.fallback-core i{border:1px solid #7deefc;border-radius:3px;background:#34dcf84d;box-shadow:0 0 10px #18bcfa80,inset 0 0 9px #eaffff}.fallback-core i:nth-child(2n){border-color:#ff95ff;background:#ef4fed45;box-shadow:0 0 10px #de35f970}.has-webgl .fallback-core{display:none}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:27px}h2{font-size:clamp(30px,3vw,45px);line-height:1.1;font-weight:600;letter-spacing:-1.8px;margin:9px 0 0}.section-index{font:10px monospace;letter-spacing:1px;color:#7a8072;white-space:nowrap}.games-section{padding-bottom:70px}.game-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.game-card{min-width:0;background:#fffdfa;border:1px solid #ddded2;border-radius:8px;overflow:hidden}.game-image{border:0;width:100%;display:block;position:relative;height:285px;padding:0;text-align:left;overflow:hidden;background:#141a25}.game-image img{height:100%;width:100%;object-fit:cover;transition:transform .5s}.cowboy .game-image img{object-position:center 49%}.game-image:hover img{transform:scale(1.025)}.image-tag{position:absolute;top:17px;left:17px;font-size:9px;font-weight:bold;letter-spacing:1px;padding:8px 11px;border-radius:3px;background:#fcf9edee;color:#34392c}.image-arrow{position:absolute;right:18px;bottom:18px;width:39px;height:39px;display:grid;place-items:center;background:#f8f7ed;border-radius:50%;font-size:23px}.reactor-image img{width:48%;margin-left:auto;object-position:50% 20%;opacity:.85}.reactor-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0d1727 38%,transparent 74%);pointer-events:none}.reactor-card-title{position:absolute;top:40%;left:7%;z-index:1;color:#d9ffff;font-size:clamp(22px,2.6vw,38px);font-weight:800;letter-spacing:0;line-height:1.08}.reactor-card-title em{font-style:normal;color:#e795ff}.reactor-image .image-tag,.reactor-image .image-arrow{z-index:2}.reactor-image .image-tag{background:#d5e4f8;color:#293848}.game-info{padding:26px 28px 23px}.game-category{font:9px monospace;letter-spacing:1.5px;color:#7c8176}h3{font-size:22px;letter-spacing:-.7px;margin:8px 0 10px}.game-info p{color:var(--muted);font-size:14px;line-height:1.6;margin:0;max-width:410px;min-height:45px}.text-link{display:inline-flex;align-items:center;gap:20px;background:none;border:0;border-bottom:1px solid #b6bbab;padding:9px 0;font-size:13px;font-weight:600}.game-info .text-link{margin-top:15px}.text-link:hover{color:#697f30;border-color:#697f30}.about-section{background:#e9ecdf;border-block:1px solid #dce0d2;padding:64px 0}.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:70px}.about-layout h2{font-size:clamp(35px,4vw,58px);line-height:1.06;letter-spacing:-2px;margin-top:20px}.about-layout h2 em,.closing h2 em{font-family:Georgia,serif;font-weight:400;color:#57704a}.about-copy{padding-top:20px;max-width:490px}.about-copy p{font-size:17px;line-height:1.7;color:#525e4d;margin:0 0 18px}.studio-signoff{display:flex;gap:16px;align-items:center;font-size:12px;font-weight:600;margin-top:25px}.studio-signoff span{font-size:27px}.notes-section{padding-block:68px}.notes-stamp{font:9px monospace;letter-spacing:1px;border:1px solid #9b9f8e;padding:9px 13px;transform:rotate(-3deg)}.notes-list{border-top:1px solid var(--line)}.notes-list article{padding:25px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:60px 1fr 130px;align-items:center;gap:25px}.note-number{font:12px monospace;color:#7a866a}.notes-list h3{font-size:19px;margin:0 0 8px}.notes-list p{font-size:14px;color:var(--muted);line-height:1.6;max-width:660px;margin:0}.note-tag{font:9px monospace;color:#63734c;justify-self:end;letter-spacing:1px}.notes-list .text-link{justify-self:end;white-space:nowrap}.closing{text-align:center;padding:40px 0 75px}.closing h2{font-size:clamp(36px,4.5vw,66px);line-height:1.1;margin:20px 0 28px;letter-spacing:-2px}.footer{display:flex;gap:30px;align-items:center;padding:30px 0;border-top:1px solid var(--line);font-size:11px;color:#737b6a}.footer-brand{width:125px;padding:7px 11px}.footer .quiet-button{margin-left:auto}.quiet-button{border:0;background:none;font-size:11px;min-height:44px}.back-top{font-size:22px;padding:10px}.skip{position:fixed;top:-100px;left:10px;padding:15px;background:var(--lime);z-index:100}.skip:focus{top:10px}dialog{max-width:min(850px,calc(100% - 32px));padding:0;background:var(--paper);color:var(--ink);border:1px solid #cdd2c3;border-radius:10px;max-height:90dvh;box-shadow:0 30px 90px #0005}dialog::backdrop{background:#17201ac4;backdrop-filter:blur(6px)}.dialog-close{position:absolute;right:12px;top:12px;width:44px;height:44px;border:0;border-radius:50%;background:#f7f5e9;z-index:4;font-size:28px}.preview-layout{display:grid;grid-template-columns:.7fr 1fr}.preview-layout>img{height:100%;max-height:85dvh;width:100%;object-fit:contain;background:#061425}.preview-copy{padding:68px 34px 35px}.preview-copy h2{font-size:35px}.preview-copy p,.preview-copy li,.info-copy p{font-size:14px;line-height:1.7}.preview-copy ul{padding-left:20px}.muted{color:var(--muted)}.preview-copy .button{font-size:12px;margin-top:10px}.info-copy{padding:55px 38px 35px;max-width:580px}.info-copy h2{margin-bottom:20px}.running .console-led{background:#fba544}.lab-scene.experiment-running{animation:lab-bump .3s ease-out}@keyframes lab-bump{25%{transform:translateY(-2px)}70%{transform:translateY(1px)}}
@media(min-width:1700px){.hero h1{font-size:90px}.game-image{height:310px}}
@media(max-width:1100px){.wrap{width:calc(100% - 56px)}.header{gap:20px;height:92px}.brand{width:155px}.header nav{gap:20px}.nav-cta{font-size:11px;padding:12px}.hero{gap:20px}.hero h1{font-size:clamp(43px,5.1vw,58px);letter-spacing:-3px}.lead{font-size:14px}.hero-foot{margin-top:24px}.game-image{height:240px}.sticky{padding:9px}.about-layout{gap:35px}}
@media(max-width:800px){.wrap{width:calc(100% - 36px)}.header{height:83px;gap:15px}.header nav{gap:18px;font-size:12px}.hero{grid-template-columns:1fr;padding-top:25px;gap:28px;padding-bottom:48px}.hero-copy{padding:6px 0 0}.hero h1{font-size:clamp(54px,11vw,76px);line-height:1;letter-spacing:-3.5px}.hero h1 br:first-child{display:none}.hero h1 br:first-child:after{content:' '}.hero h1{max-width:650px}.hero .lead{font-size:15px;max-width:420px}.hero-foot{display:none}.experiment{width:100%}.sticky{font-size:clamp(13px,3vw,21px);padding:12px}.mug-label{font-size:clamp(6px,1.7vw,11px)}.button-label{font-size:clamp(6px,1.5vw,10px)}.reactor-button{min-width:44px}.section-index{display:none}.section-heading h2{font-size:31px}.game-grid{gap:18px}.game-image{height:200px}.game-info{padding:20px}.game-info p{min-height:70px}.reactor-card-title{font-size:24px}.about-layout{gap:25px}.about-copy p{font-size:15px}.notes-list article{grid-template-columns:35px 1fr;gap:15px}.note-tag,.notes-list .text-link{grid-column:2;justify-self:start}.notes-list .text-link{margin-top:-6px}.notes-stamp{display:none}.footer{gap:17px;flex-wrap:wrap}.footer>span{font-size:10px}.footer .quiet-button{margin-left:0}.preview-layout{grid-template-columns:1fr}.preview-layout>img{max-height:55dvh}.preview-copy{padding:30px}.scene-controls button{min-height:44px}.console-id{display:none}}
@media(max-width:520px){.brand{width:138px;padding:9px 12px}.header nav{gap:13px;font-size:11px}.hero h1 br:first-child{display:block}.hero h1{font-size:63px}.eyebrow{font-size:9px;letter-spacing:1.1px}.hero h1{margin-top:19px}.game-grid{grid-template-columns:1fr}.game-image{height:250px}.game-info p{min-height:0}.reactor-card-title{font-size:34px}.about-layout{grid-template-columns:1fr}.about-section{padding:45px 0}.about-layout h2{font-size:44px}.about-copy{padding-top:0}.games-section{padding-bottom:45px}.notes-section{padding-block:45px}.closing{padding-top:15px;padding-bottom:45px}.closing h2{font-size:37px}.footer{gap:15px}.footer>span{flex:1}.footer .quiet-button{margin-left:auto}.specimen{font-size:8px}.lab-console p{font-size:9px}.lab-console{padding:10px}.scene-controls{font-size:9px}.scene-controls button{margin-left:7px}.scene-controls>span{max-width:125px}.sticky{font-size:13px;padding:9px}.mug-label{letter-spacing:0}.notes-list h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
body.motion-off{scroll-behavior:auto}body.motion-off *{animation:none!important;transition:none!important}

/* Industrial artwork and its hit target share one fixed 4:3 coordinate system. */
.hero{grid-template-columns:.64fr 1.36fr;gap:26px}.hero h1{font-size:clamp(48px,4.7vw,75px)}
.lab-scene{background:#17212a;border-radius:3px;border:1px solid #8e938b;box-shadow:0 18px 38px #24221a16}
.reactor-button{left:81%;top:60%;width:13%;height:13%;min-width:0;min-height:0;border-radius:40% 40% 18% 18%;background:transparent;box-shadow:none}
.reactor-button:hover{background:#ff402416;box-shadow:0 0 22px #ff452b80,inset 0 0 12px #ffbd8350}
.reactor-button.running{background:#ff3b2525;box-shadow:0 0 30px #ff402b70}
.reactor-button:hover .button-hint,.reactor-button:focus-visible .lab-console{background:#202c2c;border-color:#3e4b49;color:#d6f2dc}.console-led{background:#b1f36c;box-shadow:0 0 9px #91ff79}.console-id{color:#9baea8}
.fallback-core{left:46%;top:32%;width:21%;height:20%;transform:none}
.fallback-core:after{content:'';position:absolute;left:42%;top:125%;width:20px;height:20px;background:white;border-radius:50%;box-shadow:0 0 5px white,0 0 15px cyan,0 0 30px #457aff,0 0 50px #a133ff}
.lab-scene.experiment-running{animation:none}
@media(max-width:1100px) and (min-width:801px){.hero h1{font-size:clamp(38px,4.5vw,50px);letter-spacing:-2.5px}.hero .lead{font-size:13px}}
@media(max-width:800px){.hero{grid-template-columns:1fr}.hero h1{font-size:clamp(54px,11vw,76px)}}
@media(max-width:520px){.hero h1{font-size:60px}}
.brand{background:transparent;border-radius:0}.brand img{filter:drop-shadow(0 1px 1px #29332699)}
/* Dial face fits inside the photographed metal bezel; the original rim stays visible. */
.pressure-dial{position:absolute;left:74.95%;top:49.62%;width:5.04%;height:6.63%;transform:rotate(-13deg);z-index:3;pointer-events:none;overflow:visible}
/* Double the visible official logo, retaining the original pixels and padding. */
.header .brand{width:328px}.footer-brand{width:228px}
.header{height:auto;min-height:112px}
@media(max-width:1100px){.header .brand{width:278px}.header{min-height:92px}}
@media(max-width:800px){.header{min-height:83px;flex-wrap:wrap;padding-block:8px;row-gap:0}}
@media(max-width:520px){.header .brand,.footer-brand{width:252px}.header nav{padding-block:9px}}

.footer{flex-wrap:wrap}.contact-email{font-size:12px;text-decoration:underline;text-underline-offset:4px;white-space:nowrap;padding-block:12px}.contact-email:hover{color:var(--green)}
/* Full registered alternate lighting exposure: no spots, masks or brightness filter. */
.lab-art-dim{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;pointer-events:none;opacity:0}


/* Hat keeps its original photographic coordinates; only its layer moves. */
.hat-button{position:absolute;left:39.23%;top:3.96%;width:23.1354%;height:15.2855%;padding:0;border:0;background:transparent;z-index:4;transform-origin:50% 90%;visibility:hidden}
.hat-button img{width:100%;height:100%;object-fit:fill;pointer-events:none}
.hat-ready .hat-button{visibility:visible}
.hat-button:disabled{cursor:default}
.hat-button:not(:disabled):hover{filter:drop-shadow(0 0 4px #ffcc7866)}

/* The specimen labels and controls share one row above the image. */
.specimen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:center;gap:8px;margin-bottom:8px;line-height:1.5}
.specimen-label{text-align:left}
.specimen-number{text-align:center}
.specimen .scene-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0;color:#4d5846;font:11px Arial,Helvetica,sans-serif}
.specimen .scene-controls button{margin:0;padding:8px 3px;min-height:44px;min-width:48px;font-size:11px;white-space:nowrap}
/* Full mobile navigation: logo, navigation, then itch.io; no hidden links. */
@media(max-width:800px){
 .header{display:grid;grid-template-columns:1fr;height:auto;min-height:0;gap:4px;padding-block:12px}
 .header .brand{max-width:100%;justify-self:start}
 .header nav{margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px;min-width:0}
 .header nav a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
 .header .nav-cta{display:inline-flex;justify-self:start;align-items:center;min-height:44px;margin:0 0 4px;padding:10px 16px;max-width:100%;white-space:normal}
}
@media(max-width:520px){
 .specimen{font-size:8px;letter-spacing:.2px;gap:6px}
 .specimen .scene-controls{gap:3px}
 .specimen .scene-controls button{font-size:10px;padding-inline:2px}
 .header nav a:last-child{display:inline-flex}
}

/* v5: symmetric columns center the experiment number over the image. */
.specimen{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;margin-bottom:4px;gap:8px;font:12px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.3px}
.specimen-label,.specimen-number{padding-bottom:4px}
.specimen .scene-controls{justify-self:end;max-width:100%;flex-wrap:wrap;gap:8px;font:inherit;letter-spacing:inherit}
.specimen .scene-controls button{display:inline-flex;align-items:flex-end;margin:0;padding:0 3px 4px;border:0;min-height:44px;font:inherit;letter-spacing:inherit}
.reactor-button:disabled{cursor:default}
@media(max-width:520px){
 .specimen{font-size:10px;letter-spacing:0;gap:4px}
 .specimen .scene-controls{gap:3px}
 .specimen .scene-controls button{font:inherit;padding-inline:2px}
}

/* v6: compact phones only. Tablet and desktop rules above remain unchanged. */
@media (max-width:600px), (max-width:950px) and (max-height:500px) and (orientation:landscape) and (pointer:coarse){
 .header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;height:auto;min-height:0;gap:2px 10px;padding-block:8px}
 .header .brand{grid-column:1;grid-row:1;width:min(160px,100%);padding:0;max-width:100%}
 .header .nav-cta{grid-column:2;grid-row:1;display:inline-flex;justify-self:end;min-height:44px;margin:0;padding:7px 10px;font-size:10px;gap:6px;white-space:nowrap}
 .header nav{grid-column:1 / -1;grid-row:2;display:flex;flex-wrap:wrap;gap:4px 22px;margin:0;padding:0;font-size:12px}
 .header nav a,.header nav a:last-child{display:inline-flex;align-items:center;min-height:44px}
 .hero{grid-template-columns:1fr;gap:14px;padding-top:16px;padding-bottom:30px;align-items:start}
 .hero-copy{padding:0}
 .hero .eyebrow{font-size:9px;letter-spacing:1px}
 .hero h1{max-width:none;font-size:clamp(28px,8.5vw,34px);line-height:1.05;letter-spacing:-1.3px;margin:12px 0 14px}
 .hero h1 span{letter-spacing:-1px}
 .hero h1 br:first-child{display:none}
 .hero .lead{max-width:none;font-size:13px;line-height:1.45;margin-bottom:14px}
 .hero .button{min-height:44px;padding:10px 18px;font-size:12px;gap:16px}
 .hero-foot{display:none}
 .specimen{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 12px;margin-bottom:4px;font-size:10px;letter-spacing:.2px}
 .specimen-label{grid-column:1;grid-row:1;text-align:left}
 .specimen-number{grid-column:2;grid-row:1;text-align:right}
 .specimen .scene-controls{grid-column:1 / -1;grid-row:2;justify-self:end;gap:14px;flex-wrap:nowrap}
 .specimen .scene-controls button{align-items:center;padding:0 2px;min-height:44px;font:inherit}
}

/* Short, wide touch screens need a compact two-column hero, not a tall desktop hero. */
@media (min-width:601px) and (max-width:950px) and (max-height:500px) and (orientation:landscape) and (pointer:coarse){
 .wrap{width:calc(100% - 48px)}
 .header{grid-template-columns:minmax(110px,160px) minmax(0,1fr) auto;gap:8px;padding-block:4px}
 .header .brand{width:140px}
 .header nav{grid-column:2;grid-row:1;justify-content:flex-end;gap:8px 14px;font-size:11px}
 .header .nav-cta{grid-column:3;grid-row:1}
 .hero{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px;padding-top:12px;align-items:center}
 .hero h1{font-size:clamp(28px,4vw,34px);margin:10px 0 12px}
 .hero .eyebrow{font-size:8px;letter-spacing:.6px}
 .hero .lead{font-size:12px;margin-bottom:12px}
 .hero .button{font-size:11px;padding-inline:15px}
 .specimen{font-size:9px;gap:0 8px}
 .lab-console{min-height:38px;padding:8px 10px}
 .lab-console p{font-size:9px}
 .console-id{display:none}
}

/* v7: desktop sizing follows the window, while touch tablet/portrait stays as v6. */
@media (min-width:601px) and (pointer:fine){
 .hero.wrap{width:min(1280px,calc(100% - 56px))}
 .hero{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:32px;padding-top:18px;padding-bottom:40px;align-items:center}
 .hero-copy{padding:0}
 .hero h1{font-size:clamp(34px,4vw,60px);letter-spacing:-2.3px;line-height:1.02;margin:18px 0}
 .hero h1 span{letter-spacing:-1.8px}
 .hero .lead{font-size:15px;line-height:1.5;margin-bottom:20px;max-width:370px}
 .hero-foot{margin-top:20px}
 .experiment{width:min(100%,max(240px,calc((100svh - 210px) * 1.333333)));justify-self:end}
 .specimen{font-size:11px;letter-spacing:0;gap:6px}
}
@media (min-width:1001px) and (pointer:fine){
 .header.wrap{width:min(1280px,calc(100% - 56px))}
 .header{min-height:90px;gap:24px}
 .header .brand{width:240px}
 .header nav{font-size:13px;gap:24px}
}
/* Narrow desktop windows keep the lab beside the copy and compact all header links. */
@media (min-width:601px) and (max-width:1000px) and (pointer:fine){
 .header{display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:0;gap:0 16px;padding-block:8px}
 .header .brand{grid-column:1;grid-row:1;width:200px;padding:0;max-width:100%}
 .header .nav-cta{grid-column:2;grid-row:1;justify-self:end;min-height:44px;margin:0;padding:9px 12px;font-size:11px;white-space:nowrap}
 .header nav{grid-column:1 / -1;grid-row:2;margin:0;padding:0;display:flex;gap:22px;font-size:12px}
 .header nav a{display:inline-flex;align-items:center;min-height:44px}
 .hero{gap:20px;padding-top:18px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
 .hero h1{font-size:clamp(30px,4.5vw,44px);letter-spacing:-1.5px;margin:14px 0}
 .hero .eyebrow{font-size:9px;letter-spacing:.8px}
 .hero .lead{font-size:13px;margin-bottom:16px}
 .hero .button{font-size:12px;padding:13px 18px;gap:16px}
 .hero-foot{display:none}
 .specimen{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 8px;font-size:10px}
 .specimen-label{grid-column:1;grid-row:1;text-align:left}
 .specimen-number{grid-column:2;grid-row:1;text-align:right}
 .specimen .scene-controls{grid-column:1 / -1;grid-row:2;flex-wrap:nowrap;gap:12px}
 .lab-console{padding:10px;min-height:40px}
 .lab-console p{font-size:10px}
 .console-id{display:none}
}
/* Short touch landscape: shrink the entire 4:3 coordinate system, never crop it. */
@media (min-width:601px) and (max-width:1100px) and (max-height:500px) and (orientation:landscape) and (pointer:coarse){
 .wrap{width:calc(100% - 48px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
 .header{display:grid;grid-template-columns:minmax(100px,140px) minmax(0,1fr) auto;min-height:0;gap:8px;padding-block:4px}
 .header .brand{grid-column:1;grid-row:1;width:130px;padding:0;max-width:100%}
 .header nav{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;justify-content:flex-end;margin:0;padding:0;gap:0 12px;font-size:10px}
 .header nav a{display:inline-flex;align-items:center;min-height:44px}
 .header .nav-cta{grid-column:3;grid-row:1;justify-self:end;align-items:center;min-height:44px;margin:0;padding:7px 9px;gap:5px;font-size:10px;white-space:nowrap}
 .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;padding-top:8px;padding-bottom:18px;align-items:center}
 .hero-copy{padding:0}
 .hero h1{font-size:clamp(25px,3.5vw,31px);line-height:1.03;letter-spacing:-1px;margin:10px 0}
 .hero h1 br:first-child{display:none}
 .hero h1 span{letter-spacing:-1px}
 .hero .eyebrow{font-size:8px;letter-spacing:.5px}
 .hero .lead{font-size:11px;line-height:1.4;margin-bottom:10px;max-width:320px}
 .hero .button{min-height:44px;padding:9px 14px;font-size:11px;gap:14px}
 .hero-foot{display:none}
 .experiment{width:min(100%,max(180px,calc((100svh - 180px) * 1.333333)));justify-self:end}
 .specimen{grid-template-columns:minmax(0,1fr) minmax(0,1fr);font-size:9px;letter-spacing:0;gap:0 6px;margin-bottom:2px}
 .specimen-label{grid-column:1;grid-row:1;text-align:left}
 .specimen-number{grid-column:2;grid-row:1;text-align:right}
 .specimen .scene-controls{grid-column:1 / -1;grid-row:2;justify-self:end;flex-wrap:nowrap;gap:12px}
 .specimen .scene-controls button{align-items:center;padding:0 2px;min-height:44px;font:inherit}
 .lab-console{min-height:32px;padding:6px 8px;gap:7px}
 .lab-console p{font-size:9px;line-height:1.3}
 .console-id{display:none}
}

/* v8: short phone landscape uses its column width, allowing natural vertical scroll. */
@media (min-width:601px) and (max-width:1100px) and (max-height:500px) and (orientation:landscape) and (pointer:coarse){
 .hero{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px;align-items:center}
 .experiment{width:100%;justify-self:stretch}
 .specimen{gap:0 8px;font-size:9px;margin-bottom:2px;align-items:center}
 .specimen-label,.specimen-number{padding-bottom:0}
 .specimen .scene-controls{gap:12px}
 .specimen .scene-controls button{min-height:44px}
}