:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--space-0:0;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4rem;--radius-sm:6px;--radius-md:10px;--radius-lg:18px;--radius-pill:999px;--font-sans:"Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.375rem;--text-2xl:1.75rem;--text-3xl:2.25rem;--text-4xl:3rem;--leading-tight:1.25;--leading-normal:1.6;--dur-fast:.12s;--dur-base:.22s;--dur-slow:.48s;--dur-reveal:.7s;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--z-banner:50;--z-modal:100;--page-max:68rem;--page-pad:var(--space-4);--c-bg:#f6f7fb;--c-bg-elevated:#fff;--c-surface:#fff;--c-surface-2:#eef0f7;--c-surface-3:#e2e6f0;--c-border:#d3d8e6;--c-border-strong:#a9b1c7;--c-text:#16192a;--c-text-muted:#565d78;--c-text-faint:#7c839b;--c-text-invert:#fff;--c-accent:#4338ca;--c-accent-hover:#3730a3;--c-accent-soft:#e5e4fb;--c-accent-text:#fff;--c-win:#0f7a4d;--c-win-soft:#d8f3e6;--c-lose:#b3261e;--c-lose-soft:#fbe0de;--c-draw:#8a6100;--c-draw-soft:#fbeecd;--c-warn:#9a5b00;--c-warn-soft:#fdefd6;--c-danger:#b3261e;--c-info:#1d4ed8;--c-focus:#1d4ed8;--shadow-1:0 1px 2px #0f122814, 0 1px 3px #0f12280f;--shadow-2:0 6px 16px #0f12281a, 0 2px 6px #0f12280f;--shadow-focus:0 0 0 3px color-mix(in srgb, var(--c-focus) 40%, transparent)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}:root:not([data-theme=light]){--c-bg:#0d0f18;--c-bg-elevated:#161a27;--c-surface:#161a27;--c-surface-2:#1e2333;--c-surface-3:#272d40;--c-border:#333a4f;--c-border-strong:#4c5570;--c-text:#eceef6;--c-text-muted:#a8b0c6;--c-text-faint:#8089a3;--c-text-invert:#0d0f18;--c-accent:#a5b4fc;--c-accent-hover:#c7d2fe;--c-accent-soft:#262a45;--c-accent-text:#10132a;--c-win:#5fd6a0;--c-win-soft:#10301f;--c-lose:#ff8b83;--c-lose-soft:#351616;--c-draw:#f0c469;--c-draw-soft:#33280c;--c-warn:#f0c469;--c-warn-soft:#33280c;--c-danger:#ff8b83;--c-info:#93b4ff;--c-focus:#93b4ff;--shadow-1:0 1px 2px #00000080;--shadow-2:0 8px 24px #0000008c}}:root[data-theme=dark]{--c-bg:#0d0f18;--c-bg-elevated:#161a27;--c-surface:#161a27;--c-surface-2:#1e2333;--c-surface-3:#272d40;--c-border:#333a4f;--c-border-strong:#4c5570;--c-text:#eceef6;--c-text-muted:#a8b0c6;--c-text-faint:#8089a3;--c-text-invert:#0d0f18;--c-accent:#a5b4fc;--c-accent-hover:#c7d2fe;--c-accent-soft:#262a45;--c-accent-text:#10132a;--c-win:#5fd6a0;--c-win-soft:#10301f;--c-lose:#ff8b83;--c-lose-soft:#351616;--c-draw:#f0c469;--c-draw-soft:#33280c;--c-warn:#f0c469;--c-warn-soft:#33280c;--c-danger:#ff8b83;--c-info:#93b4ff;--c-focus:#93b4ff;--shadow-1:0 1px 2px #00000080;--shadow-2:0 8px 24px #0000008c}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--c-text);background:var(--c-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}h1,h2,h3,h4,p,figure,ul,ol{margin:0}ul,ol{padding:0;list-style:none}button{font:inherit;color:inherit;cursor:pointer}input,select,textarea{font:inherit;color:inherit}a{color:var(--c-accent);text-underline-offset:2px;text-decoration-thickness:1px}:focus-visible{outline:2px solid var(--c-focus);outline-offset:2px;border-radius:var(--radius-sm)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.page{max-width:var(--page-max);padding:var(--page-pad);gap:var(--space-5);flex-direction:column;margin:0 auto;display:flex}.app-shell{flex-direction:column;min-height:100%;display:flex}.app-header{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--page-pad);border-bottom:1px solid var(--c-border);background:var(--c-bg-elevated);flex-wrap:wrap;display:flex}.app-header__brand{align-items:baseline;gap:var(--space-2);color:var(--c-text);font-weight:700;text-decoration:none;display:flex}.app-header__brand small{font-weight:400;font-size:var(--text-xs);color:var(--c-text-faint)}.app-header__right{align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--c-text-muted);display:flex}.app-footer{padding:var(--space-5) var(--page-pad);border-top:1px solid var(--c-border);color:var(--c-text-faint);font-size:var(--text-xs);gap:var(--space-4);flex-wrap:wrap;margin-top:auto;display:flex}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-1)}.card--flat{box-shadow:none;background:var(--c-surface-2)}.stack{gap:var(--space-4);flex-direction:column;display:flex}.stack--tight{gap:var(--space-2)}.row{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.spread{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.muted{color:var(--c-text-muted)}.faint{color:var(--c-text-faint);font-size:var(--text-sm)}.mono{font-family:var(--font-mono);font-size:var(--text-xs);word-break:break-all}.h1{font-size:var(--text-3xl);line-height:var(--leading-tight);letter-spacing:-.01em;font-weight:800}.h2{font-size:var(--text-xl);line-height:var(--leading-tight);font-weight:700}.h3{font-size:var(--text-lg);font-weight:600}.btn{justify-content:center;align-items:center;gap:var(--space-2);border:1px solid var(--c-border-strong);background:var(--c-surface);color:var(--c-text);border-radius:var(--radius-pill);padding:var(--space-2) var(--space-5);min-height:44px;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);font-weight:600;display:inline-flex}.btn:hover:not(:disabled){background:var(--c-surface-2)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-accent-text)}.btn--primary:hover:not(:disabled){background:var(--c-accent-hover);border-color:var(--c-accent-hover)}.btn--ghost{color:var(--c-text-muted);background:0 0;border-color:#0000}.btn--ghost:hover:not(:disabled){background:var(--c-surface-2)}.btn--danger{color:var(--c-danger);border-color:color-mix(in srgb, var(--c-danger) 45%, transparent);background:0 0}.btn--sm{min-height:34px;padding:var(--space-1) var(--space-4);font-size:var(--text-sm)}.btn--block{width:100%}.field{gap:var(--space-1);flex-direction:column;display:flex}.field label{font-size:var(--text-sm);color:var(--c-text-muted);font-weight:600}.input{border:1px solid var(--c-border-strong);background:var(--c-surface);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);width:100%;min-height:44px}.badge{align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-pill);font-size:var(--text-xs);background:var(--c-surface-2);color:var(--c-text-muted);border:1px solid var(--c-border);font-weight:600;display:inline-flex}.badge--win{background:var(--c-win-soft);color:var(--c-win);border-color:color-mix(in srgb, var(--c-win) 30%, transparent)}.badge--lose{background:var(--c-lose-soft);color:var(--c-lose);border-color:color-mix(in srgb, var(--c-lose) 30%, transparent)}.badge--draw{background:var(--c-draw-soft);color:var(--c-draw);border-color:color-mix(in srgb, var(--c-draw) 30%, transparent)}.notice{border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);border:1px solid var(--c-border);background:var(--c-surface-2);font-size:var(--text-sm)}.notice--warn{background:var(--c-warn-soft);border-color:color-mix(in srgb, var(--c-warn) 35%, transparent);color:var(--c-text)}.notice--error{background:var(--c-lose-soft);border-color:color-mix(in srgb, var(--c-lose) 35%, transparent)}.reconnect-banner{z-index:var(--z-banner);gap:var(--space-1);padding:var(--space-3) var(--page-pad);background:var(--c-warn-soft);border-bottom:1px solid color-mix(in srgb, var(--c-warn) 45%, transparent);color:var(--c-text);font-size:var(--text-sm);flex-direction:column;display:flex;position:sticky;top:0}.reconnect-banner strong{align-items:center;gap:var(--space-2);display:flex}.reconnect-banner__dot{background:var(--c-warn);width:10px;height:10px;animation:pulse 1.4s var(--ease-in-out) infinite;border-radius:50%}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.75)}}.match{gap:var(--space-5);flex-direction:column;display:flex}.scoreboard{align-items:center;gap:var(--space-3);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--space-4);grid-template-columns:1fr auto 1fr;display:grid}.scoreboard__side{gap:var(--space-1);flex-direction:column;min-width:0;display:flex}.scoreboard__side--right{text-align:right;align-items:flex-end}.scoreboard__name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-weight:700;overflow:hidden}.scoreboard__score{font-size:var(--text-3xl);font-variant-numeric:tabular-nums;font-weight:800;line-height:1}.scoreboard__sep{color:var(--c-text-faint);font-size:var(--text-lg)}.countdown{align-items:center;gap:var(--space-3);display:flex}.countdown__ring{flex:none}.countdown__ring circle{transition:stroke-dashoffset .2s linear}.countdown__label{font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--text-lg)}.countdown--urgent .countdown__label{color:var(--c-lose)}.choices{gap:var(--space-3);grid-template-columns:repeat(3,1fr);display:grid}.choice{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-5) var(--space-2);border-radius:var(--radius-lg);border:2px solid var(--c-border);background:var(--c-surface);min-height:140px;font-weight:700;font-size:var(--text-lg);transition:transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);flex-direction:column;display:flex}.choice__glyph{font-size:var(--text-4xl);line-height:1}.choice:hover:not(:disabled){border-color:var(--c-accent);transform:translateY(-2px)}.choice[aria-pressed=true]{border-color:var(--c-accent);background:var(--c-accent-soft)}.choice:disabled{opacity:.45;cursor:not-allowed;transform:none}.waiting{align-items:center;gap:var(--space-3);padding:var(--space-7) var(--space-4);text-align:center;border:1px dashed var(--c-border-strong);border-radius:var(--radius-lg);background:var(--c-surface-2);flex-direction:column;display:flex}.waiting__dots{gap:var(--space-2);display:flex}.waiting__dots span{background:var(--c-text-faint);width:12px;height:12px;animation:bounce 1.2s var(--ease-in-out) infinite;border-radius:50%}.waiting__dots span:nth-child(2){animation-delay:.15s}.waiting__dots span:nth-child(3){animation-delay:.3s}@keyframes bounce{0%,to{opacity:.4;transform:translateY(0)}50%{opacity:1;transform:translateY(-6px)}}.reveal{align-items:center;gap:var(--space-4);padding:var(--space-6) var(--space-4);border-radius:var(--radius-lg);background:var(--c-surface);border:1px solid var(--c-border);grid-template-columns:1fr auto 1fr;display:grid}.reveal__hand{align-items:center;gap:var(--space-2);flex-direction:column;display:flex}.reveal__glyph{font-size:var(--text-4xl);animation:drop var(--dur-reveal) var(--ease-out) both}.reveal__hand--theirs .reveal__glyph{animation-delay:.12s}@keyframes drop{0%{opacity:0;transform:translateY(-18px)rotate(-12deg)}to{opacity:1;transform:none}}.reveal__verdict{font-weight:800;font-size:var(--text-xl);text-align:center}.reveal__verdict--win{color:var(--c-win)}.reveal__verdict--lose{color:var(--c-lose)}.reveal__verdict--draw{color:var(--c-draw)}.history-table{border-collapse:collapse;width:100%;font-size:var(--text-sm)}.history-table th,.history-table td{text-align:left;padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--c-border)}.history-table th{color:var(--c-text-muted);font-weight:600}.table-scroll{overflow-x:auto}.fairness{gap:var(--space-4);border:1px solid var(--c-border);border-left:4px solid var(--c-accent);border-radius:var(--radius-md);background:var(--c-surface);padding:var(--space-5);flex-direction:column;display:flex}.fairness__row{gap:var(--space-1);flex-direction:column;display:flex}.fairness__result{align-items:center;gap:var(--space-2);font-weight:700;display:flex}.fairness__result--ok{color:var(--c-win)}.fairness__result--bad{color:var(--c-lose)}.fairness__result--unknown{color:var(--c-warn)}.variant-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.variant-card{gap:var(--space-2);padding:var(--space-4);border-radius:var(--radius-lg);border:2px solid var(--c-border);background:var(--c-surface);text-align:left;flex-direction:column;display:flex}.variant-card[aria-pressed=true]{border-color:var(--c-accent);background:var(--c-accent-soft)}.mode-list{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(200px,1fr));display:grid}.mode-card{gap:var(--space-1);text-align:left;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:2px solid var(--c-border);background:var(--c-surface);flex-direction:column;align-items:flex-start;display:flex}.mode-card[aria-pressed=true]{border-color:var(--c-accent);background:var(--c-accent-soft)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{background:var(--c-accent);color:var(--c-accent-text);padding:var(--space-2) var(--space-4);z-index:var(--z-modal);position:absolute;top:0;left:-9999px}.skip-link:focus{left:var(--space-3);top:var(--space-3)}@media (max-width:640px){:root{--page-pad:var(--space-3);--text-3xl:1.75rem;--text-4xl:2.25rem}.choice{min-height:108px;font-size:var(--text-base);padding:var(--space-4) var(--space-1)}.reveal{text-align:center;grid-template-columns:1fr}.scoreboard{grid-template-columns:1fr auto 1fr}}@media (prefers-contrast:more){.card,.choice,.variant-card,.mode-card{border-color:var(--c-text-muted)}}