.project-experience{position:relative;isolation:isolate}
.solar-stage{height:100svh!important;max-height:1100px;min-height:580px;background:#020202 url('./assets/projects/lbank/orbit-star-clouds.webp') center/cover;--glow-x:50%;--glow-y:50%;--space-glow:0}
.solar-stage::before{content:'';position:absolute;left:0;top:0;z-index:0;width:min(1100px,140vw);aspect-ratio:1;pointer-events:none;background:radial-gradient(ellipse,#ffe10038 0%,#ffe10017 25%,#ffe10005 47%,transparent 65%);opacity:var(--space-glow);transform:translate3d(var(--glow-x),var(--glow-y),0) translate(-50%,-50%);will-change:transform,opacity}
.solar-fallback{left:38%;top:28%;width:24%;height:44%;object-fit:contain;opacity:.85}
.solar-tooltip{position:absolute;left:0;top:0;z-index:4;width:max-content;max-width:calc(100% - 32px);padding:18px 24px;border:1px solid rgba(255,255,255,.65);border-radius:22px;background:linear-gradient(115deg,rgba(255,255,255,.7),rgba(243,244,248,.45) 38%,rgba(243,244,248,.6));backdrop-filter:blur(28px) saturate(145%);-webkit-backdrop-filter:blur(28px) saturate(145%);box-shadow:inset 0 2px 1px rgba(255,255,255,.7),inset 0 -1px 1px rgba(255,255,255,.28),0 8px 32px rgba(0,0,0,.15);color:#17191d;font:500 18px/1.4 Inter,sans-serif;text-align:center;white-space:nowrap;pointer-events:none;transform:translate3d(var(--tooltip-x,0px),var(--tooltip-y,0px),0)}
.solar-tooltip[hidden]{display:none}
@supports not (backdrop-filter:blur(1px)){.solar-tooltip{background:rgba(243,244,248,.96)}}
.solar-pause{position:absolute;right:var(--gutter);bottom:30px;z-index:3;display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff38;border-radius:50%;background:#11151f77;color:#fff;font:500 15px Inter,sans-serif;cursor:pointer;backdrop-filter:blur(10px)}
.solar-pause[hidden]{display:none}.solar-pause:hover{color:#ffe100;border-color:#ffe100}.solar-pause:focus-visible,.solar-stage canvas:focus-visible{outline:2px solid #ffe100;outline-offset:-4px}
@media(max-width:800px){.solar-stage{height:75svh!important;min-height:470px}.solar-pause{bottom:22px}.solar-tooltip{padding:14px 18px;border-radius:18px;font-size:clamp(10px,3.5vw,15px)}}
.experience-stage{position:relative;height:clamp(620px,85svh,960px);overflow:hidden;isolation:isolate}
.film-experience .film-stage{height:100svh;min-height:0;max-height:none;background:#191d17}
.experience-film{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;user-select:none}
.film-brand{position:absolute;inset:0;z-index:1;display:grid;place-items:center;pointer-events:none;user-select:none}
.film-brand img{display:block;width:clamp(260px,42vw,620px);max-width:76%;max-height:70%;height:auto;object-fit:contain;filter:drop-shadow(0 2px 18px #00000029)}
.chocolate-stage{background:radial-gradient(ellipse at 40% 28%,#f6ecd9,#e4d7c2 70%,#c4b398)}
.experience-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:2;opacity:0;transition:opacity .6s;touch-action:pan-y}
.experience-ready .experience-canvas{opacity:1}
.experience-fallback{position:absolute;object-fit:contain;transition:opacity .35s}
.chocolate-fallback{inset:8% 12%;width:76%;height:84%;border-radius:24px;object-fit:cover;z-index:1}
.experience-ready .experience-fallback{opacity:0;pointer-events:none}
.chocolate-brand{position:absolute;inset:0;display:grid;place-items:center;padding:28px}
.chocolate-brand img{width:clamp(210px,29vw,440px);height:auto;filter:drop-shadow(0 12px 24px #64543712)}
.experience-action{position:absolute;right:var(--gutter);bottom:32px;z-index:3;display:flex;align-items:center;gap:24px;border:1px solid #39251d28;background:#fff8ecbb;backdrop-filter:blur(12px);color:#39251d;padding:14px 22px;border-radius:99px;font:500 14px Inter,sans-serif;cursor:pointer;transition:background .2s}
.experience-action[hidden]{display:none}.experience-action:hover{background:#fff8ec}.experience-action:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.rice-stage{height:100svh;min-height:650px;background:#f0f0ec url('./assets/projects/tong-seng-produce/marble-table.webp') center/cover}
.rice-table-logo{position:absolute;left:50%;top:50%;width:46%;max-width:640px;height:auto;transform:translate(-50%,-50%);mix-blend-mode:multiply;opacity:.92;pointer-events:none}
.rice-reveal{background:#ffffffe6;color:#333;border-color:#3332}
@media(pointer:fine) and (prefers-reduced-motion:no-preference){.rice-reveal{opacity:0;pointer-events:none}.rice-reveal:focus-visible{opacity:1;pointer-events:auto}}
.rice-still .rice-reveal{opacity:1;pointer-events:auto}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:801px){.case-mr-bucket .concept-copy,.case-tong-seng-produce .concept-copy{min-height:320px}}
@media(max-width:800px){.experience-stage{height:620px;max-height:85svh;min-height:500px}.chocolate-brand img{width:54%;max-width:300px}.experience-action{bottom:24px;right:24px;padding:13px 18px;font-size:13px}.chocolate-fallback{inset:15% 5%;width:90%;height:70%}.rice-stage{height:85svh}.rice-table-logo{width:66%}.rice-reveal{opacity:1;pointer-events:auto}}
@media(prefers-reduced-motion:reduce){.experience-canvas,.experience-fallback{transition:none}}