@font-face{font-family:Manrope;src:url(public/fonts/manrope.woff2) format('woff2');font-weight:200 800;font-display:swap}@font-face{font-family:'DM Sans';src:url(public/fonts/dmsans.woff2) format('woff2');font-weight:100 1000;font-display:swap}
:root{--paper:#f6f5ef;--muted:#b4b8c4;--faint:#9198a8;--lime:#c4f35b;--ink:#141822;--ink-soft:#10131b;--surface:#1b2030;--surface-2:#222839;--line:#f6f5ef17;--line-strong:#f6f5ef2b;--display:Manrope,ui-sans-serif,system-ui,sans-serif;--body:'DM Sans',ui-sans-serif,system-ui,sans-serif;--card-paper:#f6f5ef;--card-ink:#141822;--card-red:#ac263d;--felt:#174735;--felt-highlight:#20523e;--felt-deep:#0b281f;--rail:#111915;--felt-stitch:#9da67c;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;--radius:16px;--card-width:80px;--card-height:112px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--ink);color:var(--paper);font:16px/1.6 var(--body)}button,input,select{font:inherit}button,.button{border:1px solid var(--line-strong);border-radius:999px;background:var(--surface-2);color:var(--paper);padding:10px 20px;cursor:pointer;min-height:44px;font-weight:700;line-height:1.35;text-decoration:none}button:hover:not(:disabled),.button:hover{background:var(--surface);border-color:var(--paper)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}.primary,.button.primary{background:var(--lime);color:var(--ink);border-color:var(--lime)}.primary:hover:not(:disabled){background:var(--paper);color:var(--ink)}a{color:inherit;text-underline-offset:4px}a:hover{color:var(--lime)}:focus-visible{outline:3px solid var(--lime);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);line-height:1.15;text-wrap:balance}p+p{margin-top:16px}h3+p{margin-top:12px}[hidden]{display:none!important}.muted{color:var(--muted)}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.12em;color:var(--muted)}
.game{position:relative;border:0;overflow:clip;background:transparent;isolation:isolate;scroll-margin-top:16px;margin-top:8px}.game-bar{display:flex;justify-content:space-between;align-items:center;padding:8px 0;gap:16px}.game-bar strong{font-family:var(--display);font-size:20px}.game-bar #mode{margin-left:16px;color:var(--muted);font-size:13px}.game-bar nav{display:flex;gap:4px;flex-wrap:wrap}.game-bar nav button{background:none;border:0;color:var(--muted);font-size:13px;padding:8px 12px;min-height:44px}.felt{position:relative;isolation:isolate;background:transparent;min-height:560px;padding:16px 24px}.table-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;letter-spacing:.04em}.table-center{width:50%;margin:144px auto 0;min-height:184px;text-align:center}.table-center .turn-prompt{font-size:20px;min-height:24px}.table-center p{color:var(--muted);font-size:14px;margin:8px 0}.table-center #table-notice{min-height:24px}#deal{min-width:160px}#players .player{position:absolute;display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"avatar name score" "avatar detail score";align-items:center;column-gap:12px;row-gap:4px;max-width:260px;border:1px solid transparent;border-radius:12px;padding:12px}.player.position-1{left:24px;top:190px}#players .player.position-2{left:50%;top:64px;transform:translateX(-50%);grid-template-columns:minmax(40px,auto) minmax(0,1fr) auto;grid-template-areas:"name detail score" "avatar detail score"}.player-name{grid-area:name}.player>.avatar{grid-area:avatar}.player-detail{grid-area:detail}.player-score{grid-area:score}.position-2 .player-name,.position-2 .avatar{justify-self:center}.table-brand{position:absolute;left:12%;top:344px;pointer-events:none;opacity:.24}.player.position-3{right:24px;top:190px}.player.active{border-color:var(--lime)!important;background:var(--felt-deep)}.player strong{display:block;font-size:15px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player small{white-space:nowrap;display:block;color:var(--muted);font-size:11px}.avatar{width:40px;height:40px;flex:none;border:1px solid var(--line-strong);border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-weight:800;color:var(--paper);font-family:var(--display)}.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.player-score{font-size:20px;font-variant-numeric:tabular-nums}.player-score small{font-size:10px}.mini-backs{display:flex;margin-top:8px;height:24px;padding-right:12px}.mini-backs i{width:17px;height:24px;border:1px solid var(--muted);border-radius:3px;background:var(--ink-soft);margin-right:-8px}.piles{display:flex;justify-content:center;gap:24px;margin-top:12px}.pile-wrap{display:flex;flex-direction:column;align-items:center;gap:8px}.pile-wrap>span{color:var(--muted);font-size:12px}.pile-wrap small{margin-left:4px}.pile-wrap .card{width:64px;height:92px}.card{position:relative;flex:none;display:block;width:var(--card-width);height:var(--card-height);padding:0;border:1px solid var(--line-strong);border-radius:8px;background:var(--card-paper);color:var(--card-ink);box-shadow:0 3px 0 #0003;min-height:0;touch-action:pan-y;user-select:none}.card:hover:not(:disabled){background:var(--card-paper);border-color:var(--lime)}.card:disabled{opacity:1}.card.red{color:var(--card-red)}.card-back{background:var(--ink-soft) url(public/card-back.svg) center/cover}.card-back:hover:not(:disabled){background:var(--ink-soft) url(public/card-back.svg) center/cover}.card .corner{position:absolute;left:7px;top:6px;line-height:.95;font-size:22px;font-weight:800}.card .corner.bottom{left:auto;top:auto;right:7px;bottom:6px;transform:rotate(180deg)}.hand-wrap{max-width:100%;overflow-x:auto;padding:16px 8px 8px;min-height:132px;scrollbar-width:thin;scrollbar-color:var(--muted) var(--surface)}.hand{display:flex;justify-content:center;gap:0;width:max-content;min-width:100%;padding-right:0}.hand .card+.card{margin-left:-12px}.hand .card:hover{z-index:2}.hand .card.selected{translate:0 -12px;outline:3px solid var(--lime);outline-offset:1px;z-index:3}.hand .card:focus{outline:3px solid var(--lime);outline-offset:2px;z-index:4}.hand .card.dragging{opacity:.5}.hand-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.hand-actions button{font-size:14px}.selection-guide{text-align:center;color:var(--muted);font-size:13px;margin-top:8px;min-height:24px;max-width:640px;margin-inline:auto}.your-seat{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:8px}.your-seat small{display:block;font-size:11px;color:var(--muted)}.your-seat strong{font-size:14px}.your-seat #you-score{font-size:24px;font-variant-numeric:tabular-nums}.active-seat{border:2px solid var(--lime);color:var(--lime)}.melds{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;min-height:32px;margin:8px 0}.empty-meld{font-size:13px;color:var(--muted)}.table-meld{padding:8px;border-radius:8px;background:var(--ink-soft);opacity:1!important}.table-meld:disabled{cursor:default}.table-meld.valid{outline:2px solid var(--lime);outline-offset:2px}.meld-cards{display:flex;padding-right:0}.table-meld .card{width:36px;height:50px;margin-right:-8px;box-shadow:none;border-radius:4px}.table-meld .card:last-child{margin:0}.table-meld .corner{font-size:13px;left:4px;top:4px}.table-meld .corner.bottom{display:none}.meld-owner{overflow-wrap:anywhere;display:block;font-size:10px;color:var(--muted);margin-top:4px}.game-footer{display:flex;justify-content:space-between;gap:16px;padding:8px 24px 16px;color:var(--muted);font-size:12px}kbd{font:inherit;color:var(--paper)}.results{position:absolute;inset:48px 12% auto;background:var(--ink-soft);border:1px solid var(--line-strong);border-radius:16px;padding:32px;box-shadow:0 16px 48px #0005;text-align:center;z-index:8}.results #result-title{font-size:28px;margin:8px 0}.results p{color:var(--muted);font-size:14px}.score-scroll{overflow:auto;margin:24px 0;max-height:240px}.score-scroll table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}.score-scroll th,.score-scroll td{padding:8px;border-bottom:1px solid var(--line);text-align:right}.score-scroll th:first-child,.score-scroll td:first-child{text-align:left}.score-scroll thead{position:sticky;top:0;background:var(--ink-soft)}.score-scroll tfoot{font-weight:800;color:var(--lime)}.score-scroll caption{text-align:left;color:var(--muted);font-size:12px}.score-scroll .winner-cell{font-weight:800;color:var(--lime)}dialog{background:var(--surface);color:var(--paper);border:1px solid var(--line-strong);border-radius:16px;max-width:min(500px,calc(100% - 32px));padding:32px}dialog::backdrop{background:#10131bcc}dialog h2{font-size:26px;margin-bottom:16px}dialog p,dialog li{color:var(--muted);font-size:15px}dialog ol{padding-left:20px}dialog button{margin-top:24px}dialog label{display:block;margin:16px 0;font-size:14px}input[type=checkbox]{accent-color:var(--lime);width:18px;height:18px;vertical-align:middle}select{background:var(--ink-soft);color:var(--paper);border:1px solid var(--line-strong);border-radius:8px;min-height:44px;padding:8px;width:100%}.dialog-actions{display:flex;gap:8px;flex-wrap:wrap}.dialog-actions button{flex:1}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:30;border:1px solid var(--lime);background:var(--ink-soft);padding:16px 24px;border-radius:12px;width:max-content;max-width:calc(100% - 32px);font-size:14px}.motion-layer{position:fixed;inset:0;pointer-events:none;z-index:15;overflow:hidden}.flying-card{position:absolute;pointer-events:none}.flight-back{position:absolute;inset:0}.win-banner{display:none!important}.win-spark{display:none}.no-motion *{scroll-behavior:auto!important}.low-effects .card{box-shadow:none}

/* A padded rail contains the playing surface; its lower edge falls into the page. */
.felt::before {
 content:"";
 position:absolute;
 z-index:-2;
 inset:24px 0 96px;
 pointer-events:none;
 border:20px solid var(--rail);
 border-radius:48% / 36%;
 background:radial-gradient(ellipse at 50% 40%,var(--felt-highlight),var(--felt) 55%,var(--felt-deep));
 box-shadow:inset 0 0 0 2px var(--line-strong),inset 0 8px 32px var(--ink-soft),0 16px 40px var(--ink-soft);
 mask-image:linear-gradient(to bottom,#000 62%,#000d 78%,transparent 100%);
}
.felt::after {
 content:"";
 position:absolute;
 z-index:-1;
 inset:56px 32px 128px;
 pointer-events:none;
 border:1px dashed var(--felt-stitch);
 border-radius:48% / 36%;
 opacity:.45;
 mask-image:linear-gradient(to bottom,#000 48%,transparent 92%);
}
.game .table-top{padding-inline:8px}
.game .your-seat{position:relative}
.game .hand .card{box-shadow:0 2px 0 #c9c8c0,0 8px 12px #10131b55}
.game .hand-actions button:not(.primary){background:var(--ink-soft)}
.game .table-meld{background:var(--felt-deep)}
body.low-effects .felt::before{box-shadow:none}
@media(max-width:767px){:root{--card-width:64px;--card-height:92px}.game-bar{padding:8px 0;align-items:center;flex-wrap:wrap;gap:4px}.game-bar #mode{margin:0;font-size:11px}.game-bar nav{justify-content:flex-end;gap:0}.game-bar nav button{padding:8px;font-size:12px}.felt{padding:16px 12px;min-height:640px}.felt::before{inset:40px 0 104px;border-width:8px;border-radius:44% / 20%}.felt::after{inset:60px 16px 136px;border-radius:44% / 20%}.table-center{width:84%;margin-top:240px;min-height:200px}.table-center .turn-prompt{font-size:18px;min-height:42px}.player.position-1{left:8px;top:112px}#players .player.position-2{top:112px;grid-template-columns:minmax(0,1fr);grid-template-areas:"name" "avatar" "detail" "score"}.player.position-3{right:8px;top:112px}#players .player{padding:8px;gap:4px;grid-template-columns:minmax(0,1fr);grid-template-areas:"name" "avatar" "detail" "score";justify-items:center;width:30%;max-width:130px}.table-brand{left:24px;top:488px;width:24px;height:27px}.player .avatar{width:28px;height:28px;font-size:12px}.player strong{font-size:12px;max-width:88px;text-align:center}.player small{white-space:normal;font-size:10px;text-align:center;min-height:48px}.player-score{font-size:14px}.player-score small{display:none}.mini-backs{display:none}.table-top{font-size:11px}.table-notice{min-height:20px}.your-seat{margin-top:8px}.hand-wrap{padding-top:20px;min-height:124px}.hand .card+.card{margin-left:-8px}.card .corner{font-size:18px;left:5px}.game-footer{padding:12px;flex-direction:column;gap:4px}.results{inset:48px 8px auto;padding:20px 12px}.results #result-title{font-size:24px}.score-scroll th,.score-scroll td{padding:8px 4px;font-size:12px}.hand-actions button{padding:10px 14px}.selection-guide{font-size:12px}.melds{min-height:56px}.table-meld .card{width:28px;height:44px;margin-right:-9px}.table-meld .card:last-child{margin-right:0}.table-meld .corner{font-size:11px}.table-meld{padding:6px}.score-scroll{margin:16px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.card.empty-pile{background:transparent;border:1px dashed var(--muted);box-shadow:none;color:var(--muted)}.empty-pile-label{font-size:12px;font-weight:400}

#sound-status{min-height:44px;font-size:13px;margin:0}

.flight-back{z-index:2;border-radius:inherit}

/* Status and result labels keep their visual emphasis without entering the page outline. */
.table-center .turn-prompt{font-family:var(--display);font-weight:700;line-height:1.15;text-wrap:balance;color:var(--paper);margin:0}
.results #result-title{font-family:var(--display);font-weight:700;line-height:1.15;text-wrap:balance;color:var(--paper)}