:root{color-scheme:dark;font-family:Segoe UI Variable,Segoe UI,sans-serif;background:#06131b;color:#d7e7e9;font-synthesis:none;--ink: #07161e;--marine: #0c222b;--panel: #102d37;--line: #2b4c56;--mist: #d8e8e8;--muted: #8ca3a7;--signal: #6ee3d2;--coral: #ff8269;--paper: #f2f8f6;--amber: #edc86e}*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%}body{min-height:100vh;background:radial-gradient(circle at 19% 8%,rgba(77,162,170,.09),transparent 26rem),linear-gradient(145deg,#06131b,#071923 56%,#0a1e28)}button,textarea,select{font:inherit}button:focus-visible,textarea:focus-visible,select:focus-visible,pre:focus-visible,a:focus-visible{outline:2px solid var(--signal);outline-offset:3px}.app-shell{min-height:100vh;display:grid;grid-template-rows:auto 1fr}.topbar{min-height:62px;padding:0 28px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:#07161edb;backdrop-filter:blur(18px)}.brand{color:var(--paper);text-decoration:none;font-family:Bahnschrift,Arial Narrow,sans-serif;font-size:1.08rem;font-weight:650;letter-spacing:.025em;display:inline-flex;align-items:center;gap:11px;width:fit-content}.brand-mark{width:23px;height:23px;display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:3px;transform:skew(-8deg)}.brand-mark i{display:block;background:var(--signal);border-radius:1px}.brand-mark i:nth-child(1){height:47%;opacity:.6}.brand-mark i:nth-child(2){height:100%}.brand-mark i:nth-child(3){height:70%;opacity:.8}.compile-path{display:flex;gap:10px;align-items:center;color:var(--muted);font:.69rem/1.1 Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.1em}.compile-path b{color:var(--line);font-weight:400}.topbar-actions{justify-self:end;display:flex;align-items:center;gap:18px}.topbar-link{min-height:36px;padding:0 13px;display:inline-flex;align-items:center;gap:9px;border:1px solid var(--signal);border-radius:3px;background:var(--signal);color:#052027;box-shadow:0 0 22px #6ee3d221;font:700 .68rem/1 Cascadia Mono,Consolas,monospace;letter-spacing:.08em;text-decoration:none;text-transform:uppercase;transition:background .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease}.topbar-link-short{display:none}.topbar-link-arrow{font-size:.88rem;transition:transform .14s ease}.topbar-link:hover{border-color:#9af1e5;background:#9af1e5;box-shadow:0 0 28px #6ee3d238;transform:translateY(-1px)}.topbar-link:hover .topbar-link-arrow{transform:translate(2px)}.status-chip{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font:.72rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.09em}.status-chip:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 12%,transparent)}.status-chip[data-state=running]{color:var(--signal)}.status-chip[data-state=compiling],.status-chip[data-state=warning]{color:var(--amber)}.status-chip[data-state=error]{color:var(--coral)}.status-chip[data-state=stopped]{color:#c7a96b}.status-chip[data-state=fallback]{color:#b6c0c2}.workspace{width:min(1680px,100%);margin:0 auto;padding:28px;display:grid;grid-template-columns:minmax(560px,1.2fr) minmax(410px,.8fr);gap:22px}.instrument,.code-panel{min-height:0;border:1px solid var(--line);background:#0b202bb8;box-shadow:0 24px 70px #0003}.instrument{align-self:start;padding:22px;display:flex;flex-direction:column}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:18px}.title-block{max-width:520px}.eyebrow{margin:0 0 8px;color:var(--signal);font:.67rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.13em}h1{margin:0;color:var(--paper);font:640 clamp(2.35rem,4.3vw,4.35rem)/.86 Bahnschrift,"Arial Narrow",sans-serif;letter-spacing:-.045em}h1 em{color:var(--signal);font-style:normal}.title-note{max-width:490px;margin:14px 0 0;color:var(--muted);font-size:.79rem;line-height:1.48}.controls{max-width:310px;display:grid;grid-template-columns:repeat(2,minmax(110px,1fr));gap:8px}.button{min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:3px;background:#0c222d;color:var(--mist);cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}.button:hover:not(:disabled){border-color:#4c737d;transform:translateY(-1px)}.button:disabled{opacity:.42;cursor:not-allowed}.button-primary{border-color:var(--signal);background:var(--signal);color:#052027;font-weight:700}.button-share{border-color:#ff8269b8;color:#ffd0c7}.button-share[data-copied=true]{border-color:var(--signal);color:var(--signal)}.example-rail{min-height:58px;margin-bottom:12px;padding:9px 11px;display:grid;grid-template-columns:auto minmax(170px,230px) 1fr;align-items:center;gap:12px;border:1px solid var(--line);background:#0512198f}.example-rail label{color:var(--signal);font:.61rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.11em}.example-rail select{width:100%;min-height:34px;padding:0 30px 0 10px;border:1px solid #385c66;border-radius:2px;background:#0c222b;color:var(--paper);cursor:pointer}.example-rail select:disabled{opacity:.5;cursor:wait}.example-rail p{margin:0;color:var(--muted);font:.65rem/1.45 Cascadia Mono,Consolas,monospace}.viewport-frame{position:relative;min-height:400px;flex:1;overflow:hidden;border:1px solid #31535d;background:radial-gradient(circle at 50% 45%,rgba(57,133,139,.12),transparent 45%),#071923}.viewport-frame:before{content:attr(data-mode-label);position:absolute;z-index:2;top:14px;left:16px;color:#63818a;font:.64rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.12em;pointer-events:none}.viewport-frame[data-preset=grid] .axis{display:none}#gpu-canvas{display:block;width:100%;height:100%;min-height:400px}.axis{position:absolute;z-index:1;pointer-events:none;opacity:.36}.axis-x{left:0;right:0;top:50%;border-top:1px dotted #31535d}.axis-y{top:0;bottom:0;left:50%;border-left:1px dotted #31535d}.telemetry{position:absolute;z-index:3;left:14px;right:14px;bottom:14px;margin:0;padding:10px 12px;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(103,215,202,.22);background:#051219d1;backdrop-filter:blur(8px)}.telemetry div{padding:0 12px;border-left:1px solid var(--line)}.telemetry div:first-child{border-left:0;padding-left:0}.telemetry dt{margin-bottom:4px;color:var(--muted);font:.59rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.11em}.telemetry dd{margin:0;color:var(--paper);font:600 .95rem Bahnschrift,Arial Narrow,sans-serif}.fallback{position:absolute;inset:0;z-index:4;padding:8%;display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,#081a23f5,#102d37f7)}.fallback[hidden]{display:none}.fallback-preview{position:absolute;inset:0;overflow:hidden;opacity:.34}.fallback-preview i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--signal);box-shadow:0 0 12px var(--signal)}.fallback-preview i:nth-child(1){left:11%;top:27%}.fallback-preview i:nth-child(2){left:22%;top:63%}.fallback-preview i:nth-child(3){left:34%;top:42%}.fallback-preview i:nth-child(4){left:46%;top:70%}.fallback-preview i:nth-child(5){left:54%;top:22%}.fallback-preview i:nth-child(6){left:65%;top:53%}.fallback-preview i:nth-child(7){left:77%;top:34%}.fallback-preview i:nth-child(8){left:85%;top:68%}.fallback-preview i:nth-child(9){left:93%;top:18%}.fallback-symbol{position:relative;width:66px;height:66px;margin:0 auto 18px;display:grid;place-items:center;border:1px solid var(--coral);color:var(--coral);background:#07161ed6;font:600 .8rem Cascadia Mono,Consolas,monospace;transform:rotate(-4deg)}.fallback h2{margin:0 0 10px;color:var(--paper);font:600 1.55rem Bahnschrift,Arial Narrow,sans-serif}.fallback p{position:relative;max-width:480px;margin:0;color:#b2c4c7;line-height:1.55}.runtime-message{margin-top:16px;min-height:43px;padding:11px 13px;border-left:2px solid var(--signal);background:#67d7ca0e;color:#aac1c6;font-size:.85rem;line-height:1.45}.share-warning{margin-top:10px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid rgba(237,200,110,.38);border-left:2px solid var(--amber);background:#503d1433;color:#e2d4ad;font-size:.8rem;line-height:1.45}.share-warning[hidden]{display:none}.share-warning p{margin:0}.share-warning button{flex:0 0 auto;min-height:32px;padding:0 10px;border:1px solid rgba(237,200,110,.46);border-radius:2px;background:transparent;color:var(--amber);cursor:pointer}.share-warning button:hover{background:#edc86e14}.code-panel{display:grid;grid-template-rows:auto minmax(480px,1fr) auto;overflow:hidden}.code-tabs{min-height:49px;padding:0 14px;display:flex;align-items:stretch;gap:6px;border-bottom:1px solid var(--line)}.code-tab{position:relative;padding:0 11px;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:.78rem}.code-tab:after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;background:transparent}.code-tab.is-active{color:var(--paper)}.code-tab.is-active:after{background:var(--coral)}.line-count{margin-left:auto;align-self:center;color:#617e86;font:.65rem Cascadia Mono,Consolas,monospace}#spark-highlight,#spark-editor,#wgsl-output{grid-row:2;grid-column:1;width:100%;height:100%;min-height:0;margin:0;padding:20px;border:0;border-radius:0;resize:none;font:.76rem/1.62 Cascadia Mono,Consolas,monospace;tab-size:4;white-space:pre-wrap;word-break:break-all;overflow:auto;box-sizing:border-box}#spark-highlight{pointer-events:none;background:#051219a8;color:#c7dcdf;overflow:hidden;z-index:1}#spark-highlight code{font:inherit}#spark-editor{z-index:2;background:transparent;color:transparent;caret-color:var(--coral);overflow:auto}#wgsl-output{z-index:3;background:#051219a8;color:#c7dcdf}#spark-highlight[hidden],#spark-editor[hidden],#wgsl-output[hidden]{display:none!important}#spark-highlight .kwd{color:var(--signal);font-weight:700}#spark-highlight .type{color:var(--amber)}#spark-highlight .num{color:var(--coral)}#spark-highlight .cmt{color:#618790;font-style:italic}#wgsl-output code{font:inherit}.diagnostics{max-height:210px;padding:15px 17px;overflow:auto;border-top:1px solid rgba(255,124,98,.42);background:#3a19186b}.diagnostics strong{color:var(--coral);font:.67rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.1em}.diagnostics ol{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:8px}.diagnostics li{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:10px;color:#d8c2bf;font-size:.76rem;line-height:1.45}.diagnostics button{padding:1px 5px;border:1px solid rgba(255,124,98,.45);border-radius:2px;background:transparent;color:var(--coral);font:.65rem Cascadia Mono,Consolas,monospace;cursor:pointer}.validation-page{min-height:100vh}.validation-shell{width:min(1480px,100%);margin:0 auto;padding:40px 28px 54px}.validation-header{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:end;gap:42px;margin-bottom:30px}.validation-intro{max-width:760px;margin:18px 0 0;color:#9bb3b9;font-size:.94rem;line-height:1.6}.validation-probe{padding:10px;border:1px solid var(--line);background:#0b202bb8;box-shadow:0 20px 55px #0003}.validation-probe span{display:block;margin:2px 4px 9px;color:var(--signal);font:.62rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.13em}#validation-canvas{display:block;width:100%;height:178px;background:#071923}.validation-rack{border:1px solid var(--line);background:#0b202bc2;box-shadow:0 24px 70px #0003}.rack-heading{min-height:60px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}.rack-heading h2{margin:0;color:var(--paper);font:600 1rem Bahnschrift,Arial Narrow,sans-serif;letter-spacing:.01em}.validation-table-wrap{overflow-x:auto}.validation-table{width:100%;min-width:1040px;border-collapse:collapse;table-layout:fixed}.validation-table th,.validation-table td{padding:15px 16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.validation-table tr:last-child th,.validation-table tr:last-child td{border-bottom:0}.validation-table th:last-child,.validation-table td:last-child{border-right:0}.validation-table thead th{color:var(--muted);background:#0512199e;font:.61rem Cascadia Mono,Consolas,monospace;text-transform:uppercase;letter-spacing:.11em}.validation-table tbody th{width:15%;color:var(--paper);font:600 .78rem Cascadia Mono,Consolas,monospace}.validation-table td strong,.validation-table td span{display:block}.validation-table td strong{margin-bottom:5px;color:var(--paper);font:600 .75rem Bahnschrift,Arial Narrow,sans-serif}.validation-table td span{color:var(--muted);font:.62rem/1.45 Cascadia Mono,Consolas,monospace;overflow-wrap:anywhere}.validation-table td[data-state=pass] strong{color:var(--signal)}.validation-table td[data-state=fail] strong{color:var(--coral)}.rack-light{display:inline-block;width:7px;height:7px;margin-right:10px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 4px #829ca31a}.validation-table tr[data-state=pass] .rack-light{background:var(--signal);box-shadow:0 0 0 4px #67d7ca1f,0 0 18px #67d7ca4d}.validation-table tr[data-state=fail] .rack-light{background:var(--coral)}.validation-log{min-height:94px;margin:18px 0 0;padding:15px 17px;white-space:pre-wrap;border:1px solid var(--line);border-left:2px solid var(--signal);background:#051219b8;color:#9bb3b9;font:.68rem/1.6 Cascadia Mono,Consolas,monospace}@media(max-width:1020px){.topbar{grid-template-columns:1fr auto}.compile-path{display:none}.workspace{grid-template-columns:1fr}.code-panel{min-height:620px}.validation-header{grid-template-columns:1fr;align-items:start}.validation-probe{width:min(420px,100%)}}@media(max-width:640px){.topbar,.workspace{padding-left:16px;padding-right:16px}.topbar,.topbar-actions{gap:12px}.topbar-link{min-height:34px;padding:0 10px;font-size:.58rem;letter-spacing:.045em}.workspace{padding-top:16px}.instrument{padding:16px}.section-heading{align-items:start;flex-direction:column}.controls{max-width:none;width:100%}.example-rail{grid-template-columns:1fr;gap:7px}.viewport-frame,#gpu-canvas{min-height:380px}.telemetry{grid-template-columns:repeat(2,1fr);row-gap:10px}.telemetry div:nth-child(3){border-left:0;padding-left:0}.share-warning{align-items:stretch;flex-direction:column}.share-warning button{align-self:start}.validation-shell{padding:24px 16px 38px}.validation-header{gap:24px}}@media(max-width:520px){.topbar-link-full{display:none}.topbar-link-short{display:inline}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}