:root{--felt: #0b5a33;--felt-dark: #06261a;--gold: #e3b257;--gold-soft: #f4e7c4;--red: #b3121f;--black: #151515;--green: #0e7a3a;--ink: #f6f1e3;--panel: rgba(4, 24, 15, .72);--line: rgba(244, 231, 196, .75);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;overflow-x:clip}body{min-height:100dvh;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:radial-gradient(ellipse at 35% 40%,#13774a 0%,var(--felt) 35%,var(--felt-dark) 100%) fixed}button{font:inherit;color:inherit;cursor:pointer}.page{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,46vw);height:100dvh}.wheel{position:relative;min-height:0;overflow:hidden}.wheel canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.wheel canvas:active{cursor:grabbing}.top{position:absolute;inset:12px 16px auto;display:flex;align-items:center;gap:16px;flex-wrap:wrap;pointer-events:none}h1{margin:0;font-family:Georgia,Times New Roman,serif;font-weight:700;font-size:clamp(20px,2.6vw,32px);letter-spacing:.02em;color:var(--gold-soft);text-shadow:0 2px 10px rgba(0,0,0,.6)}.history{display:flex;gap:4px;margin:0;padding:0;list-style:none}.history li{min-width:28px;padding:3px 6px;border-radius:6px;font-weight:700;font-size:13px;text-align:center;border:1px solid rgba(255,255,255,.25)}.history li:first-child{outline:2px solid var(--gold)}.history .red{background:var(--red)}.history .black{background:var(--black)}.history .green{background:var(--green)}.view-tools{position:absolute;right:12px;bottom:12px;display:flex;gap:8px}.small{padding:6px 12px;border-radius:999px;border:1px solid rgba(244,231,196,.4);background:#00000059;font-size:13px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.small[aria-pressed=false]{opacity:.55;text-decoration:line-through}.hint{position:absolute;left:16px;bottom:12px;margin:0;max-width:60%;font-size:12px;opacity:.6;pointer-events:none}.result{position:absolute;left:50%;top:16%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;animation:pop .5s cubic-bezier(.2,1.4,.4,1)}.result[hidden]{display:none}.result .num{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;font-family:Georgia,serif;font-size:44px;font-weight:700;border:3px solid var(--gold);box-shadow:0 8px 30px #00000080}.result[data-color=red] .num{background:var(--red)}.result[data-color=black] .num{background:var(--black)}.result[data-color=green] .num{background:var(--green)}.result .won{padding:4px 14px;border-radius:999px;background:var(--gold);color:#2a1a00;font-weight:800}@keyframes pop{0%{transform:translate(-50%) scale(.4);opacity:0}}.side,.dock{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:16px 20px 16px 8px;min-height:0}.dock{padding:0}.table-svg{display:block;width:100%;max-height:46dvh;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.cell rect{fill:transparent;stroke:var(--line);stroke-width:.03}.cell .pip{fill:none}.cell.red .pip{fill:var(--red)}.cell.black .pip{fill:var(--black)}.cell.green rect{fill:var(--green)}.cell.lit rect{fill:#ffe9a047}.cell.marked .pip{stroke:var(--gold);stroke-width:.08}.cell.marked rect{fill:#e3b25759}.cell .label{fill:var(--ink);font-family:Georgia,serif;font-weight:700;font-size:.42px;text-anchor:middle;dominant-baseline:central;pointer-events:none}.cell .label.small{font-family:Inter,system-ui,sans-serif;font-size:.34px;letter-spacing:.01em}.diamond.red{fill:var(--red);stroke:var(--line);stroke-width:.02}.diamond.black{fill:var(--black);stroke:var(--line);stroke-width:.02}.hit{fill:transparent;pointer-events:fill;cursor:pointer}.line-hit:hover{fill:#ffe9a059}.chip{pointer-events:none}.chip-body{stroke:#fff;stroke-width:.05;stroke-dasharray:.12 .1;filter:drop-shadow(0 .04px .04px rgba(0,0,0,.6))}.chip-inner{fill:none;stroke:#ffffff8c;stroke-width:.02}.chip-text{fill:#fff;font-size:.2px;font-weight:800;text-anchor:middle;dominant-baseline:central}.v0{--chip: #f2f2f2;--chip-ink: #222}.v1{--chip: #c8102e;--chip-ink: #fff}.v2{--chip: #1d7a3d;--chip-ink: #fff}.v3{--chip: #1a1a1a;--chip-ink: #fff}.v4{--chip: #6c2bb5;--chip-ink: #fff}.chip-body{fill:var(--chip)}.chip-body.v0~.chip-text{fill:#222}.chips{display:flex;justify-content:center;gap:10px}.chip-button{width:52px;height:52px;border-radius:50%;border:4px dashed rgba(255,255,255,.85);background:var(--chip);color:var(--chip-ink);font-weight:800;box-shadow:0 3px 8px #00000073;transition:transform .15s}.chip-button[aria-pressed=true]{transform:translateY(-5px) scale(1.08);outline:3px solid var(--gold);outline-offset:2px}.actions{display:grid;grid-template-columns:repeat(3,1fr) 1.6fr;gap:8px}.actions button{padding:10px 8px;border-radius:10px;border:1px solid rgba(244,231,196,.35);background:#0000004d;font-weight:600}.actions .spin{background:linear-gradient(180deg,#f2c86a,#c98a1f);color:#2a1a00;font-weight:800;font-size:18px;letter-spacing:.06em;text-transform:uppercase;border-color:#ffe3a3}button:disabled{opacity:.4;cursor:default}.meters{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.meter{display:flex;flex-direction:column;padding:8px 12px;border-radius:10px;background:var(--panel)}.meter .label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;opacity:.7}.meter .value{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}.message{margin:0;color:#ffd27a;text-align:center}.refill{padding:10px;border-radius:10px;border:0;background:var(--red);font-weight:700}.refill[hidden],.message[hidden]{display:none}@media(max-aspect-ratio:1/1){.page{grid-template-columns:minmax(0,1fr);grid-template-rows:46dvh auto;height:auto}.side{padding:12px 16px 0;gap:12px}.table-svg{max-height:none;width:min(100%,440px);margin:0 auto}.dock{position:sticky;bottom:0;gap:8px;margin:0 -16px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#03160eeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid rgba(244,231,196,.2)}.chips{gap:6px}.chip-button{width:42px;height:42px;font-size:12px;border-width:3px}.actions button{padding:8px 6px}.actions .spin{font-size:16px}.meter{padding:4px 10px}.meter .value{font-size:15px}.hint{display:none}}