:root{--bg-dark: #070a16;--bg-glass: rgba(15, 23, 42, .65);--bg-glass-hover: rgba(30, 41, 59, .75);--bg-glass-surface: rgba(30, 41, 59, .45);--bg-capsule: rgba(15, 23, 42, .85);--border-glass: rgba(255, 255, 255, .12);--border-glass-accent: rgba(56, 189, 248, .35);--border-glow: rgba(56, 189, 248, .5);--primary: #38bdf8;--primary-glow: rgba(56, 189, 248, .3);--secondary: #818cf8;--accent-cyan: #22d3ee;--accent-green: #34d399;--accent-rose: #fb7185;--accent-amber: #fbbf24;--accent-purple: #c084fc;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #64748b;--font-sans: "Inter", -apple-system, sans-serif;--font-mono: "JetBrains Mono", monospace;--glass-blur: blur(20px) saturate(180%);--shadow-glass: 0 15px 35px rgba(0, 0, 0, .45)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);background-image:radial-gradient(at 0% 0%,rgba(56,189,248,.12) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(129,140,248,.12) 0px,transparent 50%),radial-gradient(at 50% 100%,rgba(192,132,252,.08) 0px,transparent 50%);color:var(--text-main);font-family:var(--font-sans);font-size:12px;height:100vh;width:100vw;overflow:hidden;-webkit-user-select:none;user-select:none}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary)}.os-container{display:flex;flex-direction:column;height:100vh;width:100vw;padding:.6rem;gap:.6rem;position:relative}.os-topbar{height:42px;background:var(--bg-capsule);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-glass);border-radius:12px;box-shadow:var(--shadow-glass);display:flex;align-items:center;justify-content:space-between;padding:0 .85rem;z-index:20}.brand-section{display:flex;align-items:center;gap:.6rem}.brand-logo{width:26px;height:26px;background:linear-gradient(135deg,#0284c7,#38bdf8);border-radius:6px;display:flex;align-items:center;justify-content:center;color:#000;font-weight:800;box-shadow:0 0 12px var(--primary-glow)}.brand-title{font-size:.95rem;font-weight:700;letter-spacing:-.2px;color:var(--text-main);display:flex;align-items:center;gap:.4rem}.brand-badge{font-size:.65rem;padding:.12rem .4rem;background:#38bdf826;color:var(--primary);border:1px solid rgba(56,189,248,.35);border-radius:4px;font-family:var(--font-mono);font-weight:600}.workspace-switcher{display:flex;align-items:center;gap:3px;background:#0000004d;padding:3px;border-radius:8px;border:1px solid var(--border-glass)}.ws-btn{display:flex;align-items:center;gap:.4rem;padding:.35rem .75rem;border-radius:6px;font-size:.72rem;font-weight:600;color:var(--text-muted);background:transparent;border:1px solid transparent;cursor:pointer;transition:all .2s ease}.ws-btn:hover{color:var(--text-main);background:var(--bg-glass-hover)}.ws-btn.active{color:#fff;background:linear-gradient(135deg,#0284c7cc,#38bdf8cc);border-color:var(--primary);box-shadow:0 0 12px var(--primary-glow);font-weight:700}.os-topbar-right{display:flex;align-items:center;gap:.75rem;font-family:var(--font-mono);font-size:.72rem}.cmd-trigger-btn{display:flex;align-items:center;gap:.5rem;padding:.3rem .75rem;background:#ffffff0d;border:1px solid var(--border-glass);border-radius:6px;color:var(--text-muted);cursor:pointer;font-size:.72rem;transition:all .2s ease}.cmd-trigger-btn:hover{border-color:var(--primary);color:var(--text-main);background:#ffffff14}.kbd-badge{background:#00000080;border:1px solid var(--border-glass);padding:.1rem .35rem;border-radius:4px;font-size:.65rem;font-family:var(--font-mono);color:var(--primary)}.status-pill{display:flex;align-items:center;gap:.35rem;padding:.25rem .55rem;background:#ffffff0a;border:1px solid var(--border-glass);border-radius:6px;color:var(--text-muted)}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--accent-green);box-shadow:0 0 8px var(--accent-green)}.cmd-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000a6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;display:flex;justify-content:center;align-items:flex-start;padding-top:12vh}.cmd-modal{width:620px;background:#0f172af2;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-glass-accent);border-radius:12px;box-shadow:0 25px 60px #000c;overflow:hidden;display:flex;flex-direction:column}.cmd-input-wrapper{display:flex;align-items:center;padding:.85rem 1.1rem;border-bottom:1px solid var(--border-glass);gap:.75rem}.cmd-input{width:100%;background:transparent;border:none;outline:none;color:var(--text-main);font-size:.95rem;font-family:var(--font-sans)}.cmd-list{max-height:320px;overflow-y:auto;padding:.5rem;display:flex;flex-direction:column;gap:3px}.cmd-item{display:flex;align-items:center;justify-content:space-between;padding:.6rem .85rem;border-radius:6px;color:var(--text-muted);cursor:pointer;font-size:.8rem;transition:all .15s ease}.cmd-item:hover,.cmd-item.active{background:var(--bg-glass-hover);color:var(--text-main)}.cmd-item-group{display:flex;align-items:center;gap:.65rem}.cmd-category{font-size:.65rem;font-family:var(--font-mono);color:var(--primary);text-transform:uppercase}.os-body{flex:1;display:flex;gap:.6rem;overflow:hidden}.left-explorer{width:240px;background:var(--bg-glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-glass);border-radius:12px;box-shadow:var(--shadow-glass);display:flex;flex-direction:column;overflow:hidden}.dock-header{height:32px;background:#ffffff08;border-bottom:1px solid var(--border-glass);display:flex;align-items:center;justify-content:space-between;padding:0 .75rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted)}.tree-view{flex:1;overflow-y:auto;padding:.35rem 0}.tree-section-header{padding:.4rem .75rem .2rem;font-size:.65rem;font-weight:700;text-transform:uppercase;color:var(--text-dim);display:flex;align-items:center;gap:.35rem}.tree-node{display:flex;align-items:center;gap:.45rem;padding:.4rem .75rem .4rem 1.35rem;color:var(--text-muted);cursor:pointer;font-size:.75rem;border-left:2px solid transparent;transition:all .15s ease}.tree-node:hover{background:var(--bg-glass-hover);color:var(--text-main)}.tree-node.active{background:#38bdf81a;color:var(--primary);border-left-color:var(--primary);font-weight:600}.center-workspace{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.view-viewport{flex:1;display:flex;flex-direction:column;overflow-y:auto;gap:.6rem}.right-inspector{width:280px;background:var(--bg-glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-glass);border-radius:12px;box-shadow:var(--shadow-glass);display:flex;flex-direction:column;overflow:hidden}.inspector-section{border-bottom:1px solid var(--border-glass);padding:.75rem}.inspector-title{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--primary);margin-bottom:.55rem;display:flex;align-items:center;gap:.4rem}.property-grid{display:grid;grid-template-columns:95px 1fr;gap:.4rem .5rem;font-size:.72rem;font-family:var(--font-mono)}.prop-key{color:var(--text-dim)}.prop-val{color:var(--text-main);font-weight:500;word-break:break-all}.bottom-dock{height:135px;background:var(--bg-glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-glass);border-radius:12px;box-shadow:var(--shadow-glass);display:flex;flex-direction:column;overflow:hidden}.dock-tabs{height:28px;background:#ffffff08;border-bottom:1px solid var(--border-glass);display:flex;align-items:center;padding:0 .5rem;gap:4px}.dock-tab-btn{padding:.25rem .75rem;font-size:.68rem;font-weight:600;color:var(--text-dim);background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .15s ease}.dock-tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);background:#38bdf814}.console-output{flex:1;overflow-y:auto;padding:.5rem .75rem;font-family:var(--font-mono);font-size:.7rem;line-height:1.5;color:#34d399;background:#02040899}.log-line{display:flex;gap:.6rem}.log-ts{color:var(--text-dim)}.log-tag{color:var(--primary);font-weight:600}.panel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:.6rem}.panel-box{background:var(--bg-glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-glass);border-radius:12px;padding:.75rem;box-shadow:var(--shadow-glass)}.panel-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:.5rem;margin-bottom:.6rem;border-bottom:1px solid var(--border-glass)}.panel-title{font-size:.8rem;font-weight:700;display:flex;align-items:center;gap:.4rem;color:var(--text-main)}.dense-table{width:100%;border-collapse:collapse;font-size:.72rem;text-align:left}.dense-table th{padding:.4rem .6rem;background:#ffffff08;color:var(--text-muted);font-weight:600;border-bottom:1px solid var(--border-glass)}.dense-table td{padding:.45rem .6rem;border-bottom:1px solid rgba(255,255,255,.04);font-family:var(--font-mono)}.dense-table tr:hover{background:var(--bg-glass-hover)}.timeline-container{display:flex;flex-direction:column;gap:.6rem;padding:.25rem 0}.timeline-item{display:flex;gap:.75rem;position:relative;padding-left:1.25rem;border-left:2px solid var(--border-glass)}.timeline-node{position:absolute;left:-5px;top:3px;width:8px;height:8px;border-radius:50%;background:var(--primary);box-shadow:0 0 8px var(--primary-glow)}.timeline-content{background:var(--bg-glass-surface);border:1px solid var(--border-glass);padding:.5rem .75rem;border-radius:8px;width:100%;font-size:.72rem}.control-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .75rem;border-radius:6px;font-size:.7rem;font-weight:600;cursor:pointer;border:1px solid var(--border-glass);background:#ffffff0d;color:var(--text-main);transition:all .2s ease}.control-btn:hover{background:var(--bg-glass-hover);border-color:var(--primary);box-shadow:0 0 10px var(--primary-glow)}.control-btn-primary{background:linear-gradient(135deg,#0284c7,#38bdf8);color:#fff;border-color:#38bdf8}.control-btn-rose{background:linear-gradient(135deg,#e11d48,#fb7185);color:#fff;border-color:#fb7185}.slider-input{width:100%;accent-color:var(--primary);height:4px}
