@import"https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;700&display=swap";:root{--font-ui: "Geist", "Noto Sans SC", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;--stage: #08080b;--bg-0: #0c0d11;--bg: #101116;--bg-1: #14151b;--surface: #181a21;--surface-2: #1f212b;--surface-3: #2a2d3a;--line-soft: #23252f;--line: #2e303c;--line-strong: #434659;--line-hi: #5b5f77;--fg: #ecebf0;--fg-2: #c6c7d2;--fg-3: #a0a2b2;--fg-4: #7d8094;--syn-keyword: #c3a6ff;--syn-type: #79c0ff;--syn-builtin: #7ee0c3;--syn-pre: #9aa3c7;--muted: var(--fg-3);--accent: #6f9bff;--accent-hi: #9bb9ff;--accent-ink: #0b1020;--accent-soft: color-mix(in srgb, var(--accent) 16%, transparent);--ok: #4cc38a;--warn: #e5c453;--bad: #ff6b78;--radius-control: 6px;--radius-panel: 12px;font-family:var(--font-ui);color:var(--fg);background:var(--bg);font-synthesis:none;color-scheme:dark;line-height:1.65}[data-lab=shader]{--accent: #ff9a3d;--accent-hi: #ffb870;--accent-ink: #1b1100;--accent-soft: color-mix(in srgb, var(--accent) 16%, transparent)}[data-lab=render]{--accent: #6f9bff;--accent-hi: #9bb9ff;--accent-ink: #0b1020;--accent-soft: color-mix(in srgb, var(--accent) 16%, transparent)}*{box-sizing:border-box}body{margin:0}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hi)}button,input,select,textarea{font:inherit}button,.file-button,.primary{border:1px solid var(--line-strong);border-radius:var(--radius-control);background:var(--surface-2);color:var(--fg);padding:9px 14px;cursor:pointer;display:inline-block}button:hover,.file-button:hover{border-color:var(--line-hi);background:var(--surface-3)}button:disabled{opacity:.5;cursor:wait}.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}.primary:hover{background:var(--accent-hi);border-color:var(--accent-hi);color:var(--accent-ink)}header{padding:22px 4vw;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{font-weight:700;color:var(--fg);letter-spacing:-.5px;font-size:22px}.brand span{font-size:12px;letter-spacing:2px;margin-left:13px;color:var(--fg-3)}nav{display:flex;gap:22px;align-items:center}main{max-width:1440px;margin:auto;padding:30px 4vw}.hero{position:relative;padding:55px 0 70px;border-bottom:1px solid var(--line)}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--fg-3);text-transform:uppercase}h1{font-size:clamp(40px,5.8vw,80px);font-weight:500;line-height:1.15;letter-spacing:-2px;margin:28px 0}h1 em{font-style:normal;color:var(--accent)}.hero p{color:var(--fg-3);font-size:17px;margin:28px 0}.hero-number{position:absolute;right:4%;top:85px;font-size:150px;letter-spacing:-10px;color:var(--fg-4);line-height:1}.hero-number small{display:block;font-size:13px;letter-spacing:3px;text-align:center;margin-top:24px;color:var(--fg-3)}.workflow{display:flex;justify-content:space-between;padding:26px 0;color:var(--fg-2);font-size:13px;letter-spacing:1px}.workflow span{color:var(--fg-4)}.track{margin:28px 0 48px}.section-title{display:flex;align-items:center;gap:20px;margin-bottom:18px}.section-title>span:first-child{color:var(--accent-hi)}.section-title h2{margin:0}.section-title small{margin-left:auto;color:var(--fg-4)}h2{font-size:19px;font-weight:500;margin:24px 0 16px}h3{font-weight:500;font-size:20px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card{display:flex;flex-direction:column;min-height:275px;border:1px solid var(--line);border-radius:var(--radius-panel);padding:24px;background:var(--surface);color:var(--fg);transition:transform .2s,border-color .2s}.card:hover{transform:translateY(-4px);border-color:var(--line-hi);color:var(--fg)}.card h3{line-height:1.6;min-height:65px;margin:16px 0}.card p{color:var(--fg-3);font-size:13px}.arrow{margin-top:auto;padding-top:18px;color:var(--accent);font-size:13px}.map{border-top:1px solid var(--line);padding:20px 0 35px}.map p{color:var(--fg-3)}.map>div{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.map span{padding:14px;border-left:2px solid var(--line-hi);background:var(--bg-1);font-size:13px}footer{border-top:1px solid var(--line);padding:24px 4vw;color:var(--fg-4);font-size:12px;display:flex;justify-content:space-between}.pill{display:inline-block;border:1px solid var(--line-strong);padding:4px 10px;border-radius:20px;font-size:11px;margin:3px}.breadcrumb{font-size:12px;color:var(--fg-3)}.experiment-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:32px}.experiment-heading h1{font-size:35px;letter-spacing:-1px;margin:12px 0}.experiment-heading p{color:var(--fg-3);max-width:820px}.boundary{border-left:3px solid var(--warn);background:color-mix(in srgb,var(--warn) 8%,transparent);padding:15px 20px;font-size:13px;color:var(--fg-2);margin:24px 0}.boundary strong{margin-right:12px}.lab-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:20px}.panel{border:1px solid var(--line);border-radius:10px;background:var(--bg-1);padding:24px;margin:20px 0}.lab-grid .panel{margin:0}.control{display:block;border-bottom:1px solid var(--line);padding:15px 0;font-size:13px}.control output{float:right;color:var(--accent)}.control input[type=checkbox]{float:right}.control select{display:block;margin-top:8px;width:100%}input:not([type=checkbox]):not([type=range]):not([type=file]),select,textarea{display:block;background:var(--bg);border:1px solid var(--line-strong);color:var(--fg);border-radius:6px;padding:10px;width:100%;margin:8px 0 14px}textarea{min-height:100px;resize:vertical}input[type=range]{width:100%;accent-color:var(--accent)}input[type=checkbox]{accent-color:var(--accent);margin-right:8px}label{font-size:13px}.muted,small{color:var(--fg-3)}.toolbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:16px 0}.toolbar button{font-size:12px}.events{padding-left:26px;font-size:13px}.events li{padding:8px}.events .active{background:var(--surface-3);color:var(--accent);border-radius:4px}.future{opacity:.35}.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:8px}.metrics>div{padding:12px;border:1px solid var(--line);border-radius:7px}.metrics strong{display:block;font-size:23px;color:var(--fg);overflow-wrap:anywhere}.metrics small{font-size:10px;overflow-wrap:anywhere}.comparison{margin:22px 0;padding:16px;background:var(--surface-2);border-radius:7px}.comparison h3{font-size:16px}code,pre,kbd,samp{font-family:var(--font-mono)}pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--bg);padding:15px;border-radius:6px;font-size:12px;max-height:350px;overflow:auto}details{margin:15px 0;border-top:1px solid var(--line);padding:12px 0}summary{cursor:pointer;color:var(--fg-2);font-size:13px}.challenge{border-left:3px solid var(--accent);padding-left:15px}.flags{display:flex;flex-wrap:wrap;gap:12px}.render-view canvas{width:100%;max-height:420px;object-fit:contain;background:var(--stage);border-radius:8px}.caption{font-size:11px;color:var(--fg-3);margin:8px 0}.render-view>button{font-size:12px}.file-button{font-size:12px}.file-button input{display:none}.attachments{display:flex;flex-wrap:wrap;gap:12px}.attachments figure{max-width:240px;margin:0}.attachments img{width:100%;border-radius:6px}.attachments figcaption{font-size:11px}.attachments button{font-size:10px;padding:3px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.source{padding:15px 0;border-bottom:1px solid var(--line)}.source p{font-size:13px;color:var(--fg-3);margin:6px 0}.error{border:1px solid var(--bad);color:var(--bad);padding:14px;border-radius:6px}.coach{border-color:var(--line-strong);background:radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 45%),var(--bg-1);padding:0;overflow:hidden;scroll-margin-top:24px}.messages{max-height:560px;overflow:auto;display:flex;flex-direction:column;gap:16px;padding:18px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-1)}.messages article{display:flex;gap:10px;max-width:100%;animation:coach-in .2s ease both}.messages article small{display:block;font-size:11px;letter-spacing:.5px;color:var(--fg-4);margin-bottom:2px}.messages .user{align-self:flex-end;max-width:85%;background:var(--accent-soft);border:1px solid var(--line);padding:10px 14px;border-radius:16px 16px 4px}.messages .user small{display:none}.messages .user .markdown p{margin:0}.coach-message-body{min-width:0;flex:1}.messages .markdown>:first-child{margin-top:0}.messages .markdown>:last-child{margin-bottom:0}.coach-composer-bar button{font-size:14px;padding:7px 14px}.messages .markdown{overflow-x:auto}.messages .markdown p,.messages .markdown li{overflow-wrap:anywhere}.messages .markdown table{border-collapse:collapse;width:max-content;max-width:100%;margin:12px 0;font-size:13px}.messages .markdown th,.messages .markdown td{border:1px solid var(--line-hi);padding:6px 10px;text-align:left;vertical-align:top}.messages .markdown th{background:var(--surface-2);color:var(--fg)}.messages .markdown pre{overflow-x:auto;background:var(--bg-1);padding:10px 12px;border-radius:6px}.messages .markdown code{font-size:12px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-hi);outline-offset:3px}@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}.hero-number{font-size:100px;right:1%;top:125px}.lab-grid{grid-template-columns:270px minmax(0,1fr)}.map>div{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){header{align-items:flex-start}.brand span{display:none}nav{gap:8px;font-size:12px}.hero{padding-top:25px}.hero-number{display:none}.cards,.lab-grid,.map>div{grid-template-columns:1fr}.workflow{font-size:10px;letter-spacing:0}.card{min-height:220px}.card h3{min-height:0}.experiment-heading{display:block}.experiment-heading h1{font-size:29px}.panel{padding:17px}.section-title{flex-wrap:wrap;gap:8px}.section-title small{margin-left:0}footer{display:block}.two{grid-template-columns:1fr}}.visual{position:relative}.concealed{min-height:190px}.concealed>svg,.concealed>.render-view{visibility:hidden}.prediction-cover{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed var(--line-strong);border-radius:8px;color:var(--fg-3);text-align:center;padding:25px}html{scroll-behavior:smooth;scroll-padding-top:78px}.skip-link{position:fixed;top:-60px;left:16px;z-index:100;padding:12px;background:var(--accent);color:var(--accent-ink)}.skip-link:focus{top:12px}header{background:var(--bg-1)}.hero{padding:36px 0 46px}.hero h1{font-size:clamp(38px,4.5vw,64px)}.hero-number{font-size:120px;top:65px;color:var(--fg-4)}.discovery{display:grid;grid-template-columns:minmax(0,2fr) minmax(180px,1fr);gap:12px 24px;align-items:start}.discovery>a,.discovery>p{grid-column:1 / -1}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.card{min-height:225px;background:var(--surface)}.card h3{min-height:0;font-size:19px}.card p{margin-top:0;line-height:1.8}.experiment-nav{position:sticky;top:0;z-index:5;gap:6px;padding:10px;margin:20px 0;border:1px solid var(--line-strong);border-radius:10px;background:color-mix(in srgb,var(--bg-1) 96%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-x:auto}.experiment-nav button{padding:7px 12px;white-space:nowrap;border-radius:6px;font-size:13px}.experiment-nav button:hover,.experiment-nav button:focus-visible{background:var(--surface-3)}.lab-grid{grid-template-columns:minmax(280px,330px) minmax(0,1fr);align-items:start}.lab-grid aside{box-shadow:0 8px 24px #0002}.lab-grid aside>h2:first-child{margin-top:0}.lab-grid aside>button{margin:5px 5px 5px 0}.observation{min-width:0}.visual{padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}.visual>svg{display:block;min-height:220px}.control-hint{display:block;margin:4px 0 0;color:var(--muted, var(--fg-3));font-weight:400;font-size:12px;line-height:1.4}.code-trace{margin:10px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}.code-trace figcaption{margin:0 0 8px;color:var(--fg-3);font-size:12px}.code-trace pre{margin:0;overflow-x:auto}.code-trace code{display:grid;gap:2px;font-size:12px;line-height:1.45;color:var(--fg)}.code-line{display:block;padding:1px 6px;border-radius:4px;white-space:pre}.code-line.is-changed{outline:1px solid var(--warn)}.code-line.is-active{background:var(--accent-soft);color:var(--accent-hi)}.code-line.is-hidden{color:var(--fg-4)}.concealed>.spatial-view,.concealed>.spatial-lab{visibility:hidden}.section-disclosure{font-size:18px;font-weight:500}.secondary-panel{background:var(--bg-1);border-color:var(--line)}.secondary-panel>details{margin:0;border:0;padding:0}.parameter-list{margin:0;padding:12px;background:var(--bg);border-radius:7px;font-size:13px}.parameter-list>div{display:flex;justify-content:space-between;gap:16px;padding:6px 0;border-bottom:1px solid var(--line)}.parameter-list dt{color:var(--fg-3)}.parameter-list dd{margin:0;overflow-wrap:anywhere}.spatial-view canvas,.spatial-lab canvas{display:block;width:100%;height:auto;touch-action:none;border-radius:8px}.spatial-view table,.spatial-lab table{width:100%;border-collapse:collapse;font-size:12px}.spatial-view td,.spatial-view th,.spatial-lab td,.spatial-lab th{padding:7px;border-bottom:1px solid var(--line);text-align:left}summary:focus-visible{outline:2px solid var(--accent-hi);outline-offset:4px}@media(max-width:1000px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.lab-grid{grid-template-columns:270px minmax(0,1fr)}}@media(max-width:760px){.cards,.discovery,.lab-grid{grid-template-columns:minmax(0,1fr)}.hero-number{display:none}.experiment-nav{margin-inline:-5px}.experiment-nav button{padding:7px 9px;font-size:12px}.hero{padding-bottom:28px}.visual{padding:5px}.experiment-heading h1{font-size:29px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}.visual>svg{width:100%;height:auto;min-height:0}.spatial-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.75rem 0}.spatial-metrics{display:flex;flex-wrap:wrap;gap:.45rem .8rem;font-variant-numeric:tabular-nums}.spatial-metrics>span{padding:.25rem .5rem;background:var(--surface-2);border-radius:.35rem}.spatial-comparison{margin-top:1rem;overflow-x:auto}.spatial-comparison table{min-width:520px}.spatial-comparison .eyebrow{margin-bottom:.35rem}.prerequisites{display:flex;flex-direction:column;gap:.4rem;margin:1rem 0;font-size:.85rem}:root{--pet-outline: #0d1a1c;--pet-body: #9fe3c6;--pet-highlight: #e3fff2;--pet-shade: #6cc3a4;--pet-eye: #0d1a1c;--pet-shine: #ffffff;--pet-blush: #ffa3b5;--pet-leaf: #5fbf6f;--pet-leaf-light: #bde9b6;--pet-drop: #7cc4ff}.pixel-pet{display:block;overflow:visible}.study-pet{position:fixed;right:24px;bottom:24px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:6px}.study-pet-button{position:relative;display:grid;place-items:center;width:80px;height:84px;padding:0;border:0;background:none;border-radius:20px}.study-pet-button:hover{background:none}.study-pet-sprite{display:block;animation:pet-bob 2.4s steps(2,jump-none) infinite;filter:drop-shadow(0 0 10px #9fe3c633);transition:transform .16s ease}.study-pet-button:hover .study-pet-sprite{transform:translateY(-3px) scale(1.04)}.study-pet-sprite.is-hopping,.study-pet .pet-mood-happy{animation:pet-hop .6s cubic-bezier(.3,1.6,.5,1)}.study-pet .pet-mood-thinking{animation:pet-tilt 1.4s steps(2,jump-none) infinite}.study-pet-shadow{position:absolute;bottom:4px;width:40px;height:6px;border-radius:50%;background:#0006}.study-pet-bubble{position:relative;max-width:220px;margin-right:8px;padding:8px 12px;border-radius:12px;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--fg);font-size:13px;line-height:1.4;opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .16s ease,transform .16s ease}.study-pet.has-bubble .study-pet-bubble,.study-pet:hover .study-pet-bubble,.study-pet:focus-within .study-pet-bubble{opacity:1;transform:none}.study-pet-dismiss{position:absolute;right:-4px;bottom:70px;width:22px;height:22px;padding:0;border-radius:50%;font-size:13px;line-height:1;opacity:0;transition:opacity .16s ease}.study-pet:hover .study-pet-dismiss,.study-pet-dismiss:focus-visible{opacity:1}@keyframes pet-bob{50%{transform:translateY(-2px)}}@keyframes pet-hop{40%{transform:translateY(-12px)}70%{transform:translateY(1px) scaleY(.94)}}@keyframes pet-tilt{50%{transform:rotate(-4deg)}}@keyframes coach-in{0%{opacity:0;transform:translateY(4px)}}.coach-header{display:flex;justify-content:flex-start;align-items:center;gap:14px;margin:0;padding:20px 24px 10px;border-bottom:0;background:none}.coach-header .pill{margin-left:auto}.coach-avatar{flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:16px;border:1px solid var(--line);background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 70%),var(--bg-1)}.coach-avatar.pet-mood-thinking .pixel-pet{animation:pet-bob .9s steps(2,jump-none) infinite}.coach-avatar.pet-mood-happy .pixel-pet{animation:pet-hop .6s cubic-bezier(.3,1.6,.5,1) 2}.coach-heading h2{margin:0}.coach-heading p{margin:2px 0 0;font-size:13px;color:var(--fg-3)}.coach-note{margin:0 24px 12px;font-size:12px;color:var(--fg-4)}.coach-phase{display:inline-flex;gap:2px;margin:0 24px 12px;padding:3px;border-radius:10px;border:1px solid var(--line);background:var(--bg-1)}.coach-phase button{border:0;background:transparent;padding:6px 12px;font-size:13px;color:var(--fg-3)}.coach-phase button.is-active{background:var(--accent);color:var(--accent-ink);font-weight:700}.coach-context{margin:0 24px 16px;padding:0;border-top:0;font-size:13px}.coach-context summary{cursor:pointer;color:var(--fg-2)}.coach-context summary span{margin-left:10px;font-size:12px;color:var(--fg-4)}.coach-context[open]{padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:var(--bg-1)}.coach-context label{display:block;margin-top:10px}.coach-context pre{max-height:200px;overflow:auto;font-size:12px}.coach .sync-conflicts{margin:0 24px 16px}.coach-message-avatar{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--bg-1)}.coach-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 0;text-align:center;color:var(--fg-3);font-size:13px}.coach-empty .pixel-pet{animation:pet-bob 2.4s steps(2,jump-none) infinite}.coach-typing{display:flex;align-items:center;gap:8px;margin:0;color:var(--fg-3);font-size:13px}.coach-dots{display:inline-flex;gap:3px}.coach-dots i{width:5px;height:5px;background:var(--accent);animation:coach-dot 1s steps(2,jump-none) infinite}.coach-dots i:nth-child(2){animation-delay:.15s}.coach-dots i:nth-child(3){animation-delay:.3s}@keyframes coach-dot{0%,to{opacity:.25}50%{opacity:1;transform:translateY(-3px)}}.coach-pending,.coach-status{margin:12px 24px 0;padding:10px 12px;border-radius:8px;border:1px solid var(--line-strong);font-size:13px}.coach-composer{margin:16px 24px 0;border:1px solid var(--line-strong);border-radius:14px;background:var(--bg-1);transition:border-color .14s ease}.coach-composer:focus-within{border-color:var(--accent)}.coach-prompts{display:flex;gap:6px;overflow-x:auto;padding:10px 12px 0;scrollbar-width:none}.coach-prompts button{flex:none;padding:4px 11px;border-radius:20px;font-size:12px;background:var(--surface)}.coach-composer textarea{display:block;width:100%;min-height:84px;border:0;outline:0;resize:vertical;background:transparent;padding:10px 14px 4px}.coach-composer-bar{display:flex;justify-content:flex-end;gap:8px;padding:6px 8px 8px}.coach-footer{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px 16px;padding:14px 24px 20px;border-top:0}.coach-footer .toolbar{margin:0}.coach-footer small{color:var(--fg-4)}@media(max-width:760px){.coach-header{flex-wrap:wrap;padding:16px 16px 8px}.coach-header .pill{margin-left:0}.coach-note,.coach-phase,.coach-context,.coach-composer,.coach .sync-conflicts{margin-left:16px;margin-right:16px}.coach-phase{display:flex;overflow-x:auto}.messages{padding:14px 16px}.study-pet{right:8px;bottom:8px}.study-pet-sprite{zoom:.75}.study-pet-button{width:60px;height:62px}.study-pet-dismiss{opacity:1;bottom:52px}}@media(prefers-reduced-motion:reduce){.study-pet-sprite,.study-pet .pixel-pet,.coach-avatar .pixel-pet,.coach-empty .pixel-pet,.coach-dots i,.messages article{animation:none!important}}.graphics-portals{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin:1.5rem 0}.graphics-home .cards{margin:2rem 0}.graphics-workbench{display:grid;grid-template-columns:minmax(200px,.8fr) minmax(250px,1fr) minmax(250px,1fr);gap:1rem;width:100%}.experiment:has(.graphics-workbench) .lab-grid{grid-template-columns:minmax(220px,.27fr) minmax(0,1fr)}.graphics-workbench section{min-width:0}.graphics-workbench h3{margin:.7rem 0}.graphics-workbench pre{max-height:30rem;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.78rem}.source-editor{width:100%;min-height:22rem;font-family:var(--font-mono);font-size:.8rem;line-height:1.55;tab-size:2;white-space:pre;overflow:auto;resize:vertical}.shader-preview iframe,.raster-preview canvas{width:100%;aspect-ratio:1;display:block;border:1px solid var(--line);border-radius:.5rem;background:var(--stage)}.raster-preview canvas{image-rendering:pixelated;cursor:crosshair}.graphics-tabs{display:none}.graphics-output .toolbar{flex-wrap:wrap}.graphics-reading{font-size:.9rem;line-height:1.8}.graphics-code label{display:block}.graphics-workbench .toolbar{display:flex;gap:.4rem;flex-wrap:wrap}@media(max-width:1250px){.graphics-workbench{grid-template-columns:1fr 1fr}.graphics-reading{grid-column:1/-1}}@media(max-width:850px){.graphics-portals{grid-template-columns:1fr}.graphics-workbench{display:block}.graphics-tabs{display:flex;gap:.5rem;margin-bottom:1rem}.graphics-workbench>section{display:none}.graphics-workbench>section.tab-active{display:block}.experiment:has(.graphics-workbench) .lab-grid{display:block}}.visual:has(.graphics-workbench){padding:0;background:transparent;border:0}.visual:has(.graphics-workbench) .prediction-cover{position:relative;margin-bottom:1rem}.concealed .graphics-output{visibility:hidden}.events,.events li{min-width:0;overflow-wrap:anywhere}.graphics-workbench button{white-space:normal}@media(max-width:650px){header{flex-wrap:wrap;padding:1rem;gap:.6rem}header nav{flex-wrap:wrap;gap:.6rem}.brand{font-size:1.15rem}.experiment-heading{flex-wrap:wrap}}.code-editor{display:grid;grid-template-columns:2.4rem minmax(0,1fr);border:1px solid var(--line-strong);border-radius:7px;overflow:hidden}.code-editor>pre{margin:0;padding:.7rem .4rem;line-height:1.55;font-family:var(--font-mono);font-size:.8rem;color:var(--fg-4);text-align:right;overflow:hidden;max-height:22rem;-webkit-user-select:none;user-select:none;border:0;border-radius:0}.code-editor .source-editor{margin:0;border:0;border-radius:0;padding:.7rem;height:22rem}.lesson-reading details{margin:.9rem 0;padding:.65rem 0;border-top:1px solid var(--line)}.lesson-reading summary{cursor:pointer;font-weight:600}.lesson-reading li{margin-bottom:.55rem}.lesson-tasks{padding-left:1.4rem}.lesson-tasks p{margin:.4rem 0}.lesson-reading code{overflow-wrap:anywhere}.coordinate-walkthrough{padding:.8rem;background:var(--bg-1);border-radius:.6rem}.coordinate-walkthrough table{font-size:.75rem;border-collapse:collapse;min-width:420px}.coordinate-walkthrough th,.coordinate-walkthrough td{padding:.45rem;text-align:left;border-bottom:1px solid var(--line)}.coordinate-walkthrough .table-scroll{max-width:100%;overflow-x:auto}.graphics-primer table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse}.graphics-primer th,.graphics-primer td{padding:.6rem;border-bottom:1px solid var(--line);text-align:left}.graphics-primer summary{cursor:pointer;font-weight:600}@media(min-width:1100px){.graphics-code,.graphics-output{position:sticky;top:4.5rem;align-self:start;max-height:calc(100vh - 5rem);overflow:auto;scrollbar-gutter:stable}}.graphics-experiment{max-width:1720px}.graphics-experiment .experiment-heading{margin-bottom:.5rem}.graphics-experiment .experiment-heading h1{font-size:clamp(1.4rem,2.6vw,2.2rem);margin:.3rem 0}.studio-chips{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.5rem;margin:.4rem 0 .9rem}.studio-boundary,.studio-chips .storage-status{position:relative;margin:0;padding:0;border:0;font-size:.78rem;color:var(--fg-3)}.task-card{margin-bottom:1rem;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface);overflow:hidden}.task-card>header{display:block;border-bottom:0;padding:.7rem .9rem;background:var(--accent-soft);border-left:3px solid var(--accent);font-size:.85rem}.task-card>header p{margin:.35rem 0 0;color:var(--fg-2)}.task-steps{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--line);padding:0 .4rem}.task-steps button{display:inline-flex;align-items:center;gap:.45rem;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:var(--fg-3);padding:.55rem .7rem .45rem;font-size:.82rem}.task-steps button:hover{background:none;color:var(--fg)}.task-steps button[aria-pressed=true]{color:var(--fg);border-bottom-color:var(--accent)}.task-steps button span{display:inline-grid;place-items:center;width:1.2rem;height:1.2rem;border-radius:50%;background:var(--surface-3);font:.68rem var(--font-mono)}.task-body{padding:.7rem .9rem .5rem;font-size:.85rem}.task-body>p{margin:0 0 .6rem}.task-body details{margin:.4rem 0 0;padding:.3rem 0;border-top:0}.task-prompts{display:grid;gap:.5rem;margin-bottom:.4rem}.task-prompts label{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.4rem .8rem}.task-prompts label>span{display:inline-flex;align-items:center;gap:.6rem}.task-card .task-prompts input{display:inline-block;width:7rem;margin:0;padding:.3rem .5rem}.task-prompts b{min-width:5.5rem;font-size:.78rem}.check-pass{color:var(--ok)}.check-fail{color:var(--fg-3)}.task-checks{padding:.6rem .9rem .8rem;border-top:1px solid var(--line);font-size:.82rem}.task-checks h4{margin:0 0 .4rem;font:500 .7rem var(--font-mono);letter-spacing:.08em;color:var(--fg-3)}.task-checks ul{list-style:none;margin:0 0 .6rem;padding:0;display:grid;gap:.35rem}.task-checks li{display:grid;grid-template-columns:1.1rem 1fr auto;gap:.4rem;align-items:baseline}.task-checks li span{color:var(--fg-2)}.task-checks li.check-pass span{color:var(--fg)}.task-checks li.check-blocked,.task-checks li.check-pending{color:var(--fg-4)}.task-checks li small{color:inherit}.task-checks>p{margin:.5rem 0 0;color:var(--fg-4);font-size:.72rem}.storage-status{position:relative;margin:0;padding:0;border:0;font-size:.78rem;color:var(--fg-3)}.studio-boundary>summary,.studio-chips .storage-status{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .7rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:.78rem;line-height:1.6;color:var(--fg-3)}.studio-chips .storage-status:before{content:"";width:.4rem;height:.4rem;border-radius:50%;background:var(--ok)}.studio-boundary[open]>summary{border-color:var(--line-hi);color:var(--fg)}.studio-boundary>p{position:absolute;z-index:8;top:calc(100% + .4rem);left:0;width:min(34rem,86vw);margin:0;padding:.8rem 1rem;border:1px solid var(--line-strong);border-radius:var(--radius-control);background:var(--surface-2);color:var(--fg-2);box-shadow:0 12px 32px #0008}.studio.graphics-workbench{display:block}.studio-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.4rem 0 .8rem}.studio-bar p{margin:.1rem 0 0;color:var(--fg-2);font-size:.95rem}.studio-bar .toolbar{margin:0}.studio-live{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1rem;align-items:start}.studio .graphics-code,.studio .graphics-output{position:static;max-height:none;overflow:visible;scrollbar-gutter:auto}.studio-editor,.studio-viewport{border:1px solid var(--line);background:var(--bg-1);border-radius:var(--radius-panel)}.studio-viewport{position:relative;overflow:hidden;background:var(--stage)}.studio-tabs{padding:0 .7rem;gap:.2rem;flex-wrap:wrap;border-bottom:1px solid var(--line)}.studio-tabs button{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:var(--fg-3);padding:.75rem .9rem .65rem}.studio-tabs button:hover{background:none;color:var(--fg)}.studio-tabs button[aria-pressed=true]{color:var(--fg);border-bottom-color:var(--accent)}.studio-editor-body{padding:1rem;min-height:540px;max-height:780px;overflow:auto}.studio-editor-body>h3{margin-top:0}.studio .source-editor{min-height:25rem}.render-studio .source-editor{min-height:10rem}.studio .code-editor{border:1px solid var(--line);border-radius:8px;background:var(--bg)}.studio .code-editor textarea{background:transparent}.studio .graphics-output{padding:1rem;position:sticky;top:1rem}.studio-preview-title{display:flex;justify-content:space-between;align-items:center;gap:1rem}.studio-preview-title h3{margin-top:0}.studio-canvases{display:grid;grid-template-columns:minmax(0,1fr);gap:.8rem}.studio-canvases{position:relative}.studio-canvases>div{min-width:0}.studio-canvases .shader-preview iframe,.studio-canvases .raster-preview canvas{width:min(100%,max(20rem,calc(100dvh - 19rem)));margin-inline:auto}.studio-canvases .shader-preview iframe{border:0;background:transparent}.studio .shader-preview .toolbar,.studio .raster-preview .toolbar{margin-top:.6rem;gap:.25rem}.studio .raster-preview .toolbar button{padding:.35rem .5rem;font-size:.78rem}.studio .raster-preview details{font-size:.8rem}.studio-runtime{color:var(--accent);font-size:.8rem}.studio-quick-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 1rem}.studio .control{padding:.5rem 0}.studio .control select{max-width:100%}.studio .control small{display:block}.studio-parameters,.studio-metrics{padding:.6rem 0;border-top:1px solid var(--line)}.studio-metrics dl>div{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.4rem;font-size:.8rem}.studio-metrics dd{margin:0}.studio-notebook{padding:1.2rem;margin:1.5rem 0;border:1px solid var(--line);border-radius:12px;background:var(--bg-1)}.studio-notebook h3,.studio-notebook p{margin:0 0 .5rem}.studio-notebook textarea{min-height:5rem}.studio-notebook nav{margin-top:1rem;flex-wrap:wrap}.studio-notebook details{margin-top:1rem}.studio-last-snapshot{color:var(--accent);margin-top:1rem!important}@media(max-width:850px){.studio-live{display:flex;flex-direction:column}.studio .graphics-output{order:-1;width:100%;position:static}.studio .graphics-code{width:100%}.studio-editor-body{min-height:0;max-height:none}.studio-bar{flex-direction:column;align-items:start}.studio-bar button{padding:.6rem;font-size:.8rem}.studio .source-editor{min-height:19rem}.render-studio .source-editor{min-height:10rem}}@media(max-width:850px){.studio .graphics-output{position:sticky;top:0;max-height:43vh;overflow:auto;z-index:5;box-shadow:0 8px 20px #0008}.studio-canvases .shader-preview iframe,.studio-canvases .raster-preview canvas{width:min(100%,29vh);height:auto;max-height:none;margin:auto}}.graphics-experiment .experiment-heading{margin-top:1rem}.graphics-experiment .experiment-heading p{margin:.4rem 0}.graphics-experiment{padding-top:1rem}.studio-brief{padding:.7rem .9rem;margin-bottom:1rem;background:var(--accent-soft);border-left:3px solid var(--accent);font-size:.85rem}.studio-brief p{margin:.35rem 0 0;color:var(--fg-2)}.storage-status{font-size:.75rem;color:var(--fg-3);margin:.5rem 0}.graphics-course-intro{padding-top:0}.render-metrics{font-size:.7rem;text-align:center;color:var(--fg-3);font-variant-numeric:tabular-nums}.renderer-empty{min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;color:var(--fg-3)}.renderer-empty>span{font-size:6rem;color:var(--fg-4)}.renderer-empty h2{font-size:1.1rem}.renderer-empty p{font-size:.85rem}.assembly-heading{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;margin:2rem 0}.assembly-heading h1{font-size:clamp(1.7rem,3vw,3rem)}.assembly-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.7fr);gap:1.6rem;align-items:start}.assembly-pipeline>h2{display:flex;justify-content:space-between}.assembly-pipeline>p{font-size:.8rem;color:var(--muted)}.module-card{display:flex;gap:.8rem;border:1px solid color-mix(in srgb,var(--line-hi) 25%,transparent);padding:1rem;border-radius:12px;margin-bottom:.7rem;background:color-mix(in srgb,var(--surface) 13%,transparent)}.module-card.connected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,transparent)}.module-number{font:.8rem var(--font-mono);color:var(--fg-4)}.module-card h3{margin:0;font-size:1rem}.module-card p{font-size:.78rem;margin:.4rem 0}.module-card small{font-size:.7rem;color:var(--muted)}.module-card button,.module-card a{font-size:.75rem}.module-card .toolbar{margin:.5rem 0 0;gap:.6rem}.assembly-screen{background:radial-gradient(ellipse at 50% 30%,#1a1c27,var(--stage));border:1px solid var(--line);border-radius:var(--radius-panel);padding:1.1rem;touch-action:pan-y}.assembly-screen .raster-preview canvas{border:0;image-rendering:auto;max-height:620px;width:auto;max-width:100%;margin:auto;cursor:grab}.assembly-controls{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1.2rem 0}.assembly-controls label{display:flex;flex-direction:column;font-size:.8rem;gap:.4rem}.assembly-controls select{width:100%}.checkpoint{display:flex;gap:1rem;justify-content:space-between;align-items:center;border-top:1px solid color-mix(in srgb,var(--line-hi) 19%,transparent);padding:.8rem 0;font-size:.8rem}.renderer-lesson-bridge{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid color-mix(in srgb,var(--line-hi) 31%,transparent);border-radius:12px;margin-bottom:1rem}.renderer-lesson-bridge p{font-size:.85rem;margin:.3rem 0}.renderer-lesson-bridge .toolbar{margin:0}.renderer-lesson-bridge button{font-size:.8rem}@media(max-width:850px){.assembly-layout{grid-template-columns:1fr}.assembly-desk{grid-row:1}.assembly-pipeline{grid-row:2}.assembly-heading,.renderer-lesson-bridge{flex-direction:column;align-items:flex-start}.assembly-screen .raster-preview canvas{width:100%;height:auto;max-height:none}.assembly-controls{grid-template-columns:1fr}.checkpoint{flex-wrap:wrap}}.assembly-screen .raster-preview canvas{width:min(100%,520px);height:auto;max-height:none}.assembly-desk{position:sticky;top:1rem;max-height:calc(100dvh - 2rem);overflow:auto;padding-right:.35rem}.assembly-pipeline,.module-card{position:relative}.module-card:not(:last-child):after{content:"";position:absolute;left:1.4rem;bottom:-.75rem;height:.7rem;border-left:1px solid color-mix(in srgb,var(--accent) 44%,transparent)}@media(max-width:850px){.assembly-desk{position:static;max-height:none;overflow:visible;padding-right:0}.assembly-screen .raster-preview canvas{width:100%}}.studio-viewport:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,#ff5d8f,#ff9a3d,#f2e05a,#4cc38a,#38c7ff,#6f6bff,#c26bff);background-size:200% 100%;opacity:.55;pointer-events:none}.studio-viewport[data-state=pending]:before{opacity:1;animation:spectrum-sweep 1.2s linear infinite}.studio-viewport[data-state=error]:before{background:var(--bad);opacity:1}@keyframes spectrum-sweep{to{background-position:-200% 0}}.studio-runtime{display:flex;align-items:center;gap:.5rem;color:var(--fg-3)}.studio-runtime:before{content:"";flex:none;width:.5rem;height:.5rem;border-radius:50%;background:var(--warn)}.studio-runtime[data-state=ok]:before{background:var(--ok)}.studio-runtime[data-state=error]:before{background:var(--bad)}.studio .shader-preview .toolbar,.studio .raster-preview .toolbar{justify-content:center}.studio .shader-preview .toolbar button{border-color:transparent;background:var(--surface-2);font-size:.78rem;padding:.35rem .8rem}.studio .shader-preview>small{display:block;text-align:center;color:var(--fg-4)}.studio .raster-preview{display:flex;flex-direction:column}.studio .raster-preview>.toolbar{order:-1;flex-wrap:wrap;margin:0 0 .7rem;gap:.3rem}.studio .raster-preview .toolbar button{border-radius:999px;border-color:var(--line);background:none;color:var(--fg-3);padding:.25rem .7rem;font-size:.75rem}.studio .raster-preview .toolbar button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.studio .raster-preview>button{align-self:center;margin:.6rem 0 0;border-color:transparent;background:none;color:var(--fg-3);font-size:.78rem}.studio .raster-preview>small{text-align:center;color:var(--fg-4);margin-top:.3rem}@media(prefers-reduced-motion:reduce){.studio-viewport[data-state=pending]:before{animation:none}}.graphics-experiment .experiment-heading .eyebrow,.studio-bar .eyebrow{display:none}@media(max-width:850px){.studio .raster-preview>.toolbar{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.3rem;scrollbar-width:none}.studio .raster-preview>.toolbar button{flex:none;white-space:nowrap}.studio-preview-title h3{font-size:.95rem}}body:has(.effect-gallery.immersive)>#root>header,body:has(.effect-gallery.immersive) header{position:absolute;inset:0 0 auto;z-index:20;background:transparent;border-bottom-color:transparent}.graphics-home{max-width:none;padding:0}.graphics-home-body{max-width:1440px;margin:auto;padding:30px 4vw}.effect-gallery.immersive{--spot-x: 70%;--spot-y: 40%;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:clamp(600px,92vh,900px);padding:6.5rem 4vw 8rem;background:var(--stage);color:var(--fg)}.exhibit-canvas.stage{position:absolute;inset:0;z-index:0;transition:opacity .25s,filter .25s}.exhibit-canvas.stage.switching{opacity:.2;filter:blur(10px)}.stage .shader-preview,.stage .shader-surface{position:absolute;inset:0}.stage .shader-preview iframe{display:block;width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0;background:var(--stage)}.shader-touch{position:absolute;inset:0;touch-action:pan-y;cursor:grab}.shader-touch:active{cursor:grabbing}.stage-veil{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--stage) 88%,transparent) 0%,color-mix(in srgb,var(--stage) 50%,transparent) 36%,transparent 62%),linear-gradient(to bottom,color-mix(in srgb,var(--stage) 60%,transparent) 0,transparent 20%,transparent 62%,var(--bg) 100%)}.effect-gallery .exhibit-copy{position:relative;z-index:2;max-width:min(560px,46%);pointer-events:none;transition:max-width .3s}.effect-gallery .exhibit-copy .toolbar,.effect-gallery .exhibit-copy a,.effect-gallery .exhibit-copy button{pointer-events:auto}.effect-gallery h1{font-size:clamp(2.3rem,4.6vw,4.4rem);line-height:1.1;font-weight:700;letter-spacing:-.04em;margin:1.2rem 0 1.6rem}.effect-gallery h2{color:var(--accent);font-size:1.3rem;margin:0 0 .3rem}.effect-gallery p{color:var(--fg-2);line-height:1.8;margin:.3rem 0}.effect-gallery .eyebrow{color:var(--fg-2);letter-spacing:.18em;font-size:.7rem}.mechanism-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0}.mechanism-tags span{font-size:.72rem;border:1px solid var(--line-strong);background:color-mix(in srgb,var(--stage) 55%,transparent);border-radius:999px;padding:.3rem .7rem}.exhibit-note{font-size:.75rem;color:var(--fg-3)}.effect-gallery .toolbar{flex-wrap:wrap}.effect-gallery .primary:hover{transform:translateY(-1px)}.exhibit-editor{position:relative;z-index:3;margin-top:1.2rem;padding:1rem;border:1px solid var(--line-strong);border-radius:var(--radius-panel);background:color-mix(in srgb,var(--stage) 84%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.exhibit-editor p{font-size:.78rem;color:var(--fg-3)}@media(min-width:1100px){.exhibit-editor{position:absolute;right:4vw;top:6.5rem;bottom:8rem;width:min(560px,42vw);margin:0;overflow:auto}.effect-gallery.is-editing .exhibit-copy{max-width:min(400px,32%)}}.stage-dock{position:absolute;z-index:3;left:4vw;right:4vw;bottom:2rem;display:flex;flex-direction:column;gap:.9rem}.exhibit-dots{display:flex;flex-wrap:wrap;gap:.2rem .4rem}.exhibit-dots button{position:relative;display:inline-flex;align-items:baseline;gap:.5rem;padding:.45rem .8rem .6rem;border:0;border-radius:0;background:none;color:var(--fg-3);font-size:.8rem}.exhibit-dots button span{font:.68rem var(--font-mono);color:var(--fg-4)}.exhibit-dots button:before,.exhibit-dots button:after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:0;height:2px;background:var(--line-strong)}.exhibit-dots button:after{background:var(--accent);transform-origin:left;transform:scaleX(0)}.exhibit-dots button:hover{background:none;color:var(--fg)}.exhibit-dots [aria-pressed=true]{color:var(--fg)}.exhibit-dots [aria-pressed=true]:after{transform:scaleX(1)}.exhibit-dots button.auto:after{animation:exhibit-progress var(--auto) linear both}@keyframes exhibit-progress{0%{transform:scaleX(0)}}.stage-controls{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem 1.1rem;align-self:flex-start;padding:.5rem 1rem;border:1px solid var(--line-strong);border-radius:999px;background:color-mix(in srgb,var(--stage) 72%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font:.7rem var(--font-mono);letter-spacing:.08em;color:var(--fg-3)}.stage-controls label{display:flex;align-items:center;gap:.5rem}.stage-controls input[type=range]{width:84px}.stage-controls>button{padding:.3rem .7rem;border-radius:999px;border-color:transparent;background:none;color:var(--fg-2);font-size:.75rem}.swatches{display:flex;gap:.4rem}.swatch{width:1.05rem;height:1.05rem;padding:0;border:2px solid transparent;border-radius:50%;background:var(--swatch);box-shadow:0 0 0 1px var(--line-strong)}.swatch[aria-pressed=true]{border-color:var(--stage);box-shadow:0 0 0 2px var(--fg)}.stage-hint{position:absolute;right:0;bottom:.7rem;font:.68rem var(--font-mono);letter-spacing:.1em;color:var(--fg-3);transition:opacity .6s}.stage-hint.is-quiet{opacity:0}@media(max-width:850px){.effect-gallery.immersive{padding:5.5rem 1.25rem 2.5rem}.effect-gallery .exhibit-copy{max-width:100%}.stage-veil{background:linear-gradient(to bottom,color-mix(in srgb,var(--stage) 70%,transparent) 0,color-mix(in srgb,var(--stage) 55%,transparent) 55%,var(--bg) 100%)}.stage-dock{position:relative;left:auto;right:auto;bottom:auto;margin-top:1.5rem}.exhibit-dots button b{display:none}.stage-controls{border-radius:var(--radius-panel)}.stage-hint{display:none}}@media(prefers-reduced-motion:reduce){.exhibit-canvas.stage,.effect-gallery .exhibit-copy{transition:none}.exhibit-dots button.auto:after{animation:none;transform:scaleX(1)}}.code-stack{position:relative;min-width:0;display:grid}.code-highlight{position:absolute;inset:0;margin:0;padding:.7rem;overflow:hidden;white-space:pre;pointer-events:none;font:.8rem/1.55 var(--font-mono);tab-size:2;color:var(--fg-2);background:none;border:0;border-radius:0;max-height:none}.code-probe{position:absolute;visibility:hidden}.code-editor .source-editor{position:relative;background:transparent;color:transparent;caret-color:var(--fg)}.code-editor .source-editor::selection{background:color-mix(in srgb,var(--accent) 35%,transparent);color:transparent}.code-editor .source-editor::placeholder{color:var(--fg-4)}.code-editor.over-number .source-editor{cursor:ew-resize}.tok-comment{color:var(--fg-4)}.tok-keyword{color:var(--syn-keyword)}.tok-type{color:var(--syn-type)}.tok-builtin{color:var(--syn-builtin)}.tok-pre{color:var(--syn-pre)}.tok-number{color:var(--accent-hi);border-bottom:1px dotted var(--accent)}.code-hint{display:block;margin-top:.35rem;color:var(--fg-4);font-size:.72rem}.pinned-image{position:absolute;top:var(--ab-top, 0);left:var(--ab-left, 0);width:var(--ab-width, 100%);height:var(--ab-height, 100%);clip-path:inset(0 calc(100% - (18px + var(--wipe) * (100% - 36px))) 0 0);pointer-events:none}.pinned-image .shader-preview,.pinned-image .raster-preview,.pinned-image .shader-surface{position:absolute;inset:0}.pinned-image iframe,.pinned-image canvas{width:100%!important;height:100%!important;margin:0!important;aspect-ratio:auto}.pinned-image small,.pinned-image .toolbar,.pinned-image details{display:none}.ab-label{position:absolute;top:var(--ab-top, 0);z-index:3;margin:.5rem;padding:.1rem .5rem;border-radius:999px;background:color-mix(in srgb,var(--stage) 75%,transparent);color:var(--fg-2);font:.68rem var(--font-mono);letter-spacing:.08em;pointer-events:none}.ab-label.is-a{left:var(--ab-left, 0)}.ab-label.is-b{left:calc(var(--ab-left, 0px) + var(--ab-width, 100%) - 5.5rem);text-align:right}.wipe-range{position:absolute;top:var(--ab-top, 0);left:var(--ab-left, 0);width:var(--ab-width, 100%);height:var(--ab-height, 100%);z-index:4;margin:0;padding:0;appearance:none;background:none;border:0;pointer-events:none}.wipe-range::-webkit-slider-runnable-track{background:none;height:var(--ab-height, 100%)}.wipe-range::-webkit-slider-thumb{appearance:none;width:36px;height:var(--ab-height, 100%);border:0;background:radial-gradient(circle at 50% 50%,var(--fg) 0 7px,transparent 8px),linear-gradient(var(--fg),var(--fg)) 50% 0 / 2px 100% no-repeat;cursor:ew-resize;pointer-events:auto}.wipe-range::-moz-range-track{background:none}.wipe-range::-moz-range-thumb{width:36px;height:var(--ab-height, 100%);border:0;border-radius:0;background:radial-gradient(circle at 50% 50%,var(--fg) 0 7px,transparent 8px),linear-gradient(var(--fg),var(--fg)) 50% 0 / 2px 100% no-repeat;cursor:ew-resize;pointer-events:auto}.wipe-range:focus-visible::-webkit-slider-thumb{outline:2px solid var(--accent-hi)}.studio-ab-note{margin:.4rem 0 0;color:var(--fg-4);font-size:.75rem}.render-backdrop{position:absolute;inset:0;z-index:0;background:radial-gradient(55% 70% at 72% 46%,color-mix(in srgb,var(--accent) 20%,transparent),transparent 70%),radial-gradient(40% 30% at 72% 84%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 70%)}.render-stage{--lx: 50%;--ly: 50%;--lr: 0px;position:absolute;z-index:2;right:max(4vw,3rem);top:calc(50% - 3.5rem);width:max(18rem,min(calc(min(92vh,900px) - 18rem),46vw,620px));transform:translateY(-50%);cursor:grab;user-select:none;-webkit-user-select:none}.render-stage:active{cursor:grabbing}.render-stage .raster-preview{position:relative}.render-stage .canvas-wrap{position:relative;aspect-ratio:1}.render-stage canvas{display:block;width:100%;height:100%;image-rendering:auto;aspect-ratio:auto;border:0;border-radius:0;background:transparent;cursor:inherit}.lens-canvas{position:absolute;inset:0;clip-path:circle(var(--lr) at var(--lx) var(--ly));transition:clip-path .2s ease-out}.lens-ring{position:absolute;left:var(--lx);top:var(--ly);width:calc(var(--lr) * 2);height:calc(var(--lr) * 2);margin:calc(var(--lr) * -1) 0 0 calc(var(--lr) * -1);border:1px solid var(--accent-hi);border-radius:50%;pointer-events:none;opacity:0;transition:width .2s ease-out,height .2s ease-out,margin .2s ease-out,opacity .2s}.render-stage:hover .lens-ring{opacity:1}.lens-ring span{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:.4rem;padding:.1rem .6rem;border-radius:999px;background:color-mix(in srgb,var(--stage) 80%,transparent);color:var(--accent-hi);font:.68rem var(--font-mono);letter-spacing:.08em;white-space:nowrap}.render-floor{position:absolute;left:-25%;right:-25%;bottom:4%;height:46%;transform:perspective(520px) rotateX(70deg);transform-origin:50% 100%;background:linear-gradient(var(--line-strong) 1px,transparent 1px) 0 0 / 44px 44px,linear-gradient(90deg,var(--line-strong) 1px,transparent 1px) 0 0 / 44px 44px;-webkit-mask-image:radial-gradient(ellipse 50% 60% at 50% 55%,#000 20%,transparent 72%);mask-image:radial-gradient(ellipse 50% 60% at 50% 55%,#000 20%,transparent 72%);opacity:.7;pointer-events:none}.axis-gizmo{position:absolute;left:-1.5rem;bottom:3rem;width:72px;height:72px;pointer-events:none}.render-stage .render-metrics{position:absolute;left:0;right:0;bottom:-2rem;margin:0}@media(max-width:850px){.render-stage{position:relative;right:auto;top:auto;transform:none;width:min(86vw,420px);margin:0 auto 2.5rem;order:-1}}.render-gallery h1{font-size:clamp(2.1rem,3.8vw,3.7rem)}.render-gallery .exhibit-copy{max-width:min(600px,50%)}@media(max-width:850px){.render-gallery .exhibit-copy{max-width:100%}}.assembly-layout{display:flex;flex-direction:column;align-items:stretch;gap:2rem}.assembly-layout>*{min-width:0}.assembly-desk{position:static;max-height:none;overflow:visible;padding:0;display:flex;flex-direction:column;gap:1rem}.assembly-screen{position:relative;display:grid;place-items:center;min-height:min(68vh,620px);padding:1.5rem;overflow:hidden;border:0;border-radius:var(--radius-panel);background:radial-gradient(60% 70% at 50% 40%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),var(--stage)}.assembly-screen .render-floor{left:8%;right:8%;bottom:8%;height:38%}.assembly-screen .renderer-view,.assembly-screen .renderer-empty{position:relative;z-index:1}.assembly-screen .renderer-view{width:min(100%,560px)}.assembly-screen .raster-preview canvas{width:100%;background:transparent;image-rendering:auto}.assembly-screen .canvas-label{position:absolute;z-index:2;left:1.5rem;bottom:1rem;margin:0}.assembly-pipeline>p{margin:0 0 .5rem}.module-rail{display:flex;gap:28px;overflow-x:auto;padding:.5rem .2rem 1rem;scroll-snap-type:x proximity}.module-card{position:relative;flex:none;width:232px;flex-direction:column;gap:.4rem;margin:0;scroll-snap-align:start;border:1px dashed var(--line-strong);border-radius:var(--radius-panel);background:var(--surface)}.module-card.connected{border-style:solid;border-color:var(--accent);background:var(--accent-soft)}.module-card.waiting{border-color:var(--warn)}.module-card:not(:last-child):after{content:"";position:absolute;left:100%;top:2rem;bottom:auto;width:28px;height:0;border-left:0;border-top:2px dashed var(--line-strong)}.module-card.connected:has(+.module-card.connected):after{border-top:2px solid var(--accent)}.module-card>div{display:flex;flex-direction:column;flex:1;min-height:9.5rem}.module-card .toolbar{margin-top:auto;flex-wrap:wrap}.module-number{align-self:flex-start;padding:.05rem .5rem;border-radius:999px;background:var(--surface-3);color:var(--fg-2)}.module-card.connected .module-number{background:var(--accent);color:var(--accent-ink)}@media(max-width:850px){.assembly-screen{min-height:0;padding:1rem .5rem 2.5rem}}.effect-gallery.is-editing h1{font-size:clamp(1.7rem,2.6vw,2.8rem)}.effect-gallery.immersive{user-select:none;-webkit-user-select:none}.effect-gallery .exhibit-editor{user-select:text;-webkit-user-select:text}.effect-gallery[data-tone=light],body:has(.effect-gallery[data-tone=light]) header{--stage: #efe9dc;--surface: #e6dfcf;--surface-2: #e2dac8;--surface-3: #d8cfba;--fg: #1b1c22;--fg-2: #3b3d49;--fg-3: #5d5f6c;--fg-4: #7b7d89;--line: #cfc7b4;--line-strong: #b9b09b;--line-hi: #9d947f;--accent: #b34d00;--accent-hi: #d2620a;--accent-ink: #fff4e6}.effect-gallery[data-tone=light] .stage-veil{--bg: #efe9dc}.bug-hunt{margin-bottom:1rem;padding:.7rem .9rem;border:1px dashed var(--line-strong);border-radius:var(--radius-panel);font-size:.85rem}.bug-hunt.is-active{border-style:solid;border-color:var(--warn);background:color-mix(in srgb,var(--warn) 6%,transparent)}.bug-hunt h4{margin:0 0 .3rem;font:500 .7rem var(--font-mono);letter-spacing:.08em;color:var(--fg-3)}.bug-hunt p{margin:.3rem 0}.hunt-stages{display:flex;flex-wrap:wrap;gap:.3rem;margin:.5rem 0}.hunt-stages button{border-radius:999px;padding:.25rem .7rem;font-size:.78rem;background:none;color:var(--fg-3)}.hunt-stages button[aria-checked=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.hunt-miss{color:var(--bad)}.hunt-right{color:var(--ok)}.hunt-diffs{width:100%;margin:.5rem 0;border-collapse:collapse;font-size:.78rem}.hunt-diffs caption{text-align:left;color:var(--fg-3);padding-bottom:.2rem}.hunt-diffs th,.hunt-diffs td{padding:.2rem .4rem;border-bottom:1px solid var(--line-soft);text-align:left}.hunt-diffs td{font-variant-numeric:tabular-nums;text-align:right}.hunt-diffs tr.differs{color:var(--warn)}.lesson-links{margin-bottom:1rem;padding:.6rem .9rem;border:1px solid var(--line);border-radius:var(--radius-panel);font-size:.82rem}.lesson-links h4{margin:0 0 .3rem;font:500 .7rem var(--font-mono);letter-spacing:.08em;color:var(--fg-3)}.lesson-links ul{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}.lesson-links li{display:grid;gap:.1rem}.lesson-links li span{color:var(--fg-3)}.lesson-links .path-next{margin:.6rem 0 0;color:var(--fg-4);font-size:.75rem}.dual-path{margin:2rem 0}.dual-path ol{list-style:none;margin:1rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.4rem;counter-reset:step}.dual-path li{counter-increment:step;display:flex;align-items:baseline;gap:.6rem;padding:.4rem .7rem;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:6px;background:var(--surface);font-size:.82rem}.dual-path li:before{content:counter(step);min-width:1.2rem;color:var(--fg-4);font:.7rem var(--font-mono)}.dual-path li a{color:var(--fg-2)}.dual-path li a:hover{color:var(--fg)}.review-card,.review-due{border:1px solid var(--line);border-radius:var(--radius-panel);font-size:.82rem}.review-card{margin-bottom:1rem;padding:.6rem .9rem}.review-card h4{margin:0 0 .3rem;font:500 .7rem var(--font-mono);letter-spacing:.08em;color:var(--fg-3)}.review-card p,.review-due p{margin:.3rem 0}.review-card small,.review-due small{display:block;margin-top:.4rem;color:var(--fg-4)}.review-due-now{margin:.4rem 0;padding:.5rem .7rem;border-left:3px solid var(--warn);background:color-mix(in srgb,var(--warn) 7%,transparent)}.review-due{margin:1rem 0;padding:.8rem 1rem;border-color:var(--warn);background:color-mix(in srgb,var(--warn) 6%,transparent)}.review-due h2{margin:0 0 .5rem;font-size:1rem}.review-due ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}.review-due li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem}.review-due li>div:first-child{flex:1 1 18rem}details.lesson-links,details.review-card{margin:0 0 .6rem;padding:.45rem .9rem;border:1px solid var(--line)}.lesson-links>summary,.review-card>summary{font-size:.8rem;color:var(--fg-2)}.lesson-links[open]>summary,.review-card[open]>summary{margin-bottom:.4rem}.next-steps,.lesson-map{margin:2rem 0}.next-pick,.next-ready li{padding:.6rem .9rem;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface)}.next-pick{margin:.8rem 0;border-left:3px solid var(--accent)}.next-pick a{font-weight:600}.next-pick p{margin:.2rem 0 0;color:var(--fg-3);font-size:.82rem}.next-ready h3{margin:.8rem 0 .4rem;font-size:.85rem;color:var(--fg-2)}.next-ready ul{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}.next-ready li{display:flex;gap:.8rem;align-items:baseline}.next-ready li>span:last-child{display:flex;flex-wrap:wrap;gap:.3rem 1rem;font-size:.82rem}.next-ready .tag{flex:none;min-width:5.2rem;font:500 .7rem var(--font-mono);color:var(--fg-3)}.next-ready em{color:var(--fg-4);font-style:normal}.next-review{color:var(--warn)}.next-steps small{color:var(--fg-4)}.map-scroll{overflow-x:auto;padding:.5rem 0 1rem}.map-canvas{position:relative}.map-canvas svg{position:absolute;inset:0;overflow:visible}.map-canvas path{fill:none;stroke:var(--line-strong);stroke-width:1.5}.map-node{position:absolute;display:flex;align-items:center;gap:.5rem;padding:0 .7rem;border:1px solid var(--line-strong);border-radius:8px;background:var(--bg);color:var(--fg-2);font-size:.78rem;line-height:1.2;overflow:hidden}.map-node span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.map-node:hover{color:var(--fg);border-color:var(--line-hi)}.map-node.status-none{border-style:dashed;color:var(--fg-3)}.map-node.status-tried b{color:var(--warn)}.map-node.status-independent{border-color:var(--accent);background:var(--accent-soft);color:var(--fg)}.map-node.status-independent b{color:var(--accent)}.map-node.status-variant{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}.map-legend{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;color:var(--fg-3);font-size:.76rem}.effect-gallery .exhibit-copy .anatomy,.effect-gallery .exhibit-copy .anatomy summary{pointer-events:auto}.anatomy{margin-top:.9rem;max-width:34rem}.anatomy-label{display:block;margin-bottom:.4rem;font:500 .68rem var(--font-mono);letter-spacing:.1em;color:var(--fg-3)}.layer-chips{display:flex;flex-wrap:wrap;gap:.35rem}.layer-chips button{padding:.25rem .7rem;border-radius:999px;font-size:.76rem;background:color-mix(in srgb,var(--stage) 55%,transparent);color:var(--fg-3);text-decoration:line-through}.layer-chips button[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent);color:var(--fg);text-decoration:none}.anatomy details.anatomy-learn{margin:.6rem 0 0;padding:0;border:0;font-size:.78rem;color:var(--fg-2)}.anatomy-learn ul{margin:.4rem 0;padding-left:1.1rem}.anatomy-learn li small{margin-left:.5rem;color:var(--fg-3)}.anatomy-learn p{margin:.3rem 0;color:var(--fg-3)}.task-scaffold{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .9rem;padding:.55rem .9rem;border-bottom:1px solid var(--line);font-size:.78rem;color:var(--fg-2)}.task-scaffold b{color:var(--accent);font-weight:600;letter-spacing:.02em}.task-scaffold button{margin-left:auto;padding:.2rem .55rem;font-size:.75rem}