:root{color-scheme:dark;--bg:#0b0d17;--panel:#171c30;--line:#2b324b;--ink:#eef0ff;--muted:#a9b1ce;--accent:#ffad70}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.9 Tahoma,sans-serif}main{max-width:1000px;margin:auto;padding:28px}header{display:flex;justify-content:space-between;gap:20px;align-items:center}h1{font-size:26px;margin:3px 0 14px}a{color:var(--accent)}.eyebrow,.foot{color:var(--muted);font-size:13px}.notice{border-inline-start:3px solid var(--accent);padding:12px 18px;background:var(--panel)}.controls{display:flex;flex-wrap:wrap;align-items:end;gap:16px;padding:18px 0}.controls>div{margin-inline-end:auto}.controls strong{display:block;font-size:24px;direction:ltr;text-align:right}label{display:flex;flex-direction:column;gap:6px}button,select{font:inherit;min-height:44px;border-radius:8px;border:1px solid var(--line);padding:8px 16px;background:var(--panel);color:var(--ink)}button{cursor:pointer}#spin{background:var(--accent);color:#20170f;font-weight:bold}button:disabled{opacity:.5;cursor:wait}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#status{min-height:29px;color:var(--accent)}.result{padding:24px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.totals{display:flex;gap:25px;justify-content:space-between;flex-wrap:wrap}.totals strong{display:block;font-size:24px;direction:ltr}#board{display:grid;gap:7px;direction:ltr;margin-top:24px;max-width:650px;margin-inline:auto}.symbol{display:flex;justify-content:center;align-items:center;min-height:50px;border:1px solid var(--line);border-radius:8px;font-size:20px;font-weight:bold;background:#20283f}#detail,#ruleNote{color:var(--muted)}details{margin-top:24px}summary{cursor:pointer;padding:8px}pre{direction:ltr;text-align:left;white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel);border-radius:8px;padding:16px;max-height:440px;overflow:auto;font-size:12px}@media(max-width:600px){main{padding:16px}header{align-items:start}h1{font-size:21px}header a{font-size:12px;white-space:nowrap}.controls{gap:12px}.controls>div{width:100%}.result{padding:14px}.totals{gap:12px}.totals strong{font-size:20px}.symbol{min-height:36px;font-size:16px}#board{gap:4px}}