*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,sans-serif;background:#1a1a2e;color:#eee;min-height:100vh}#app{display:flex;flex-direction:column;height:100vh}header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#16213e;border-bottom:1px solid #0f3460}header h1{font-size:1.5rem;font-weight:600}#sim-selector{padding:.5rem 1rem;font-size:1rem;background:#0f3460;color:#eee;border:1px solid #e94560;border-radius:4px;cursor:pointer}main{display:flex;flex:1;overflow:hidden}#canvas-container{flex:1;display:flex;justify-content:center;align-items:center;background:#0a0a12;padding:1rem}#sim-canvas{background:#000;border:2px solid #0f3460;border-radius:8px;max-width:100%;max-height:100%}#controls{width:280px;background:#16213e;padding:1rem;display:flex;flex-direction:column;gap:1.5rem;overflow-y:auto;border-left:1px solid #0f3460}#controls section{display:flex;flex-direction:column;gap:.5rem}#playback{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}#controls button{padding:.5rem 1rem;font-size:.875rem;background:#0f3460;color:#eee;border:1px solid #0f3460;border-radius:4px;cursor:pointer;transition:all .2s}#controls button:hover{background:#e94560;border-color:#e94560}#controls button:disabled{opacity:.5;cursor:not-allowed}.slot-buttons{display:flex;gap:.25rem}.slot{width:28px;height:28px;padding:0;font-size:.75rem;border-radius:4px;transition:all .2s;border:1px solid #333}.slot:not(.has-data){background:#1a1a2e;color:#666}.slot.has-data{background:#4ade80;color:#000;border-color:#4ade80;font-weight:600}.slot.is-loaded{box-shadow:0 0 0 2px #fff}#config-slots.mode-save .slot:not(.has-data){background:#60a5fa;border-color:#60a5fa;color:#000;cursor:pointer}#config-slots.mode-save .slot:not(.has-data):hover{background:#93c5fd}#config-slots.mode-delete .slot.has-data{background:#f87171;border-color:#f87171;color:#000;cursor:pointer}#config-slots.mode-delete .slot.has-data:hover{background:#fca5a5}#config-slots.mode-save{border-left:3px solid #60a5fa;padding-left:8px;margin-left:-11px}#config-slots.mode-delete{border-left:3px solid #f87171;padding-left:8px;margin-left:-11px}.slot-actions{display:flex;gap:.5rem}.slot-actions button{flex:1;font-size:.75rem}#save-slot-btn.active{background:#60a5fa;border-color:#60a5fa;color:#000}#delete-slot-btn.active{background:#f87171;border-color:#f87171;color:#000}#config-slots.mode-save .slot.has-data,#config-slots.mode-delete .slot:not(.has-data){opacity:.4;cursor:not-allowed;pointer-events:none}#stats{margin-top:auto;padding-top:1rem;border-top:1px solid #0f3460;font-family:monospace;font-size:.875rem;color:#888}.param-row{display:flex;flex-direction:column;gap:.25rem}.param-row label{font-size:.75rem;color:#aaa}.param-row input[type=range]{width:100%}.param-row .param-value{font-size:.75rem;font-family:monospace;color:#e94560}