:root{--bg:#07111a;--bg-elevated:#0b1823e0;--panel:#0e1f2bdb;--panel-strong:#142b3af2;--border:#8dbdd62e;--text:#dce8ee;--muted:#8fa9b8;--accent:#72f0d1;--accent-strong:#f2b84b;--danger:#ff8978;--shadow:0 28px 80px #00000057;--display:"Avenir Next Condensed", "Arial Narrow", "Segoe UI", sans-serif;--body:"IBM Plex Sans", "Segoe UI", sans-serif;--mono:"SFMono-Regular", "SF Mono", Consolas, monospace;color:var(--text);font:16px/1.45 var(--body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at top,#2c8ec13d,#0000 32%),radial-gradient(circle at 100% 100%,#f2b84b1f,#0000 22%),linear-gradient(#07111a 0%,#081620 44%,#04080d 100%)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{min-height:100%;margin:0}body{min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}#app{min-height:100vh}.app-shell{min-height:100vh;position:relative;overflow:clip}.control-panel,.visual-panel{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:24px}.visual-stage,.canvas-host{min-height:100vh}.visual-stage{position:relative}.overlay-panels{pointer-events:none;z-index:10;justify-content:space-between;align-items:flex-start;gap:20px;display:flex;position:absolute;inset:24px}.control-panel{pointer-events:auto;flex-direction:column;gap:24px;width:min(380px,100vw - 32px);max-height:calc(100vh - 48px);padding:24px;display:flex;overflow:auto}.eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--accent);align-items:center;gap:8px;font-size:12px;display:inline-flex}.eyebrow:before{content:"";background:currentColor;width:22px;height:1px}.panel-title{font:600 clamp(2.3rem, 6vw, 3.8rem) / .95 var(--display);letter-spacing:-.04em;margin:10px 0 8px}.panel-copy{color:var(--muted);max-width:30ch;margin:0}.section-title{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-size:.9rem}.stack{flex-direction:column;gap:12px;display:flex}.field{flex-direction:column;gap:8px;display:flex}.field-label{color:var(--muted);justify-content:space-between;gap:12px;font-size:.92rem;display:flex}.field input[type=text],.field input[type=range],.field input[type=file],.field output{width:100%}.field input[type=text]{border:1px solid var(--border);color:var(--text);background:#07111ab3;border-radius:14px;padding:12px 14px}.field input[type=file]{color:var(--muted);background:#07111a5c;border:1px dashed #72f0d147;border-radius:14px;padding:12px}.transport-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.transport-row button,.secondary-action{border:1px solid var(--border);color:var(--text);background:#ffffff0a;border-radius:999px;padding:11px 16px;transition:transform .14s,border-color .14s,background .14s}.transport-row button:hover,.secondary-action:hover{border-color:#72f0d16b;transform:translateY(-1px)}.transport-row button.primary{background:linear-gradient(135deg,#72f0d12e,#f2b84b1f);border-color:#72f0d147}.range-line{align-items:center;gap:12px;display:flex}.range-line output,.status-badge{text-align:right;min-width:70px;color:var(--accent);font-family:var(--mono);font-size:.9rem}.status-badge{text-align:left;min-width:auto}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.metric-card{border:1px solid var(--border);background:#07111a73;border-radius:16px;padding:12px 14px}.metric-card dt{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:0 0 6px;font-size:.8rem}.metric-card dd{margin:0;font-size:1.1rem}.visual-panel{pointer-events:auto;flex-direction:column;width:min(420px,100vw - 32px);display:flex;position:relative;overflow:hidden}.app-shell.drag-active{position:relative}.app-shell.drag-active .control-panel,.app-shell.drag-active .visual-panel{border-color:#72f0d157;transform:scale(.995)}.panel-toolbar{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.panel-tag{color:var(--muted);letter-spacing:.12em;text-transform:uppercase;font-size:.75rem}.panel-dismiss,.overlay-launcher{border:1px solid var(--border);color:var(--text);background:#07111ab8;border-radius:999px;padding:9px 14px;transition:transform .14s,border-color .14s,background .14s}.panel-dismiss:hover,.overlay-launcher:hover{border-color:#72f0d16b;transform:translateY(-1px)}.visual-header{border-bottom:1px solid var(--border);background:#07111a80;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;display:flex}.visual-header h2{letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:1rem}.visual-header p{color:var(--muted);margin:4px 0 0;font-size:.92rem}.canvas-host{background:radial-gradient(circle at top,#5fd6ff14,#0000 20%),linear-gradient(#020a1066,#020a10d9);width:100vw;height:100vh;position:relative}.canvas-host canvas{width:100%;height:100%;display:block}.canvas-overlay{flex-wrap:wrap;justify-content:flex-end;gap:10px;max-width:min(60vw,640px);display:flex;position:absolute;inset:auto 18px 18px auto}.pill{border:1px solid var(--border);color:var(--text);background:#07111ab8;border-radius:999px;padding:8px 12px;font-size:.86rem}.helper-copy,.error-copy{color:var(--muted);margin:0}.error-copy{color:var(--danger)}.data-flow{border:1px solid var(--border);color:var(--muted);background:#07111a7a;border-radius:18px;padding:14px 16px;font-size:.92rem}.data-flow strong{color:var(--text)}.drop-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;pointer-events:none;z-index:50;background:#040a0fad;place-items:center;padding:24px;transition:opacity .14s;display:grid;position:fixed;inset:0}.drop-overlay.visible{opacity:1;pointer-events:auto}.drop-overlay-card{width:min(560px,100%);box-shadow:var(--shadow);text-align:center;background:radial-gradient(circle at top,#72f0d11f,#0000 38%),#07111af0;border:1px solid #72f0d157;border-radius:28px;padding:28px}.drop-overlay-title{font:600 clamp(2rem, 6vw, 3rem) / .95 var(--display);letter-spacing:-.04em;margin:0 0 8px}.drop-overlay-copy{color:var(--muted);margin:0}.overlay-launchers{z-index:12;gap:10px;display:flex;position:absolute;top:24px;left:24px}.overlay-launcher[hidden]{display:none}@media (width<=1080px){.overlay-panels{flex-direction:column;align-items:stretch;inset:14px}.control-panel,.visual-panel{width:min(100%,520px);max-height:none}.visual-panel{align-self:flex-end}.overlay-launchers{top:14px;left:14px}}@media (width<=720px){.control-panel,.visual-panel{border-radius:18px}.control-panel{padding:18px}.overlay-panels{gap:12px;inset:12px}.overlay-launchers{flex-wrap:wrap;top:12px;left:12px;right:12px}.transport-row,.metrics-grid{grid-template-columns:1fr}.visual-header{flex-direction:column;align-items:flex-start}.canvas-overlay{max-width:none;bottom:12px;left:12px;right:12px}}