@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url('assets/inter-latin.woff2') format('woff2')}
:root{color-scheme:dark;--bg:#031327;--surface:#08233f;--text:#f8fafc;--muted:#cbd5e1;--cyan:#38bdf8;--accent:#38bdf8;--amber:#ffaa00;--green:#22c55e}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font:16px/1.55 Inter,Arial,sans-serif}
button,a{font:inherit;color:inherit}button{border:0;background:none;cursor:pointer;min-width:44px;min-height:44px}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #7dd3fc;outline-offset:3px}.skip{position:fixed;left:12px;top:-60px;z-index:100;background:#0066ff;padding:10px 14px;border-radius:6px}.skip:focus{top:12px;visibility:visible}.skip:not(:focus){visibility:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
.experience{height:100dvh;min-height:560px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(circle at 60% 35%,#153b5b,#031327 65%)}
.topbar{height:64px;position:absolute;z-index:30;top:16px;left:clamp(14px,2vw,30px);right:clamp(14px,2vw,30px);display:flex;align-items:center;justify-content:space-between;padding:9px 12px 9px 10px;border:1px solid #ffffff42;border-radius:22px;background:linear-gradient(145deg,#d8f1ff20,#ffffff0b 50%,#0313275c);box-shadow:0 18px 55px #0007,0 1px 0 #ffffff6b inset;backdrop-filter:blur(28px) saturate(1.75);-webkit-backdrop-filter:blur(28px) saturate(1.75);pointer-events:none}
.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand-mark{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;border:1px solid #aee8ff50;background:linear-gradient(145deg,#ffffff24,#0d2b488c);box-shadow:0 1px 0 #ffffff6b inset,0 9px 24px #0004;font-size:28px;font-weight:800;line-height:1}.brand-mark span{position:absolute;right:-6px;top:-7px;color:var(--cyan);font-size:17px}.brand strong{display:block;font-size:14px;letter-spacing:1.7px}.brand strong b{color:var(--cyan)}.brand small{display:block;color:#c1d2df;font-size:10px}.top-actions{display:flex;align-items:center;gap:5px}.top-actions>button{padding:0 14px;font-size:13px;color:#e5eef5;border-radius:999px;transition:background .22s,transform .22s}.top-actions>button:hover{background:#ffffff18}.top-actions>button:active{transform:scale(.96)}.top-actions #exit-tour{width:44px;border:1px solid #ffffff30;background:#ffffff0a;font-size:25px}.view-status{padding:7px 11px;border:1px solid #ffffff20;border-radius:999px;background:#ffffff09;font-size:10px;letter-spacing:1.6px;color:#c2d2df;margin-right:5px}.view-status i{display:inline-block;width:6px;height:6px;background:var(--green);border-radius:50%;box-shadow:0 0 10px #22c55e;margin-right:8px}
.viewer-shell,.viewport{position:absolute;inset:0}.viewer-shell{overflow:hidden}.viewport{background:#031327;overflow:hidden;touch-action:none;cursor:grab}.viewport:active{cursor:grabbing}.scene{position:absolute;will-change:transform;transform-origin:center;transition:transform .9s cubic-bezier(.2,.75,.2,1),width .6s ease,height .6s ease,left .6s ease,top .6s ease}.scene.dragging{transition:none}.scene-image{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;opacity:0;transition:opacity .8s ease;pointer-events:none}.scene-image.active{opacity:1}.scene svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.vignette{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,#031327d9 0%,transparent 32%,transparent 72%,#031327a8 100%),linear-gradient(0deg,#031327e8 0%,transparent 23%,transparent 78%,#03132799 100%);transition:opacity .7s}.tour-active .vignette{opacity:.65}
.cover{position:absolute;z-index:10;left:clamp(22px,7vw,105px);top:50%;width:min(790px,86vw);padding:27px 34px 29px;border:1px solid #8bdcff30;border-left:3px solid #38bdf8;border-radius:18px;background:linear-gradient(105deg,#031327f5 0%,#061c32e8 68%,#061c32b8 100%);box-shadow:0 28px 90px #0009,0 0 0 1px #03132770 inset;backdrop-filter:blur(12px) saturate(1.08);transform:translateY(-48%);transition:opacity .55s,transform .8s cubic-bezier(.2,.8,.2,1),visibility .55s}.tour-active .cover{opacity:0;visibility:hidden;transform:translateY(-44%) translateX(-30px);pointer-events:none}.eyebrow{margin:0;color:#9ed9f4;font-size:11px;letter-spacing:2.1px;font-weight:700}.eyebrow>span{display:inline-block;width:20px;height:2px;background:var(--cyan);vertical-align:middle;margin-right:8px}.cover .team-name{display:inline-flex;align-items:center;padding:8px 12px 8px 0;color:#f8fafc;font-size:13px;letter-spacing:2.4px}.cover .team-name>span{width:30px}.cover h1{font-size:clamp(30px,3.7vw,56px);line-height:1.06;letter-spacing:-.045em;margin:18px 0 24px;max-width:790px;text-shadow:0 2px 18px #000b}.cover h1>span{display:block}.cover h1 .title-emphasis{color:#c9e7f7}.cover h1 em{font-style:normal;color:#7dd3fc}.cover h1 small{display:block;max-width:700px;margin-top:14px;color:#e2edf5;font-size:clamp(14px,1.3vw,19px);font-weight:500;line-height:1.4;letter-spacing:0}.cover h1 strong{display:block;margin-top:8px;color:#7dd3fc;font-size:clamp(14px,1.35vw,20px);line-height:1.35;letter-spacing:.055em}.enter-button{display:inline-flex;align-items:center;gap:56px;padding:0 19px;background:#0066ff;border:1px solid #4e94ff;border-radius:9px;font-weight:700;box-shadow:0 13px 35px #0066ff30}.enter-button span{font-size:20px}.cover>small{display:block;margin-top:18px;color:#a9bed1;font-size:11px;letter-spacing:.5px}
.mode-card{position:absolute;z-index:6;left:clamp(18px,3vw,48px);top:98px;width:min(370px,calc(100vw - 36px));padding:18px 21px;border:1px solid #ffffff29;border-radius:20px;background:linear-gradient(145deg,#071f37f4,#031327e8);box-shadow:0 22px 65px #0006,0 1px 0 #ffffff29 inset;opacity:0;transform:translateX(-18px);pointer-events:none;transition:opacity .6s .2s,transform .7s cubic-bezier(.22,1,.36,1) .2s}.tour-active .mode-card{opacity:1;transform:none}.mode-card>span{color:var(--accent);font-size:10px;letter-spacing:1.5px}.mode-card h2{margin:4px 0 6px;font-size:21px;letter-spacing:-.5px}.mode-card p{margin:0;color:#c2d2df;font-size:13px}
.mode-switch{position:absolute;z-index:8;left:50%;bottom:24px;transform:translateX(-50%) translateY(25px);display:flex;padding:6px;background:linear-gradient(145deg,#d8f1ff24,#ffffff0b 48%,#0313274d);border:1px solid #ffffff4a;border-radius:999px;backdrop-filter:blur(28px) saturate(1.8);-webkit-backdrop-filter:blur(28px) saturate(1.8);box-shadow:0 22px 65px #0008,0 1px 0 #ffffff70 inset,0 -1px 0 #0005 inset;opacity:0;transition:opacity .6s .25s,transform .7s .25s}.tour-active .mode-switch{opacity:1;transform:translateX(-50%)}.mode-switch button{min-width:118px;padding:7px 15px;border-radius:999px;display:flex;align-items:center;gap:9px;color:#d3e2ee;transition:background .25s,color .25s,box-shadow .25s,transform .25s}.mode-switch button:hover{background:#ffffff13}.mode-switch button:active{transform:scale(.98)}.mode-switch button span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;border:1px solid #ffffff48;background:#ffffff0d;font-size:9px}.mode-switch button b{font-size:12px;text-transform:uppercase;letter-spacing:.7px}.mode-switch button[aria-pressed=true]{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 92%,white),var(--accent));color:#031327;box-shadow:0 7px 22px color-mix(in srgb,var(--accent) 38%,transparent),0 1px 0 #ffffffa8 inset}.mode-switch button[aria-pressed=true] span{border-color:#03132755;background:#ffffff42}
.stage-rail{position:absolute;z-index:8;left:50%;bottom:91px;transform:translateX(-50%) translateY(14px);display:flex;align-items:center;gap:9px;padding:5px 8px;border:1px solid #ffffff42;border-radius:999px;background:linear-gradient(145deg,#d8f1ff1f,#ffffff08 58%,#03132755);backdrop-filter:blur(24px) saturate(1.7);-webkit-backdrop-filter:blur(24px) saturate(1.7);box-shadow:0 16px 45px #0007,0 1px 0 #ffffff5c inset;opacity:0;transition:opacity .55s .35s,transform .65s .35s}.tour-active .stage-rail{opacity:1;transform:translateX(-50%)}#stage-auto-status{position:absolute;bottom:47px;left:50%;width:max-content;transform:translateX(-50%);padding:3px 8px;border:1px solid #ffffff24;border-radius:999px;background:#061a2c8c;backdrop-filter:blur(12px);color:#bdd1e1;font-size:8px;font-weight:700;letter-spacing:1.3px}.stage-rail>button{min-width:34px;width:34px;min-height:34px;height:34px;border-radius:50%;font-size:16px}.stage-rail>button:hover{background:#ffffff16}#stage-dots{display:flex;gap:7px}.stage-dot{min-width:30px;width:30px;min-height:30px;height:30px;border-radius:50%;border:1px solid #ffffff42;background:#ffffff0a;color:#b8cad8;font-size:10px}.stage-dot[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#031327;font-weight:800;box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 42%,transparent),0 1px 0 #ffffff9a inset}.stage-dot .dot-label{position:absolute;bottom:42px;left:50%;width:max-content;max-width:250px;transform:translateX(-50%);padding:8px 11px;border-radius:7px;background:#04192c;opacity:0;visibility:hidden;color:#f8fafc;font-size:11px;box-shadow:0 12px 30px #0007}.stage-dot:hover .dot-label,.stage-dot:focus-visible .dot-label{opacity:1;visibility:visible}
.viewer-tools{position:absolute;z-index:8;right:clamp(17px,3vw,48px);bottom:25px;display:flex;align-items:center;padding:4px;background:linear-gradient(145deg,#d8f1ff1f,#ffffff08 58%,#03132755);border:1px solid #ffffff42;border-radius:999px;backdrop-filter:blur(24px) saturate(1.7);-webkit-backdrop-filter:blur(24px) saturate(1.7);box-shadow:0 16px 45px #0007,0 1px 0 #ffffff5c inset;opacity:0;transform:translateY(20px);transition:opacity .55s .3s,transform .7s .3s}.tour-active .viewer-tools{opacity:1;transform:none}.viewer-tools button{width:40px;min-width:40px;min-height:40px;border-radius:50%;font-size:18px}.viewer-tools button:hover{background:#ffffff16}.viewer-tools output{min-width:48px;text-align:center;font-size:11px;color:#d5e4ef}.viewer-tools button:disabled{opacity:.35;cursor:not-allowed}
.simulation-note{position:absolute;z-index:5;left:clamp(17px,3vw,48px);bottom:26px;margin:0;color:#8fa5ba;font-size:10px;letter-spacing:.25px;opacity:0;transition:opacity .6s .4s}.tour-active .simulation-note{opacity:1}
.process-panel{position:absolute;z-index:20;top:96px;right:clamp(14px,2vw,32px);bottom:92px;width:min(390px,calc(100vw - 28px));padding:25px 24px;background:linear-gradient(145deg,#071f37f5,#031327ed);border:1px solid #ffffff32;border-radius:24px;box-shadow:0 28px 90px #0009,0 1px 0 #ffffff38 inset;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);overflow:auto;animation:panel-in .45s cubic-bezier(.22,1,.36,1)}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel-head .eyebrow{font-size:10px}.panel-head button{font-size:24px;border:1px solid #ffffff20;border-radius:50%;background:#ffffff0a}.process-panel h2{font-size:29px;line-height:1.2;letter-spacing:-1px;margin:18px 0 9px}.process-panel>#panel-intro{margin:0 0 18px;color:#c4d3df;font-size:14px}.stage{width:100%;display:grid;grid-template-columns:34px 1fr;gap:12px;text-align:left;padding:13px 0;border-bottom:1px solid #ffffff15}.stage .num{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #ffffff38;background:#ffffff08;color:#b8c9d7;font-size:10px}.stage b{display:block;font-size:13px;line-height:1.45}.stage small{display:block;color:#aebfcd;font-size:11px;margin-top:3px}.stage[aria-pressed=true] .num{background:var(--accent);border-color:var(--accent);color:#031327;box-shadow:0 5px 16px color-mix(in srgb,var(--accent) 38%,transparent)}.stage[aria-pressed=true] b{color:var(--accent)}#stage-detail{padding:16px 0;color:#d9e5ee;font-size:14px;line-height:1.75}#total-time strong{display:block;color:#ffc56a;font-size:23px;margin-top:13px}#total-time span,#total-time p{color:#b4c6d6;font-size:11px}#total-time p{line-height:1.65}
.hotspot{position:absolute;z-index:3;display:grid;place-items:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;transform:translate(-50%,-50%);border-radius:50%}.hotspot:before{content:'';width:11px;height:11px;border:2px solid white;background:#0066ff;border-radius:50%;box-shadow:0 0 0 6px #03132775,0 0 18px #38bdf8}.hotspot:after{content:'';position:absolute;width:28px;height:28px;border:1px solid #8bdcff;border-radius:50%;animation:pulse 2s ease-out infinite}.hotspot:hover:before,.hotspot.selected:before{background:var(--accent)}.hotspot.selected:after{width:38px;height:38px;border-color:var(--accent)}
#tooltip{position:absolute;z-index:21;right:clamp(18px,3vw,48px);top:105px;width:min(330px,calc(100vw - 36px));padding:17px 47px 17px 18px;background:#041a2ef2;border:1px solid #66c9f26b;border-radius:11px;box-shadow:0 20px 60px #0008;font-size:13px;line-height:1.65;backdrop-filter:blur(16px)}#tooltip b{display:block;margin-bottom:4px;color:#7dd3fc;font-size:15px}#tooltip button{position:absolute;right:5px;top:4px;font-size:21px}.flow-track,.flow-path,.flow-spark{fill:none;stroke-linecap:round}.flow-track{stroke:#38bdf866;stroke-width:16;filter:url(#flow-glow)}.flow-path{stroke:#a9edff;stroke-width:7;stroke-dasharray:14 22;filter:url(#flow-glow);animation:liquid 1.45s linear infinite}.flow-spark{stroke:#fff;stroke-width:8;stroke-dasharray:1 54;filter:url(#flow-glow);animation:liquid-fast 1.1s linear infinite}.flow-particle{fill:#eafbff;stroke:#38bdf8;stroke-width:4;filter:url(#flow-glow)}.flow-particle.particle-small{fill:#fff;stroke-width:2}.reprocessing .flow-track{stroke:#ff9d296b}.reprocessing .flow-path{stroke:#ffc471}.reprocessing .flow-spark{stroke:#fff6dc}.reprocessing .flow-particle{fill:#fff1d2;stroke:#ff9d29}.paused .flow-path,.paused .flow-spark{animation-play-state:paused}.equipment-ring{fill:#22c55e16;stroke:#9bf5ba;stroke-width:2;stroke-dasharray:10 7;animation:ring 2s ease-in-out infinite}
#image-error{position:absolute;z-index:40;left:50%;top:50%;transform:translate(-50%,-50%);padding:20px 24px;background:#071d32;border:1px solid #ffffff24;border-radius:10px}#image-error button{color:#7dd3fc;text-decoration:underline}
dialog{color:var(--text);background:#071f36f5;border:1px solid #ffffff35;border-radius:16px;max-width:590px;width:calc(100% - 30px);padding:40px;box-shadow:0 30px 100px #000a}dialog::backdrop{background:#010b1fcc;backdrop-filter:blur(8px)}dialog h2{font-size:34px;line-height:1.2;letter-spacing:-1px}dialog ol{padding-left:22px}dialog li{padding:11px 0 11px 9px}dialog p{color:#bdcedc;font-size:14px}#close-benefits{position:absolute;right:13px;top:10px;font-size:26px}
.value-dialog{max-width:1000px;width:calc(100% - 40px);max-height:92dvh;padding:27px 30px 24px;border-radius:28px;overflow:auto;background:linear-gradient(145deg,#092743f8,#031327f5);box-shadow:0 38px 120px #000c,0 1px 0 #ffffff50 inset}.value-heading{text-align:center}.value-heading h2{margin:8px 0 5px;font-size:clamp(25px,3vw,39px)}.value-heading p{margin:0;color:#aebfd0}.value-tabs{display:flex;justify-content:center;gap:7px;margin:20px auto 16px;padding:5px;width:max-content;max-width:100%;overflow-x:auto;border:1px solid #ffffff32;border-radius:999px;background:#ffffff0b;backdrop-filter:blur(18px)}.value-tabs button{flex:0 0 auto;min-height:40px;padding:0 15px;border-radius:999px;color:#afc3d4;font-size:11px;font-weight:700;letter-spacing:.35px;transition:transform .4s cubic-bezier(.34,1.56,.64,1),background .3s,color .3s}.value-tabs button[aria-selected=true]{transform:scale(1.06);color:#031327;background:linear-gradient(145deg,#9aeaff,#38bdf8);box-shadow:0 7px 22px #38bdf84d,0 1px 0 #fff9 inset}.value-stage{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;align-items:center;gap:12px}.value-arrow{display:grid;place-items:center;width:48px;min-width:48px;height:48px;min-height:48px;border:1px solid #ffffff35;border-radius:50%;background:#ffffff0e;font-size:31px;box-shadow:0 9px 25px #0004;transition:transform .35s cubic-bezier(.34,1.56,.64,1),background .3s}.value-arrow:hover{transform:scale(1.1);background:#ffffff1c}.value-arrow:active{transform:scale(.95)}.value-slides{min-width:0;display:grid;place-items:center}.value-slides figure{margin:0;display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:28px;width:100%;animation:value-in .5s cubic-bezier(.22,1,.36,1)}.value-slides img{display:block;justify-self:center;max-width:100%;max-height:57dvh;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 24px 35px #0008)}.value-slides figcaption{padding:20px;border-left:1px solid #ffffff28}.value-slides figcaption b{display:block;color:#7dd3fc;font-size:24px}.value-slides figcaption span{display:block;margin-top:8px;color:#c4d3df;font-size:14px;line-height:1.7}.value-progress{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;color:#9fb5c7;font-size:10px;letter-spacing:1px}.value-progress i{display:block;width:150px;height:3px;overflow:hidden;border-radius:999px;background:#ffffff17}.value-progress b{display:block;width:20%;height:100%;border-radius:inherit;background:#38bdf8;transition:width .45s cubic-bezier(.22,1,.36,1)}@keyframes value-in{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes liquid{to{stroke-dashoffset:-72}}@keyframes liquid-fast{to{stroke-dashoffset:-110}}@keyframes pulse{0%{transform:scale(.65);opacity:0}40%{opacity:1}100%{transform:scale(1.35);opacity:0}}@keyframes ring{50%{opacity:.45}}@keyframes panel-in{from{opacity:0;transform:translateX(20px)}}
@media(max-width:820px){.topbar{height:58px;top:10px;left:10px;right:10px;padding:7px 8px;border-radius:19px}.brand-mark{width:40px;height:40px;border-radius:13px;font-size:24px}.brand small,.view-status,.top-actions>button:not(#exit-tour){display:none}.brand strong{font-size:12px}.cover{left:14px;top:51%;width:calc(100vw - 28px);padding:21px 20px 23px;border-radius:20px}.cover .team-name{font-size:10px;letter-spacing:1.7px}.cover h1{font-size:clamp(22px,7vw,31px);line-height:1.08;letter-spacing:-.035em}.cover h1 small{font-size:12px;line-height:1.4}.cover h1 strong{font-size:12px;letter-spacing:.035em}.mode-card{top:82px;left:15px;width:calc(100vw - 30px);padding:14px 16px;border-radius:19px}.mode-card h2{font-size:18px}.mode-card p{font-size:12px}.mode-switch{bottom:19px;width:calc(100vw - 28px);justify-content:stretch}.mode-switch button{flex:1;min-width:0;padding:6px 5px;justify-content:center}.mode-switch button span{display:none}.mode-switch button b{font-size:10px}.stage-rail{bottom:80px}.viewer-tools{right:15px;top:240px;bottom:auto;flex-direction:column;border-radius:999px}.viewer-tools output{min-width:40px;padding:5px 0;writing-mode:vertical-rl}.simulation-note{display:none}.process-panel{top:auto;left:10px;right:10px;bottom:78px;width:auto;max-height:68dvh;border-radius:24px;padding:21px 20px}.process-panel h2{font-size:24px}.stage{padding:11px 0}.stage b{font-size:14px}#tooltip{top:auto;bottom:136px;left:15px;right:15px;width:auto}.hotspot{width:44px;height:44px;min-width:44px;min-height:44px}.vignette{background:linear-gradient(0deg,#031327e8 0%,transparent 25%,transparent 68%,#031327aa 100%),linear-gradient(90deg,#03132799 0%,transparent 45%)}dialog{padding:30px 26px}.top-actions #exit-tour{border:0}.stage-dot .dot-label{display:none}}
@media(max-height:650px) and (min-width:821px){.mode-card{top:80px}.process-panel{top:77px;bottom:75px}.stage-rail{bottom:76px}.mode-switch{bottom:15px}.viewer-tools{bottom:16px}.simulation-note{bottom:18px}.cover h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important}.scene{will-change:auto}}
@media(prefers-reduced-transparency:reduce){.topbar,.mode-switch,.stage-rail,.viewer-tools{background:#09223af5;backdrop-filter:none;-webkit-backdrop-filter:none}.cover,.process-panel{background:#061a2dfb;backdrop-filter:none;-webkit-backdrop-filter:none}}
.mode-switch,.stage-rail,.viewer-tools{pointer-events:none}
.tour-active .mode-switch,.tour-active .stage-rail,.tour-active .viewer-tools{pointer-events:auto}
@media(max-width:820px){.top-actions>button[data-action=benefits],.top-actions>button[data-action=process]{display:block!important;width:40px;min-width:40px;padding:0;font-size:0}.top-actions{gap:0}.top-actions>button[data-action=benefits]:before{content:'VC';font-size:10px;font-weight:800;letter-spacing:.5px}.top-actions>button[data-action=process]:before{content:'☷';font-size:17px}.top-actions #exit-tour{width:40px;min-width:40px}.value-dialog{width:calc(100% - 14px);max-height:94dvh;padding:22px 13px 18px;border-radius:25px}.value-heading{padding:0 18px}.value-heading h2{font-size:24px}.value-heading p{font-size:12px}.value-tabs{justify-content:flex-start;margin:16px 0 12px;width:100%}.value-tabs button{padding:0 12px}.value-stage{grid-template-columns:38px minmax(0,1fr) 38px;gap:5px}.value-arrow{width:36px;min-width:36px;height:44px;min-height:44px;font-size:25px}.value-slides figure{display:block}.value-slides img{max-height:55dvh}.value-slides figcaption{margin-top:9px;padding:10px 8px 0;border-left:0;border-top:1px solid #ffffff20;text-align:center}.value-slides figcaption b{font-size:18px}.value-slides figcaption span{font-size:12px;line-height:1.55}.value-progress{margin-top:10px}}

/* iOS 27 inspired interaction layer */
.scene-image{transform:scale(1);filter:blur(0) saturate(1);transition:opacity .72s cubic-bezier(.22,1,.36,1),filter .72s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.viewport.mode-changing .scene-image.active{opacity:.28;filter:blur(4px) saturate(.78);transform:scale(1.018)}
body:not(.tour-active) #hotspots,body:not(.tour-active) #flow{opacity:0;pointer-events:none}
.cover{overflow:hidden;border:1px solid #ffffff42;border-left:1px solid #ffffff42;border-radius:30px;background:linear-gradient(135deg,#102d48e8 0%,#06182ce8 54%,#ffffff12 100%);box-shadow:0 34px 100px #000a,0 1px 0 #ffffff72 inset,0 -1px 0 #0007 inset;backdrop-filter:blur(30px) saturate(1.45);-webkit-backdrop-filter:blur(30px) saturate(1.45)}
.cover:before{content:'';position:absolute;inset:0 0 auto;height:42%;pointer-events:none;background:linear-gradient(180deg,#ffffff15,transparent);border-radius:inherit}
.cover>*{position:relative}.enter-button{min-height:52px;padding:0 22px;border-color:#8cc4ff70;border-radius:999px;background:linear-gradient(145deg,#2780ff,#075be8);box-shadow:0 12px 32px #0066ff4d,0 1px 0 #ffffff80 inset;transition:transform .42s cubic-bezier(.2,1.55,.35,1),box-shadow .3s}.enter-button:hover{transform:scale(1.035);box-shadow:0 16px 40px #0066ff66,0 1px 0 #ffffff94 inset}.enter-button:active{transform:scale(.97)}
.mode-switch button,.stage-rail button,.viewer-tools button{transform-origin:center;will-change:transform;transition:transform .58s cubic-bezier(.34,1.56,.64,1),background .38s ease,color .38s ease,box-shadow .45s ease,filter .38s ease}
.mode-switch button.pending,.mode-switch button[aria-pressed=true]{transform:scale(1.15)}
.stage-rail button[aria-pressed=true]{transform:scale(1.15);box-shadow:0 9px 26px color-mix(in srgb,var(--accent) 42%,transparent),0 1px 0 #ffffff8a inset}
.viewer-tools button[aria-pressed=true]{transform:scale(1.15);background:#ffffff24;box-shadow:0 1px 0 #ffffff66 inset,0 10px 26px #0004}
.mode-switch button:active,.stage-rail button:active,.viewer-tools button:active{transform:scale(1.08);filter:brightness(1.12)}
.mode-switch button[aria-pressed=true]:active,.stage-rail button[aria-pressed=true]:active,.viewer-tools button[aria-pressed=true]:active{transform:scale(1.2)}
.ios-pop{animation:ios-control-tap .58s cubic-bezier(.34,1.56,.64,1)!important}
.ios-pop[aria-pressed=true]{animation-name:ios-control-pop!important}
.mode-card.content-pop{animation:ios-content-pop .52s cubic-bezier(.22,1,.36,1)}
@keyframes ios-control-tap{0%{transform:scale(1)}38%{transform:scale(1.15)}72%{transform:scale(.98)}100%{transform:scale(1)}}
@keyframes ios-control-pop{0%{transform:scale(1.15)}38%{transform:scale(1.24)}72%{transform:scale(1.1)}100%{transform:scale(1.15)}}
@keyframes ios-content-pop{0%{opacity:.66;transform:translateY(7px) scale(.985)}100%{opacity:1;transform:none}}
@media(max-width:820px){body:not(.tour-active) .scene{width:100vw!important;height:100dvh!important;min-width:0;min-height:0;inset:0}body:not(.tour-active) .scene-image{object-fit:cover;object-position:center center}.tour-active .scene-image{object-fit:fill}.cover{top:50%;border-radius:28px;background:linear-gradient(145deg,#102d48e8,#041529ee 62%,#ffffff10);box-shadow:0 28px 80px #000b,0 1px 0 #ffffff70 inset}.enter-button{width:100%;justify-content:space-between}.cover>small{text-align:center}}
@media(max-width:820px){.scene{transition:transform .52s cubic-bezier(.22,1,.36,1),width .32s ease,height .32s ease,left .32s ease,top .32s ease}.scene-image{transition:opacity .38s cubic-bezier(.22,1,.36,1),transform .46s cubic-bezier(.22,1,.36,1);filter:none}.viewport.mode-changing .scene-image.active{opacity:.42;filter:none;transform:scale(1.006)}.mode-switch button{touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .42s cubic-bezier(.34,1.56,.64,1),background .26s ease,color .26s ease,box-shadow .3s ease}}
@media(prefers-reduced-motion:reduce){.ios-pop,.mode-card.content-pop{animation:none!important}.viewport.mode-changing .scene-image.active{filter:none;transform:none}}

/* Stable image coordinates and lighter motion for touch screens. */
.scene{transition:transform .65s cubic-bezier(.22,1,.36,1)}
.scene-image{transition:opacity .65s ease;filter:none;transform:none;object-fit:contain}
.viewport.mode-changing .scene-image.active{opacity:1;filter:none;transform:none}
.flow-track{stroke-width:9;opacity:.3}.flow-path{stroke-width:4}.flow-spark{stroke-width:3}.flow-particle{filter:none}
#stage-auto-status{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);white-space:nowrap;min-height:36px;padding:0 14px;background:#08233fe8;border:1px solid #ffffff35;border-radius:999px;font-size:11px;letter-spacing:.07em}
#stage-auto-status[aria-pressed=true]{transform:translateX(-50%);box-shadow:none}
#value-auto{min-height:44px;padding:0 15px;border:1px solid #ffffff30;border-radius:999px;background:#ffffff10;white-space:nowrap;font-size:12px}
.value-slides img{display:block;justify-self:center;margin-inline:auto;object-fit:contain;object-position:center;width:auto;height:57dvh;max-width:100%}
.value-slides figure{min-width:0}.value-slides{min-width:0}.value-progress{align-items:center}.value-tabs button{flex-shrink:0}
@media(max-width:820px){
 .experience{min-height:100dvh}.scene{transition:transform .5s cubic-bezier(.22,1,.36,1)}
 .scene-image{transition:opacity .4s ease}.tour-active .scene-image{object-fit:contain}
 .value-stage{grid-template-columns:1fr 1fr;gap:10px}.value-slides{grid-column:1/-1;grid-row:1}
 .value-arrow{justify-self:center;width:52px!important;min-width:44px}.value-slides img{height:47dvh;max-height:480px;width:100%;margin:0 auto}
 .value-slides figure{margin:0}.value-slides figcaption{min-height:80px}.value-dialog{max-height:94dvh;overflow-y:auto}
 .value-tabs{flex-wrap:wrap;justify-content:center;overflow:visible;gap:5px}.value-tabs button{min-height:44px;padding:0 10px;font-size:12px}
 .value-heading h2{font-size:21px}.value-heading p{display:none}.value-progress{gap:10px}
 .stage-rail{max-width:calc(100vw - 20px);padding:7px;gap:4px}.stage-rail #stage-dots{min-width:0;overflow-x:auto;overflow-y:hidden;padding:7px;gap:8px;scrollbar-width:none}
 .stage-rail>button:not(#stage-auto-status){min-width:36px;width:36px}.stage-dot{flex-shrink:0;min-width:32px}
 .mode-card p{font-size:13px;line-height:1.5}.viewer-tools{top:auto;bottom:171px;padding:6px;gap:5px}.viewer-tools button{width:40px;min-width:40px;min-height:40px}
}
@media(max-height:550px){.cover{max-height:calc(100dvh - 95px);overflow:auto}.tour-active .mode-card{max-height:150px;overflow:auto;width:45%;top:78px}.viewer-tools{top:80px;bottom:auto}.stage-rail{bottom:78px}.value-slides img{height:60dvh}}
@media(prefers-reduced-motion:reduce){.scene,.scene-image{transition:none!important}}
@media(max-width:820px){.value-heading{padding:0 20px}.value-heading .eyebrow{font-size:10px}.value-heading h2{margin:8px 0 0;font-size:20px}.value-tabs{border-radius:22px;margin:12px 0;padding:5px}.value-slides img{height:clamp(200px,38dvh,440px)}.value-slides figcaption{min-height:65px}.value-stage{gap:4px}.value-progress{margin-top:6px}.value-dialog{padding-bottom:12px}}
@media(max-width:820px) and (min-height:551px){.viewer-tools{top:auto;bottom:178px;left:50%;right:auto;transform:translateX(-50%);flex-direction:row;max-width:calc(100vw - 28px)}.viewer-tools output{writing-mode:horizontal-tb;min-width:42px;padding:0;font-size:12px}}
@media(max-width:820px) and (min-height:551px){.tour-active .viewer-tools{transform:translateX(-50%)}}
@media(max-width:820px) and (min-height:551px){.viewer-tools{bottom:195px}}

/* Cover fills every screen with uniform scaling; scene mode keeps its coordinates. */
body:not(.tour-active) .scene{width:100%!important;height:100%!important;inset:0!important;aspect-ratio:auto!important;transform:none!important}
body:not(.tour-active) .scene-image{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:none}

/* Interactive 3D refinery reconstruction */
.three-active .topbar,.three-active .mode-switch{background:linear-gradient(120deg,#08233ff2,#031327e8);border-color:#a7cde76b;color:#f8fafc}.three-active .mode-switch button{color:#f8fafc}.three-active .mode-switch button[aria-pressed=true]{color:#031327}
.three-view{position:absolute;inset:0;z-index:4;overflow:hidden;background:radial-gradient(circle at 55% 30%,#173c58,#031327 72%)}
.three-canvas,.three-canvas canvas{display:block;width:100%;height:100%}.three-canvas{touch-action:none;cursor:grab}.three-canvas:active{cursor:grabbing}
.three-loading{position:absolute;left:50%;top:50%;display:flex;align-items:center;gap:12px;transform:translate(-50%,-50%);padding:14px 18px;border:1px solid #ffffff2d;border-radius:999px;background:#061a2dda;backdrop-filter:blur(18px);font-size:13px;color:#dbeafe;transition:opacity .35s}.three-loading.ready{opacity:0;pointer-events:none}.three-loading i{width:18px;height:18px;border:2px solid #ffffff30;border-top-color:#38bdf8;border-radius:50%;animation:three-spin .8s linear infinite}
.three-info{position:absolute;left:clamp(15px,3vw,48px);top:98px;display:flex;flex-direction:column;width:min(330px,calc(100vw - 30px));padding:17px 20px;border:1px solid #ffffff32;border-radius:20px;background:linear-gradient(145deg,#08233fe9,#031327d9);box-shadow:0 20px 60px #0007;backdrop-filter:blur(20px)}.three-info small{color:#7dd3fc;font-size:10px;letter-spacing:1.6px}.three-info strong{font-size:20px;margin:3px 0}.three-info span{color:#bfd0dc;font-size:12px;line-height:1.5}
.three-controls{position:absolute;left:50%;bottom:25px;display:flex;gap:5px;transform:translateX(-50%);padding:5px;border:1px solid #ffffff42;border-radius:999px;background:#08233fc7;box-shadow:0 18px 55px #0008,0 1px 0 #ffffff55 inset;backdrop-filter:blur(24px)}.three-controls button{min-height:42px;padding:0 16px;border-radius:999px;color:#dce8f1;font-size:12px}.three-controls button:hover,.three-controls button[aria-pressed=true]{background:#38bdf8;color:#031327}
.three-note{position:absolute;right:clamp(15px,3vw,48px);bottom:31px;margin:0;color:#b6c8d5;font-size:10px}.three-active .viewport,.three-active .vignette,.three-active .mode-card,.three-active .stage-rail,.three-active .viewer-tools,.three-active .simulation-note{visibility:hidden;pointer-events:none}.three-active .mode-switch{bottom:82px}.three-active .view-status{color:#dff7ff}.three-active .view-status i{background:#38bdf8;box-shadow:0 0 12px #38bdf8}
@keyframes three-spin{to{transform:rotate(360deg)}}
.three-markers{position:absolute;inset:0;pointer-events:none}.three-marker{position:absolute;left:0;top:0;pointer-events:auto;width:44px;height:44px;border:2px solid #e2f5ff;border-radius:50%;background:#075ca9;color:white;box-shadow:0 3px 15px #03132780;font-size:16px;font-weight:800;transition:background .2s}.three-marker:hover,.three-marker:focus-visible{background:#0066ff;outline:3px solid #ffb938;outline-offset:3px}.three-marker[hidden]{display:none}.three-process{position:absolute;right:24px;top:100px;width:280px;padding:16px;border:1px solid #ffffff38;border-radius:20px;background:#031327ed;color:#f8fafc;box-shadow:0 14px 40px #0004}.three-process label{display:block;font-size:14px;margin-bottom:8px}.three-process select{width:100%;min-height:44px;background:#08233f;color:#fff;border:1px solid #6b9dc1;border-radius:10px;padding:8px;font:inherit;font-size:14px}.three-process p{font-size:14px;line-height:1.55;margin:12px 0}.three-process button{min-height:44px;background:#075ca9;color:white;border-radius:12px;padding:8px 14px}.three-process small{display:block;margin-top:10px;font-size:12px;color:#cbd5e1}.three-info span{font-size:14px}.three-note{display:none}@media(max-width:820px){.three-process{right:12px;left:12px;top:auto;bottom:150px;width:auto;padding:10px 12px}.three-process label{display:none}.three-process p{max-height:66px;overflow:auto;margin:6px 0;font-size:13px}.three-process small{font-size:12px;margin:5px 0}.three-process button{position:absolute;right:12px;bottom:8px}.three-process small{padding-right:110px}.three-info{max-width:280px}.three-info span{font-size:13px}.three-marker{width:44px;height:44px}.three-process select{font-size:13px}.three-controls button{font-size:12px!important}}
@media(max-width:820px){.top-actions #three-toggle{display:block!important;width:40px;min-width:40px;padding:0;font-size:0}.top-actions #three-toggle:before{content:'3D';font-size:10px;font-weight:800}.three-info{top:82px;padding:13px 15px}.three-info strong{font-size:17px}.three-controls{bottom:max(18px,env(safe-area-inset-bottom));width:calc(100vw - 24px);justify-content:stretch}.three-controls button{flex:1;min-width:0;padding:0 7px;font-size:10px}.three-note{left:18px;right:18px;bottom:76px;text-align:center;font-size:9px}.three-active .mode-switch{bottom:86px}}

/* Keep autoplay and liquid controls reachable on compact screens. */
.three-process button{position:static;margin:3px 5px 0 0;font-size:12px}
@media(max-width:820px){.three-process button{position:static}.three-process small{padding-right:0}.three-info{max-height:180px;overflow:auto}}
.three-stage-buttons{display:flex;gap:8px;margin-top:8px}.three-stage-buttons button{flex:1;min-height:44px;border:1px solid #6b9dc1;background:#08233f}.three-stage-buttons button[aria-pressed=true]{background:#6ee7b7;color:#031327;transform:scale(1.08)}
@media(max-width:820px){.three-process p{max-height:60px}.three-stage-buttons{margin-top:5px}.three-stage-buttons button{min-height:44px;padding:4px}}
.three-stage-buttons{flex-wrap:wrap}.three-stage-buttons button{flex:1 0 44px}
.three-repro-reference{position:absolute;inset:85px 0 140px;display:grid;place-items:center;background:#031327;pointer-events:none}.three-repro-reference[hidden]{display:none}.three-repro-reference>div{position:relative;width:100%;max-height:100%;aspect-ratio:2;max-width:calc((100dvh - 225px)*2)}.three-repro-reference img{display:block;width:100%;height:auto}.three-repro-reference svg{position:absolute;inset:0;width:100%;height:100%}.three-repro-reference .repro-flow{animation:reproFlow 1.8s linear infinite}.three-repro-reference.paused .repro-flow{animation-play-state:paused}.three-info,.three-process,.three-controls{z-index:2}@keyframes reproFlow{to{stroke-dashoffset:-112}}@media(prefers-reduced-motion:reduce){.repro-flow{animation:none!important}}@media(max-width:820px){.three-repro-reference{inset:195px 0 425px}}

/* Reprocessing stays in this viewer, with an uncropped reference and no WebGL work. */
.three-view.show-reprocessing{background:#031327}
.show-reprocessing .three-canvas,.show-reprocessing .three-markers,.show-reprocessing .three-controls{visibility:hidden;pointer-events:none}
.show-reprocessing .three-info{width:240px;font-size:12px}
.show-reprocessing .three-repro-reference{inset:85px 315px 110px 12px}
.show-reprocessing .three-repro-reference>div{max-width:100%;width:100%;}
.show-reprocessing .three-info{top:auto;bottom:12px;left:18px;max-width:calc(100% - 36px);width:auto;padding:10px 14px}
.show-reprocessing .three-info small,.show-reprocessing .three-info span{display:none}
.show-reprocessing .three-info strong{font-size:14px;margin:0}
@media(max-width:820px){
 .show-reprocessing .three-repro-reference{inset:78px 8px auto;height:calc((100vw - 16px)/2)}
 .show-reprocessing .three-process{top:calc(90px + (100vw - 16px)/2);bottom:150px;overflow:auto}
 .show-reprocessing .three-info{bottom:14px;left:12px;right:12px;text-align:center}
}

.value-readable{max-width:660px;margin:10px auto 0;padding:10px 14px;text-align:left;border:1px solid #ffffff35;border-radius:12px;background:#08233f}.value-readable summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:15px;color:#f8fafc}.value-readable p{font-size:17px;line-height:1.65;color:#e2e8f0;margin:8px 0}.value-slides figure:has(.value-readable[open]) img{height:40dvh}

.value-readable{grid-column:1/-1;width:100%;box-sizing:border-box}

/* Consistent glass panels, restrained motion, and touch feedback. */
.three-info,.three-process{background:linear-gradient(135deg,#102b45ed,#031327eb);border:1px solid #c5e7ff36;box-shadow:0 14px 40px #0004,inset 0 1px 0 #ffffff18;backdrop-filter:blur(12px)}
.three-stage-buttons button{transition:transform .24s cubic-bezier(.22,1,.36,1),background .24s,color .24s;touch-action:manipulation}
.three-stage-buttons button:active{transform:scale(.97)}
.three-stage-buttons button:focus-visible,.three-controls button:focus-visible{outline:2px solid #ffbb48;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.three-stage-buttons button{transition:none}}

/* Keep the model as the primary mobile surface. */
.view-float{position:absolute;z-index:12;right:24px;bottom:90px;min-width:64px;min-height:48px;padding:10px 16px;border:1px solid #9ee7ff;border-radius:25px;background:#075ca9;color:white;font:800 15px inherit;box-shadow:0 5px 20px #00142655;cursor:pointer}
.view-float:focus-visible{outline:3px solid #ffb938;outline-offset:3px}
.three-active .view-float{background:#08233f;color:#8cf1bb}
.three-detail-toggle,.three-info-close{display:none}
@media(max-width:820px){
 .view-float{top:82px;bottom:auto;right:12px;min-width:62px;min-height:44px;padding:8px 12px}
 .three-canvas,.three-markers{position:absolute;inset:76px 0 178px;width:100%;height:auto}
 .three-canvas canvas{height:100%;width:100%}
 .three-info,.show-reprocessing .three-info{display:none;top:134px;bottom:auto;left:12px;right:12px;width:auto;max-width:none;max-height:30dvh;padding:14px 42px 14px 15px;text-align:left;overflow:auto}
 .three-info.equipment-open{display:flex}
 .three-info-close{display:block;position:absolute;right:0;top:0;width:44px;height:44px;background:transparent;color:white;font-size:24px}
 .three-process,.show-reprocessing .three-process{display:grid;grid-template-columns:minmax(0,1fr) 60px;gap:6px;left:12px;right:12px;top:auto;bottom:120px;padding:6px;width:auto;border-radius:16px;max-height:46dvh;overflow:auto}
 .three-process>label{display:none}
 .three-process select{min-width:0;font-size:12px;border:0;background:transparent;padding:5px}
 .three-process .three-detail-toggle{display:block;margin:0;padding:4px;min-height:44px;font-size:12px}
 #three-process-details{display:none;grid-column:1/-1;padding:0 6px 6px}
 .details-open #three-process-details{display:block}
 .three-process p{max-height:none;font-size:13px}
 .three-stage-buttons{margin:0}
 .three-active .mode-switch{bottom:64px;height:48px;min-height:48px;left:12px;right:12px;width:calc(100% - 24px);transform:none;padding:3px}
 .three-active .mode-switch button{min-height:40px;font-size:10px;padding:4px 8px}
 .three-controls{bottom:10px;height:44px;padding:0 6px;gap:2px}
 .three-controls button{min-height:44px}
 .three-marker{font-size:12px;border:0;background:radial-gradient(circle,#075ca9 0 14px,#e2f5ff 15px 16px,transparent 17px);box-shadow:none}
 .show-reprocessing .three-repro-reference{inset:132px 8px 178px;height:auto;background:#e8e2d7}
 .show-reprocessing .three-repro-reference>div{max-width:100%}
}
@media(max-width:820px) and (max-height:500px){.three-canvas,.three-markers{inset:70px 0 120px}.three-process,.show-reprocessing .three-process{left:auto;width:260px;bottom:64px}.three-active .mode-switch{width:45%;right:auto;bottom:64px}.three-controls{width:300px}.view-float{top:76px}}

/* A clear invitation to switch visualizations, with a quiet return state. */
.view-float{display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid #bbf6ff;border-radius:18px;background:linear-gradient(120deg,#0751a5,#087dac);color:#fff;font-family:inherit;text-align:left;box-shadow:0 8px 26px #003d7860,inset 0 1px 0 #ffffff40;isolation:isolate;transition:transform .2s,box-shadow .2s;animation:viewInvitation 2.8s ease-out 3}
.view-float:hover{transform:translateY(-2px);box-shadow:0 10px 28px #003d7880}
.view-float:active{transform:translateY(0)}
.view-float-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#ffffff1a;border:1px solid #ffffff38}
.view-float-icon svg{width:25px;height:25px;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.view-float-copy{display:flex;flex-direction:column;gap:3px}
.view-float-copy strong{font-size:15px;line-height:1.2;font-weight:800}
.view-float-copy small{font-size:10px;line-height:1.25;font-weight:500;color:#d4f5ff}
.view-float-arrow{font-size:21px;line-height:1}
.three-active .view-float{background:linear-gradient(120deg,#0b293e,#124553);color:#b4f9d2;border-color:#a5edce;animation:none}
.three-active .view-float-copy small{color:#d3e9e5}
@keyframes viewInvitation{0%,100%{box-shadow:0 8px 26px #003d7860,0 0 0 0 #38d7ff00}35%{box-shadow:0 8px 26px #003d7860,0 0 0 6px #38d7ff35}}
@media(max-width:820px){.view-float{gap:8px;padding:9px 11px;border-radius:16px}.view-float-copy strong{font-size:13px}.view-float-copy small{font-size:10px}.view-float-icon{width:30px;height:30px}.view-float-icon svg{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){.view-float{animation:none;transition:none}.view-float:hover{transform:none}}

/* Calm, native-style cover: clean refinery imagery and restrained glass. */
.cover-backdrop{position:absolute;inset:0;z-index:2;overflow:hidden;background:#152335;pointer-events:none;transition:opacity .5s,visibility .5s}
.cover-backdrop img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;filter:saturate(.65) brightness(.8)}
.cover-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0916259e 0%,#14263935 58%,#10213412),linear-gradient(0deg,#08142165,transparent 60%)}
.tour-active .cover-backdrop{opacity:0;visibility:hidden}
body:not(.tour-active) .topbar{background:#132235a8;border:1px solid #ffffff30;box-shadow:0 8px 28px #07121e24,inset 0 1px 0 #ffffff12;backdrop-filter:blur(22px) saturate(1.15);-webkit-backdrop-filter:blur(22px) saturate(1.15)}
.cover{width:min(660px,60vw);padding:32px 36px;border:1px solid #ffffff36;border-radius:32px;background:linear-gradient(145deg,#1c2b3ddc,#172435e8);box-shadow:0 24px 70px #07111e40,inset 0 1px 0 #ffffff20;backdrop-filter:blur(22px) saturate(1.1);-webkit-backdrop-filter:blur(22px) saturate(1.1)}
.cover:before{height:100%;background:linear-gradient(140deg,#ffffff08,transparent 55%)}
.cover .team-name{font-size:11px;letter-spacing:1.8px;color:#c4d8e8;padding:0}
.cover .team-name>span{width:20px;height:2px;background:#83bcf0}
.cover h1{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:clamp(28px,3.1vw,46px);line-height:1.13;letter-spacing:-.035em;font-weight:700;text-shadow:none;margin:23px 0 26px;text-wrap:balance}
.cover h1 .title-emphasis{color:#d9e8f6}.cover h1 em{color:#99ceff}
.cover h1 small{font-size:14px;line-height:1.55;color:#c8d2df;margin-top:20px;font-weight:400}
.cover h1 strong{font-size:13px;line-height:1.5;letter-spacing:.025em;color:#b9d9f7;margin-top:10px;font-weight:600}
.cover .enter-button{border-radius:16px;background:#1877ee;box-shadow:0 6px 18px #005ac524,inset 0 1px 0 #ffffff26;border:1px solid #ffffff25;font-weight:600;min-height:50px}
.cover>small{font-size:12px;line-height:1.5;letter-spacing:0;color:#b8c7d5;margin-top:16px}
@media(max-width:820px){
 .cover-backdrop img{object-position:48% 50%;filter:saturate(.65) brightness(.82)}
 .cover-backdrop:after{background:linear-gradient(180deg,#14243715,#101e3260 55%,#0a15278c)}
 .cover{left:16px;width:calc(100% - 32px);top:54%;padding:25px 24px;border-radius:28px;background:linear-gradient(145deg,#26364ade,#142237ef);max-height:calc(100dvh - 185px);overflow:auto}
 .cover .team-name{font-size:10px;letter-spacing:1.4px}
 .cover h1{font-size:clamp(23px,6.5vw,34px);line-height:1.15;margin:21px 0 22px}
 .cover h1 small{font-size:12px;margin-top:17px;line-height:1.5}
 .cover h1 strong{font-size:12px;margin-top:9px}
 .cover>small{font-size:11px;margin-top:14px}
}
@media(max-height:550px){.cover{top:54%;max-height:calc(100dvh - 100px);overflow:auto;padding:20px 24px}}
@media(prefers-reduced-transparency:reduce){.cover{background:#1b2b3d;backdrop-filter:none;-webkit-backdrop-filter:none}body:not(.tour-active) .topbar{background:#18283b}}

/* Shared glass surfaces: readable at rest, lightly reflective at the edges. */
:root{--regain-glass:linear-gradient(145deg,rgba(57,76,99,.84),rgba(15,31,50,.93));--regain-glass-line:rgba(218,237,255,.32);--regain-glass-shadow:0 14px 42px #06142230,inset 0 1px 0 #ffffff30,inset 0 -1px 0 #04122330}
.topbar,.three-active .topbar,.mode-switch,.three-active .mode-switch,.three-controls,.viewer-tools,.stage-rail{border:1px solid var(--regain-glass-line);background:var(--regain-glass);box-shadow:var(--regain-glass-shadow);backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2)}
.three-info,.three-process,.mode-card,.process-panel{background:var(--regain-glass);border:1px solid var(--regain-glass-line);box-shadow:var(--regain-glass-shadow);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)}
.three-info strong,.mode-card h2{letter-spacing:-.025em}
.three-process select{background:#061c324d;border-color:#b6d6f24d}
.three-process button,.three-controls button{transition:background .2s,box-shadow .2s}
.three-controls button:hover,.three-controls button:focus-visible{background:#ffffff1a}
.three-stage-buttons button[aria-pressed=true]{background:linear-gradient(145deg,#b7f7da,#79dfbd);color:#072c2a;box-shadow:inset 0 1px 0 #ffffff80,0 4px 14px #062b2926}
.mode-switch button[aria-pressed=true]{background:linear-gradient(145deg,#b7f7da,#79dfbd);box-shadow:inset 0 1px 0 #ffffff80,0 4px 14px #062b2926}
@supports not (backdrop-filter:blur(1px)){.topbar,.mode-switch,.three-controls,.viewer-tools,.stage-rail,.three-info,.three-process,.mode-card,.process-panel{background:#1b2e43}}
@media(prefers-reduced-transparency:reduce){.topbar,.three-active .topbar,.mode-switch,.three-active .mode-switch,.three-controls,.viewer-tools,.stage-rail,.three-info,.three-process,.mode-card,.process-panel{background:#1b2e43;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.three-process button,.three-controls button{transition:none}}

/* Consistent frosted glass with stronger contrast, inspired by the supplied cover. */
:root{--regain-glass:linear-gradient(125deg,rgba(39,61,82,.94) 0%,rgba(15,34,54,.96) 54%,rgba(94,105,115,.88) 100%);--regain-glass-line:#d7eafa52;--regain-glass-shadow:0 18px 48px #03122240,inset 0 1px 0 #ffffff35}
.cover,body:not(.tour-active) .topbar,.topbar,.three-active .topbar,.mode-switch,.three-active .mode-switch,.three-controls,.viewer-tools,.stage-rail,.three-info,.three-process,.mode-card,.process-panel,.value-dialog,dialog,#tooltip{background:var(--regain-glass);border:1px solid var(--regain-glass-line);box-shadow:var(--regain-glass-shadow);backdrop-filter:blur(24px) saturate(1.12);-webkit-backdrop-filter:blur(24px) saturate(1.12)}
.view-float{position:fixed;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;max-width:calc(100vw - 16px)}
.view-float:hover{transform:none}.view-float.is-dragging{cursor:grabbing;animation:none;transition:none;box-shadow:0 16px 36px #00152f60;opacity:.95}
.view-float-copy small{font-size:11px}
@media(prefers-reduced-transparency:reduce){.cover,body:not(.tour-active) .topbar,.topbar,.three-active .topbar,.mode-switch,.three-active .mode-switch,.three-controls,.viewer-tools,.stage-rail,.three-info,.three-process,.mode-card,.process-panel,.value-dialog,dialog,#tooltip{background:#203348;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* Compact draggable view switch, retaining a comfortable touch target. */
.view-float{min-width:76px;min-height:44px;padding:8px 11px;gap:7px;border-radius:24px;animation:none}
.view-float .view-float-copy small,.view-float .view-float-arrow{display:none}
.view-float .view-float-copy strong{font-size:13px;line-height:1;font-weight:700}
.view-float .view-float-icon{width:24px;height:24px;border:0;background:transparent}
.view-float .view-float-icon svg{width:22px;height:22px}

/* Opening cover contains only the title and refinery background. */
body:not(.tour-active) .topbar,body:not(.tour-active) .view-float{display:none}
body:not(.tour-active) .cover{inset:0;width:100%;height:100%;max-height:none;transform:none;padding:clamp(28px,7vw,105px);display:flex;align-items:center;border:0;border-radius:0;background:linear-gradient(90deg,#071829b3,transparent);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;cursor:pointer}
body:not(.tour-active) .cover:before,body:not(.tour-active) .cover .team-name,body:not(.tour-active) .cover .enter-button,body:not(.tour-active) .cover>small,body:not(.tour-active) .cover h1 small,body:not(.tour-active) .cover h1 strong{display:none}
body:not(.tour-active) .cover h1{max-width:800px;margin:0;font-size:clamp(30px,4.2vw,62px);line-height:1.12;text-shadow:0 2px 20px #06132380}
body:not(.tour-active) .cover:focus-visible{outline:3px solid #99ceff;outline-offset:-8px}
@media(max-width:820px){body:not(.tour-active) .cover{padding:28px}body:not(.tour-active) .cover h1{font-size:clamp(28px,7.6vw,46px)}}

/* Keep a static reference in place until the actual GLB is ready. */
.three-placeholder{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.three-view:not(.model-ready) .three-canvas,.three-view:not(.model-ready) .three-markers{visibility:hidden}
.three-view.model-ready .three-placeholder{display:none}
body:not(.tour-active) .cover{flex-direction:column;align-items:flex-start;justify-content:center;gap:30px;cursor:default}
body:not(.tour-active) .cover .enter-button{display:inline-flex;width:auto;min-width:220px;justify-content:space-between;gap:35px}
.view-float .tap-icon svg{stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:820px){body:not(.tour-active) .cover .enter-button{width:100%;max-width:330px}}