:root{--felt:#0d3a2a;--felt-light:#155a40;--felt-dark:#08291e;color:var(--ivory);background:var(--felt);font-synthesis:none;text-rendering:optimizelegibility;font-family:Zen Kaku Gothic New,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{background:radial-gradient(ellipse at 50% -10%, #ffffff14, transparent 50%), radial-gradient(ellipse at 50% 110%, #0000008c, transparent 60%), repeating-linear-gradient(30deg, #ffffff03 0 1px, transparent 1px 5px), var(--felt);min-width:320px;min-height:100vh}button{font:inherit}.app-shell{width:min(1120px,100%);min-height:100vh;margin:0 auto;padding:22px clamp(10px,2.5vw,28px) 28px}.app-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;display:flex}.eyebrow{color:var(--gold);letter-spacing:.3em;margin-bottom:2px;font-size:10px;font-weight:700}h1{letter-spacing:.1em;text-shadow:0 2px 8px #0000008c;font-family:Shippori Mincho B1,serif;font-size:clamp(28px,5vw,42px);line-height:1.1}.subtitle{color:#f7f2e4ad;margin-top:4px;font-size:12px}.speed-chip{color:#f7f2e4cc;white-space:nowrap;background:#00000029;border:1px solid #e8c87959;border-radius:999px;align-items:center;gap:8px;padding:8px 12px;font-size:12px;font-weight:700;display:flex}.pulse-dot{background:#8ce3aa;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #8ce3aa1f}.table-board{background:linear-gradient(135deg, #ffffff0a, transparent 36%), radial-gradient(circle at center, #23764e94, transparent 48%), var(--felt-light);border:1px solid #e8c87952;border-radius:24px;grid-template-columns:minmax(210px,1fr) minmax(190px,.9fr) minmax(210px,1fr);grid-template-areas:".north.""west center east"".south.";gap:12px;min-height:510px;padding:18px;display:grid;box-shadow:inset 0 0 45px #00000040,0 18px 45px #00000052}.river-panel{background:#0000001a;border:1px solid #0000;border-radius:12px;min-width:0;padding:10px;transition:border-color .12s,background .12s}.river-panel.active-player{background:#e8c87912;border-color:#e8c87985}.river-south{grid-area:south}.river-east{grid-area:east}.river-north{grid-area:north}.river-west{grid-area:west}.player-label{color:#f7f2e4d1;align-items:center;gap:7px;margin-bottom:9px;font-size:12px;font-weight:700;display:flex}.wind-badge{background:var(--ivory);width:25px;height:25px;color:var(--ink);box-shadow:0 2px 0 var(--amber);border-radius:50%;place-items:center;font-family:Shippori Mincho B1,serif;font-size:14px;display:grid}.hand-count{color:#f7f2e47a;margin-left:auto;font-size:10px;font-weight:500}.river{grid-template-columns:repeat(6,27px);align-content:start;gap:5px 4px;min-height:105px;display:grid}.river-empty{color:#f7f2e447;letter-spacing:.08em;text-align:center;grid-column:1/-1;align-self:center;font-size:10px}.table-center{aspect-ratio:1;background:linear-gradient(145deg, #ffffff0e, #0000003b), var(--felt-dark);text-align:center;border:1px solid #e8c87973;border-radius:18px;flex-direction:column;grid-area:center;justify-content:center;place-self:center;align-items:center;width:160px;display:flex;box-shadow:inset 0 0 20px #00000040,0 8px 24px #00000047}.round-label{color:var(--gold);letter-spacing:.16em;font-size:11px;font-weight:700}.table-center strong{min-height:24px;margin:6px 0;font-family:Shippori Mincho B1,serif;font-size:16px}.riichi-status{color:var(--gold);letter-spacing:.14em;border:1px solid #e8c8798c;border-radius:999px;margin-bottom:4px;padding:2px 9px;font-family:Shippori Mincho B1,serif;font-size:10px;font-weight:800}.wall-counter{color:#f7f2e49e;align-items:baseline;gap:4px;font-size:11px;display:flex}.wall-counter b{color:var(--ivory);font-family:Shippori Mincho B1,serif;font-size:30px;line-height:1}.table-center small{color:#f7f2e461;margin-top:8px;font-size:9px}.hand-zone{text-align:center;margin-top:18px}.hand{justify-content:center;align-items:flex-end;gap:clamp(2px,.35vw,5px);min-height:76px;padding:8px 5px 12px;display:flex}.hand .tile.drawn{margin-left:clamp(5px,1.2vw,13px)}.hand-hint{min-height:20px;color:var(--gold);letter-spacing:.08em;margin-top:7px;font-size:12px;font-weight:700}.hand-action-buttons{justify-content:center;margin-top:5px;display:flex}.hand-action-buttons .win-button{min-width:156px;box-shadow:0 0 0 2px #e8c87959,0 4px 12px #0000004d}.learning-panel{background:linear-gradient(#ffffff0b,#00000021),#0f4632e0;border:1px solid #e8c8794d;border-radius:16px;grid-template-columns:minmax(230px,.75fr) minmax(340px,1.25fr);gap:12px;margin-top:12px;padding:14px;display:grid;box-shadow:0 10px 28px #0000003d}.learning-metrics{flex-wrap:wrap;grid-column:1/-1;gap:8px;display:flex}.learning-metrics span{color:#f7f2e4b3;background:#00000026;border:1px solid #f7f2e421;border-radius:7px;padding:6px 10px;font-size:11px}.learning-metrics b{color:var(--ivory)}.learning-label{color:var(--gold);letter-spacing:.17em;margin-bottom:6px;font-size:10px;font-weight:700;display:block}.yaku-hints{background:#0000001f;border-radius:11px;min-width:0;padding:11px}.hint-chips{flex-wrap:wrap;gap:6px;display:flex}.hint-chip{color:#f0db9f;background:#e8c8791a;border:1px solid #e8c87947;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:700}.hint-empty{color:#f7f2e466;font-size:11px}.evaluation-card{background:#00000026;border:1px solid #0000;border-radius:11px;min-width:0;padding:11px 12px}.evaluation-card.grade-best{border-color:#e8c8798c}.evaluation-card.grade-good{border-color:#5dbe847a}.evaluation-card.grade-compromise{border-color:#e29f4373}.evaluation-card.grade-bad{border-color:#d663538c}.evaluation-card.is-empty{color:#f7f2e46e;font-size:11px}.evaluation-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.evaluation-heading>div{min-width:0}.evaluation-grade{font-family:Shippori Mincho B1,serif;font-size:17px;line-height:1.55;display:block}.grade-best .evaluation-grade{color:var(--gold)}.grade-good .evaluation-grade{color:#8ce3aa}.grade-compromise .evaluation-grade{color:#f0b66b}.grade-bad .evaluation-grade{color:#f0a195}.evaluation-meta,.evaluation-deltas{color:#f7f2e491;flex-wrap:wrap;gap:5px 12px;margin-top:7px;font-size:9.5px;display:flex}.evaluation-meta b,.evaluation-deltas b{color:#f7f2e4e0}.evaluation-deltas{border-top:1px dashed #f7f2e41f;padding-top:6px}.evaluation-card p{color:#f7f2e4b3;margin-top:7px;font-size:11px;line-height:1.65}.evaluation-riichi{border-radius:999px;padding:3px 8px;font-weight:700;display:inline-block}.evaluation-riichi.declared{color:var(--gold);background:#e8c87926}.evaluation-riichi.missed{color:#f7f2e4c2;background:#f7f2e417}.riichi-wait-panel{background:#e8c87912;border:1px solid #e8c87959;border-radius:11px;grid-column:1/-1;padding:10px 11px}.riichi-wait-list{flex-wrap:wrap;gap:8px;display:flex}.riichi-wait-item{color:#f7f2e4b3;align-items:center;gap:6px;font-size:10px;display:flex}.riichi-wait-item b{color:var(--gold);font-size:12px}.yaku-info-panel{grid-column:1/-1;min-width:0;padding-top:2px}.yaku-info-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.yaku-info-card{background:#00000021;border:1px solid #e8c87933;border-radius:10px;min-width:0;padding:10px}.yaku-info-card h4{color:var(--gold);margin-bottom:4px;font-family:Shippori Mincho B1,serif;font-size:13px}.yaku-info-card p{color:#f7f2e49e;font-size:9.5px;line-height:1.55}.yaku-info-card .yaku-current{color:#f7f2e4db;margin-top:4px;font-weight:700}.yaku-examples{gap:5px;margin-top:7px;display:grid}.yaku-example-row{align-items:center;gap:6px;min-width:0;display:flex}.example-label{color:#f7f2e480;text-align:right;flex:0 0 36px;font-size:8px;font-weight:700}.example-label.ok{color:#8ce3aa}.example-label.ng{color:#f0a195}.example-groups{flex-wrap:wrap;align-items:center;gap:5px;min-width:0;display:flex}.example-group{gap:1px;display:flex}.example-groups small{color:#f7f2e48c;font-size:8px}.feedback-message{color:var(--gold);text-align:center;background:#e8c87917;border:1px solid #e8c87966;border-radius:8px;grid-column:1/-1;padding:7px 10px;font-size:12px;font-weight:700}.action-buttons{grid-column:1/-1;justify-content:center;gap:9px;display:flex}.action-buttons:empty{display:none}.riichi-button,.win-button,.restart-button{cursor:pointer;min-width:136px;color:var(--ink);border:0;border-radius:999px;padding:9px 18px;font-weight:700;box-shadow:0 4px 12px #0000004d}.riichi-button{background:linear-gradient(180deg, #f3db9c, var(--gold))}.riichi-button.is-active{background:linear-gradient(#f5b4a9,#d66353);box-shadow:0 0 0 2px #ffe5de8c,0 4px 12px #0000004d}.win-button{background:linear-gradient(180deg, #fffdf6, var(--ivory-dim));font-family:Shippori Mincho B1,serif;font-size:17px}.round-result{z-index:10;text-align:center;background:linear-gradient(#ffffff0f,#00000024),#104b36;border:1px solid #e8c879a6;border-radius:18px;width:min(720px,100% - 28px);max-height:min(86vh,760px);padding:24px;animation:.2s ease-out result-in;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 20px 70px #000000bf}.round-result h2{margin:2px 0;font-family:Shippori Mincho B1,serif;font-size:38px}.round-result>p{color:#f7f2e4b3;font-size:12px}.discard-history{text-align:left;margin-top:16px}.discard-history h3{color:var(--gold);margin-bottom:8px;font-family:Shippori Mincho B1,serif;font-size:15px}.discard-history ol{gap:8px;list-style:none;display:grid}.discard-history li{color:#f7f2e4a8;background:#00000029;border-radius:9px;padding:10px 11px;font-size:10px;line-height:1.55}.history-title{color:var(--ivory);justify-content:space-between;gap:8px;font-size:12px;display:flex}.history-flag{color:var(--gold);background:#e8c87929;border-radius:999px;margin-top:5px;padding:2px 7px;font-weight:700;display:inline-block}.history-flag.missed{color:#f7f2e4b8;background:#f7f2e41a}.history-empty{color:#f7f2e473;font-size:11px}.round-result .restart-button{background:var(--gold);margin-top:17px}.draw-result{z-index:10;text-align:center;background:linear-gradient(#ffffff0f,#00000024),#104b36;border:1px solid #e8c879a6;border-radius:18px;width:min(350px,100% - 36px);padding:28px;animation:.2s ease-out result-in;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 70px #000000bf}.result-kicker{color:var(--gold);letter-spacing:.24em;font-size:10px;font-weight:700}.draw-result h2{margin:4px 0;font-family:Shippori Mincho B1,serif;font-size:42px}.draw-result p{color:#f7f2e4b8;font-size:13px}.draw-result button{background:var(--gold);color:var(--ink);cursor:pointer;border:0;border-radius:999px;margin-top:20px;padding:10px 30px;font-weight:700;box-shadow:0 4px 12px #00000059}footer{color:#f7f2e461;letter-spacing:.06em;text-align:center;margin-top:18px;font-size:10px}@keyframes result-in{0%{opacity:0;transform:translate(-50%,-47%)scale(.96)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@media (width<=780px){.table-board{border-radius:18px;grid-template-columns:1fr 1fr;grid-template-areas:"north north""west east""center center""south south";min-height:0;padding:10px}.river-panel{padding:8px}.river{grid-template-columns:repeat(6,24px);gap:4px 3px;min-height:88px}.tile.river{--tile-width:24px}.table-center{width:140px;margin:6px 0}.learning-panel{grid-template-columns:1fr}.learning-metrics,.feedback-message,.action-buttons{grid-column:1}.yaku-info-grid{grid-template-columns:1fr 1fr}}@media (width<=480px){.app-shell{padding-top:14px}.app-header{margin-bottom:12px}.subtitle{display:none}.speed-chip{padding:6px 9px;font-size:10px}.table-board{gap:7px}.player-label{gap:5px;margin-bottom:7px}.hand-count{display:none}.river{grid-template-columns:repeat(6,23px);min-height:80px}.tile.hand,.tile.river{--tile-width:23px}.table-center{border-radius:15px;width:124px}.table-center strong{font-size:14px}.wall-counter b{font-size:25px}.hand-zone{margin-top:12px}.hand{gap:2px;min-height:62px;padding-inline:1px}.hand .tile.drawn{margin-left:3px}.hand-action-buttons .win-button{min-width:144px}.learning-panel{border-radius:13px;gap:8px;margin-top:8px;padding:9px}.learning-metrics{gap:5px}.learning-metrics span{text-align:center;flex:1;padding:5px 6px;font-size:9.5px}.yaku-hints,.evaluation-card{padding:9px}.hint-chip{padding:3px 7px;font-size:9.5px}.evaluation-grade{font-size:14px}.evaluation-card p{font-size:10px}.evaluation-meta,.evaluation-deltas{font-size:9px}.yaku-info-grid{grid-template-columns:1fr;gap:6px}.yaku-info-card{padding:9px}.yaku-info-card p{font-size:9px}.yaku-examples{margin-top:5px}.riichi-button,.win-button{min-width:124px;padding:8px 14px}.round-result{padding:18px 13px}.history-title{font-size:11px}}:root{--ivory:#f7f2e4;--ivory-dim:#e9e2cf;--amber:#d9a23e;--chun:#c0392b;--hatsu:#1e7a4c;--pin-blue:#2b4f9e;--ink:#2a241c;--gold:#e8c879}.tile{--tile-width:50px;width:var(--tile-width);min-width:var(--tile-width);height:calc(var(--tile-width) * 1.4);min-height:calc(var(--tile-width) * 1.4);max-height:calc(var(--tile-width) * 1.4);aspect-ratio:auto;background:linear-gradient(180deg, #fffdf6, var(--ivory) 60%, var(--ivory-dim));border-radius:calc(var(--tile-width) * .13);color:var(--ink);cursor:pointer;box-shadow:0 calc(var(--tile-width) * .09) 0 var(--amber), 0 calc(var(--tile-width) * .13) calc(var(--tile-width) * .18) #00000073;-webkit-user-select:none;user-select:none;border:none;flex-direction:column;flex:none;justify-content:center;align-self:end;align-items:center;padding:0;font-family:Shippori Mincho B1,serif;font-weight:800;line-height:1;transition:transform .12s,box-shadow .12s,opacity .12s;display:flex;position:relative}button.tile:hover{transform:translateY(-5px)}button.tile:active{box-shadow:0 2px 0 var(--amber), 0 4px 6px #0006;transform:translateY(3px)}.tile:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.tile .num{font-size:calc(var(--tile-width) * .43);line-height:1.05}.tile .suit{font-size:calc(var(--tile-width) * .28);line-height:1.05}.tile.man .suit{color:var(--chun)}.tile.pin .num,.tile.pin .suit{color:var(--pin-blue)}.tile.sou .num,.tile.sou .suit{color:var(--hatsu)}.tile .honor{font-size:calc(var(--tile-width) * .5)}.tile .honor.chun{color:var(--chun)}.tile .honor.hatsu{color:var(--hatsu)}.tile .haku{border:max(2px, calc(var(--tile-width) * .055)) solid #9fb6d8;border-radius:calc(var(--tile-width) * .09);width:62%;height:72%}.tile.static{cursor:default}.tile.picked-right{box-shadow:0 5px 0 var(--hatsu), 0 0 0 3px var(--hatsu), 0 8px 10px #00000073}.tile.picked-wrong{box-shadow:0 5px 0 var(--chun), 0 0 0 3px var(--chun), 0 8px 10px #00000073}.tile.dim{opacity:.45}.tile.hand{--tile-width:clamp(30px, 5.4vw, 56px)}.tile.river{--tile-width:27px}.tile.mini{--tile-width:30px;box-shadow:0 3px 0 var(--amber), 0 4px 5px #0006;border-radius:4px}.tile.tiny{--tile-width:21px;box-shadow:0 2px 0 var(--amber), 0 3px 4px #00000059;border-radius:3px}.tile.latest-discard{box-shadow:0 3px 0 var(--amber), 0 0 0 2px var(--gold), 0 5px 9px #0000008c;animation:.2s ease-out discard-pop}@keyframes discard-pop{0%{opacity:.4;transform:translateY(-8px)scale(1.08)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=780px){.tile.river{--tile-width:24px}}@media (width<=480px){.tile.hand,.tile.river{--tile-width:23px}}