@font-face{font-family:Spectral;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/spectral-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Spectral;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/spectral-latin-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Spectral;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/spectral-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:400 500;font-display:swap;src:url(/fonts/ibm-plex-sans-latin-400-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{color-scheme:light;--paper: #eef0f3;--ink: #13233c;--ink-soft: #4a5870;--rule: #c7cdd7;--accent: #14675e;--font-serif: Spectral, Georgia, serif;--font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--radius: 2px;--surface: #ffffff;--on-accent: #ffffff;--accent-2: #17776d;--suit-red: #b3261e;--suit-black: var(--ink);--danger: #b3261e;--danger-soft: #f6dcd9;--gold: #a8780a;--gold-wash: #fff4d6;--joker: #6b3fa0;--joker-wash: #f1e8fb;--card-radius: 6px;--card-edge: 1px solid var(--ink-soft);--card-shadow: 0 1px 2px rgba(19, 35, 60, .22), 0 4px 10px rgba(19, 35, 60, .12);--card-shadow-lifted: 0 6px 14px rgba(19, 35, 60, .28);--card-ring: 0 0 0 2px var(--paper), 0 0 0 4px var(--ink);--scrim: rgba(19, 35, 60, .45)}:root{--cw: 46px;--ch: 64px;--my-cw: 62px;--my-ch: 86px;--mid-cw: 62px;--mid-ch: 86px;--gap: 5px;--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{background:var(--paper);color:var(--ink);font:15px/1.45 var(--font-sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button,input{font:inherit;color:inherit}h1,h2,h3{margin:0;font-family:var(--font-serif);font-weight:600;letter-spacing:-.01em}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--radius)}.btn{min-height:44px;min-width:44px;padding:0 14px;border-radius:var(--radius);border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;touch-action:manipulation}.btn:hover:not(:disabled){background:var(--surface)}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:500}.btn.primary:hover:not(:disabled){background:var(--ink);border-color:var(--ink)}.btn.cambio,.btn.leave.armed{background:var(--danger);border-color:var(--danger);color:var(--on-accent);font-weight:500}.btn.small{min-height:36px;padding:0 10px;font-size:13px}.btn.big{min-height:52px;font-size:17px}.btn.link{border:none;background:none;text-decoration:none;border-bottom:1px solid var(--accent);min-height:0;padding:0 0 1px;align-self:flex-start}.btn.icon{padding:0;border-color:transparent}.badge{display:inline-block;padding:0 6px;border-radius:var(--radius);font-family:var(--font-sans);font-size:11px;font-weight:500;line-height:17px;background:var(--rule);color:var(--ink);white-space:nowrap}.badge.host{background:transparent;box-shadow:inset 0 0 0 1px var(--ink-soft);color:var(--ink-soft)}.badge.caller{background:var(--danger);color:var(--on-accent)}.badge.out{background:var(--ink-soft);color:var(--on-accent)}.badge.offline{background:var(--danger-soft);color:var(--danger)}.badge.clock{background:var(--accent);color:var(--on-accent)}.muted{color:var(--ink-soft)}.error{color:var(--danger)}.home,.lobby{max-width:460px;margin:0 auto;padding:24px 16px calc(24px + var(--safe-bottom));display:flex;flex-direction:column;gap:16px;min-height:100%;justify-content:center}.home h1{font-size:clamp(2.7rem,12vw,4rem);line-height:1.02;letter-spacing:-.022em;padding-bottom:12px;border-bottom:2px solid var(--ink)}.home .sub{margin:-6px 0 8px;font-family:var(--font-serif);font-size:1.15rem;color:var(--ink-soft)}.home label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--ink-soft)}.home input,.join input{min-height:48px;border-radius:var(--radius);border:1px solid var(--ink-soft);background:var(--surface);color:var(--ink);padding:0 12px;font-size:17px}.home-actions{display:flex;flex-direction:column;gap:12px}.home-actions>.btn{min-height:52px}.join{display:flex;gap:8px}.join input{flex:1;text-transform:uppercase;letter-spacing:.3em;text-align:center;min-width:0}.lobby{justify-content:flex-start}.room-code{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 0;border-bottom:1px solid var(--rule)}.room-code .label{color:var(--ink-soft);font-size:13px}.room-code .code{font-family:var(--font-serif);font-size:52px;font-weight:600;line-height:1.1;letter-spacing:.22em;padding-left:.22em}.members{list-style:none;margin:0;padding:0}.members li{display:flex;align-items:center;gap:8px;min-height:52px;padding:0 2px;border-bottom:1px solid var(--rule)}.members li>span:first-child{flex:1;font-family:var(--font-serif);font-weight:500;font-size:17px}.members li.offline>span:first-child{color:var(--ink-soft)}.top{display:flex;align-items:center;gap:8px;padding:6px 12px;padding-top:max(6px,env(safe-area-inset-top,0px));border-bottom:2px solid var(--ink)}.top .brand{margin:0;line-height:inherit;font-family:var(--font-serif);font-weight:600;font-size:20px}.top .meta{flex:1;color:var(--ink-soft);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lobby .top{padding:0 0 8px}.lobby .top .brand{flex:1}.game{height:100%;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.play-area{flex:1;min-height:0;display:flex;flex-direction:column}.table{position:relative;flex:1;min-height:0}.table-body,.card-layer{transition:opacity .2s}.table-body.dimmed,.card-layer.dimmed{opacity:.5}.seat{display:flex;flex-direction:column;align-items:center;gap:4px;--scw: var(--cw);--sch: var(--ch)}.seat.mine{--scw: var(--my-cw);--sch: var(--my-ch)}.seat.eliminated .grid{opacity:.35}.nameplate{display:flex;gap:4px;align-items:center;max-width:100%;padding:1px 6px;border-radius:var(--radius);font-family:var(--font-serif);font-weight:500;font-size:14px;white-space:nowrap}.nameplate .name{overflow:hidden;text-overflow:ellipsis}.seat.turn .nameplate{background:var(--accent);color:var(--on-accent)}.seat.turn .nameplate .badge.host{color:var(--on-accent);box-shadow:inset 0 0 0 1px var(--on-accent)}.seat.turn .nameplate .badge.clock{background:var(--surface);color:var(--accent)}.grid{position:relative;display:grid;grid-template-columns:repeat(3,var(--scw));grid-auto-rows:var(--sch);gap:var(--gap)}.slot{width:var(--scw);height:var(--sch);border-radius:var(--card-radius);border:1px dashed var(--ink-soft)}.held-spot{position:absolute;width:var(--scw);height:var(--sch);right:calc(-.55 * var(--scw));top:calc(-.35 * var(--sch));pointer-events:none}.center{display:flex;gap:52px;align-items:center;justify-content:center}.deck,.discard{position:relative;width:var(--mid-cw);height:var(--mid-ch);border-radius:var(--card-radius)}.discard{border:1px dashed var(--ink-soft)}.deck-stack{position:absolute;inset:0;border-radius:var(--card-radius);border:var(--card-edge);background:repeating-linear-gradient(45deg,var(--accent) 0 5px,var(--accent-2) 5px 10px);box-shadow:inset 0 0 0 3px var(--surface),2px 2px 0 -1px var(--surface),2px 2px 0 0 var(--ink-soft),4px 4px 0 -1px var(--surface),4px 4px 0 0 var(--ink-soft),var(--card-shadow)}.deck-stack[data-count="0"]{opacity:.2}.deck-count{position:absolute;top:-8px;left:-8px;z-index:1;min-width:22px;padding:0 5px;border-radius:var(--radius);background:var(--ink);color:var(--paper);text-align:center;font-size:11px;line-height:18px}.deck.actionable{cursor:pointer}.deck.actionable .deck-stack{box-shadow:inset 0 0 0 3px var(--surface),var(--card-ring),var(--card-shadow-lifted)}.table.ring .home-row{display:contents}.table.ring .table-body{position:absolute;inset:0}.table.ring{min-height:520px}.table.ring .table-body:before{content:"";position:absolute;inset:6% 4%;border-radius:50%;border:1px solid var(--rule)}.table.ring .seat.placed{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%)}.table.ring .seat.mine,.table.ring .home-row>.seat{position:absolute;left:50%;bottom:12px;transform:translate(-50%)}.table.ring .center{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%)}.card-layer{position:absolute;inset:0;pointer-events:none;perspective:900px}.card{position:absolute;top:0;left:0;pointer-events:auto;touch-action:manipulation;user-select:none;-webkit-user-select:none}.card.tappable{cursor:pointer}.lifter{width:100%;height:100%;border-radius:var(--card-radius);transition:transform .14s ease-out,box-shadow .14s ease-out}.card.ring .lifter{transform:translateY(-4px);box-shadow:var(--card-ring)}@media(hover:hover){.card.tappable:hover .lifter{transform:translateY(-4px);box-shadow:var(--card-ring)}}.card.tappable:active .lifter{transform:translateY(-1px)}.flipper{position:relative;width:100%;height:100%;transform-style:preserve-3d}.front,.back{position:absolute;inset:0;border-radius:var(--card-radius);border:var(--card-edge);backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:var(--card-shadow)}.back{transform:rotateY(180deg);background:repeating-linear-gradient(45deg,var(--accent) 0 5px,var(--accent-2) 5px 10px);box-shadow:inset 0 0 0 3px var(--surface),var(--card-shadow)}.mini-card .back{transform:none}.front{background:var(--surface);color:var(--suit-black);display:flex;align-items:center;justify-content:center;overflow:hidden;font-family:var(--font-serif)}.front.red{color:var(--suit-red)}.front .corner{position:absolute;top:3px;left:4px;font-size:13px;font-weight:600;line-height:1}.front .pip{font-size:22px;line-height:1}.front .value{position:absolute;bottom:2px;right:4px;font-family:var(--font-sans);font-size:10px;color:var(--ink-soft)}.front.red-king{background:var(--gold-wash);border:2px solid var(--gold)}.front.red-king .pip{font-size:26px}.front.red-king .value{color:var(--suit-red);font-weight:600;font-size:12px}.front.joker{background:var(--joker-wash);border:2px solid var(--joker);color:var(--joker)}.front.joker .pip{font-family:var(--font-sans);font-size:10px;font-weight:500;letter-spacing:.05em}.front.joker .value{color:var(--joker);font-weight:600}.card.penalty .lifter{box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--danger),0 0 14px 4px #b3261e73}.card.peeked .lifter{box-shadow:var(--card-ring),var(--card-shadow-lifted)}.peek-tag{position:absolute;left:50%;bottom:-8px;z-index:1;transform:translate(-50%);font-size:10px;white-space:nowrap;background:var(--ink);color:var(--paper);padding:0 5px;border-radius:var(--radius);pointer-events:none}.action-bar{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;min-height:60px;padding:8px 12px calc(8px + var(--safe-bottom));color:var(--ink-soft);text-align:center;border-top:1px solid var(--rule)}.action-bar .btn{min-height:48px;flex:1;max-width:180px}.overlay{position:relative;z-index:200;margin:0 auto;width:min(100%,640px);max-height:46vh;overflow:auto;background:var(--surface);color:var(--ink);border-top:2px solid var(--ink);border-radius:var(--radius) var(--radius) 0 0;padding:10px 14px calc(12px + var(--safe-bottom));box-shadow:0 -8px 24px #13233c2e}.overlay.collapsed{padding-bottom:calc(6px + var(--safe-bottom))}.overlay.collapsed header{margin-bottom:0}.overlay header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.overlay h2{margin:0;flex:1;font-size:17px}.overlay .hint{margin:6px 0;font-size:13px;color:var(--ink-soft)}.overlay-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}.peek-waiting{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:8px;font-size:14px}.held-row{display:flex;gap:12px;align-items:center;margin-bottom:8px}.opp-grids{display:flex;flex-wrap:wrap;gap:10px 16px}.mini-label{font-family:var(--font-serif);font-weight:500;font-size:13px;margin-bottom:3px}.mini.disabled{opacity:.4}.mini-grid{display:grid;grid-template-columns:repeat(3,44px);grid-auto-rows:54px;gap:6px}.mini-card{position:relative;width:44px;height:54px;padding:0;border-radius:var(--card-radius);border:1px dashed var(--ink-soft);background:transparent;cursor:pointer;transition:transform .14s ease-out,box-shadow .14s ease-out}.mini-card:not(.empty){border-color:transparent}.mini-card:not(.empty):not(:disabled):focus-visible{transform:translateY(-3px);box-shadow:var(--card-ring);outline:none}@media(hover:hover){.mini-card:not(.empty):not(:disabled):hover{transform:translateY(-3px);box-shadow:var(--card-ring)}}.mini-card.big{width:62px;height:86px;cursor:default}.mini-grid.static .mini-card{cursor:default}.log{position:fixed;z-index:300;top:60px;right:8px;bottom:8px;width:min(340px,calc(100% - 16px));display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--rule);border-top:2px solid var(--ink);border-radius:var(--radius);box-shadow:0 10px 30px #13233c2e}.log header{display:flex;align-items:center;padding:4px 4px 4px 12px;border-bottom:1px solid var(--rule)}.log h3{flex:1;font-size:16px}.log ol{margin:0;padding:8px 12px 12px 30px;overflow:auto;font-size:13px}.log li{margin:3px 0}.log li::marker{color:var(--ink-soft)}.banner{position:fixed;z-index:250;top:64px;left:50%;transform:translate(-50%);width:min(92%,420px);background:var(--surface);color:var(--ink);border-top:2px solid var(--ink);border-radius:var(--radius);padding:12px 16px;box-shadow:0 10px 30px #13233c38}.banner p{margin:4px 0}.totals{list-style:none;padding:0;margin:6px 0;display:flex;flex-wrap:wrap;gap:4px 14px}.modal-back{position:fixed;inset:0;z-index:400;background:var(--scrim);display:flex;align-items:center;justify-content:center;padding:16px}.modal{width:min(100%,460px);max-height:100%;display:flex;flex-direction:column;background:var(--surface);color:var(--ink);border-top:2px solid var(--ink);border-radius:var(--radius);box-shadow:0 20px 50px #13233c4d}.modal.wide{width:min(100%,720px)}.modal>header{display:flex;align-items:center;gap:8px;padding:12px 12px 8px 18px}.modal>header h2{flex:1;font-size:24px}.modal-body{padding:0 18px 18px;overflow:auto}.modal-body h3{margin:18px 0 6px;font-size:18px;font-weight:500;padding-bottom:4px;border-bottom:1px solid var(--rule)}.modal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;align-items:center}.modal-actions.column{flex-direction:column;align-items:stretch}.final-hands{display:flex;flex-wrap:wrap;gap:12px 20px}.final-hand>span{display:block;font-size:13px;margin-bottom:4px}.rules .lede{font-family:var(--font-serif);font-size:18px;color:var(--ink-soft)}.rules ul{padding-left:20px}.rules li{margin:4px 0}.value-table{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}.value-cell{display:flex;align-items:center;gap:6px;font-size:13px}.value-cell .mini-card{cursor:default;border:none;flex:none}.toasts{position:fixed;z-index:500;left:50%;top:64px;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;width:min(92%,380px);pointer-events:none}.toast{background:var(--ink);color:var(--paper);padding:8px 14px;border-radius:var(--radius);font-size:14px;text-align:center;box-shadow:0 6px 18px #13233c40}.conn-banner{position:fixed;z-index:450;top:0;left:0;right:0;background:var(--danger);color:var(--on-accent);text-align:center;font-size:13px;padding:4px 8px;padding-top:max(4px,env(safe-area-inset-top,0px))}@media(max-width:760px){:root{--cw: 44px;--ch: 46px;--my-cw: 58px;--my-ch: 78px;--mid-cw: 50px;--mid-ch: 68px;--gap: 4px}.top .brand{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.top{padding:4px 10px;gap:6px}.top .btn{padding:0 10px}.table.stack .table-body{height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:4px 16px 6px;gap:6px}.table.stack .home-row{display:flex;align-items:flex-end;justify-content:center;gap:18px;width:100%}.table.stack .center{flex-direction:column;gap:14px;padding-bottom:2px}.table.stack .opponents{flex:1;align-content:center;display:grid;grid-template-columns:repeat(2,auto);justify-content:center;gap:6px 22px}.table.stack.n2 .opponents{grid-template-columns:auto}.table.stack .seat .nameplate{font-size:13px;padding:0 5px}.table.stack .seat:not(.mine) .held-spot{right:calc(-.4 * var(--scw));top:calc(-.2 * var(--sch))}.table.stack .seat.mine .held-spot{right:calc(-.75 * var(--scw))}.front .corner{font-size:11px;top:2px;left:3px}.front .pip{font-size:17px}.seat:not(.mine) .front .value{display:none}.overlay{max-height:52vh}.log{top:54px;left:8px;width:auto}}@media(max-width:760px)and (max-height:700px){:root{--my-cw: 52px;--my-ch: 66px;--mid-cw: 46px;--mid-ch: 60px}.action-bar{min-height:52px;padding-top:4px}}@media(prefers-reduced-motion:reduce){.table-body,.card-layer,.lifter,.mini-card{transition:none}}@media(min-width:1100px){.play-area:has(>.overlay){flex-direction:row}.play-area>.overlay{order:2;flex:0 0 360px;width:360px;max-height:none;margin:0;border-top:none;border-left:2px solid var(--ink);border-radius:0;box-shadow:-8px 0 24px #13233c1f;padding-bottom:16px}}.match-reason{font-family:var(--font-serif);font-size:17px;margin:0 0 12px}@media(min-width:1100px){.game:has(.play-area>.overlay) .log{right:368px}}.mini-card.marked{box-shadow:var(--card-ring)}.overlay .hint.warn{color:var(--ink);font-weight:600}.king-pair{gap:20px}.king-look{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px}.skip{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.skip:focus{position:fixed;left:12px;top:12px;width:auto;height:auto;z-index:1000;padding:10px 16px;background:var(--paper);border:2px solid var(--ink);color:var(--ink)}#actions:focus,.modal:focus{outline:none}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.card.tappable:focus-visible{outline:none}.card.tappable:focus-visible .lifter{transform:translateY(-4px);box-shadow:var(--card-ring)}