:root { color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { background: #1c1f26; color: #e8eaee; font: 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; overflow: auto; }
#app { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; align-items: flex-start; padding: 8px; }
#stage { position: relative; width: 521px; height: 577px; transform-origin: 0 0; }
#container { user-select: none; -webkit-user-select: none; }
#container img { display: block; }
#side { width: 190px; }
#status { min-height: 2.8em; margin-bottom: 8px; font-weight: 600; color: #f2b441; }
.label { margin: 10px 0 3px; color: #9aa3b2; }
select, button { width: 100%; font: inherit; color: #e8eaee; background: #323846; border: 1px solid #4a5263; border-radius: 6px; padding: 4px 6px; }
select option { background: #323846; }
button { cursor: pointer; }
button:hover, select:hover { border-color: #f2b441; }
.row { margin-top: 6px; }
.check { display: flex; gap: 6px; align-items: center; margin-top: 10px; }
#selMoveList { font-family: ui-monospace, Menlo, Consolas, monospace; }
select option:checked { background: #f2b441 linear-gradient(#f2b441, #f2b441); color: #111; }