/* Scene controls stay quiet, in a small dock inside the 3D canvas. */
.hero{height:clamp(690px,calc(100svh - 92px),830px);min-height:690px;isolation:isolate;background:#f5f6f8}
.hero-wash{display:none}
.hero-content{padding-top:42px;padding-bottom:100px;z-index:2;pointer-events:none}
.hero-content>*{width:415px;max-width:38%;pointer-events:auto}
.hero-name{font-size:clamp(126px,12.4vw,178px);margin-top:10px;margin-bottom:15px}
.hero h1{font-size:clamp(29px,2.65vw,38px);letter-spacing:-.052em}
.hero-description{max-width:335px;font-size:13px}
.hero-actions{max-width:42%;gap:20px}
.hero-actions .button{padding:16px 20px;gap:27px}
.hero-actions .text-link{font-size:11px}
.hero-bottom{z-index:4;pointer-events:auto}
.scene-shell{position:absolute;right:0;top:0;bottom:75px;width:60%;z-index:1;isolation:isolate}
.thao-scene{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:hidden;background:#f5f6f8}
#thao-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;opacity:0;visibility:hidden;touch-action:pan-y;cursor:grab;outline-offset:-8px;transition:opacity .5s ease}
#thao-canvas:active{cursor:grabbing}
.scene-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center;transition:opacity .45s ease}
.scene-ready #thao-canvas,#thao-canvas.scene-ready{opacity:1;visibility:visible}
.scene-ready .scene-fallback,.thao-scene:has(#thao-canvas.scene-ready) .scene-fallback{opacity:0;visibility:hidden}
.scene-unavailable #thao-canvas,#thao-canvas.scene-unavailable{opacity:0!important;visibility:hidden!important;pointer-events:none}
.scene-unavailable .scene-fallback,.thao-scene:has(#thao-canvas.scene-unavailable) .scene-fallback{opacity:1!important;visibility:visible!important}
.scene-ui{position:absolute;inset:0;z-index:3;pointer-events:none}
.scene-dock{position:absolute;right:28px;bottom:22px;display:flex;align-items:center;gap:0;padding:3px;border:1px solid rgba(70,83,109,.1);border-radius:15px;background:rgba(255,255,255,.7);box-shadow:0 5px 24px rgba(24,38,63,.045);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);pointer-events:auto}
.scene-icon-button{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;min-height:40px;padding:0;border:0;border-radius:11px;background:transparent;color:#687285;line-height:1;transition:background .18s,color .18s}
.scene-icon-button svg{display:block;width:16px;height:16px;flex:none;pointer-events:none}
.scene-icon-button .icon-on{display:none}
.scene-icon-button[aria-pressed="true"] .icon-off,.scene-icon-button[aria-expanded="true"] .icon-off{display:none}
.scene-icon-button[aria-pressed="true"] .icon-on,.scene-icon-button[aria-expanded="true"] .icon-on{display:block}
.scene-icon-button:hover,.scene-icon-button:focus-visible{background:rgba(36,72,255,.07);color:var(--cobalt)}
.scene-icon-button[aria-pressed="true"],.scene-icon-button[aria-expanded="true"]{color:var(--cobalt);background:rgba(36,72,255,.065)}
.scene-icon-button:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}
.scene-icon-button:disabled{opacity:.35;cursor:default;background:transparent}
.scene-icon-button:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,3px);padding:7px 10px;border-radius:7px;background:#182033;color:white;font-size:9px;font-weight:400;line-height:1.55;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s,transform .14s;z-index:6;box-shadow:0 4px 16px rgba(10,20,40,.1)}
.scene-icon-button:hover:after,.scene-icon-button:focus-visible:after{opacity:1;visibility:visible;transform:translate(-50%,0)}
#scene-more[aria-expanded="true"]:after{opacity:0;visibility:hidden}
.scene-dock>.scene-icon-button:nth-last-of-type(-n+2):after,.scene-tools>.scene-icon-button:nth-last-child(-n+2):after{left:auto;right:0;transform:translateY(3px)}
.scene-dock>.scene-icon-button:nth-last-of-type(-n+2):hover:after,.scene-dock>.scene-icon-button:nth-last-of-type(-n+2):focus-visible:after,.scene-tools>.scene-icon-button:nth-last-child(-n+2):hover:after,.scene-tools>.scene-icon-button:nth-last-child(-n+2):focus-visible:after{transform:translateY(0)}
.scene-progress-track{position:absolute;left:13px;right:13px;bottom:1px;height:1px;overflow:hidden;opacity:0;background:rgba(36,72,255,.08);pointer-events:none;transition:opacity .2s}
.scene-playing .scene-progress-track{opacity:1}
#scene-progress{display:block;width:100%;height:100%;background:var(--cobalt);transform:scaleX(var(--show-progress,0));transform-origin:left center}
.scene-options{position:absolute;right:0;bottom:calc(100% + 9px);padding:4px;border:1px solid rgba(70,83,109,.1);border-radius:15px;background:rgba(255,255,255,.92);box-shadow:0 8px 28px rgba(24,38,63,.08);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);pointer-events:auto}
.scene-options[hidden]{display:none!important}
.scene-tools{display:flex;gap:0}
.scene-steps{display:flex;justify-content:center;gap:2px;border-top:1px solid rgba(66,80,110,.09);padding-top:4px;margin-top:4px}
.scene-steps .scene-icon-button{height:34px;min-height:34px;width:44px}
.scene-steps .scene-icon-button svg{width:15px;height:15px}
.scene-options .scene-icon-button:after{font-size:9px}
.scene-error #scene-status,.scene-shell:has(.scene-unavailable) #scene-status{position:absolute;clip:auto;width:auto;height:auto;overflow:visible;white-space:normal;left:20px;right:20px;bottom:85px;padding:12px 15px;border:1px solid rgba(66,80,110,.12);border-radius:12px;background:rgba(255,255,255,.92);color:#46516b;font-size:11px;line-height:1.7}
.scene-cobalt{background:#131b4d}
.scene-dark .scene-dock{background:rgba(27,38,77,.66);border-color:rgba(216,224,255,.12);box-shadow:0 5px 24px rgba(0,0,0,.1)}
.scene-dark .scene-icon-button{color:#b9c4e8}
.scene-dark .scene-icon-button:hover,.scene-dark .scene-icon-button:focus-visible{color:#fff;background:rgba(255,255,255,.08)}
.scene-dark .scene-icon-button[aria-pressed="true"],.scene-dark .scene-icon-button[aria-expanded="true"]{color:var(--lime);background:rgba(214,244,60,.08)}
.scene-dark .scene-icon-button:focus-visible{outline-color:var(--lime)}
.scene-dark .scene-options{background:rgba(26,37,76,.96);border-color:rgba(216,224,255,.14)}
.scene-dark .scene-steps{border-color:rgba(216,224,255,.12)}
.scene-dark #scene-progress{background:var(--lime)}
.scene-dark .scene-progress-track{background:rgba(255,255,255,.1)}
.scene-expanded{overflow:hidden}
.scene-expanded .hero{isolation:auto;overflow:visible}
.scene-expanded .scene-shell{position:fixed;inset:0;width:100%;height:100dvh;z-index:100;margin:0}
.scene-expanded .scene-dock{right:28px;bottom:max(25px,env(safe-area-inset-bottom))}
.scene-expanded .scene-fallback{object-fit:cover;object-position:70% center}
@media(min-width:1650px){.hero{min-height:740px}.hero-content{padding-top:55px}.hero-name{font-size:191px}.hero-content>*{max-width:40%}.hero-description{font-size:14px}.scene-dock{right:max(40px,calc((100vw - 1440px)/2))}}
@media(max-width:1190px){.hero-content{padding-top:40px}.hero-name{font-size:146px}.hero-content>*{max-width:42%}.hero-description{width:310px;max-width:38%;font-size:12px}.hero h1{font-size:30px}.hero-actions{flex-direction:column;align-items:flex-start;gap:18px;max-width:39%;margin-top:25px}.hero-note{font-size:10px}.scene-shell{width:58%}.scene-dock{right:22px}}
@media(max-width:900px) and (min-width:641px){.hero{min-height:690px}.hero-content{padding-top:45px}.hero-name{font-size:116px}.hero h1{font-size:25px;line-height:1.25}.hero-description{width:255px;max-width:37%;font-size:12px}.hero-actions .button{padding:14px 16px;font-size:11px;gap:24px}.hero-actions .text-link{font-size:10px}.hero-note{font-size:9px}.scene-shell{width:60%}.scene-dock{right:18px;bottom:18px}}
@media(min-width:641px) and (max-height:820px){.hero-content{padding-top:26px;padding-bottom:90px}.hero-name{font-size:clamp(108px,9.4vw,136px);line-height:1.12;margin-top:7px;margin-bottom:13px}.hero h1{font-size:clamp(27px,2.45vw,34px);line-height:1.22}.hero-description{font-size:12px;line-height:1.7;margin-top:17px}.hero-actions{margin-top:20px;gap:18px}.hero-actions .button{min-height:47px;padding:13px 18px;font-size:11px;gap:24px}.hero-actions .text-link{font-size:10px}.hero-note{font-size:9px;margin-top:10px;line-height:1.5}}
@media(max-width:640px){
 .hero{height:auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
 .hero-content{order:1;padding-top:16px;padding-bottom:0;z-index:2;pointer-events:none}
 .hero-content>*{width:auto;max-width:100%}
 .hero-content>.eyebrow{font-size:8px}
 .hero-name{font-size:104px;line-height:1.1;letter-spacing:-.088em;margin:8px 0 14px -5px}
 .hero h1{font-size:28px;line-height:1.23;max-width:335px}
 .hero-description{font-size:12px;line-height:1.75;max-width:305px;width:100%;margin-top:17px}
 .hero-actions{display:flex;flex-direction:row;align-items:center;gap:20px;max-width:100%;margin-top:23px}
 .hero-actions .button{font-size:10px;gap:24px;padding:14px 18px;min-height:47px}
 .hero-actions .text-link{font-size:9px;gap:7px}
 .hero-note{font-size:9px;margin-top:11px}
 .scene-shell{order:2;position:relative;inset:auto;width:100%;height:440px;min-height:440px;flex:none;margin-top:7px}
 .scene-dock{right:15px;bottom:15px;padding:3px;border-radius:16px}
 .scene-icon-button{width:44px;height:44px;min-height:44px;border-radius:12px}
 .scene-options{padding:4px;border-radius:16px}
 .scene-steps .scene-icon-button{height:40px;min-height:40px;width:48px}
 .hero-bottom{order:3;position:relative;inset:auto;z-index:4;flex:none;height:59px;min-height:59px;background:#f5f6f8}
 .scene-expanded .scene-shell{position:fixed;inset:0;width:100%;height:100dvh;min-height:0;order:initial}
 .scene-expanded .scene-dock{right:15px;bottom:max(17px,env(safe-area-inset-bottom))}
}
@media(max-width:370px){.hero-name{font-size:98px}.hero h1{font-size:26px}.hero-actions{gap:13px}.hero-actions .button{font-size:10px;padding-inline:15px;gap:19px}.hero-actions .text-link{font-size:8px}.scene-shell{height:410px;min-height:410px}}
@media(hover:none){.scene-icon-button:hover:after{opacity:0;visibility:hidden}.scene-icon-button:focus-visible:after{opacity:1;visibility:visible}}
@media(prefers-reduced-motion:reduce){#thao-canvas,.scene-fallback,.scene-icon-button,.scene-icon-button:after,.scene-progress-track{transition:none!important}}

/* Audio indication follows the sound analyser; it has no decorative animation. */
.scene-audio-meter{position:absolute;left:50%;bottom:5px;display:none;align-items:flex-end;gap:2px;width:10px;height:5px;transform:translateX(-50%);pointer-events:none}
#scene-sound[data-audio-state="on"] .scene-audio-meter{display:flex}
.scene-audio-meter i{display:block;width:2px;height:5px;border-radius:1px;background:currentColor;transform-origin:center bottom}
.scene-audio-meter i:nth-child(1){transform:scaleY(clamp(.15,var(--audio-level-1,0),1))}
.scene-audio-meter i:nth-child(2){transform:scaleY(clamp(.15,var(--audio-level-2,0),1))}
.scene-audio-meter i:nth-child(3){transform:scaleY(clamp(.15,var(--audio-level-3,0),1))}
.scene-audio-note{position:absolute;right:28px;bottom:84px;max-width:min(290px,calc(100% - 40px));padding:8px 11px;border:1px solid rgba(70,83,109,.1);border-radius:10px;background:rgba(255,255,255,.92);color:#566278;font-size:10px;line-height:1.65;box-shadow:0 5px 20px rgba(24,38,63,.04);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);pointer-events:none}
.scene-audio-note[hidden]{display:none!important}
.scene-audio-note[data-tone="error"]{color:#814024;background:rgba(255,249,244,.96);border-color:rgba(158,85,48,.16)}
.scene-ui:has(#scene-more[aria-expanded="true"]) .scene-audio-note{bottom:183px}
.scene-dark .scene-audio-note{color:#e0e7fc;background:rgba(26,37,76,.96);border-color:rgba(216,224,255,.14)}
.scene-dark .scene-audio-note[data-tone="error"]{color:#ffd3b5;background:rgba(49,35,50,.97);border-color:rgba(255,194,157,.2)}
.scene-expanded .scene-audio-note{right:28px;bottom:calc(max(25px,env(safe-area-inset-bottom)) + 62px)}
.scene-expanded .scene-ui:has(#scene-more[aria-expanded="true"]) .scene-audio-note{bottom:calc(max(25px,env(safe-area-inset-bottom)) + 161px)}
@media(min-width:1650px){.scene-audio-note{right:max(40px,calc((100vw - 1440px)/2))}}
@media(max-width:1190px){.scene-audio-note{right:22px}}
@media(max-width:900px) and (min-width:641px){.scene-audio-note{right:18px;bottom:80px}.scene-ui:has(#scene-more[aria-expanded="true"]) .scene-audio-note{bottom:179px}}
@media(max-width:640px){
 .scene-audio-note{right:15px;bottom:81px;font-size:10px}
 .scene-ui:has(#scene-more[aria-expanded="true"]) .scene-audio-note{bottom:190px}
 .scene-expanded .scene-audio-note{right:15px;bottom:calc(max(17px,env(safe-area-inset-bottom)) + 66px)}
 .scene-expanded .scene-ui:has(#scene-more[aria-expanded="true"]) .scene-audio-note{bottom:calc(max(17px,env(safe-area-inset-bottom)) + 175px)}
}