:root{--bg: #0b0c0e;--ink: #eceae4;--muted: #9a978f;--line: rgba(236, 234, 228, .14);--panel: rgba(12, 13, 15, .62);--accent: #ffb454;--mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace;--sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);overflow:hidden}body{font:13px/1.4 var(--sans);-webkit-font-smoothing:antialiased}#app{position:fixed;inset:0}#viewport{position:absolute;inset:0;cursor:grab;touch-action:none}#viewport.dragging{cursor:grabbing}#viewport canvas{display:block;width:100%;height:100%}.hud{position:absolute;z-index:2;transition:opacity .35s ease}body.ui-hidden .hud{opacity:0;pointer-events:none}.top-left{top:18px;left:20px;max-width:min(440px,calc(100vw - 40px));pointer-events:none}.eyebrow{margin:0 0 4px;font:10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}h1{margin:0;font-size:22px;font-weight:600;letter-spacing:-.01em;text-shadow:0 1px 12px rgba(0,0,0,.6)}.status{margin:6px 0 0;font:11px/1.4 var(--mono);color:var(--muted);text-shadow:0 1px 8px rgba(0,0,0,.8)}.status.error{color:#ff7a6b}.progress{margin-top:8px;width:180px;height:2px;background:var(--line);overflow:hidden}.progress span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}.progress.done{opacity:0;transition:opacity .8s .4s}.top-right{top:16px;right:16px;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:calc(100vw - 32px)}.top-right button,.pipeline-toggle{font:11px/1 var(--mono);letter-spacing:.04em;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 12px;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.top-right button:hover,.pipeline-toggle:hover{border-color:#eceae466}.top-right button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.minimap{right:16px;bottom:16px;width:176px;height:176px;border-radius:50%;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.pipeline{left:16px;bottom:16px;max-width:calc(100vw - 224px)}.pipeline-toggle{margin-bottom:8px}.stages{list-style:none;margin:0;padding:0;display:flex;gap:8px}.pipeline.collapsed .stages{display:none}.stage{width:176px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:6px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.stage figure{margin:0;aspect-ratio:2 / 1;border-radius:6px;overflow:hidden;background:#000}.stage img,.stage video{width:100%;height:100%;object-fit:cover;display:block}.stage p{margin:6px 2px 0;font:10.5px/1.3 var(--mono);color:var(--muted)}.stage p b{color:var(--accent);font-weight:500;margin-right:4px}.stage p span{display:block;color:#6f6c66}.stats dl{margin:0;aspect-ratio:2 / 1;display:grid;grid-template-columns:auto 1fr;gap:1px 8px;align-content:center;padding:0 6px;font:10.5px/1.45 var(--mono)}.stats dt{color:#6f6c66}.stats dd{margin:0;text-align:right;color:var(--ink)}.help{left:50%;transform:translate(-50%);top:16px;margin:0;font:10.5px/1 var(--mono);color:var(--muted);pointer-events:none;white-space:nowrap;display:none}.help .touch{display:none}@media(hover:none){.help .desk{display:none}.help .touch{display:inline}}@media(min-width:1180px){.help{display:block}}@media(max-width:860px){.pipeline{max-width:calc(100vw - 32px);bottom:16px}.stages{overflow-x:auto;scrollbar-width:none}.stage{flex:0 0 136px;width:136px}.minimap{width:112px;height:112px;bottom:auto;top:118px;right:16px}.top-right{inset:auto 16px 198px;justify-content:flex-start}body.pipeline-collapsed .top-right{bottom:60px}h1{font-size:18px}}