:root{--ink:#eaf8f4;--muted:#8aa39d;--line:rgb(155 231 209 / 18%);--panel:rgb(6 21 23 / 78%);--accent:#62f2bd;--background:#041012}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0;background:var(--background);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button{font:inherit}.viewer-shell{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 64% 43%,rgb(38 113 102 / 24%),transparent 33%),linear-gradient(135deg,#071617 0%,#031012 55%,#07191a 100%)}.render-canvas{position:absolute;inset:0;z-index:-3;width:100%;height:100%;outline:0;touch-action:none}.ambient-grid{position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:.22;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to right,#000,transparent 68%)}.vignette{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgb(2 12 14 / 92%) 0%,rgb(2 12 14 / 42%) 32%,transparent 62%),linear-gradient(0deg,rgb(2 10 12 / 80%) 0%,transparent 32%)}.viewer-header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:14px;min-height:82px;padding:18px clamp(20px,3vw,52px);border-bottom:1px solid var(--line);background:linear-gradient(to bottom,rgb(3 15 17 / 92%),rgb(3 15 17 / 38%));backdrop-filter:blur(14px)}.back-link{color:var(--accent);font:600 12px/1 "SFMono-Regular",Consolas,monospace;letter-spacing:.06em;text-decoration:none}.back-link:hover{text-decoration:underline}.brand-copy{display:grid;gap:3px}.brand-copy strong{font-size:15px;font-weight:650;letter-spacing:.04em}.eyebrow,.section-number,.control-heading span,.model-status-topline,.viewer-footer{color:var(--accent);font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.16em}.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.runtime-badge,.quality-switch{display:flex;align-items:center;gap:8px;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:rgb(5 19 21 / 58%);font-size:11px}.quality-switch>span{padding-left:4px;color:var(--muted);font-size:10px}.quality-switch button{min-width:43px;padding:5px 8px;border:0;border-radius:999px;color:var(--muted);background:transparent;cursor:pointer;font-size:10px}.quality-switch button.is-active{color:#071713;background:var(--accent)}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgb(98 242 189 / 10%),0 0 16px var(--accent)}.intro-panel{position:absolute;top:clamp(118px,16vh,158px);left:clamp(20px,4vw,68px);width:min(410px,calc(100vw - 40px))}.intro-panel h1{margin:14px 0 16px;font-size:clamp(34px,4vw,62px);line-height:1.08;letter-spacing:-.045em;font-weight:540}.intro-panel p{max-width:360px;margin:0;color:var(--muted);font-size:13px;line-height:1.8}.process-demo{display:grid;gap:8px;margin-top:24px}.process-demo-label{color:var(--accent);font:9px "SFMono-Regular",Consolas,monospace;letter-spacing:.16em}.process-button{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:11px;width:100%;padding:11px 13px;border:1px solid rgb(98 242 189 / 42%);color:var(--ink);background:linear-gradient(110deg,rgb(18 70 61 / 88%),rgb(5 26 28 / 86%));cursor:pointer;text-align:left}.process-button:disabled{cursor:wait}.process-button:hover:not(:disabled){border-color:var(--accent)}.process-play{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgb(98 242 189 / 45%);border-radius:50%;color:#071713;background:var(--accent);font-size:11px}.process-button.is-playing .process-play{color:var(--accent);background:rgb(98 242 189 / 12%)}.process-copy{display:grid;gap:3px}.process-copy strong{font-size:12px;font-weight:650}.process-copy small,.process-state{color:var(--muted);font:9px "SFMono-Regular",Consolas,monospace}.process-state{color:var(--accent)}.process-progress{height:2px;overflow:hidden;background:rgb(98 242 189 / 12%)}.process-progress span{display:block;width:0;height:100%;background:var(--accent)}.process-progress.is-playing span{animation:process-run 2.967s linear forwards}.process-progress.is-completed span{width:100%}@keyframes process-run{to{width:100%}}.view-controls{position:absolute;left:clamp(20px,4vw,68px);bottom:clamp(58px,8vh,90px);width:min(340px,calc(100vw - 40px));border-top:1px solid var(--line);background:linear-gradient(90deg,rgb(4 18 20 / 90%),rgb(4 18 20 / 58%));backdrop-filter:blur(16px)}.control-heading{display:flex;align-items:center;justify-content:space-between;padding:12px 4px;border-bottom:1px solid var(--line)}.control-heading small{color:var(--muted);font-size:11px}.view-list{display:grid;grid-template-columns:1fr 1fr}.view-button{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;min-height:70px;padding:12px 10px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink);text-align:left;background:rgb(8 27 29 / 58%);cursor:pointer}.view-button:nth-child(even){border-right:0}.view-button:disabled{cursor:wait;opacity:.45}.view-button.is-active,.view-button:not(:disabled):hover{color:#071713;background:var(--accent)}.view-index{color:var(--accent);font:10px "SFMono-Regular",Consolas,monospace}.view-button.is-active .view-index{color:#0b4d39}.view-copy{display:grid;gap:4px}.view-copy strong{font-size:12px;font-weight:650}.view-copy small{color:var(--muted);font-size:9px;line-height:1.35}.view-button.is-active small{color:rgb(7 23 19 / 65%)}.model-status{position:absolute;right:clamp(20px,3vw,48px);bottom:clamp(58px,8vh,90px);width:min(292px,calc(100vw - 40px));padding:18px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(18px)}.model-status-topline{display:flex;justify-content:space-between;margin-bottom:20px}.model-status strong{display:block;margin-bottom:8px;font-size:14px}.model-status p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}.progress-track{height:3px;margin-top:14px;overflow:hidden;background:rgb(98 242 189 / 13%)}.progress-track span{display:block;width:0;height:100%;background:var(--accent);transition:width .2s}.stat-row{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:10px}.stat-row b{color:var(--accent)}.viewer-footer{position:absolute;right:clamp(20px,3vw,48px);bottom:24px;display:flex;gap:16px;color:var(--muted);font-size:9px}@media(max-width:820px){.viewer-header{min-height:64px;padding:12px 16px}.brand-copy{display:none}.runtime-badge{display:none}.quality-switch{margin-left:auto}.intro-panel{top:86px;left:16px;width:calc(100vw - 32px)}.intro-panel h1{font-size:clamp(30px,10vw,42px);margin:10px 0}.intro-panel p{max-width:320px}.view-controls{left:16px;bottom:18px;width:calc(100vw - 32px)}.model-status{top:auto;right:16px;bottom:202px;width:calc(100vw - 32px);padding:12px}.model-status-topline{margin-bottom:8px}.model-status p{display:none}.viewer-footer{display:none}.process-demo{max-width:360px;margin-top:16px}.ambient-grid{mask-image:none;opacity:.1}}@media(max-width:430px){.header-actions{gap:0}.quality-switch>span{display:none}.back-link span{display:none}.model-status{bottom:202px}.view-button{min-height:58px;padding:8px}.view-copy small{display:none}.process-button{padding:9px}}