:root{--bg:#0b0e12;--panel:#141920;--panel-2:#1a212a;--line:#262f3a;--line-soft:#1e262f;--text:#dfe6ef;--text-dim:#8b98a8;--text-faint:#5f6c7b;--accent:#4ea1ff;--accent-dim:#2b6cb0;--warn:#ffb340;--danger:#ff5c5c;--ok:#35d07f;--radius:8px;--shadow:0 8px 28px #00000073;--mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-size:13px;overflow:hidden}#app{width:100vw;height:100vh;display:flex}#sidebar{background:var(--panel);border-right:1px solid var(--line);z-index:10;flex-direction:column;width:336px;min-width:336px;display:flex}.brand{border-bottom:1px solid var(--line);background:linear-gradient(180deg, #171e27, var(--panel));align-items:center;gap:10px;padding:14px 16px 12px;display:flex}.brand-mark{color:var(--accent);font-size:22px;line-height:1;transform:translateY(-1px)}.brand-text h1{letter-spacing:.4px;margin:0;font-size:15px;font-weight:650}.brand-text p{color:var(--text-faint);letter-spacing:.3px;margin:2px 0 0;font-size:11px}.sidebar-body{scrollbar-width:thin;scrollbar-color:#2c3743 transparent;flex:1;padding-bottom:24px;overflow:hidden auto}.sidebar-body::-webkit-scrollbar{width:9px}.sidebar-body::-webkit-scrollbar-thumb{border:2px solid var(--panel);background:#2c3743;border-radius:6px}.sidebar-footer{border-top:1px solid var(--line);background:#10151b;gap:8px;padding:10px 14px;display:flex}.badge{color:#7fd0ff;white-space:nowrap;background:#1c2a38;border:1px solid #24384a;border-radius:999px;padding:3px 8px;font-size:10.5px}.badge.ok{color:#6fe3a1;background:#12291d;border-color:#1e4230}.badge.warn{color:var(--warn);background:#2e2413;border-color:#46351a}.badge.ghost{color:var(--text-faint);border-color:var(--line);background:0 0}.section{border-bottom:1px solid var(--line-soft)}.section-head{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:11px 16px;display:flex}.section-head:hover{background:#171d25}.section-title{letter-spacing:.5px;color:#c3cfdd;text-transform:none;align-items:center;gap:8px;font-size:12px;font-weight:600;display:flex}.section-title:before{content:"";background:var(--accent);opacity:.75;border-radius:2px;width:3px;height:12px}.section-caret{color:var(--text-faint);font-size:10px;transition:transform .18s}.section.collapsed .section-caret{transform:rotate(-90deg)}.section.collapsed .section-body{display:none}.section-body{flex-direction:column;gap:11px;padding:4px 16px 14px;display:flex}.field{flex-direction:column;gap:5px;display:flex}.field-head{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.field-label{color:var(--text-dim);font-size:11.5px}.field-value{font-family:var(--mono);color:#a9c4e0;white-space:nowrap;font-size:11px}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:18px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:#2b3644;border-radius:3px;height:3px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border:2px solid #0d1116;border-radius:50%;width:13px;height:13px;margin-top:-5px;box-shadow:0 0 0 1px #2b6cb0}input[type=range]:hover::-webkit-slider-thumb{background:#6db4ff}input[type=number],input[type=text],select{background:var(--panel-2);border:1px solid var(--line);width:100%;color:var(--text);font-size:12px;font-family:var(--mono);border-radius:6px;outline:none;padding:6px 8px}input[type=number]:focus,select:focus,input[type=text]:focus{border-color:var(--accent-dim);box-shadow:0 0 0 2px #4ea1ff1f}select{cursor:pointer;font-family:inherit}input[type=color]{appearance:none;border:1px solid var(--line);background:var(--panel-2);cursor:pointer;border-radius:6px;width:100%;height:28px;padding:0}input[type=color]::-webkit-color-swatch-wrapper{padding:2px}input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}input[type=color]::-moz-color-swatch{border:none;border-radius:4px}input[type=checkbox]{display:none}.switch{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:9px;display:inline-flex}.switch-track{background:#2a3542;border:1px solid #33404f;border-radius:999px;flex:none;width:34px;height:19px;transition:background .16s,border-color .16s;position:relative}.switch-track:after{content:"";background:#7d8b9b;border-radius:50%;width:13px;height:13px;transition:transform .16s,background .16s;position:absolute;top:2px;left:2px}.switch input:checked+.switch-track{background:#1d4c7a;border-color:#2f6ea8}.switch input:checked+.switch-track:after{background:#7fc0ff;transform:translate(15px)}.switch-label{color:var(--text-dim);font-size:11.5px}button{color:var(--text);background:var(--panel-2);border:1px solid var(--line);cursor:pointer;border-radius:7px;padding:8px 12px;font-family:inherit;font-size:12px;transition:background .14s,border-color .14s,color .14s}button:hover{background:#222c37;border-color:#35414f}button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{color:#f2f8ff;background:linear-gradient(#2f7fd0,#2668ad);border-color:#3a87d6;font-weight:600}button.primary:hover{background:linear-gradient(#3a8cdd,#2a72ba)}button.secondary{background:0 0}button.mini{border-radius:6px;padding:3px 9px;font-size:11px}.btn-row{gap:8px;display:flex}.btn-row>*{flex:1}.view-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.view-grid button{letter-spacing:.3px;padding:7px 4px;font-size:11.5px}.hint{color:var(--text-faint);font-size:11px;line-height:1.55}.hint strong{color:var(--text-dim);font-weight:500}.meta-grid{border:1px solid var(--line-soft);background:#10151b;border-radius:7px;grid-template-columns:auto 1fr;gap:4px 10px;padding:8px 10px;font-size:11px;display:grid}.meta-grid .k{color:var(--text-faint)}.meta-grid .v{color:#b6c6d8;font-family:var(--mono);text-align:right}.empty-slot{text-align:center;color:var(--text-faint);cursor:pointer;border:1px dashed #2c3743;border-radius:7px;padding:14px 10px;font-size:11.5px;transition:border-color .15s,color .15s,background .15s}.empty-slot:hover{border-color:var(--accent-dim);color:#9dc6f0;background:#131a22}.ramp-preview{border:1px solid var(--line);background-size:100% 100%;border-radius:6px;height:20px;box-shadow:inset 0 0 0 1px #00000059}.ramp-stops{flex-direction:column;gap:6px;display:flex}.ramp-stop{grid-template-columns:26px 1fr 60px 26px;align-items:center;gap:6px;display:grid}.ramp-stop input[type=color]{border-radius:5px;width:26px;height:24px;padding:0}.ramp-stop input[type=range]{height:16px}.ramp-stop .pos{font-family:var(--mono);color:var(--text-dim);text-align:right;font-size:10.5px}.icon-btn{width:24px;height:24px;color:var(--text-faint);background:0 0;border-color:#0000;border-radius:5px;justify-content:center;align-items:center;padding:2px 0;font-size:12px;line-height:1;display:inline-flex}.icon-btn:hover{color:var(--danger);background:#241a1a;border-color:#3a2626}#stage{background:radial-gradient(circle at 50% 20%,#121822 0%,#080b0f 70%);flex:1;min-width:0;position:relative;overflow:hidden}#view{width:100%;height:100%;display:block}.stage-topbar{pointer-events:none;z-index:5;justify-content:space-between;align-items:center;display:flex;position:absolute;top:12px;left:14px;right:14px}.stage-topbar>*{pointer-events:auto}.segmented{border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f141ad1;border-radius:9px;gap:3px;padding:3px;display:flex}.segmented button{color:var(--text-dim);background:0 0;border:none;border-radius:6px;padding:6px 14px;font-size:12px}.segmented button:hover{color:var(--text);background:#1d2630}.segmented button.active{color:#eaf5ff;background:linear-gradient(#2b6ea8,#235a8b);box-shadow:inset 0 1px #ffffff14}.topbar-actions{gap:8px;display:flex}.tool{border:1px solid var(--line);color:#c3d2e2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f141ad1;padding:7px 12px;font-size:12px}.tool:hover{background:#1e2834eb}.hud{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:4;background:#0c1015b8;border:1px solid #262f3ae6;border-radius:9px;flex-direction:column;gap:3px;min-width:168px;padding:9px 11px;font-size:11px;display:flex;position:absolute;bottom:14px;left:14px}.hud-row{justify-content:space-between;gap:14px;display:flex}.hud-row .k{color:var(--text-faint)}.hud-row .v{font-family:var(--mono);color:#a9c4e0}.pt-progress{border:1px solid var(--line);font-size:11px;font-family:var(--mono);color:var(--text-dim);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:4;white-space:nowrap;background:#0c1015d9;border-radius:999px;align-items:center;gap:10px;padding:7px 12px;display:flex;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.pt-progress.hidden{display:none}.pt-progress-bar{background:#1c2631;border-radius:3px;width:140px;height:4px;overflow:hidden}.pt-progress-fill{background:linear-gradient(90deg,#2b6cb0,#6db4ff);width:0%;height:100%;transition:width .2s}.drop-overlay{border:2px dashed var(--accent-dim);z-index:20;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#080c10d1;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.drop-overlay.active{display:flex}.drop-inner{text-align:center;color:#bcd6ff}.drop-icon{opacity:.8;margin-bottom:8px;font-size:34px}.drop-inner p{margin:0 0 4px;font-size:15px}.drop-inner span{color:var(--text-faint);font-size:12px}.busy{z-index:30;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#06090cad;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.busy.hidden{display:none}.busy-card{background:var(--panel);border:1px solid var(--line);min-width:280px;box-shadow:var(--shadow);border-radius:12px;flex-direction:column;align-items:center;gap:12px;padding:22px 24px;display:flex}.spinner{border:3px solid #2a3642;border-top-color:var(--accent);border-radius:50%;width:26px;height:26px;animation:.85s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.busy-text{color:var(--text-dim);font-size:12.5px;font-family:var(--mono)}.busy-bar{background:#1c2631;border-radius:3px;width:100%;height:4px;overflow:hidden}.busy-fill{background:var(--accent);width:0%;height:100%;transition:width .15s}.busy-fill.indeterminate{width:30%;animation:1.1s ease-in-out infinite slide}@keyframes slide{0%{margin-left:-30%}to{margin-left:100%}}.toast{border:1px solid var(--line);border-left:3px solid var(--accent);color:#cfdcea;max-width:380px;box-shadow:var(--shadow);opacity:0;pointer-events:none;z-index:40;background:#182029;border-radius:8px;padding:10px 14px;font-size:12px;line-height:1.5;transition:opacity .2s,transform .2s;position:absolute;top:60px;right:16px;transform:translateY(-6px)}.toast.show{opacity:1;transform:translateY(0)}.toast.error{border-left-color:var(--danger)}.toast.warn{border-left-color:var(--warn)}.fallback{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#05080be0;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.fallback.hidden{display:none}.fallback-card{background:var(--panel);border:1px solid var(--line);max-width:460px;box-shadow:var(--shadow);border-radius:14px;padding:26px 28px}.fallback-card h2{color:var(--warn);margin:0 0 12px;font-size:17px}.fallback-card p{color:var(--text-dim);margin:0 0 10px;font-size:12.5px;line-height:1.65}.fallback-card .muted{color:var(--text-faint);font-size:12px}.fallback-actions{gap:10px;margin-top:18px;display:flex}.fallback-actions button{flex:1}@media (width<=900px){#sidebar{width:300px;min-width:300px}.hud{display:none}}