:root{--bg: #0f2a27;--felt: #17423c;--felt2: #1d5049;--card: #18332f;--card2: #21403b;--line: #2e5550;--ink: #eef5f2;--muted: #9fb8b2;--accent: #f0b429;--accent-ink: #2b1d00;--good: #3ecf8e;--bad: #ff6b6b;--teal: #1f7a6c;--radius: 14px;--tile-w: calc(min(100vw, 520px) / 15.2);--safe-b: env(safe-area-inset-bottom, 0px);color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100%}body{background:var(--bg);color:var(--ink);font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;overscroll-behavior:none}button{font:inherit;color:inherit}input{font:inherit;color:var(--ink);background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:8px 10px}a{color:var(--accent)}.app{max-width:520px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}.screen{flex:1;padding-bottom:calc(68px + var(--safe-b))}.app.full .screen{padding-bottom:0}.page{padding:16px;display:flex;flex-direction:column;gap:12px}h1{font-size:24px;margin:4px 0}h2{font-size:18px;margin:8px 0 2px}.muted{color:var(--muted)}.small{font-size:13px}.mono{font-family:ui-monospace,monospace;word-break:break-all}.center-text{text-align:center}.center-col{align-items:center;text-align:center;padding-top:60px}.big-emoji{font-size:56px}.error{color:var(--bad)}.pos{color:var(--good)}.neg{color:var(--bad)}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:520px;display:flex;background:#0b211e;border-top:1px solid var(--line);padding-bottom:var(--safe-b);z-index:20}.tab{flex:1;background:none;border:0;padding:8px 0 6px;display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--muted)}.tab.on{color:var(--accent)}.ti{font-size:20px;line-height:1}.tl{font-size:11px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;text-align:left;display:flex;flex-direction:column;gap:8px}button.card{cursor:pointer}button.card:active{transform:scale(.99)}.card-t{font-weight:700;font-size:16px}.card.cta{background:linear-gradient(135deg,#2a6d5f,#1f4f47);border-color:#3a8a7a}.card.daily{background:linear-gradient(135deg,#5a3f0a,#3b2a08);border-color:#8a6618}.ghost-card{background:transparent}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat .big{font-size:22px;font-weight:800}.btn{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:10px 14px;cursor:pointer;text-align:center;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn:disabled{opacity:.45}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}.btn.ghost{background:transparent}.btn.wide{width:100%;padding:13px}.btn.icon{padding:6px 10px;border-radius:10px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.seg{display:flex;gap:6px}.seg.col{flex-direction:column}.seg button{flex:1;background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:10px;cursor:pointer;display:flex;align-items:center;gap:10px;justify-content:center}.seg button.on{border-color:var(--accent);background:#3a3214}.seg.small button{padding:6px 12px}.preview-tiles{display:inline-flex;gap:2px}.preview-tiles img{width:22px}.hero{text-align:center;padding:18px 0 6px}.hero-tiles{display:flex;justify-content:center;gap:4px}.brand{font-size:34px;letter-spacing:-.5px;margin:8px 0 0}.beta{font-size:11px;vertical-align:super;color:var(--accent);margin-left:4px;text-transform:uppercase}.tile{display:inline-block;flex:none;user-select:none;-webkit-user-drag:none;transition:transform .08s}.tile.hand{width:var(--tile-w)}.tile.pond{width:calc(var(--tile-w) * .62)}.tile.small{width:22px}.tile.meld{width:calc(var(--tile-w) * .8)}.tile.rot{transform:rotate(-90deg);margin:0 calc(var(--tile-w) * .11)}.tile.small.rot{margin:0 4px}.tile.pond.rot{margin:0 calc(var(--tile-w) * .07)}.tile.dim{opacity:.4}.tile.sel{transform:translateY(-10px)}.tile.hl{filter:drop-shadow(0 0 4px var(--accent))}.tile.click{cursor:pointer}.tile-row{display:flex;flex-wrap:wrap;gap:2px;align-items:flex-end}.hand-row{justify-content:center;padding:14px 0 4px}.table-wrap{height:100dvh;display:flex;flex-direction:column;background:radial-gradient(ellipse at center,var(--felt2),var(--felt) 70%,#10302b);overflow:hidden}.topbar{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#0003}.round-info{flex:1;font-size:14px}.dora{display:flex;align-items:center;gap:2px}.timer-wrap{display:flex;align-items:center;gap:6px}.timer{font-weight:800;min-width:26px;text-align:center;color:var(--accent)}.timer.low{color:var(--bad)}.board{position:relative;flex:1;min-height:0}.center{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:46%;aspect-ratio:1;background:#00000040;border-radius:12px}.seat-label{position:absolute;display:flex;align-items:center;gap:4px;font-size:12px;white-space:nowrap}.seat-label .wind{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:#0d2522;font-weight:800}.seat-label .wind.dealer{background:var(--accent);color:var(--accent-ink)}.seat-label.active .pts{color:var(--accent)}.seat-label .pts{font-weight:700}.seat-label .nm{color:var(--muted);max-width:70px;overflow:hidden;text-overflow:ellipsis}.seat-label.seat-0{bottom:6px;left:50%;transform:translate(-50%)}.seat-label.seat-2{top:6px;left:50%;transform:translate(-50%)}.seat-label.seat-1{top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:right center;right:22px}.seat-label.seat-3{top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:left center;left:22px}.seat-label.seat-1,.seat-label.seat-3{flex-direction:row}.riichi-stick{width:22px;height:4px;background:#fff;border-radius:2px;position:relative}.riichi-stick:after{content:"";position:absolute;left:9px;top:0;width:4px;height:4px;background:var(--bad);border-radius:50%}.opp{position:absolute}.opp-2{top:4px;right:8px}.opp-1{right:2px;bottom:6px}.opp-3{left:2px;top:30px}.opp-melds{display:flex;flex-direction:column;gap:3px}.meld{display:inline-flex;align-items:flex-end;gap:1px;margin-right:6px}.kakan-stack{position:relative;display:inline-block}.kakan-top{position:absolute;left:0;bottom:100%}.me{padding:6px 4px calc(8px + var(--safe-b));background:linear-gradient(to top,rgba(0,0,0,.35),transparent)}.status-row{display:flex;justify-content:space-between;align-items:center;padding:0 8px;min-height:26px;font-size:13px}.status{color:var(--muted)}.shanten-pill{background:#0000004d;border-radius:99px;padding:2px 8px;display:inline-flex;align-items:center;gap:3px}.actions{display:flex;justify-content:flex-end;gap:8px;padding:4px 8px;min-height:48px;flex-wrap:wrap}.btn.act{padding:10px 16px;font-weight:800;border-radius:12px;background:#20403b}.btn.act.win{background:var(--bad);border-color:var(--bad);color:#fff}.btn.act.riichi{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.btn.act.call{background:#2e6ad1;border-color:#2e6ad1;color:#fff}.my-melds{display:flex;justify-content:flex-end;padding:0 6px;min-height:0}.hand{display:flex;justify-content:center;align-items:flex-end;padding:12px 2px 4px}.hand-slot{position:relative;display:inline-flex}.hand-slot.up .tile{transform:translateY(-12px)}.drawn-gap{width:8px}.hint-dot{position:absolute;top:-16px;left:50%;transform:translate(-50%);font-size:10px;padding:0 4px;border-radius:6px}.hint-dot.good{background:var(--good);color:#062}.hint-dot.bad{background:var(--bad);color:#fff}.overlay{position:fixed;inset:0;background:#0000008c;display:flex;align-items:flex-end;justify-content:center;z-index:50}.sheet{background:var(--card);width:100%;max-width:520px;max-height:92dvh;overflow:auto;border-radius:18px 18px 0 0;padding:18px 16px calc(16px + var(--safe-b));display:flex;flex-direction:column;gap:10px}.sheet-title{font-weight:800;font-size:18px;text-align:center}.win-block{background:var(--card2);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:6px}.win-hand{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1px}.yaku-list{list-style:none;margin:0;padding:0}.yaku-list li{display:flex;justify-content:space-between;padding:2px 0;border-bottom:1px dashed var(--line)}.win-total{text-align:right;font-size:18px}.limit{color:var(--accent)}.tenpai-row{display:flex;flex-wrap:wrap;gap:8px;font-size:13px}.tenpai-row .tp{color:var(--good)}.tenpai-row .nt{color:var(--muted)}.deltas{display:flex;flex-direction:column;gap:2px}.delta-row{display:grid;grid-template-columns:1fr 80px 70px;gap:6px;text-align:right}.delta-row span:first-child{text-align:left}.final-row{display:grid;grid-template-columns:34px 1fr 70px 60px;align-items:center;padding:8px;border-radius:10px;text-align:right}.final-row .nm{text-align:left}.final-row.me{background:#2e4b2a}.medal{font-size:22px;text-align:center}.unit h2{margin-top:12px}.lesson-row{width:100%;display:flex;gap:10px;align-items:center;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;margin-top:6px;cursor:pointer}.lesson-row.done{border-color:#2e6b4f}.lesson-row .check{color:var(--good);width:18px}.lesson-row .lt{flex:1;display:flex;flex-direction:column}.lesson-top{display:flex;align-items:center;gap:10px}.progress{flex:1;height:8px;background:var(--card2);border-radius:99px;overflow:hidden}.progress div{height:100%;background:var(--good);transition:width .2s}.step{display:flex;flex-direction:column;gap:10px}.rich p{margin:0 0 8px}.choices{display:flex;flex-direction:column;gap:8px}.choice{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:12px;text-align:left;cursor:pointer}.choice.ok{border-color:var(--good);background:#1d4634}.choice.bad{border-color:var(--bad);background:#4a2323}.feedback{border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:6px}.feedback.ok{background:#1a3d2f;border:1px solid #2e6b4f}.feedback.bad{background:#3d2020;border:1px solid #6b2e2e}.sticky-cta{position:sticky;bottom:calc(76px + var(--safe-b))}.kind-picker{display:flex;flex-direction:column;gap:4px}.kind-picker .tile.small{width:30px}.context{background:#0003;border-radius:10px;padding:8px}.yaku-card{cursor:pointer}.gloss-row{padding:8px 0;border-bottom:1px solid var(--line)}.search{width:100%}.prompt{font-weight:700;font-size:16px}.pz-info{display:flex;align-items:center;gap:4px;flex-wrap:wrap}table.rank{width:100%;border-collapse:collapse;font-size:13px}table.rank th,table.rank td{padding:3px 4px;border-bottom:1px solid var(--line);text-align:center}.code{font-family:ui-monospace,monospace;color:var(--accent);letter-spacing:2px}.code-input{flex:1;text-transform:uppercase;letter-spacing:4px;font-family:ui-monospace,monospace;font-size:20px;text-align:center}.hist-row{display:grid;grid-template-columns:28px 1fr 60px 80px;gap:6px;align-items:center;padding:4px 0;border-bottom:1px solid var(--line)}@media (min-width: 521px){.app{border-left:1px solid var(--line);border-right:1px solid var(--line)}}.tile img{display:block;width:100%;height:auto;pointer-events:none}.tile.big{width:48px}.tile.pond{width:var(--pond-w)}.tile.pond.rot{margin:0 calc(var(--pond-w) * .12)}:root{--pond-w: calc(min(100vw, 520px) / 19)}.board-area{flex:1;min-height:0;display:flex;align-items:center;justify-content:center}.board{position:relative;width:min(100vw,520px,calc(100dvh - 300px));aspect-ratio:1;flex:none}.side{position:absolute;inset:0;pointer-events:none}.side-1{transform:rotate(-90deg)}.side-2{transform:rotate(180deg)}.side-3{transform:rotate(90deg)}:root{--pond-w: calc(min(100vw, 520px, calc(100dvh - 300px) ) / 13.5)}.side .river{position:absolute;left:50%;top:66%;transform:translate(-50%);width:calc(var(--pond-w) * 6 + 5px);display:flex;flex-wrap:wrap;gap:1px;align-content:flex-start;grid-template-columns:none}.side .tile.pond{width:var(--pond-w)}.side .tile.pond.rot{margin:0 calc(var(--pond-w) * .14)}.center-box{position:absolute;left:32%;top:32%;width:36%;height:36%;background:#0000004d;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center}.cb-round{font-size:13px;font-weight:700}.cb-left{font-size:20px;font-weight:800;color:var(--accent)}.side .seat-label{position:absolute;inset:58.5% auto auto 50%;transform:translate(-50%);font-size:11px}.side .seat-label .nm{max-width:60px}.side .riichi-stick{position:absolute;left:50%;top:63.5%;transform:translate(-50%);width:40px}.side-melds{position:absolute;right:2px;bottom:2px;display:flex;flex-direction:row-reverse;gap:4px}.side-melds .tile.small{width:calc(var(--pond-w) * .85)}.hero-tiles{margin-bottom:4px}.hero .tile.pond{width:36px}:root{--pond-w: calc(min(100vw, 520px, calc(100dvh - 300px) ) / 15)}.center-box{left:33%;top:33%;width:34%;height:34%}.side .seat-label{top:59.5%}.side .river{top:68.5%}.side .riichi-stick{top:65.2%}.hist-row{background:none;border:0;border-bottom:1px solid var(--line);width:100%;text-align:left;cursor:pointer}.review-counts{display:flex;flex-direction:column;gap:2px;font-size:12px;text-align:right}.rc .ri,.badge{display:inline-block;min-width:22px;text-align:center;border-radius:6px;padding:0 4px;font-weight:800}.best .ri,.badge.best{background:#2e7d5b}.good .ri,.badge.good{background:#3c6e5f}.inacc .ri,.badge.inacc{background:#b38a1b;color:#221}.mistake .ri,.badge.mistake{background:#c96a2b}.blunder .ri,.badge.blunder{background:#c0392b}.review-row{cursor:pointer}.big{font-size:28px;font-weight:800}