:root{--surface:#fff;--soft:#eef0ff;--reading:#4b556b;--action-bg:#4f46e5;--action-ink:#fff;color-scheme:light}
:root[data-theme=dark]{--bg:#111827;--ink:#eef2ff;--muted:#aab5cf;--green:#a5b4fc;--border:#334155;--surface:#1b2538;--soft:#242e48;--reading:#c6cee2;--action-bg:#818cf8;--action-ink:#10152b;color-scheme:dark}
body,.panel,header,button,select,textarea,input{transition:background-color .2s,color .2s,border-color .2s}.panel{background:var(--surface)}.secondary,.icon-button{background:var(--surface);color:var(--ink)}.primary{background:var(--action-bg);color:var(--action-ink);border-color:var(--action-bg)}.header-actions{display:flex;align-items:center;gap:12px}.help-button{background:transparent;border:0;color:var(--green);font-size:11px;font-weight:600;padding:7px 0;cursor:pointer;text-align:left}.help-button:hover{text-decoration:underline}.intro-help{margin-top:14px}.controls>.section-label{margin-bottom:6px}.section-help{margin-bottom:20px}.metric-help{text-align:right;padding-bottom:10px}.code-help{color:#67e8f9;margin-top:10px}.code-panel{background:#17213a}.badge{background:var(--soft)}.tip,.game-feedback{background:var(--soft)}.game-top p,.game-rule,.intro p,.explanation>p,.tip p,.narration p{color:var(--reading)}.metrics{background:var(--soft)}.control-heading output{background:var(--soft)}
[data-theme=dark] select,[data-theme=dark] textarea,[data-theme=dark] input[type=number]{background:#131d30;color:var(--ink)}[data-theme=dark] .secondary:hover{background:#2c3653}[data-theme=dark] .bar .value,[data-theme=dark] .bar .index{color:#c6cee2}[data-theme=dark] .bar.settled,[data-theme=dark] .sorted{background:#34d399}[data-theme=dark] .mark{background:#3730a3;color:#e0e7ff}[data-theme=dark] .game-tile{background:#252f48}[data-theme=dark] .game-tile.selected{background:#164458;border-color:#22d3ee}[data-theme=dark] .game-feedback.correct{background:#123d36;color:#a7f3d0}[data-theme=dark] .game-feedback.incorrect{background:#49341e;color:#fde6bc}[data-theme=dark] #error{color:#ffb4a6}[data-theme=dark] footer{color:var(--muted)}[data-theme=dark] .game-tile span,[data-theme=dark] .game-score span{color:var(--muted)}
#helpDialog{width:min(820px,calc(100vw - 32px));max-height:calc(100dvh - 40px);padding:0;border:1px solid var(--border);border-radius:20px;background:var(--surface);color:var(--ink);box-shadow:0 24px 100px #0005;overflow:hidden}#helpDialog[open]{animation:guide-in .24s ease-out}#helpDialog::backdrop{background:#080f24b3;backdrop-filter:blur(5px);animation:backdrop-in .2s ease-out}#helpDialog.closing{animation:guide-out .18s ease-in forwards}#helpDialog.closing::backdrop{animation:backdrop-out .18s ease-in forwards}.help-shell{display:flex;flex-direction:column;max-height:calc(100dvh - 44px)}.help-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 26px 12px}.help-tabs{display:flex;gap:6px;overflow-x:auto;flex-shrink:0;padding:10px 26px 18px;border-bottom:1px solid var(--border)}.help-tabs button{white-space:nowrap;border:1px solid var(--border);border-radius:30px;background:var(--surface);color:var(--reading);padding:9px 13px;font-size:11px}.help-tabs button[aria-pressed=true]{background:var(--action-bg);color:var(--action-ink);border-color:var(--action-bg)}.help-content{overflow-y:auto;overscroll-behavior:contain;padding:22px 30px;min-height:0}.help-content h2{font-size:28px;margin:0 0 14px}.help-content>p{font-size:15px;line-height:1.8;color:var(--reading);margin:0 0 22px}#helpDetails{display:grid;gap:12px}#helpDetails section{border:1px solid var(--border);border-radius:12px;padding:16px 18px;background:var(--soft)}#helpDetails h3{font-size:14px;margin:0 0 8px;color:var(--green)}#helpDetails p{font-size:13px;line-height:1.8;margin:0;color:var(--reading)}.help-bottom{padding:16px 26px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:18px}.help-bottom span{font-size:11px;line-height:1.6;color:var(--muted)}body:has(#helpDialog[open]){overflow:hidden}@keyframes guide-in{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes guide-out{to{opacity:0;transform:translateY(15px) scale(.98)}}@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes backdrop-out{to{opacity:0}}@media(max-width:620px){header{height:auto;min-height:82px;flex-wrap:wrap;gap:12px;padding:16px}.header-actions{gap:10px}.header-actions .secondary{padding:9px 10px;font-size:11px}.help-header,.help-bottom{padding:16px}.help-tabs{padding:8px 16px 14px}.help-content{padding:20px 18px}.help-content h2{font-size:24px}.help-header .section-label{font-size:8px}.help-bottom span{max-width:65%}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Midnight Indigo palette: consistent surfaces and algorithm state colors. */
:root{--bg:#f5f6ff;--ink:#1e2540;--muted:#64708a;--green:#4f46e5;--lime:#67e8f9;--border:#dfe4f2;--unvisited:#b8c2e8;--settled:#059669;--pivot:#f0b75b}
:root[data-theme=dark]{--unvisited:#6574ad;--settled:#34d399;--pivot:#f0b75b}
select,textarea,input[type=number]{background:var(--bg)}.secondary:hover{background:var(--soft)}.mark{background:#4f46e5;color:#e0e7ff}.bar,.idle{background:var(--unvisited)}.bar.active,.active{background:var(--lime)}.bar.settled,.sorted{background:var(--settled)}.bar.pivot{background:var(--pivot)}.bar .value,.bar .index{color:var(--reading)}.game-tile{background:var(--soft)}.game-tile.selected{background:#cffafe;border-color:#0891b2}.game-score strong{color:var(--green)}.game-tile span,.game-score span{color:var(--muted)}.tip{border-left-color:#818cf8}.game-feedback.correct{background:#e5f7ef;color:#065f46}.code-panel{background:#17213a;color:#e0e7ff}.code-heading{color:#b7c1e0}.live-dot{color:#67e8f9}.code-panel li.current{background:#2d3763;color:#a5f3fc}.code-panel li::marker{color:#9ba9d4}.code-panel>p{color:#aab7d7}.local-note span{background:#6366f1}footer{color:var(--muted)}.intro-art i{background:#c7d2fe}.intro-art i:nth-child(2){background:#a5b4fc}.intro-art i:nth-child(3){background:#67e8f9}.intro-art i:nth-child(4){background:#818cf8}.intro-art i:nth-child(5){background:#6366f1}.intro-art i:nth-child(6){background:#4f46e5}:focus-visible{outline-color:#818cf8}

.faq{margin-top:20px;padding:28px}.faq h2{margin:14px 0 10px;font-size:28px}.faq-intro{color:var(--reading);font-size:13px;line-height:1.8;margin-bottom:22px}.faq details{border-top:1px solid var(--border)}.faq summary{position:relative;list-style:none;padding:18px 32px 18px 0;cursor:pointer;font-size:14px;font-weight:600;line-height:1.6}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:'+';position:absolute;right:3px;top:17px;font-size:20px;font-weight:400;color:var(--green)}.faq details[open] summary::after{content:'−'}.faq details[open] summary{color:var(--green)}.faq details p{margin:0 0 20px;max-width:900px;color:var(--reading);font-size:13px;line-height:1.9}.faq details[open] p{animation:faq-reveal .2s ease-out}@keyframes faq-reveal{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@media(max-width:620px){.faq{padding:20px}.faq h2{font-size:24px}}@media(prefers-reduced-motion:reduce){.faq details[open] p{animation:none}}