:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--page:#15181f;--panel:#232832;--panel-strong:#1b2029;--border:#3a4352;--text:#eef2f7;--muted:#a7b0bf;--accent:#3b82f6;--accent-hover:#2563eb;--success:#22c55e;--warning:#f59e0b;--danger:#ef4444}html,body{background:var(--page);min-width:0;height:100%;color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}#app{grid-template-rows:64px minmax(0,1fr);gap:12px;min-width:0;height:100dvh;padding:12px;display:grid}#title-bar{border:1px solid var(--border);background:var(--panel);border-radius:10px;justify-content:space-between;align-items:center;min-width:0;padding:0 20px;display:flex}#title-bar h1{letter-spacing:-.02em;margin:0;font-size:1.35rem}#main-layout{grid-template-columns:112px minmax(0,1fr) minmax(260px,330px);align-items:stretch;gap:12px;min-width:0;min-height:0;display:grid;overflow:hidden}.panel{border:1px solid var(--border);background:var(--panel);border-radius:10px;min-width:0;min-height:0;padding:16px;box-shadow:0 8px 24px #00000024}.panel h2{border-bottom:1px solid var(--border);letter-spacing:.02em;color:var(--muted);margin:0 0 14px;padding-bottom:9px;font-size:.95rem}#tool-panel{flex-direction:column;align-self:start;gap:8px;display:flex}#workspace{grid-template-rows:minmax(0,1fr) minmax(150px,22vh);gap:12px;min-width:0;min-height:0;display:grid}#grid-panel{flex-direction:column;gap:10px;min-width:0;min-height:0;display:flex;overflow:hidden}#canvas-frame{background:#11151c;border:1px solid #465063;border-radius:8px;flex:1;width:100%;min-width:0;height:auto;min-height:0;padding:8px;overflow:hidden}#canvas-container{background:radial-gradient(circle at 50% 40%,#3b82f614,#0000 45%),#12161d;border-radius:6px;place-items:center;width:100%;min-width:0;height:100%;min-height:0;display:grid;overflow:auto}#canvas-container canvas{flex:none;display:block}#simulation-panel{background:0 0;border:0;flex-wrap:wrap;align-items:center;gap:8px;min-width:0;padding:0;display:flex}.simulation-status{border:1px solid var(--border);background:var(--panel-strong);min-width:180px;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;border-radius:999px;margin-right:auto;padding:7px 10px;font-size:.82rem;overflow:hidden}.simulation-status[data-state=running]{color:#86efac;border-color:#22c55ea6}.simulation-status[data-state=completed]{color:#93c5fd;border-color:#3b82f6bf}.simulation-status[data-state=failed]{color:#fcd34d;border-color:#f59e0bb3}#sidebar{grid-template-rows:auto minmax(0,1fr);gap:12px;min-width:0;min-height:0;display:grid;overflow:hidden}#algorithm-panel,#algorithms-panel{grid-template-columns:1fr;gap:8px;display:grid}#description-panel{flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}#description-content{min-height:0;color:var(--muted);line-height:1.55;overflow:auto}#console-panel{flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}#console-output{background:#10141a;border:1px solid #303848;border-radius:7px;flex:1;min-height:0;padding:10px 12px;font:.8rem/1.45 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;overflow:auto}.console-line{overflow-wrap:anywhere;padding:2px 0}.console-line--info{color:#cbd5e1}.console-line--success{color:#86efac}.console-line--warning{color:#fcd34d}.console-line--error{color:#fca5a5}button{min-height:38px;color:var(--text);font:inherit;cursor:pointer;background:#343c49;border:1px solid #4a5568;border-radius:8px;padding:9px 12px;transition:background .12s,border-color .12s,transform .12s,opacity .12s}button:hover:not(:disabled){background:#424c5d;border-color:#64748b}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible{outline-offset:2px;outline:2px solid #60a5fa}button:disabled{cursor:not-allowed;opacity:.45}button.is-selected,button[aria-pressed=true]{background:var(--accent-hover);border-color:#60a5fa;box-shadow:0 0 0 2px #3b82f633}#tool-panel button,.algorithm-button{width:100%}.algorithm-button{text-align:left}.control-button--run{background:#166534;border-color:#22c55eb3}.control-button--run:hover:not(:disabled){background:#15803d}.control-button--stop{border-color:#f59e0ba6}.control-button--clear{color:#fecaca}@media (width<=1050px){#main-layout{grid-template-columns:96px minmax(0,1fr) minmax(230px,280px)}}@media (width<=780px){#app{grid-template-rows:60px auto;height:auto;min-height:100dvh}#main-layout{grid-template-columns:1fr;overflow:visible}#tool-panel{grid-template-columns:repeat(4,minmax(0,1fr));display:grid}#workspace{grid-template-rows:minmax(420px,65vh) 180px}#sidebar{grid-template-rows:auto minmax(200px,auto);overflow:visible}#algorithm-panel,#algorithms-panel{grid-template-columns:repeat(2,minmax(0,1fr))}}.visualizer-canvas{cursor:crosshair;-webkit-user-select:none;user-select:none;touch-action:none}.grid-size-controls{border-left:1px solid var(--border);flex-wrap:wrap;align-items:end;gap:8px;padding-left:8px;display:flex}.grid-size-field{color:var(--muted);gap:4px;font-size:.72rem;display:grid}.grid-size-field input{width:76px;height:38px;color:var(--text);font:inherit;background:#1b2029;border:1px solid #4a5568;border-radius:8px;padding:0 9px}.grid-size-field input:focus-visible{outline-offset:2px;outline:2px solid #60a5fa}.grid-size-apply{white-space:nowrap}#grid-settings-panel .grid-size-controls{border-left:0;padding-left:0}@media (width<=900px){.grid-size-controls{border-top:1px solid var(--border);border-left:0;width:100%;padding-top:8px;padding-left:0}}
