/* Each transformed visual stays inside its own stage, separate from the copy. */
.lab-tab-name{min-width:0;flex:1}
.lab-panel .demo-label{line-height:1.8}
.lab-hardware-stage{height:clamp(190px,22vw,290px);position:relative;overflow:hidden;isolation:isolate;margin:8px 0 26px;display:grid;place-items:center}
.lab-hardware-stage .demo-hardware{position:absolute;width:min(72%,360px);margin:0;transform-origin:center;transform:perspective(900px) rotateX(35deg) rotateZ(-16deg)}
.lab-panel .hardware-demo-title{margin-top:0;position:relative;line-height:1.35}
.lab-feature-title{font-size:25px;line-height:1.35;letter-spacing:-.7px}
.lab-scope{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:18px 0 0;padding:0}
.lab-scope li{font-size:10px;line-height:1.5;padding:7px 10px;border:1px solid #4a5a3d;border-radius:20px;color:#c6d3b4}
.lab-panel .lab-caption{line-height:1.85}
.lab-media-stage{height:clamp(200px,22vw,290px);position:relative;overflow:hidden;isolation:isolate;margin-bottom:26px}
.media-film{position:absolute;inset:8% 5% 15% 17%;background:#11180f;border:1px solid #64764c;transform:perspective(900px) rotateY(-10deg) rotateZ(6deg);padding:18px;box-shadow:10px 15px 30px #0004}
.media-film>span{font-size:8px;letter-spacing:2px;display:flex;align-items:center;gap:7px;color:#d2f66a}
.media-film>span>i{width:5px;height:5px;background:#d2f66a;border-radius:50%}
.media-viewfinder{position:absolute;inset:25% 20% 26%;border:1px solid #869d5f;display:grid;place-items:center;background:repeating-linear-gradient(-35deg,transparent 0 15px,#d2f66a08 16px 17px)}
.media-viewfinder:before,.media-viewfinder:after{content:'';position:absolute;inset:-6px;border:1px solid #d2f66a;clip-path:polygon(0 0,15% 0,15% 10%,2% 10%,2% 90%,15% 90%,15% 100%,0 100%)}
.media-viewfinder:after{transform:rotate(180deg)}
.media-viewfinder>b{display:block;width:0;height:0;border-left:20px solid #d2f66a;border-top:12px solid transparent;border-bottom:12px solid transparent}
.media-film>small{position:absolute;bottom:15px;left:18px;font-size:7px;letter-spacing:1.4px;color:var(--muted)}
.media-photo{position:absolute;width:40%;height:70%;left:6%;top:24%;background:#cfe68d;box-shadow:8px 12px 25px #0004;padding:10px;transform:rotate(-12deg);display:flex;flex-direction:column;align-items:center;gap:12px}
.media-lens{background:#243719;width:100%;flex:1;display:grid;place-items:center;overflow:hidden;min-height:0}
.media-lens>i{display:block;width:70%;aspect-ratio:1;border-radius:50%;border:1px solid #b8d774;background:conic-gradient(from 30deg,#d2f66a55,#172a0e 20%,#b7cf6f66 40%,#182a0f 60%,#829f4244 80%,#d2f66a55);position:relative}
.media-lens>i:after{content:'';position:absolute;inset:28%;border-radius:50%;background:#111a0e;box-shadow:0 0 0 4px #a8c36644;border:1px solid #91ad58}
.media-photo>span{font-size:6px;letter-spacing:1px;color:#243219;text-align:center;line-height:1.6}
.equipment-visual{position:relative;border:1px solid #425235;background:#12190f}
.equipment-art{position:relative;aspect-ratio:1.16;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 60% 40%,#4f692332,transparent 65%);perspective:900px}
.equipment-grid{position:absolute;inset:0;background-image:linear-gradient(#9fb96b0c 1px,transparent 1px),linear-gradient(90deg,#9fb96b0c 1px,transparent 1px);background-size:34px 34px;mask-image:radial-gradient(ellipse,#000,transparent 75%)}
.equipment-coordinate{position:absolute;left:7%;top:7%;font-size:9px;letter-spacing:2px;color:var(--muted)}
.equipment-cross{position:absolute;right:7%;bottom:7%;font-size:27px;color:var(--accent);font-weight:400}
.chip-scene{position:absolute;inset:17% 20%;transform-style:preserve-3d;transform:rotateX(48deg) rotateZ(-35deg)}
.chip-board,.chip-plate,.chip-core{position:absolute;inset:0;transform-style:preserve-3d}
.chip-board{border:1px solid #58793a;background:repeating-linear-gradient(90deg,transparent 0 14%,#5c803244 14.3% 14.7%,transparent 15% 21%),repeating-linear-gradient(0deg,#17230f 0 20%,#5c803266 20.3% 20.7%,#17230f 21% 25%);box-shadow:12px 12px 0 #090e06}
.chip-plate{inset:17%;background:#344b20;border:1px solid #aecf6a;transform:translateZ(23px);box-shadow:7px 7px 0 #1c2e10}
.chip-plate:before,.chip-plate:after{content:'';position:absolute;inset:12% -9%;background:repeating-linear-gradient(0deg,#d2f66a 0 3px,transparent 3px 12px);z-index:-1}
.chip-plate:after{transform:rotate(90deg)}
.chip-core{inset:21%;background:linear-gradient(135deg,#ecffac,#c3e36b 50%,#87a63d);border:1px solid #efffc9;transform:translateZ(47px);display:grid;place-items:center;box-shadow:8px 8px 0 #729235}
.chip-core>span{font-size:clamp(48px,7vw,100px);line-height:1;letter-spacing:-.07em;color:#243414;font-weight:600}
.equipment-caption{border-top:1px solid #425235;padding:19px 7%;display:flex;justify-content:space-between;gap:16px;align-items:center}
.equipment-caption>span:first-child{font-size:8px;letter-spacing:1.4px;color:var(--accent);line-height:1.8}
.equipment-caption>span:last-child{font-size:10px;line-height:1.8;color:var(--muted);text-align:right;max-width:55%}
.hardware-hero-visual{padding-top:0}
.hardware-hero-note{margin-top:27px}
@media(max-width:900px){.lab-hardware-stage{height:210px}.lab-hardware-stage .demo-hardware{width:75%}.lab-media-stage{height:220px}.media-film{padding:13px}.media-film>small{left:13px;font-size:6px}.media-photo{padding:8px;gap:7px}.media-photo>span{font-size:5px;letter-spacing:.5px}.equipment-caption{padding:15px 7%}.equipment-caption>span:first-child{font-size:7px}.equipment-caption>span:last-child{font-size:9px}}
@media(max-width:580px){.lab-tabs{gap:10px}.lab-tabs button{min-width:0;min-height:54px;line-height:1.45;font-size:11px}.lab-tabs button>span:last-child{display:none}.lab-tab-name{flex:initial}.lab-hardware-stage{height:200px;margin-top:0;margin-bottom:23px}.lab-hardware-stage .demo-hardware{width:76%}.lab-media-stage{height:225px;margin-bottom:23px}.lab-feature-title,.lab-panel .hardware-demo-title{font-size:24px}.lab-scope{gap:6px}.lab-scope li{font-size:9px;padding:6px 9px}.lab-panel .lab-caption{margin-top:20px}.equipment-art{aspect-ratio:1.2}.equipment-coordinate{font-size:7px}.chip-core>span{font-size:56px}.chip-scene{inset:19% 23%;transform:rotateX(48deg) rotateZ(-35deg) scale(.94)}.equipment-caption>span:first-child{font-size:6px;letter-spacing:1px}.equipment-caption>span:last-child{font-size:8px}.hardware-hero-visual{width:100%}.hardware-hero-note{margin-top:22px}}
@media(prefers-reduced-motion:reduce){.lab-hardware-stage .demo-hardware{transform:rotate(-8deg)}}

/* The room has its own fixed-ratio stage; captions never share the 3D space. */
.planner-visual{min-width:0;min-height:0}
.isometric-room{flex:none;display:grid;grid-template-columns:minmax(0,1fr);justify-content:stretch;place-items:center;aspect-ratio:1.3;padding:0;margin:18px 0 25px;overflow:hidden;isolation:isolate}
.room-desks{position:relative;width:min(72%,calc(var(--room-columns,2) * 83px + 40px));max-width:none;min-height:0;margin:0;padding:5%;gap:clamp(9px,1.2vw,16px);grid-template-columns:repeat(var(--room-columns,2),minmax(0,1fr));transform:rotateX(28deg) rotateZ(-16deg);box-shadow:8px 10px 0 #080d06a0}
.room-desk{height:auto;aspect-ratio:1.65;min-width:0;box-shadow:2px 3px 0 #4a652b}
.room-desk i{left:22%;right:18%;height:68%;top:-26%;border-width:1px}
.room-desk i:after{inset:20%;border-top-width:1px}
.room-desk b{bottom:12%;height:9%;min-height:1px}
.planner-summary{position:relative;line-height:1.75;margin-top:0}
.school-visual{width:min(100%,320px);margin-top:22px;color:#203212}
.school-visual svg{display:block;width:100%;height:auto}
.school-windows rect{opacity:.35}
.js-motion .experience-label:not(.is-visible) .school-outline>*{stroke-dasharray:1;stroke-dashoffset:1}
.js-motion .experience-label.is-visible .school-outline>*{stroke-dasharray:1;animation:school-draw 1.8s ease both}
.js-motion .experience-label.is-visible .school-windows rect{animation:school-light 1s 1.1s ease both}
.school-windows rect:nth-child(2n){animation-delay:1.3s!important}
.school-windows rect:nth-child(3n){animation-delay:1.5s!important}
@keyframes school-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes school-light{from{opacity:0}to{opacity:.6}}
.intro-playing .hardware-hero h1{animation:gallery-detail calc(.95s / var(--motion-rate)) calc(.65s / var(--motion-rate)) var(--ease) both}
.intro-playing .hardware-hero-visual{animation:gallery-detail calc(1.1s / var(--motion-rate)) calc(.8s / var(--motion-rate)) var(--ease) both}
.intro-playing .hardware-hero-grid>div>p,.intro-playing .hardware-hero-grid>div>.button{animation:gallery-detail calc(.8s / var(--motion-rate)) calc(1.1s / var(--motion-rate)) both}
@media(max-width:580px){.experience-label{align-items:flex-start}.school-visual{width:125px;flex:0 0 125px;margin-top:-8px}.isometric-room{aspect-ratio:1.1;margin-top:18px;margin-bottom:20px}.room-desks{width:76%;gap:9px;padding:6%}.goal-choice strong{line-height:1.35}}
@media(prefers-reduced-motion:reduce){.school-outline>*{stroke-dashoffset:0!important}.school-windows rect{opacity:.6}.room-desks{transform:rotate(-10deg)}}
