*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background:#141127;color:#eee;display:flex;justify-content:center}
main{width:100%;max-width:440px;padding:14px}h1{font-size:22px;margin:6px 0}h2{font-size:17px;margin:14px 0 6px}
button,.btn{background:#8b7bff;color:#fff;border:0;border-radius:10px;padding:11px 16px;font-size:16px;margin:4px 4px 4px 0;cursor:pointer;text-decoration:none;display:inline-block}
button.alt{background:#2f2a52}button:disabled{opacity:.4}input{font-size:16px;padding:10px;border-radius:8px;border:0;width:100%}
.card{background:#211c3d;border-radius:12px;padding:12px;margin:10px 0}.muted{color:#aaa;font-size:14px}
.board{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin:10px 0}
.t{aspect-ratio:1;border-radius:8px;background:#2f2a52;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;position:relative;user-select:none}
.t.o0{background:#3b6dd8}.t.o1{background:#d8503b}.t.legal{outline:2px dashed #ffe066;cursor:pointer}.t.sel{outline:3px solid #fff;background:#6f5f00}
.t.key{outline:3px solid #7CFC00}.pc{position:absolute;font-size:22px}.hud{display:flex;justify-content:space-between;font-size:15px}
.bar{height:6px;background:#8b7bff;border-radius:3px;transition:width .2s linear}table{width:100%;border-collapse:collapse;font-size:13px}td,th{padding:4px;border-bottom:1px solid #333;text-align:left}
.big{font-size:28px;font-weight:800}