:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f4efe6;--ink-2:#f4efe6b3;--ink-3:#f4efe670;--bg:#0b1411;--bg-2:#0f1d19;--glass:#09110f9e;--glass-strong:#070d0ce0;--line:#ffeecd1f;--line-2:#ffeecd38;--gold:#e3b04b;--gold-2:#f3cf82;--gold-soft:#e3b04b29;--verm:#e2462f;--verm-2:#ff7058;--jade:#3fbf8f;--jade-deep:#0f5a4c;--sky:#6fb3ee;--serif:"Noto Serif TC", "Songti TC", "Songti SC", "STSong", "Noto Serif CJK TC", "Hiragino Mincho ProN", "Yu Mincho", Georgia, serif;--sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang TC", "Hiragino Sans", "Noto Sans CJK TC", sans-serif;--num:ui-rounded, "SF Pro Rounded", -apple-system, "Segoe UI", Roboto, sans-serif;--r:14px;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px)}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;margin:0;font-size:15px}*{box-sizing:border-box}button{font:inherit;color:inherit;cursor:pointer;-webkit-user-select:none;user-select:none}button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}#root{background:radial-gradient(120% 80% at 50% 110%, #0f5a4c73, transparent 60%), radial-gradient(90% 60% at 50% -10%, #e3b04b14, transparent 60%), var(--bg);position:fixed;top:0;bottom:0;left:0;right:0;overflow:hidden}.screen{-webkit-overflow-scrolling:touch;padding:calc(var(--safe-t) + 18px) calc(var(--safe-r) + 18px) calc(var(--safe-b) + 24px) calc(var(--safe-l) + 18px);position:absolute;top:0;bottom:0;left:0;right:0;overflow-y:auto}.screen-inner{flex-direction:column;gap:22px;max-width:980px;margin:0 auto;display:flex}.home{place-items:center;min-height:100%;display:grid}.home-card{flex-direction:column;align-items:stretch;gap:26px;width:min(460px,100%);display:flex}.lang-pick{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.lang-pick button{border:1px solid var(--line);min-height:40px;color:var(--ink-2);background:#ffffff0a;border-radius:999px;padding:7px 12px;font-size:14px}.lang-pick button.on{border-color:var(--gold);background:var(--gold-soft);color:var(--ink);font-weight:700}.lang-pick button:active{transform:scale(.97)}.brand{text-align:center;flex-direction:column;align-items:center;gap:6px;display:flex}.brand-tiles{gap:6px;margin-bottom:14px;display:flex}.brand-tiles img{filter:drop-shadow(0 6px 10px #00000073);width:44px;animation:.7s cubic-bezier(.2,.9,.3,1.2) both tile-in}.brand-tiles img:nth-child(2){animation-delay:70ms}.brand-tiles img:nth-child(3){animation-delay:.14s}.brand-tiles img:nth-child(4){animation-delay:.21s}@keyframes tile-in{0%{opacity:0;transform:translateY(18px)rotate(-6deg)}to{opacity:1;transform:none}}.brand h1{font-family:var(--serif);letter-spacing:.01em;text-wrap:balance;margin:0;font-size:clamp(40px,11vw,60px);font-weight:900;line-height:1}.brand .cjk{font-family:var(--serif);letter-spacing:.5em;color:var(--gold);margin-right:-.5em;font-size:20px;font-weight:900}.brand p{color:var(--ink-2);margin:4px 0 0}.menu{flex-direction:column;gap:12px;display:flex}.menu-btn{text-align:left;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(#ffffff0d,#ffffff04);grid-template-columns:1fr auto;align-items:center;gap:4px 12px;padding:16px 18px;transition:transform .16s,border-color .16s,background .16s;display:grid}.menu-btn:active{transform:scale(.985)}.menu-btn:hover{border-color:var(--line-2)}.menu-btn strong{font-size:18px;font-weight:700}.menu-btn span{color:var(--ink-2);grid-column:1;font-size:13.5px}.menu-btn .chev{color:var(--ink-3);grid-area:1/2/span 2;font-size:22px}.menu-btn.primary{background:linear-gradient(#e3b04b33,#e3b04b0f);border-color:#e3b04b8c}.menu-btn.primary strong{color:var(--gold-2)}.home-foot{justify-content:center;gap:10px;display:flex}.chip-btn{border:1px solid var(--line);color:var(--ink-2);background:#ffffff0a;border-radius:999px;padding:9px 16px;font-size:14px}.chip-btn:active{transform:scale(.97)}.bar{align-items:center;gap:12px;display:flex}.bar h2{text-wrap:balance;margin:0;font-size:22px;font-weight:800}.icon-btn{border:1px solid var(--line);background:#ffffff0a;border-radius:12px;flex:none;place-items:center;width:40px;height:40px;font-size:18px;display:grid}.variants{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;display:grid}.variant{text-align:left;border:1px solid var(--line);background:linear-gradient(170deg,#0f5a4c38,#ffffff05);border-radius:16px;flex-direction:column;gap:10px;padding:16px;transition:border-color .18s,transform .18s,background .18s;display:flex;position:relative}.variant.on{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset, 0 10px 30px #00000059;background:linear-gradient(170deg,#e3b04b33,#0f5a4c2e)}.variant:active{transform:scale(.99)}.variant .v-tiles{align-items:flex-end;gap:4px;height:46px;display:flex}.variant .v-tiles img{width:30px}.variant .native{font-family:var(--serif);font-size:26px;font-weight:900;line-height:1.1}.variant .name{color:var(--gold-2);letter-spacing:.02em;font-size:14px;font-weight:700}.variant ul{color:var(--ink-2);flex-direction:column;gap:3px;margin:0;padding-left:18px;font-size:13px;display:flex}.variant .beta{letter-spacing:.04em;color:#a9d3f7;background:#6fb3ee29;border-radius:999px;align-self:flex-start;padding:3px 8px;font-size:11px;font-weight:800}.variant .check{background:var(--gold);color:#1a1204;border-radius:50%;place-items:center;width:24px;height:24px;font-size:14px;font-weight:900;display:grid;position:absolute;top:12px;right:12px}.panel{border:1px solid var(--line);background:#ffffff06;border-radius:16px;padding:6px 16px}.panel h3{text-transform:uppercase;letter-spacing:.12em;color:var(--ink-3);margin:12px 0 4px;font-size:12px}.opt{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;padding:12px 0;display:flex}.opt:last-child{border-bottom:0}.opt label{flex:160px;font-size:14.5px}.seg{border:1px solid var(--line);background:#ffffff0d;border-radius:11px;flex-wrap:wrap;gap:4px;padding:3px;display:inline-flex}.seg button{color:var(--ink-2);white-space:nowrap;background:0 0;border:0;border-radius:8px;padding:7px 11px;font-size:13px}.seg button.on{background:var(--gold);color:#1b1305;font-weight:700}.toggle{border:1px solid var(--line-2);background:#ffffff14;border-radius:999px;flex:none;width:50px;height:30px;position:relative}.toggle:after{content:"";background:var(--ink);border-radius:50%;width:22px;height:22px;transition:transform .18s;position:absolute;top:3px;left:3px}.toggle.on{background:var(--jade);border-color:var(--jade)}.toggle.on:after{transform:translate(20px)}input[type=text],input[type=range]{font:inherit}input[type=text]{border:1px solid var(--line-2);width:100%;color:var(--ink);background:#00000040;border-radius:11px;padding:11px 13px}input[type=range]{accent-color:var(--gold);width:min(200px,100%)}.sticky-cta{background:linear-gradient(180deg, transparent, var(--bg) 35%);padding-top:12px;position:sticky;bottom:0}.cta{color:#1b1305;background:linear-gradient(#f0c566,#d59b33);border:0;border-radius:14px;width:100%;padding:16px;font-size:17px;font-weight:800;box-shadow:0 10px 28px #e3b04b47}.cta:active{transform:translateY(1px)}.cta:disabled{opacity:.45;box-shadow:none}.cta.ghost{color:var(--ink);border:1px solid var(--line-2);box-shadow:none;background:#ffffff0f}.notice{color:var(--ink);background:#6fb3ee14;border:1px solid #6fb3ee59;border-radius:14px;align-items:flex-start;gap:12px;padding:14px 16px;font-size:14px;line-height:1.45;display:flex}.notice .dot{background:var(--sky);border-radius:50%;flex:none;width:8px;height:8px;margin-top:7px}.scrim{-webkit-backdrop-filter:blur(3px);z-index:40;background:#0308078c;justify-content:center;align-items:flex-end;animation:.18s both fade;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}@keyframes fade{0%{opacity:0}}.sheet{width:min(560px,100%);max-height:calc(100% - var(--safe-t) - 24px);border:1px solid var(--line-2);padding:18px 18px calc(var(--safe-b) + 18px);background:linear-gradient(#13241f,#0c1714);border-bottom:0;border-radius:20px 20px 0 0;flex-direction:column;gap:14px;animation:.32s cubic-bezier(.2,.9,.25,1) both sheet-up;display:flex;overflow-y:auto;box-shadow:0 -20px 60px #00000080}@media (min-width:700px) and (min-height:500px){.scrim{align-items:center}.sheet{border-bottom:1px solid var(--line-2);border-radius:20px}}@keyframes sheet-up{0%{opacity:0;transform:translateY(40px)}}.sheet h2{margin:0;font-size:20px;font-weight:800}.sheet .sub{color:var(--ink-2);margin-top:-8px;font-size:13.5px}.game{position:absolute;top:0;bottom:0;left:0;right:0}.game.rotated{transform-origin:0 0;--safe-t:env(safe-area-inset-right,0px);--safe-r:env(safe-area-inset-bottom,0px);--safe-b:env(safe-area-inset-left,0px);--safe-l:env(safe-area-inset-top,0px);top:0;bottom:auto;left:auto;right:auto;transform:rotate(90deg)}.table-host{position:absolute;top:0;bottom:0;left:0;right:0}.hud{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.hud>*{pointer-events:auto}.topbar{top:calc(var(--safe-t) + 8px);left:calc(var(--safe-l) + 8px);right:calc(var(--safe-r) + 8px);pointer-events:none;align-items:center;gap:8px;display:flex;position:absolute}.topbar>*{pointer-events:auto}.glass{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px)saturate(1.2)}.round-chip{white-space:nowrap;border-radius:12px;align-items:center;gap:10px;min-width:0;padding:7px 12px;font-size:13px;display:flex}.round-chip b{text-overflow:ellipsis;font-weight:700;overflow:hidden}.round-chip .wall{font-family:var(--num);font-variant-numeric:tabular-nums;color:var(--gold-2);font-weight:800}.dora{color:var(--ink-2);border-radius:12px;align-items:center;gap:3px;padding:5px 8px;font-size:11px;display:flex}.dora img{width:20px}.spacer{flex:1}.plate{white-space:nowrap;z-index:5;border-radius:999px;align-items:center;gap:8px;padding:5px 10px 5px 5px;transition:box-shadow .25s,border-color .25s;display:flex;position:absolute;transform:translate(-50%,-50%)}.plate.active{border-color:#e3b04bcc;box-shadow:0 0 0 1px #e3b04b80,0 0 22px #e3b04b40}.plate .wind{width:30px;height:30px;font-family:var(--serif);border:1px solid var(--line-2);background:#ffffff14;border-radius:50%;flex:none;place-items:center;font-size:17px;font-weight:900;display:grid;position:relative}.plate .wind.dealer{background:var(--verm);border-color:var(--verm-2);color:#fff}.plate .wind svg{width:38px;height:38px;position:absolute;top:-4px;bottom:-4px;left:-4px;right:-4px;transform:rotate(-90deg)}.plate .who{flex-direction:column;min-width:0;line-height:1.15;display:flex}.plate .nm{text-overflow:ellipsis;max-width:92px;font-size:12.5px;font-weight:700;overflow:hidden}.plate .sc{font-family:var(--num);font-variant-numeric:tabular-nums;color:var(--gold-2);font-size:13px;font-weight:800}.plate .tag{letter-spacing:.04em;border-radius:6px;padding:2px 6px;font-size:10.5px;font-weight:800}.tag.riichi{color:#b33a24;background:#fff4e0}.tag.won{background:var(--verm);color:#fff}.tag.void{color:var(--ink);font-family:var(--serif);background:#ffffff1f}.plate .flowers{gap:1px;display:flex}.plate .flowers img{width:14px}.bubble{pointer-events:none;z-index:20;flex-direction:column;align-items:center;animation:1.5s cubic-bezier(.2,.9,.25,1) both bubble;display:flex;position:absolute;transform:translate(-50%,-50%)}.bubble.win{animation-duration:2.2s}.bubble .word{font-family:var(--serif);color:#fff7e6;text-shadow:0 0 2px #7a4a06,0 2px #7a4a06,0 0 24px #e3b04be6,0 0 60px #e3b04b73;letter-spacing:.02em;font-size:clamp(38px,9vmin,64px);font-weight:900;line-height:1}.bubble.win .word{color:#fff;text-shadow:0 0 2px #6d1407,0 3px #6d1407,0 0 28px #e2462ff2,0 0 70px #e2462f8c;font-size:clamp(48px,12vmin,88px)}.bubble .sub{letter-spacing:.16em;text-transform:uppercase;color:var(--gold-2);text-shadow:0 1px 6px #000c;margin-top:2px;font-size:12px;font-weight:800}.bubble.chat .word,.bubble.emote .word{font-family:var(--sans);color:#1b1b1b;text-shadow:none;letter-spacing:0;white-space:normal;text-align:center;background:#fffaf0f2;border-radius:14px;max-width:220px;padding:8px 12px;font-size:15px;font-weight:700}@keyframes bubble{0%{opacity:0;transform:translate(-50%,-50%)scale(.4)}14%{opacity:1;transform:translate(-50%,-50%)scale(1.12)}24%{transform:translate(-50%,-50%)scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-62%)scale(1)}}@media (prefers-reduced-motion:reduce){.bubble{animation-name:fade}.sheet{animation:none}}.actions{z-index:15;flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex;position:absolute}.act{min-width:74px;height:48px;color:var(--gold-2);font-family:var(--serif);background:linear-gradient(#282012eb,#161109eb);border:1px solid #ffe6be59;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;padding:0 16px;font-size:19px;font-weight:900;line-height:1;animation:.22s cubic-bezier(.2,.9,.3,1.3) both act-in;display:flex;box-shadow:0 6px 18px #00000073}.act small{font-family:var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-top:3px;font-size:9.5px;font-weight:800}.act.win{color:#fff;background:linear-gradient(#ef5a3f,#b92d18);border-color:#ff9a82;box-shadow:0 6px 24px #e2462f80}.act.win small{color:#ffffffd9}.act.riichi{color:#2a1604;background:linear-gradient(#f5b35c,#cf7d23);border-color:#ffd8a0}.act.riichi small{color:#2a1604bf}.act.pass{font-family:var(--sans);color:var(--ink);border-color:var(--line-2);background:#141c1ae6;font-size:15px;font-weight:700}@keyframes act-in{0%{opacity:0;transform:translateY(10px)scale(.9)}}.picker{z-index:16;border-radius:16px;gap:8px;padding:8px;display:flex;position:absolute}.picker button{border:1px solid var(--line-2);background:#ffffff0f;border-radius:10px;gap:2px;padding:6px;display:flex}.picker img{width:28px}.waits{z-index:14;color:var(--ink-2);border-radius:14px;align-items:center;gap:8px;padding:7px 10px;font-size:12px;display:flex;position:absolute}.waits .w{font-family:var(--num);font-variant-numeric:tabular-nums;color:var(--ink);flex-direction:column;align-items:center;gap:1px;font-weight:800;display:flex}.waits .w.none{opacity:.4}.waits img{width:24px}.hint{z-index:12;color:var(--ink-2);white-space:nowrap;border-radius:999px;padding:5px 10px;font-size:12px;animation:.4s both fade;position:absolute}.banner{z-index:18;text-align:center;border-radius:18px;flex-direction:column;gap:10px;width:min(440px,100% - 24px);padding:14px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.banner h3{font-family:var(--serif);margin:0;font-size:20px;font-weight:900}.banner p{color:var(--ink-2);margin:0;font-size:13px}.suits{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.suits button{border:1px solid var(--line-2);background:#ffffff0d;border-radius:12px;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;font-size:13px;display:flex}.suits button.sugg{border-color:var(--gold);background:var(--gold-soft)}.suits img{width:30px}.suits small{color:var(--ink-3);font-size:11px}.dock{top:calc(var(--safe-t) + 8px);right:calc(var(--safe-r) + 8px);z-index:13;gap:8px;display:flex;position:absolute}.round-btn{border:1px solid var(--line-2);width:40px;height:40px;color:var(--ink);touch-action:none;border-radius:50%;place-items:center;font-size:18px;display:grid}.round-btn.rec{background:var(--verm);border-color:var(--verm-2);box-shadow:0 0 0 6px #e2462f40}.emotes{z-index:30;border-radius:16px;grid-template-columns:repeat(3,auto);gap:6px;padding:8px;display:grid;position:absolute}.emotes button{border:1px solid var(--line);background:#ffffff0f;border-radius:10px;padding:9px 12px;font-size:13px;font-weight:700}.toast{left:50%;top:calc(var(--safe-t) + 62px);z-index:60;border-radius:12px;max-width:calc(100% - 32px);padding:10px 14px;font-size:13px;line-height:1.4;animation:.2s both fade;position:absolute;transform:translate(-50%)}.conn-banner{left:50%;top:calc(var(--safe-t) + 12px);z-index:70;border-radius:999px;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:8px 14px;font-size:13px;line-height:1.35;animation:.2s both fade;display:flex;position:absolute;transform:translate(-50%)}.conn-banner.lost{border-color:#e8786073;border-radius:14px}.conn-banner .spinner{border:2px solid #ffffff40;border-top-color:var(--gold,#d8b25a);border-radius:50%;flex:none;width:14px;height:14px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.midwin{left:50%;top:calc(var(--safe-t) + 56px);z-index:25;white-space:nowrap;border-color:#e2462f99;border-radius:14px;align-items:center;gap:10px;padding:8px 14px;animation:.32s both sheet-up;display:flex;position:absolute;transform:translate(-50%)}.midwin b{font-family:var(--serif);color:var(--verm-2);font-size:18px;font-weight:900}.spotlight{z-index:11;pointer-events:none;animation:1.3s cubic-bezier(.2,.9,.25,1) both spot;position:absolute;transform:translate(-50%,-50%)}.spotlight img{filter:drop-shadow(0 8px 16px #0000008c)drop-shadow(0 0 10px #e3b04b59);display:block}@keyframes spot{0%{opacity:0;transform:translate(-50%,-50%)scale(.5)}15%{opacity:1;transform:translate(-50%,-50%)scale(1.06)}25%{transform:translate(-50%,-50%)scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-50%)scale(.85)}}.res-win{border:1px solid var(--line);background:#ffffff08;border-radius:14px;flex-direction:column;gap:10px;padding:12px;display:flex}.res-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px;display:flex}.res-head .who{font-size:17px;font-weight:800}.res-head .how{color:var(--ink-2);font-size:13px}.res-tiles{flex-wrap:wrap;align-items:flex-end;gap:2px;display:flex}.res-tiles img{width:clamp(24px,5.2vmin,32px)}.res-tiles .gap{width:8px}.res-tiles img.winning{outline:2px solid var(--verm);outline-offset:1px;border-radius:4px}.pats{flex-direction:column;display:flex}.pat{border-bottom:1px dashed var(--line);justify-content:space-between;gap:12px;padding:7px 0;font-size:14px;animation:.38s cubic-bezier(.2,.9,.25,1) both pat-in;display:flex}.pat .d{color:var(--ink-3);font-size:12px;display:block}.pat .v{font-family:var(--num);font-variant-numeric:tabular-nums;color:var(--gold-2);white-space:nowrap;font-weight:800}@keyframes pat-in{0%{opacity:0;transform:translate(-12px)}}.res-total{justify-content:space-between;align-items:baseline;padding-top:4px;font-size:16px;font-weight:800;display:flex}.res-total .big{font-family:var(--serif);color:var(--verm-2);font-size:22px;font-weight:900}.deltas{grid-template-columns:1fr auto auto;align-items:center;gap:6px 14px;font-size:14px;display:grid}.deltas .n{text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.deltas .s{font-family:var(--num);font-variant-numeric:tabular-nums;color:var(--ink-2);text-align:right}.deltas .d{font-family:var(--num);font-variant-numeric:tabular-nums;text-align:right;min-width:64px;font-weight:800}.pos{color:#6fe0a8}.neg{color:#ff8a73}.fair{color:var(--ink-3);align-items:flex-start;gap:8px;font-size:12px;line-height:1.4;display:flex}.fair b{color:#6fe0a8}.fair code{color:var(--ink-2);word-break:break-all;font-size:11px}.standings{flex-direction:column;gap:8px;display:flex}.stand{border:1px solid var(--line);background:#ffffff08;border-radius:14px;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:12px;display:grid}.stand.first{border-color:var(--gold);background:var(--gold-soft)}.stand .rk{font-family:var(--serif);color:var(--gold-2);text-align:center;font-size:22px;font-weight:900}.stand .nm{font-weight:800}.stand .pts{font-family:var(--num);font-variant-numeric:tabular-nums;text-align:right;font-weight:800}.stand .pts small{color:var(--ink-3);font-weight:600;display:block}.rotate-hint{left:50%;top:calc(var(--safe-t) + 58px);z-index:9;color:var(--ink-2);white-space:nowrap;border-radius:999px;padding:6px 12px;font-size:12px;position:absolute;transform:translate(-50%)}.tap-start{z-index:70;background:#03080766;place-items:center;display:grid;position:absolute;top:0;bottom:0;left:0;right:0}.tap-start span{border-radius:999px;padding:14px 22px;font-size:16px;font-weight:800}.rulebook .pat{animation:none}.row-wrap{flex-wrap:wrap;gap:8px;display:flex}.muted{color:var(--ink-2)}.small{font-size:12.5px}
