/* Same control language, no labels to read and no foreground interaction to mistake. */
.hero-stage{position:relative;isolation:isolate;overflow:hidden;background:var(--page)}
.hero-stage>.hero,.hero-stage>.guide-hero{position:relative;z-index:1}
.ambient-controls{--ambient-state:paused;position:absolute;z-index:0;inset:0;pointer-events:none;user-select:none;overflow:hidden;filter:blur(6px);opacity:.34;mask-image:radial-gradient(ellipse 48% 52% at 43% 46%,transparent 20%,#000 90%);-webkit-mask-image:radial-gradient(ellipse 48% 52% at 43% 46%,transparent 20%,#000 90%)}
.ambient-running .ambient-controls{--ambient-state:running}
.ambient-card{position:absolute;width:200px;height:118px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;border:1px solid #c5cdd8;border-radius:24px;background:#e7ecf3;box-shadow:0 8px 22px #2233440a;color:#729ac0;animation:ambient-drift 32s ease-in-out infinite;animation-play-state:var(--ambient-state)}
.ambient-card svg{width:100px;height:76px;overflow:visible;fill:currentColor}
.ambient-card .track{fill:none;stroke:#b2bfce;stroke-width:8;stroke-linecap:round}
.ambient-card .value{fill:none;stroke:currentColor;stroke-width:8;stroke-linecap:round}
.ambient-gauge{left:-2%;top:20%;transform:rotate(-12deg);animation-delay:-8s;--tilt:-12deg}
.ambient-gauge .gauge-arc{stroke-dasharray:142;stroke-dashoffset:48;animation:ambient-gauge 18s ease-in-out infinite}
.ambient-gauge .needle{stroke:#82909f;stroke-width:4;stroke-linecap:round;transform-origin:60px 66px;transform:rotate(15deg);animation:ambient-needle 18s ease-in-out infinite}
.ambient-toggle{left:39%;top:2%;width:170px;height:100px;--tilt:8deg;animation-delay:-16s;color:#79a998}
.toggle-track{width:78px;height:42px;border-radius:30px;background:#adccc1;position:relative}
.toggle-track i{position:absolute;left:6px;top:6px;width:30px;height:30px;background:#fff;border-radius:50%;transform:translateX(20px);animation:ambient-switch 16s ease-in-out infinite}
.hint-line{width:58px;height:5px;border-radius:9px;background:#adb9c7}.hint-line.short{width:35px;align-self:flex-start;margin-left:28px}
.ambient-chart{right:-3%;top:10%;width:225px;height:145px;--tilt:10deg;animation-delay:-21s;color:#91a8c9}
.ambient-chart svg{width:170px;height:86px}.chart-baseline{fill:none;stroke:#afbdcb;stroke-width:2}.chart-line{fill:none;stroke:currentColor;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:215;stroke-dashoffset:16;animation:ambient-chart 24s ease-in-out infinite}
.ambient-slider{left:6%;bottom:7%;width:210px;height:120px;--tilt:7deg;animation-delay:-12s}
.slider-track{width:150px;height:8px;background:#bac9da;border-radius:8px;position:relative}.slider-track i{position:absolute;left:52%;top:-9px;width:26px;height:26px;background:#fff;border:1px solid #bbc7d7;border-radius:50%;animation:ambient-slider 20s ease-in-out infinite}
.ambient-ring{right:3%;bottom:9%;width:145px;height:135px;--tilt:-8deg;animation-delay:-26s;color:#9dacc6}
.ambient-ring svg{width:90px;height:90px;transform:rotate(-90deg)}.ring-value{stroke-dasharray:201;stroke-dashoffset:65;animation:ambient-ring 22s ease-in-out infinite}
.ambient-segment{left:48%;bottom:-3%;width:185px;height:110px;--tilt:-6deg;animation-delay:-4s;color:#9aabc4}
.segment-track{width:125px;height:34px;position:relative;background:#b7c3d4;border-radius:10px}.segment-track i{position:absolute;top:4px;left:4px;width:38px;height:26px;border-radius:7px;background:#f8fafc;transform:translateX(38px);animation:ambient-segment 24s ease-in-out infinite}
.ambient-controls *,.ambient-controls *::before,.ambient-controls *::after{animation-play-state:var(--ambient-state)}
.ambient-toggle-motion{position:absolute;z-index:2;right:24px;bottom:14px;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:30px;background:var(--page);color:var(--secondary);font:12px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer}.ambient-toggle-motion:hover{color:var(--ink)}.ambient-toggle-motion:focus-visible{outline:3px solid var(--link);outline-offset:3px}.ambient-toggle-motion[hidden]{display:none}
@keyframes ambient-drift{0%,100%{transform:translate3d(0,0,0) rotate(var(--tilt,0deg))}50%{transform:translate3d(9px,-12px,0) rotate(calc(var(--tilt,0deg) + 3deg))}}
@keyframes ambient-gauge{0%,100%{stroke-dashoffset:70}50%{stroke-dashoffset:30}}
@keyframes ambient-needle{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(35deg)}}
@keyframes ambient-switch{0%,25%,100%{transform:translateX(6px)}50%,75%{transform:translateX(34px)}}
@keyframes ambient-chart{0%,100%{stroke-dashoffset:45}50%{stroke-dashoffset:0}}
@keyframes ambient-slider{0%,100%{left:28%}50%{left:68%}}
@keyframes ambient-ring{0%,100%{stroke-dashoffset:100}50%{stroke-dashoffset:38}}
@keyframes ambient-segment{0%,100%{transform:translateX(8px)}50%{transform:translateX(74px)}}
@media(prefers-color-scheme:dark){.ambient-controls{opacity:.23}.ambient-card{background:#303b4c;border-color:#64758a;color:#7ca6d1;box-shadow:none}.ambient-toggle{color:#8ab5a6}.hint-line{background:#748499}.ambient-toggle-motion{background:#202022}}
@media(max-width:800px){.ambient-controls{filter:blur(8px);opacity:.26;mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000);-webkit-mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000)}.ambient-gauge{left:-100px;top:15%}.ambient-chart{right:-130px;top:32%}.ambient-toggle{left:70%;top:3%}.ambient-slider{left:-110px;bottom:14%}.ambient-ring{right:-80px;bottom:4%}.ambient-segment{display:none}.hero-stage>.hero{padding-bottom:74px}.hero-stage>.guide-hero{padding-bottom:85px}.ambient-toggle-motion{right:20px;bottom:10px}}
@media(prefers-reduced-motion:reduce){.ambient-controls *,.ambient-controls *::before,.ambient-controls *::after{animation:none!important}.ambient-toggle-motion{display:none}}