.sim-root{--bg:#0a0e14;--panel:#111820;--panel-border:#1e2a38;--accent:#00d4ff;--accent2:#ff6b35;--text:#c8d1da;--text-dim:#6b7b8d;--text-bright:#e8eef4;--grid:#1a2330;--danger:#ff4757;--success:#2ed573;--warning:#ffa502;background:var(--bg);color:var(--text);flex-direction:column;height:100vh;font-family:Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:flex;overflow:hidden}.sim-root *{box-sizing:border-box;margin:0;padding:0}.sim-root .header{background:var(--panel);border-bottom:1px solid var(--panel-border);flex-shrink:0;justify-content:space-between;align-items:center;height:48px;padding:0 20px;display:flex}.sim-root .header-left{align-items:center;gap:12px;display:flex}.sim-root .header h1{color:var(--text-bright);letter-spacing:.5px;text-transform:uppercase;font-size:14px;font-weight:600}.sim-root .badge{color:var(--accent);background:#00d4ff1a;border:1px solid #00d4ff33;border-radius:4px;padding:2px 8px;font-size:10px}.sim-root .warning-badge{color:var(--warning);background:#ffa5021a;border:1px solid #ffa50233;border-radius:4px;padding:2px 8px;font-size:10px}.sim-root .header-meta{color:var(--text-dim);font-size:10px}.sim-root .main{flex:1;display:flex;overflow:hidden}.sim-root .viewport{background:radial-gradient(#0f1620 0%,#060a10 100%);flex:1;position:relative}.sim-root #canvas-container{width:100%;height:100%}.sim-root .overlay-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--panel-border);background:#111820eb;border-radius:8px;padding:16px;position:absolute;box-shadow:0 8px 32px #0006}.sim-root .readout-panel{width:280px;max-height:calc(100% - 32px);top:16px;right:16px;overflow-y:auto}.sim-root .readout-panel h3,.sim-root .controls-panel h3{text-transform:uppercase;color:var(--accent);letter-spacing:1px;border-bottom:1px solid var(--panel-border);margin-bottom:12px;padding-bottom:8px;font-size:11px}.sim-root .readout-grid{grid-template-columns:1fr 1fr;gap:8px 12px;font-size:12px;display:grid}.sim-root .readout-item{justify-content:space-between;display:flex}.sim-root .readout-label{color:var(--text-dim)}.sim-root .readout-value{color:var(--text-bright);font-family:SF Mono,ui-monospace,monospace;font-weight:500}.sim-root .readout-value.highlight{color:var(--accent)}.sim-root .readout-value.highlight2{color:var(--accent2)}.sim-root .readout-value.danger{color:var(--danger)}.sim-root .readout-divider{background:var(--panel-border);grid-column:1/-1;height:1px;margin:4px 0}.sim-root .readout-section-title{color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;grid-column:1/-1;margin-top:4px;font-size:10px}.sim-root .controls-panel{width:260px;top:16px;left:16px}.sim-root .control-group{margin-bottom:14px}.sim-root .control-group label{color:var(--text-dim);justify-content:space-between;gap:8px;margin-bottom:6px;font-size:11px;display:flex}.sim-root .control-group input[type=range]{appearance:none;background:var(--panel-border);border-radius:2px;outline:none;width:100%;height:4px}.sim-root .control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;border:2px solid var(--bg);border-radius:50%;width:14px;height:14px}.sim-root .control-group input[type=range]::-moz-range-thumb{background:var(--accent);cursor:pointer;border:2px solid var(--bg);border-radius:50%;width:14px;height:14px}.sim-root .control-value{color:var(--text-bright);white-space:nowrap;font-family:SF Mono,ui-monospace,monospace;font-size:11px}.sim-root .btn-row{gap:8px;margin-top:12px;display:flex}.sim-root .btn{cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:6px;flex:1;padding:8px 12px;font-size:11px;font-weight:600;transition:all .2s}.sim-root .btn-primary{background:var(--accent);color:#000}.sim-root .btn-primary:hover{background:#3df}.sim-root .btn-secondary{background:var(--panel-border);color:var(--text-bright)}.sim-root .btn-secondary:hover{background:#2a3a4d}.sim-root .btn-danger{color:var(--danger);background:#ff475733;border:1px solid #ff47574d}.sim-root .btn-danger:hover{background:#ff47574d}.sim-root .playback-bar{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--panel-border);background:#111820f2;border-radius:8px;align-items:center;gap:12px;padding:10px 20px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.sim-root .playback-btn{background:var(--panel-border);width:36px;height:36px;color:var(--text-bright);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex}.sim-root .playback-btn:hover,.sim-root .playback-btn.active{background:var(--accent);color:#000}.sim-root .time-display{color:var(--accent);text-align:center;min-width:80px;font-family:SF Mono,ui-monospace,monospace;font-size:13px}.sim-root .graph-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--panel-border);background:#111820eb;border-radius:8px;width:320px;height:180px;padding:12px;display:none;position:absolute;bottom:80px;right:16px}.sim-root .graph-panel.visible{display:block}.sim-root .graph-panel h4{text-transform:uppercase;color:var(--text-dim);margin-bottom:8px;font-size:10px}.sim-root .graph-canvas{width:100%!important;height:130px!important}.sim-root .graph-legend{color:var(--text-dim);gap:12px;margin-top:4px;font-size:9px;display:flex}.sim-root .graph-legend span b{font-weight:600}.sim-root .comparison-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--panel-border);background:#111820f2;border-radius:8px;min-width:400px;padding:16px;display:none;position:absolute;top:64px;left:50%;transform:translate(-50%)}.sim-root .comparison-panel.visible{display:block}.sim-root .comparison-panel h3{text-transform:uppercase;color:var(--accent2);letter-spacing:1px;margin-bottom:12px;font-size:11px}.sim-root .comparison-table{border-collapse:collapse;width:100%;font-size:11px}.sim-root .comparison-table th,.sim-root .comparison-table td{text-align:right;border-bottom:1px solid var(--panel-border);padding:6px 10px}.sim-root .comparison-table th:first-child,.sim-root .comparison-table td:first-child{text-align:left;color:var(--text-dim)}.sim-root .comparison-table th{color:var(--text-bright);font-weight:600}.sim-root .comparison-table .case-a{color:var(--accent)}.sim-root .comparison-table .case-b{color:var(--accent2)}.sim-root .physics-info{max-width:300px;color:var(--text-dim);font-size:10px;line-height:1.6;position:absolute;bottom:16px;left:16px}.sim-root .physics-info strong{color:var(--text)}.sim-root .mode-toggle{background:var(--panel);border:1px solid var(--panel-border);z-index:2;border-radius:6px;gap:4px;padding:4px;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%)}.sim-root .mode-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:6px 14px;font-size:11px;transition:all .2s}.sim-root .mode-btn:hover{color:var(--text)}.sim-root .mode-btn.active{background:var(--panel-border);color:var(--text-bright)}.sim-root .phase-strip{z-index:2;pointer-events:none;flex-wrap:wrap;justify-content:center;gap:6px;max-width:calc(100% - 32px);display:flex;position:absolute;top:60px;left:50%;transform:translate(-50%)}.sim-root .phase-chip{letter-spacing:.6px;text-transform:uppercase;border:1px solid var(--panel-border);color:var(--text-dim);background:#111820d9;border-radius:4px;padding:3px 8px;font-family:SF Mono,ui-monospace,monospace;font-size:9px}.sim-root .phase-chip.active{color:#000;background:var(--accent);border-color:var(--accent)}.sim-root ::-webkit-scrollbar{width:6px}.sim-root ::-webkit-scrollbar-track{background:0 0}.sim-root ::-webkit-scrollbar-thumb{background:var(--panel-border);border-radius:3px}.sim-root ::-webkit-scrollbar-thumb:hover{background:#2a3a4d}.sim-root .loading{color:var(--accent);letter-spacing:2px;text-transform:uppercase;font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}