:root{--bg: #05100d;--panel: #0c211c;--panel-2: #123029;--ink: #f4ecdd;--muted: #a7bdb4;--gold: #e4bd76;--gold-deep: #b98f42;--jade: #2f8f6d;--red: #b8443a;--line: rgba(228, 189, 118, .28);--font: "Segoe UI", system-ui, -apple-system, "Hiragino Sans", "Yu Gothic UI", "Noto Sans JP", "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Noto Sans", Arial, sans-serif;--display: Georgia, "Times New Roman", "Songti SC", "Noto Serif JP", "Yu Mincho", serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--font);overscroll-behavior:none;touch-action:manipulation}[hidden]{display:none!important}#app{position:fixed;inset:0;display:flex;flex-direction:column;background:radial-gradient(circle at 50% 20%,#123029,#05100d 70%)}.hud{flex:0 0 auto;display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;padding:max(6px,env(safe-area-inset-top)) 10px 6px;background:linear-gradient(180deg,#040e0bfa,#040e0b9e);border-bottom:1px solid rgba(228,189,118,.16);z-index:4}.round-btn{width:48px;height:48px;flex:0 0 auto;border-radius:14px;border:1px solid var(--line);background:#123029e6;color:var(--ink);font-size:20px;cursor:pointer}.round-badge{display:flex;align-items:baseline;gap:5px;padding:5px 11px;border-radius:12px;border:1px solid var(--line);background:#0b211cdb;min-height:48px;align-content:center;flex-wrap:wrap;flex:0 1 auto;min-width:0}.round-badge b{font-family:var(--display);font-size:22px;color:var(--gold);line-height:1}.round-badge span{font-size:16px;font-weight:700}.round-badge small{font-size:10px;color:var(--muted);white-space:nowrap;letter-spacing:.01em}.scores{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;flex:1 1 100%;order:5;min-width:0}.score-chip{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:3px 6px;border-radius:10px;background:#0a1c18d1;border:1px solid rgba(255,255,255,.07);min-width:0}.score-chip.me{border-color:var(--gold);background:#2a220fb8}.score-chip .who{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;display:flex;gap:4px;align-items:center}.score-chip .wind{font-family:var(--display);color:var(--gold);font-size:12px}.score-chip .pts{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}.score-chip.turn{box-shadow:inset 0 0 0 1px #e4bd768c}.score-chip .riichi-dot{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 6px var(--red)}.wall-count{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--muted);flex:0 0 auto;padding:0 2px}.wall-count b{font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}#stage{position:relative;flex:1 1 auto;min-height:0;width:100%;overflow:hidden;background:#04100d}#scene,#hand-layer{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:fill}#hand-layer{pointer-events:none;background:transparent}.dock{flex:0 0 auto;padding:6px 10px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(0deg,#040e0bfc,#040e0bb8);border-top:1px solid rgba(228,189,118,.16);display:flex;flex-direction:column;gap:6px;z-index:4}.dock-info{font-size:12px;color:var(--muted);min-height:16px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.dock-info b{color:var(--ink);font-weight:700}.dock-info .pill{padding:2px 8px;border-radius:999px;background:#2f8f6d3d;border:1px solid rgba(47,143,109,.5);color:#d5f2e4;font-size:11px;font-weight:700;white-space:nowrap}.dock-info .pill.furiten{background:#b8443a3d;border-color:#b8443a99;color:#ffd9d4}.dock-actions{display:flex;gap:8px;flex-wrap:wrap}button{font-family:inherit}.btn{min-height:48px;min-width:48px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#142f28eb;color:var(--ink);font-size:15px;font-weight:700;cursor:pointer;flex:1 1 auto;transition:transform .08s ease,background .15s ease,opacity .15s ease}.btn:active{transform:scale(.97)}.btn.primary{background:linear-gradient(180deg,#f0cd8c,#c99a4d);color:#23180a;border-color:#f6e0b3;box-shadow:0 6px 18px #c99a4d38}.btn.riichi{background:linear-gradient(180deg,#d1584b,#a5382d);border-color:#ffb6ab}.btn.win{background:linear-gradient(180deg,#4fd2a4,#2e9b74);color:#06231a;border-color:#a9f4d8}.btn.ghost{background:#ffffff0f}.btn:disabled{opacity:.38;cursor:default}.screen{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 32%,#1230296b,#030a08e0 78%),#030a088c;overflow:auto}.screen.modal{background:#030a08d1}.title-inner{width:min(520px,100%);display:flex;flex-direction:column;gap:14px;align-items:stretch;text-align:center}.brand{display:flex;align-items:center;gap:12px;justify-content:center}.brand-mark{width:60px;height:60px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:32px;color:#16200f;background:radial-gradient(circle at 35% 30%,#f6e2b7,#c99a4d);box-shadow:0 8px 24px #c99a4d47}.brand h1{font-family:var(--display);font-size:clamp(21px,5.6vw,34px);line-height:1.1;margin:0;text-align:left;letter-spacing:.01em;color:#f8efdc}.brand p{margin:3px 0 0;font-size:12px;color:var(--muted);text-align:left;letter-spacing:.04em;text-transform:uppercase}.lang-row{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.lang-row button{min-height:48px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#ffffff0d;color:var(--ink);font-size:14px;cursor:pointer}.lang-row button.on{border-color:var(--gold);color:var(--gold);background:#e4bd761f}.title-actions{display:flex;flex-direction:column;gap:10px}.title-actions .primary{min-height:58px;font-size:19px;border-radius:16px;border:1px solid #f6e0b3;background:linear-gradient(180deg,#f3d59a,#c99a4d);color:#23180a;font-weight:800;cursor:pointer}.title-actions .primary:disabled{opacity:.6}.play-hint{margin:0;font-size:12px;color:var(--muted)}.difficulty{display:flex;gap:6px}.difficulty button{flex:1;min-height:48px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:var(--muted);font-size:14px;font-weight:700;cursor:pointer}.difficulty button.on{color:var(--ink);border-color:var(--gold);background:#e4bd7624}.title-links{display:flex;gap:8px}.title-links button{flex:1;min-height:48px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:var(--ink);font-size:14px;cursor:pointer}.about{font-size:11px;color:var(--muted);line-height:1.5;margin:0}.card{width:min(560px,100%);max-height:100%;overflow:auto;position:relative;padding:22px 20px 18px;border-radius:20px;background:linear-gradient(180deg,#102620fa,#071411fc);border:1px solid rgba(228,189,118,.28);box-shadow:0 24px 60px #00000080}.card h2{font-family:var(--display);font-size:clamp(20px,5vw,26px);margin:0 0 10px;color:#f8efdc;padding-right:40px}.card .close{position:absolute;top:10px;right:10px;width:48px;height:48px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:#ffffff0d;color:var(--ink);font-size:18px;cursor:pointer}.modal-body{font-size:14px;line-height:1.6;color:#dbe8e1}.modal-body p{margin:0 0 10px}.modal-body .row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.06)}.modal-body .row label{font-size:14px}.modal-body input[type=range]{width:140px;accent-color:var(--gold)}.modal-actions{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}.modal-actions .btn{flex:1 1 120px}.hand-card{text-align:center}.hand-sub{color:var(--muted);font-size:13px;margin:0 0 10px}.yaku-list{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:10px 0}.yaku-list span{padding:4px 10px;border-radius:999px;background:#e4bd761f;border:1px solid rgba(228,189,118,.3);font-size:12px}.hand-points{font-family:var(--display);font-size:clamp(26px,8vw,38px);color:var(--gold)}.mini-scores{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:10px 0 4px;font-size:12px;color:var(--muted)}.result-place{font-size:15px;color:var(--gold);margin:0 0 10px}.result-table{list-style:none;padding:0;margin:0 0 12px;font-size:14px}.result-table li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 10px;border-radius:10px;margin-bottom:4px;background:#ffffff0a}.result-table li.me{background:#e4bd7624;border:1px solid rgba(228,189,118,.34)}.result-table .r-place{font-family:var(--display);color:var(--gold);width:46px}.result-table .r-name{flex:1;text-align:left}.result-table .r-score{font-variant-numeric:tabular-nums;font-weight:700}.board-list{font-size:12px;color:var(--muted);max-height:180px;overflow:auto}.board-list h3{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:6px 0}.board-list .b-row{display:flex;gap:8px;padding:5px 2px;border-bottom:1px solid rgba(255,255,255,.05)}.board-list .b-row.me{color:var(--gold)}.board-list .b-rank{width:26px}.board-list .b-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-list .b-score{font-variant-numeric:tabular-nums}.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translate(-50%);z-index:40;padding:9px 16px;border-radius:999px;background:#081612f5;border:1px solid var(--line);color:var(--ink);font-size:13px;max-width:min(90vw,460px);text-align:center;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.toast.show{opacity:1;transform:translate(-50%) translateY(-6px)}.call-timer{font-size:11px;color:var(--muted);min-width:88px;text-align:right;align-self:center}.call-hint{font-size:12px;color:var(--gold);align-self:center;margin-right:auto}@media(orientation:landscape)and (max-height:560px){.hud{padding:max(4px,env(safe-area-inset-top)) 8px 4px;gap:6px;flex-wrap:nowrap}.scores{flex:1 1 auto;order:0}.round-btn{width:44px;height:44px}.round-badge{padding:3px 9px;min-height:48px}.score-chip{padding:2px 5px}.score-chip .pts{font-size:12px}.score-chip .who{font-size:9px}.wall-count b{font-size:13px}.dock{padding:4px 8px calc(6px + env(safe-area-inset-bottom));gap:4px}.dock-info{font-size:11px;min-height:14px}.btn{min-height:44px;font-size:14px;padding:0 12px}.card{padding:16px 16px 14px}.title-inner{width:min(760px,100%);display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;align-items:start}.brand,.lang-row{grid-column:1 / -1}.title-actions{grid-column:1}.about{grid-column:2;text-align:left;align-self:center}}@media(max-width:380px){.score-chip .who{font-size:9px}.score-chip .pts{font-size:12px}.wall-count span{display:none}.wall-count b{font-size:13px}}.shop-card{max-width:560px}.shop-preview{position:relative;width:100%;height:170px;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 50% 35%,#1e463ae6,#040e0bf2);border:1px solid rgba(228,189,118,.24);margin-bottom:12px}.shop-preview canvas{display:block;width:100%;height:100%}.shop-preview span{position:absolute;left:12px;bottom:10px;font-family:var(--display);font-size:15px;color:var(--gold);text-shadow:0 2px 6px #000a}.shop-list{display:flex;flex-direction:column;gap:8px}.shop-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);cursor:pointer}.shop-row.sel{border-color:var(--gold);background:#e4bd761a}.shop-row .info{flex:1 1 auto;min-width:0}.shop-row .info strong{display:block;font-size:14px}.shop-row .info small{display:block;font-size:11px;color:var(--muted);line-height:1.35}.shop-row .tag{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.shop-row .act{flex:0 0 auto;min-height:48px;min-width:48px;padding:0 14px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:#142f28eb;color:var(--ink);font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;cursor:pointer}.shop-row .act.primary{background:linear-gradient(180deg,#f0cd8c,#c99a4d);color:#23180a;border-color:#f6e0b3}.shop-row .act[disabled]{opacity:.5;cursor:default}.shop-row .act img{width:18px;height:18px}.shop-note{font-size:11px;color:var(--muted);margin:10px 0 0;line-height:1.45}
