:root{--background:#0a0a0a;--foreground:#ededed;--cell-border:#2a2a2a;--cell-wall:#6b21a8;--cell-visited:#8ec5ff;--cell-path:#f59e0b;--cell-start:#16a34a;--cell-goal:#ef4444;--panel-border:#e5e7eb;--panel-bg:#fafafa;--button-bg:transparent;--button-bg-active:#e5e7eb;--button-border:#d1d5db}@media (prefers-color-scheme:dark){:root{--background:#0a0a0a;--foreground:#ededed;--cell-border:#2a2a2a;--cell-wall:#4c1d95;--cell-visited:#3b82f6;--cell-path:#f59e0b;--cell-start:#16a34a;--cell-goal:#dc2626;--panel-border:#2a2a2a;--panel-bg:#111111;--button-bg-active:#1f2937;--button-border:#303030}}body,html{max-width:100vw;overflow-x:hidden}body{color:var(--foreground);background:var(--background);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;padding:0;margin:0}a{color:inherit;text-decoration:none}@media (prefers-color-scheme:dark){html{color-scheme:dark}}.controls{display:grid;grid-template-columns:1fr 1fr 1fr auto;grid-gap:12px;gap:12px;align-items:center;width:100%;max-width:980px;margin:0 auto 16px;padding:12px;border:1px solid var(--panel-border);border-radius:12px;background:var(--panel-bg)}.controls label{font-weight:600;margin-right:8px;white-space:nowrap}.controls .algos,.controls .modes,.controls .resets,.controls .speed{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.controls button,.controls select{padding:10px 14px;border:1px solid var(--button-border);border-radius:10px;background:var(--button-bg);color:inherit;cursor:pointer;min-height:44px}.controls button.active{background:var(--button-bg-active)}.controls input[type=range]{accent-color:var(--cell-path)}.grid-wrapper{width:100%;max-width:980px;margin:12px auto 0;aspect-ratio:1/1}.grid{display:inline-block;width:100%;height:100%;border:2px solid var(--panel-border);border-radius:6px;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:none}.row{display:flex;flex:1 1}.cell{flex:1 1;aspect-ratio:1/1;border:1px solid var(--cell-border);transition:background-color .12s linear,box-shadow .12s linear}.cell.wall{background:var(--cell-wall)}.cell.visited{background:var(--cell-visited)}.cell.path{background:var(--cell-path)}.cell.start{background:var(--cell-start)}.cell.goal{background:var(--cell-goal)}.cell:focus-visible{outline:2px solid var(--cell-path);outline-offset:-2px}.cell:hover{box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}@media (max-width:900px){.controls{grid-template-columns:1fr 1fr}}@media (max-width:600px){.controls{grid-template-columns:1fr}.controls .speed{justify-content:space-between}}