*,:before,:after{box-sizing:border-box}:root{--ink:#f2f2f7;--ink-dim:#9d9daa;--bg:#0e0e13;--surface:#1a1a24;--line:#2e2e3c;--board-bg:#14141a;--cell-bg:#23232e;--yellow:#f5c518;--yellow-soft:#4a3f14;--red:#d94a3d;--magenta:#b455c8}html,body{overscroll-behavior:none;background:var(--bg);color:var(--ink);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.game{--pad:8px;--gap:3px;--chrome:210px;--cell:min((100vw - 2 * var(--pad) - 7 * var(--gap)) / 8, (100dvh - var(--chrome)) / 11 - var(--gap));padding:var(--pad);background:var(--board-bg);flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:100dvh;display:flex}.board{grid-template-columns:repeat(8, var(--cell));grid-auto-rows:var(--cell);gap:var(--gap);display:grid}.cell{background:var(--cell-bg);width:100%;height:100%;color:var(--ink);font-size:calc(var(--cell) * .5);border:2px solid #0000;border-radius:6px;padding:0;font-weight:600;line-height:1}.cell[data-state=target]{background:var(--yellow-soft);border-color:var(--yellow)}.cell[data-state=placeable]{border-color:#3d3d4d}.cell[data-state=valid]{background:var(--yellow);color:#1a1a1a}.cell[data-state=invalid]{background:var(--red)}.cell[data-state=opponent]{background:var(--magenta)}.cell[data-state=opening]{background:#33333f}.hand{min-height:calc(var(--cell) * 1.15);gap:8px;display:flex}.hand-slot{width:calc(var(--cell) * 1.15);height:calc(var(--cell) * 1.15);border:2px dashed #2f2f3d;border-radius:8px}.hand-card{width:calc(var(--cell) * 1.15);height:calc(var(--cell) * 1.15);background:var(--cell-bg);color:var(--ink);font-size:calc(var(--cell) * .55);border:2px solid #0000;border-radius:8px;font-weight:600}.hand-card[aria-pressed=true]{border-color:var(--yellow);transform:translateY(-6px)}.actions{width:100%;max-width:calc(8 * var(--cell) + 7 * var(--gap));flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.actions button{background:var(--cell-bg);color:var(--ink);border:none;border-radius:8px;flex:1;padding:5px 12px;font-size:14px}.actions button:disabled{opacity:.4}.actions .resign{border:1px solid var(--line);background:var(--cell-bg);width:84px;color:var(--ink);text-align:center;flex:none;padding:5px 0;font-size:13px}.actions .resign[data-confirming=true]{border-color:var(--red);background:var(--red);color:#fff;font-weight:600}.hint{opacity:.8;text-overflow:ellipsis;white-space:nowrap;flex-basis:100%;min-width:0;margin:0;font-size:13px;line-height:18px;overflow:hidden}.turn{opacity:.7;flex:none;font-size:14px}.turn[data-yours=true]{opacity:1;color:var(--yellow);font-weight:700}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);text-align:center;background:#0a0a0ef0;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:24px;display:flex;position:fixed;inset:0}.overlay h2{letter-spacing:-.02em;margin:0;font-size:32px;font-weight:700}.overlay[data-outcome=player] h2{color:var(--yellow)}.result{gap:28px;margin:8px 0 4px;display:flex}.result-side{flex-direction:column;align-items:center;gap:6px;min-width:0;display:flex}.result-name{max-width:12ch;color:var(--ink-dim);letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.result-score{letter-spacing:-.02em;font-size:44px;font-weight:700;line-height:1}.result-side[data-winner=true] .result-score{color:var(--ink)}.result-side[data-winner=false] .result-score{opacity:.45}.overlay[data-outcome=player] .result-side[data-winner=true] .result-score{color:var(--yellow)}.overlay-actions{width:100%;max-width:260px;margin-top:14px}.muted{opacity:.6;font-size:14px}.seed{opacity:.35;font-size:11px}.board-area{position:relative}.coach{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#1e1e2ae6;border:1px solid #3a3a4a;border-radius:8px;align-items:center;gap:12px;padding:8px 10px;display:flex;position:absolute;bottom:6px;left:0;right:0;box-shadow:0 4px 16px #00000059}.coach p{margin:0;font-size:13px;line-height:1.3}.coach-skip{color:var(--ink);opacity:.55;background:0 0;border:none;border-radius:6px;flex-shrink:0;padding:6px 10px;font-size:13px}.hand-card[data-locked=true]{opacity:.35}.score-popover{z-index:10;background:var(--yellow);color:#1a1a1a;text-align:center;pointer-events:none;border-radius:8px;max-width:260px;padding:8px 12px;font-size:14px;line-height:1.3;position:fixed;transform:translate(-50%,-100%)}.score-popover:after{content:"";left:var(--arrow,50%);border:6px solid #0000;border-top-color:var(--yellow);position:absolute;top:100%;transform:translate(-50%)}@keyframes pip-land{0%{opacity:0;transform:scale(.65)}to{opacity:1;transform:scale(1)}}.pip{animation:.15s ease-out pip-land;display:inline-block}@keyframes opponent-ring{0%{box-shadow:0 0 0 0 var(--magenta)}to{box-shadow:0 0 0 10px #b455c800}}.cell[data-state=opponent]{animation:.6s ease-out opponent-ring}@keyframes invalid-shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}75%{transform:translate(3px)}}.cell[data-state=invalid]{animation:.22s ease-in-out invalid-shake}@keyframes cell-enter{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.board.entering .cell{animation:.26s ease-out backwards cell-enter;animation-delay:calc(var(--i) * 4ms)}@keyframes overlay-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.overlay>*{animation:.24s ease-out backwards overlay-in}.overlay h2{animation-delay:60ms}@keyframes coach-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.coach p{animation:.22s ease-out coach-in}.cell:active,.actions button:not(:disabled):active,.btn:not(:disabled):active,.segmented button:active,.overlay-actions button:active,.hand-card:active{transform:scale(.95)}.hand-card[aria-pressed=true]:active{transform:translateY(-6px)scale(.95)}@keyframes score-flash{0%,to{box-shadow:0 0 #f0c85000}40%{box-shadow:0 0 0 6px #f0c8508c}}.cell[data-flash=true]{animation:.6s ease-out score-flash}@media (prefers-reduced-motion:reduce){.pip,.cell[data-state=opponent],.cell[data-state=invalid],.cell[data-flash=true],.board.entering .cell,.overlay>*,.coach p{animation:none}.cell:active,.actions button:not(:disabled):active,.btn:not(:disabled):active,.segmented button:active,.overlay-actions button:active,.hand-card:active{transform:none}.hand-card[aria-pressed=true]:active{transform:translateY(-6px)}}.auth{width:100%;max-width:320px;padding:var(--pad);flex-direction:column;gap:8px;margin:auto;display:flex}.auth label{color:var(--ink-dim);letter-spacing:.06em;text-transform:uppercase;font-size:12px}.auth input{border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;border-radius:10px;padding:12px;font-size:16px}.auth input:focus-visible{border-color:var(--yellow);outline:none}.auth button{background:var(--yellow);color:#1a1a1a;font:inherit;border:none;border-radius:10px;margin-top:4px;padding:14px;font-size:15px;font-weight:600}.auth button:disabled{opacity:.4}.account{width:100%;max-width:340px;min-height:100dvh;padding:max(40px, env(safe-area-inset-top) + 24px) 20px max(24px, env(safe-area-inset-bottom) + 16px);flex-direction:column;margin:0 auto;display:flex}.account-title{letter-spacing:-.02em;text-align:center;margin:0 0 20px;font-size:26px;font-weight:700}.stats{margin:0 0 22px}.stats-figures{gap:8px;margin-bottom:14px;display:flex}.stats-figure{background:var(--surface);border-radius:10px;flex-direction:column;flex:1;align-items:center;gap:3px;padding:12px 6px;display:flex}.stats-value{letter-spacing:-.02em;font-size:22px;font-weight:700}.stats-label{color:var(--ink-dim);letter-spacing:.06em;text-transform:uppercase;font-size:11px}.stats-recent{margin:0;padding:0;list-style:none}.stats-recent li{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:8px 2px;font-size:14px;display:flex}.stats-recent li[data-outcome=won] .stats-score{color:var(--yellow)}.stats-recent li[data-outcome=lost] .stats-score{opacity:.5}.stats-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.stats-score{flex:none;font-weight:600}.stats-empty{color:var(--ink-dim);margin:0 0 22px;font-size:13px;line-height:1.45}.account .auth{max-width:none;margin:0;padding:0 0 20px}.account .auth-name button{border:1px solid var(--line);color:var(--ink);background:0 0;font-weight:600}.account h2{margin:8px 0 0;font-size:17px;font-weight:600}.account-note{color:var(--ink-dim);margin:0;font-size:13px;line-height:1.45}.account>.btn-quiet{margin-top:auto}.auth .auth-switch{color:var(--ink-dim);background:0 0;margin-top:0;font-weight:400}.auth-error{color:var(--red);margin:0;font-size:14px}.menu{width:100%;max-width:340px;min-height:100dvh;padding:max(12px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom) + 16px);text-align:center;flex-direction:column;align-items:center;gap:34px;margin:0 auto;display:flex;position:relative}.menu .menu-settings{top:max(12px, env(safe-area-inset-top));border:1px solid var(--line);background:var(--surface);width:40px;height:40px;color:var(--ink-dim);border-radius:50%;padding:0;font-size:17px;line-height:1;position:absolute;right:8px}.brand{flex-direction:column;align-items:center;gap:14px;margin-top:auto;display:flex}.brand-mark{mix-blend-mode:screen;width:96px;height:96px}.brand-name{letter-spacing:-.02em;margin:0;font-size:40px;font-weight:700}.brand-rule{max-width:24ch;color:var(--ink-dim);margin:0;font-size:15px;line-height:1.4}.install{border:1px solid var(--line);background:var(--surface);border-radius:10px;align-items:center;gap:8px;width:100%;padding:8px 10px 8px 14px;display:flex}.install-link{color:var(--ink);flex:1;font-size:14px;text-decoration:none}.menu .install-close{width:28px;height:28px;color:var(--ink-dim);background:0 0;border:none;border-radius:50%;flex:none;padding:0;font-size:18px;line-height:1}.ongoing{width:100%;margin-bottom:4px}.ongoing-title{color:var(--ink-dim);letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-size:12px;font-weight:600}.ongoing ul{margin:0;padding:0;list-style:none}.ongoing li+li{margin-top:6px}.menu .ongoing-row{border:1px solid var(--line);background:var(--surface);width:100%;color:var(--ink);border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;font-size:15px;font-weight:400;display:flex}.menu .ongoing-row[data-state=yourTurn]{border-color:var(--yellow);background:#f5c5181a}.ongoing-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.ongoing-state{color:var(--ink-dim);flex:none;font-size:13px}.menu .ongoing-row[data-state=yourTurn] .ongoing-state{color:var(--yellow)}.menu .ongoing-row[data-state=invited] .ongoing-state{color:var(--ink);letter-spacing:.08em;font-weight:700}.menu-actions{flex-direction:column;gap:26px;width:100%;display:flex}.menu-group{flex-direction:column;gap:10px;width:100%;display:flex}.btn{width:100%;color:var(--ink);font:inherit;background:0 0;border:1px solid #0000;border-radius:12px;padding:16px;font-size:16px;font-weight:600}.btn-primary{background:var(--yellow);color:#1a1a1a}.btn-ghost{border-color:var(--line)}.btn-quiet{color:var(--ink-dim);font-weight:400}.btn:disabled{opacity:.4}.levels{flex-direction:column;align-items:center;gap:6px;display:flex}.levels-label{color:var(--ink-dim);letter-spacing:.08em;text-transform:uppercase;font-size:12px}.segmented{background:var(--surface);border-radius:10px;gap:4px;padding:4px;display:flex}.segmented button{color:var(--ink-dim);font:inherit;background:0 0;border:none;border-radius:7px;padding:8px 16px;font-size:14px;font-weight:600;transition:background-color .12s,color .12s}.segmented button[aria-pressed=true]{background:var(--cell-bg);color:var(--ink)}.menu-searching{color:var(--ink-dim);margin:0;padding:16px;font-size:16px;animation:1.6s ease-in-out infinite searching-pulse}@keyframes searching-pulse{50%{opacity:.45}}.menu-foot{flex-direction:column;align-items:center;gap:6px;margin-top:auto;display:flex}.menu-name{color:var(--ink);font:inherit;text-underline-offset:4px;background:0 0;border:none;border-radius:8px;padding:8px 12px;font-size:15px;font-weight:600;-webkit-text-decoration:underline #fff3;text-decoration:underline #fff3}.menu-name:disabled{opacity:.5;text-decoration:none}.menu-note{max-width:28ch;color:var(--ink-dim);margin:0;font-size:13px;line-height:1.4}@media (prefers-reduced-motion:reduce){.menu-searching{animation:none}.segmented button{transition:none}}.sheet{z-index:10;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet-scrim{z-index:0;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0a0a0e99;border:none;position:absolute;inset:0}.sheet-body{z-index:1;width:100%;max-width:400px;padding:18px 16px max(18px, env(safe-area-inset-bottom) + 12px);background:var(--surface);border-radius:16px 16px 0 0;flex-direction:column;gap:8px;animation:.2s ease-out sheet-in;display:flex;position:relative}@keyframes sheet-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.sheet-title{margin:0 0 6px;font-size:17px;font-weight:700}.sheet-row{border:1px solid var(--line);background:var(--cell-bg);color:var(--ink);font:inherit;text-align:left;border-radius:10px;justify-content:space-between;align-items:center;padding:14px;font-size:15px;display:flex}.sheet-danger{color:var(--red)}.sheet-danger[data-confirming=true]{border-color:var(--red);background:var(--red);color:#fff;font-weight:600}.sheet-field{flex-direction:column;gap:8px;padding:4px 0 8px;display:flex}.sheet-label{color:var(--ink-dim);letter-spacing:.06em;text-transform:uppercase;font-size:12px}.sheet-field .segmented{width:100%}.sheet-field .segmented button{flex:1}.sheet-row:disabled{color:var(--ink-dim)}.invite-code{border:1px solid var(--line);background:var(--cell-bg);letter-spacing:.18em;text-align:center;border-radius:10px;margin:4px 0 10px;padding:14px;font-size:28px;font-weight:700}.sheet-note{color:var(--ink-dim);margin:0 0 4px;font-size:13px;line-height:1.45}.sheet-primary{border-color:var(--yellow);background:var(--yellow);color:#1a1a1a;justify-content:center;font-weight:600}.menu-warning{color:var(--red)}.sheet-close{color:var(--ink-dim);font:inherit;background:0 0;border:none;border-radius:10px;margin-top:4px;padding:12px;font-size:15px}@media (prefers-reduced-motion:reduce){.sheet-body{animation:none}}.scoreboard{width:100%;max-width:calc(8 * var(--cell) + 7 * var(--gap));align-items:stretch;gap:8px;display:flex}.side{border:1px solid var(--line);background:var(--surface);border-radius:10px;flex-direction:column;flex:1 1 0;gap:2px;min-width:0;padding:6px 10px;transition:border-color .15s,background-color .15s;display:flex}.side[data-active=true]{border-color:var(--yellow);background:#f5c5181a;animation:.5s ease-out side-wake}.side[data-active=false]{opacity:.6}.side-name{color:var(--ink-dim);letter-spacing:.06em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;align-items:center;gap:5px;font-size:11px;font-weight:600;display:flex;overflow:hidden}.side[data-active=true] .side-name{color:var(--yellow)}.side-dot{background:var(--yellow);border-radius:50%;flex:none;width:6px;height:6px}.side-figures{justify-content:space-between;align-items:baseline;gap:6px;display:flex}.side-score{letter-spacing:-.02em;font-size:22px;font-weight:700;line-height:1.1}.side-deck{color:var(--ink-dim);flex:none;align-items:center;gap:4px;font-size:12px;font-weight:600;display:flex}.side-deck-mark{width:8px;height:11px;box-shadow:2px -2px 0 -1px var(--surface), 2px -2px 0 currentColor;border:1px solid;border-radius:2px}.settings-open{width:34px;height:34px;color:var(--ink-dim);background:0 0;border:none;border-radius:50%;flex:none;align-self:center;padding:0;font-size:17px;line-height:1}@keyframes side-wake{0%{transform:scale(1)}35%{transform:scale(1.14)}to{transform:scale(1)}}.board[data-yours=true]{animation:.7s ease-out board-wake}@keyframes board-wake{0%{box-shadow:0 0 #f5c51880}to{box-shadow:0 0 0 16px #f5c51800}}@media (prefers-reduced-motion:reduce){.side{transition:none}.side[data-active=true],.board[data-yours=true]{animation:none}}.overlay-install{opacity:.75;margin-top:1rem;font-size:.85rem;display:inline-block}