:root{--card-w: clamp(44px, 9vmin, 86px);--felt: #14532d;--felt-dark: #0b3a20;--ink: #0f1720;--paper: #fdfdfb;--muted: #64748b;--line: #cbd5e1;--accent: #f59e0b;--danger: #dc2626;--ok: #16a34a;color-scheme:dark;font-family:ui-rounded,SF Pro Rounded,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:linear-gradient(180deg,var(--felt-dark),var(--ink)) fixed;color:var(--paper);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.page{min-height:100%;display:flex;flex-direction:column;gap:1rem;padding:max(1.5rem,env(safe-area-inset-top)) 1.25rem max(1.5rem,env(safe-area-inset-bottom))}.page.narrow{max-width:30rem;margin:0 auto;width:100%}.page-title{margin:0;font-size:1.75rem}.page-links{display:flex;flex-direction:column;align-items:center;gap:.25rem;margin-top:auto}.landing{max-width:30rem;margin:0 auto;width:100%;justify-content:center;gap:1.5rem}.brand{margin:0;text-align:center;font-size:clamp(2.5rem,12vw,4rem);letter-spacing:.02em}.card-panel{display:flex;flex-direction:column;gap:.75rem;padding:1.25rem;border-radius:16px;background:#ffffff14}.landing-account{display:flex;flex-direction:column;align-items:stretch;gap:.5rem;text-align:center}.text-input{min-height:52px;border-radius:12px;border:2px solid rgb(255 255 255 / 20%);background:#0000004d;color:var(--paper);font:inherit;font-size:1.1rem;padding:0 .9rem;-webkit-user-select:text;user-select:text}a.big-button,a.text-button{display:flex;align-items:center;justify-content:center;text-decoration:none}a.text-button{text-decoration:underline}.page-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.section-title{margin:.5rem 0 0;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.75rem}.game-card{display:flex;flex-direction:column;gap:.3rem;padding:1rem;border-radius:14px;background:#ffffff17;border:2px solid transparent;color:var(--paper);text-decoration:none;min-height:44px}.game-card:hover,.game-card:focus-visible{border-color:var(--accent)}.game-card-name{font-weight:800;font-size:1.2rem}.game-card-blurb{color:#fffc}.game-card-meta,.game-meta{font-size:.8rem;color:var(--muted)}.game-description{margin:0;line-height:1.5}.rules-list{margin:.5rem 0 0;padding-left:1.1rem;display:flex;flex-direction:column;gap:.35rem;line-height:1.4}.pack-list{display:flex;flex-direction:column;gap:.75rem}.pack{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem;border-radius:14px;background:#ffffff17}.pack-text{display:flex;flex-direction:column;gap:.25rem;flex:1 1 16rem}.pack-name{font-weight:800;font-size:1.1rem}.pack-blurb{color:#fffc;line-height:1.4}.pack .big-button{flex:0 0 auto;min-width:7rem}.splash{display:grid;place-items:center;height:100%;font-size:1.5rem;color:var(--muted)}.card{width:var(--card-w);height:calc(var(--card-w) * 1.4);border-radius:calc(var(--card-w) * .1);background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:0 2px 6px #00000059;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1em;font-size:calc(var(--card-w) * .32);font-weight:700;line-height:1;padding:0;flex:none}.card.small{--card-w: clamp(26px, 4.5vmin, 44px)}.card.red{color:#b91c1c}.card .suit{font-size:1.1em}.card.back{background:repeating-linear-gradient(45deg,#1e3a8a,#1e3a8a 6px,#1d4ed8 6px,#1d4ed8 12px);border-color:#1e3a8a}button.card{cursor:default;opacity:.55;transform:translateY(4px);transition:transform .12s ease,opacity .12s ease}button.card.playable{cursor:pointer;opacity:1;transform:translateY(-4px);box-shadow:0 0 0 2px var(--accent),0 6px 14px #00000073}button.card.playable:active{transform:translateY(-10px)}.card.selected{box-shadow:0 0 0 3px var(--ok),0 8px 16px #00000073;transform:translateY(-12px)}.zone{display:flex;flex-direction:column;align-items:center;gap:.35rem}.zone-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.zone-row,.zone-fan{display:flex;align-items:flex-end}.zone-row{gap:.4rem;flex-wrap:wrap;justify-content:center}.zone-fan{flex-wrap:wrap;justify-content:center;row-gap:.5rem}.zone-fan>.card{margin-left:calc(var(--card-w) * -.2)}.zone-fan>.card:first-child{margin-left:0}.zone-stack{position:relative;display:flex}.zone-stack>.card.back{position:absolute;top:-4px;left:-4px}.zone-stack>.card:not(.back){position:relative;z-index:1}.zone-count{position:relative;display:flex}.count-badge{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:1.1rem;font-weight:800;color:var(--paper);text-shadow:0 1px 4px rgb(0 0 0 / 80%)}.zone-empty{width:clamp(44px,9vmin,86px);height:calc(clamp(44px,9vmin,86px)*1.4);border:2px dashed rgb(255 255 255 / 18%);border-radius:8px}.table-screen{height:100%;display:grid;grid-template-rows:auto 1fr auto;background:radial-gradient(ellipse at center,var(--felt) 0%,var(--felt-dark) 100%)}.table-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:clamp(.5rem,2vmin,1.25rem)}.room{display:flex;flex-direction:column}.room-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:#fff9}.room-code{font-size:clamp(2rem,7vmin,5rem);font-weight:800;letter-spacing:.12em;line-height:1}.table-title{text-align:center}.table-title h1{margin:0;font-size:clamp(1rem,3vmin,2rem)}.objective{margin:.25rem 0 0;font-size:clamp(.7rem,1.6vmin,1rem);color:#ffffffb3}.table-body{display:grid;place-items:center;padding:1rem;min-height:0;overflow:hidden}.avatar{font-size:clamp(1.5rem,4vmin,3rem);line-height:1}.seat-name{font-weight:700;font-size:clamp(.8rem,1.8vmin,1.2rem);display:flex;align-items:center;gap:.35rem}.host-tag{font-size:.6em;text-transform:uppercase;letter-spacing:.06em;background:#fff3;border-radius:999px;padding:.1em .5em}.seat-state{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:#ffffffa6}.badges{display:flex;gap:.4rem}.badge{display:flex;align-items:baseline;gap:.2rem;font-size:.7rem;color:#ffffffbf}.badge-count{font-weight:800;font-size:1.1em}.seat-zones{display:flex;gap:.3rem}.hand-screen{height:100%;display:flex;flex-direction:column;gap:.5rem;padding:max(.75rem,env(safe-area-inset-top)) .75rem max(.75rem,env(safe-area-inset-bottom));background:linear-gradient(180deg,var(--felt-dark),var(--ink));transition:box-shadow .2s ease}.room-screen.my-turn{box-shadow:inset 0 0 0 4px var(--accent);animation:turn-pulse 1.8s ease-in-out infinite}@keyframes turn-pulse{50%{box-shadow:inset 0 0 0 8px #f59e0b8c}}@media(prefers-reduced-motion:reduce){.room-screen.my-turn{animation:none}}.hand-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.who{font-weight:700}.pill{border-radius:999px;padding:.25rem .8rem;background:#ffffff24;font-size:.85rem;font-weight:700}.pill.mine{background:var(--accent);color:var(--ink)}.pill.warn{background:var(--danger)}.hand-zones>.zone{width:100%}.hand-zones{display:flex;flex-direction:column;align-items:stretch;gap:.75rem;max-height:45vh;overflow-y:auto}.hand-actions{display:flex;gap:.5rem}.hand-actions>.big-button,.sheet-options>.big-button{flex:1}.waiting{text-align:center;color:var(--muted);margin:0}.big-button{min-height:48px;border-radius:12px;border:none;background:#ffffff29;color:var(--paper);font:inherit;font-weight:700;font-size:1rem;cursor:pointer}.big-button.primary{background:var(--accent);color:var(--ink)}.big-button:disabled{opacity:.45;cursor:default}.text-button{background:none;border:none;color:var(--muted);font:inherit;text-decoration:underline;cursor:pointer;min-height:44px}.banner{border-radius:10px;padding:.6rem .9rem;font-weight:600;text-align:center}.banner.error{background:#dc262640;color:#fecaca}.banner.warn{background:#f59e0b40;color:#fde68a}.banner.win{background:#16a34a40;color:#bbf7d0}.field{display:flex;flex-direction:column;gap:.4rem;border:none;padding:0;margin:0}.field-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.field-help{font-size:.8rem;color:var(--muted)}.field-error{font-size:.8rem;color:#fca5a5}.code-input,.name-input{min-height:56px;border-radius:12px;border:2px solid rgb(255 255 255 / 20%);background:#0000004d;color:var(--paper);font:inherit;padding:0 .9rem;font-size:1.5rem;font-weight:700;-webkit-user-select:text;user-select:text}.code-input{letter-spacing:.3em;text-align:center}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(60px,1fr));gap:.5rem}.avatar-choice{aspect-ratio:1;border-radius:14px;border:2px solid transparent;background:#ffffff1a;font-size:2rem;cursor:pointer;min-height:48px}.avatar-choice.chosen{border-color:var(--accent);background:#f59e0b38}.clock{position:relative;display:inline-grid;place-items:center;flex:none}.clock svg{display:block}.clock-track{stroke:#ffffff2e;stroke-width:4}.clock-sweep{stroke:var(--ok);stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset .25s linear,stroke .3s ease}.clock.warning .clock-sweep{stroke:var(--danger)}.clock-number{position:absolute;font-size:.8rem;font-weight:800;font-variant-numeric:tabular-nums}.clock.big .clock-number{font-size:1.25rem}.clock.warning .clock-number{color:#fecaca}.header-right{display:flex;align-items:center;gap:.6rem}.room-screen.my-turn.warning{box-shadow:inset 0 0 0 5px var(--danger);animation:turn-warning .9s ease-in-out infinite}@keyframes turn-warning{50%{box-shadow:inset 0 0 0 11px #dc2626a6}}@media(prefers-reduced-motion:reduce){.room-screen.my-turn.warning{animation:none}}.shuffling{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.6rem 1rem;border-radius:12px;background:#00000073;font-weight:700;font-size:clamp(.8rem,2vmin,1.1rem)}.shuffling-cards{position:relative;width:34px;height:30px;flex:none}.shuffling-card{position:absolute;top:0;left:10px;width:14px;height:20px;border-radius:3px;background:repeating-linear-gradient(45deg,#1e3a8a,#1e3a8a 3px,#1d4ed8 3px,#1d4ed8 6px);border:1px solid #1e3a8a;animation:riffle .9s ease-in-out infinite}.shuffling-card:nth-child(2){animation-delay:.15s}.shuffling-card:nth-child(3){animation-delay:.3s}@keyframes riffle{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(-9px,-5px) rotate(-16deg)}}@media(prefers-reduced-motion:reduce){.shuffling-card{animation:none}}.scoreboard{text-align:center}.scoreboard-title{margin:0 0 .5rem;font-size:clamp(1.1rem,3vmin,2rem);font-weight:800}.scoreboard.compact .scoreboard-title{font-size:1.1rem}.scoreboard-rows{list-style:none;margin:0 0 .5rem;padding:0;display:flex;flex-direction:column;gap:.25rem;text-align:left}.scoreboard-rows li{display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;padding:.25rem .6rem;border-radius:8px;background:#ffffff0f}.scoreboard-rows li.winner{background:#16a34a40}.scoreboard-name{font-weight:600}.scoreboard-score{font-weight:800;font-variant-numeric:tabular-nums}.seat-score{display:flex;align-items:baseline;gap:.3rem}.seat-score-value{font-size:clamp(1rem,2.4vmin,1.6rem);font-weight:800;font-variant-numeric:tabular-nums}.seat-score-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:#ffffffa6}.room-hint{font-size:clamp(.6rem,1.2vmin,.9rem);color:#ffffff8c;letter-spacing:.02em}.table-status{display:flex;align-items:center;gap:.75rem}.qr{border-radius:6px;box-shadow:0 0 0 3px #fff}.table-waiting,.table-result{text-align:center;padding:1rem 1.5rem;border-radius:16px;background:#0000004d}.table-waiting-title{margin:0;font-size:clamp(1.25rem,4vmin,2.5rem);font-weight:800}.table-waiting-sub{margin:.4rem 0 0;font-size:clamp(.8rem,2vmin,1.25rem);color:#ffffffbf}.room-status{text-align:center;padding:.75rem;border-radius:12px;background:#ffffff14}.host-toggle{align-self:center}.host-panel{display:flex;flex-direction:column;gap:.75rem;padding:.9rem;border-radius:12px;background:#ffffff14;max-height:40vh;max-height:40dvh;overflow-y:auto;overscroll-behavior:contain}.host-row{display:flex;gap:.5rem}.host-row>.big-button{flex:1}.host-check{display:flex;align-items:center;gap:.6rem;min-height:44px;cursor:pointer}.host-check input{width:22px;height:22px;accent-color:var(--accent)}.host-seats{display:flex;flex-direction:column;gap:.35rem}.host-seat{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:44px}.text-button.danger{color:#fca5a5}.sheet{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;align-items:end;background:#0000008c}.sheet-body{background:#1e293b;border-radius:16px 16px 0 0;padding:1.25rem 1rem max(1.25rem,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:.75rem}.game-meta{font-size:.8rem;color:var(--muted)}.seat-choices{display:flex;gap:.5rem;flex-wrap:wrap}.seat-choice{min-width:56px;min-height:56px;border-radius:12px;border:2px solid transparent;background:#ffffff1a;color:var(--paper);font:inherit;font-size:1.25rem;font-weight:700;cursor:pointer}.seat-choice.chosen{border-color:var(--accent);background:#f59e0b38}.arg{text-transform:capitalize}.arg.red{color:#fca5a5}.sheet-title{margin:0;font-weight:700;text-align:center}.sheet-options{display:flex;gap:.5rem;flex-wrap:wrap}.lobby{display:flex;flex-direction:column;gap:1.25rem;padding:.5rem 0 1.5rem}.lobby-head{text-align:center}.lobby-game{margin:0 0 .25rem;font-size:clamp(1.4rem,6vw,2rem)}.lobby-code{display:flex;align-items:center;justify-content:center;gap:1.25rem;flex-wrap:wrap;padding:1rem;border-radius:16px;background:#ffffff14}.lobby-code .room{align-items:center}.invite{display:flex;gap:.5rem;flex-wrap:wrap}.invite>.big-button,.invite>a.big-button{flex:1 1 auto;min-width:6.5rem;font-size:.95rem;text-align:center;text-decoration:none}.lobby-seats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem}.lobby-seats li{display:flex;align-items:center;gap:.5rem;min-height:44px;padding:.4rem .8rem;border-radius:12px;background:#ffffff14}.lobby-seats li.empty{background:none;border:1px dashed rgb(255 255 255 / 20%);color:var(--muted)}.lobby-seats li.offline{opacity:.6}.lobby-seat-name{font-weight:600}.lobby-settings{display:flex;flex-direction:column;gap:1rem;padding-top:.5rem;border-top:1px solid rgb(255 255 255 / 12%)}.seat-choice:disabled{opacity:.35;cursor:not-allowed}.room-screen{position:relative;height:100%;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(ellipse 130% 60% at 50% 40%,var(--felt) 0%,var(--felt-dark) 70%,var(--ink) 100%);transition:box-shadow .2s ease}.room-screen>.hand-header,.room-screen>.banner{flex:none;margin:0;padding:max(.5rem,env(safe-area-inset-top)) .75rem .5rem}.ring{position:relative;flex:1 1 auto;min-height:0;margin:2.75rem clamp(3rem,14vw,7rem) 0;justify-self:stretch;align-self:stretch;min-width:0}.ring.full{margin:clamp(3.5rem,9vmin,6rem) clamp(5rem,16vw,12rem)}.ring-seat{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.25rem .4rem;border-radius:12px;border:2px solid transparent;white-space:nowrap}.ring-seat.active{border-color:var(--accent);background:#f59e0b2e}.ring-seat.offline,.ring-seat.away{opacity:.5}.ring-seat.empty{color:var(--muted);border-style:dashed;border-color:#fff3}.ring-seat-meta{display:flex;flex-direction:column;align-items:center;line-height:1.15}.ring.full .ring-seat{gap:.3rem;padding:.5rem .75rem;background:#00000038}.ring-play{position:absolute;transform:translate(-50%,-50%)}.ring-middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:clamp(.75rem,4vmin,3rem);flex-wrap:wrap}.hand-layer{flex:none;display:flex;flex-direction:column;gap:.5rem;padding:.5rem .75rem max(.75rem,env(safe-area-inset-bottom));background:linear-gradient(180deg,#09121800,#091218d1 22%,#091218f5)}.hand-layer{container-type:inline-size}.hand-layer .zone-fan{--card-w: clamp(40px, calc(97cqw / var(--fan-slots, 6)), 92px)}.observers{display:flex;flex-direction:column;gap:.35rem;padding:.5rem clamp(.5rem,2vmin,1.25rem)}.observer-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}.observer-list li{display:flex;align-items:center;gap:.35rem;padding:.25rem .6rem;border-radius:999px;background:#ffffff1a;font-size:.85rem}.observer-name{font-weight:600}.mode-choice{min-height:56px;padding:0 1.25rem;border-radius:12px;border:2px solid transparent;background:#ffffff1a;color:var(--paper);font:inherit;font-weight:700;cursor:pointer}.mode-choice.chosen{border-color:var(--accent);background:#f59e0b38}.variant-controls{display:flex;flex-direction:column;gap:.75rem;padding-top:.5rem;border-top:1px solid rgb(255 255 255 / 12%)}.stepper{display:flex;align-items:center;gap:.75rem}.stepper-value{min-width:3ch;text-align:center;font-size:1.25rem;font-weight:700;font-variant-numeric:tabular-nums}.hand-layer{transition:transform .26s ease}.hand-layer.retreated{transform:translateY(calc(100% - 3.25rem))}@media(prefers-reduced-motion:reduce){.hand-layer{transition:none}}.hand-handle{display:flex;align-items:center;gap:.5rem;min-height:2.75rem}.handle-grip{flex:1;display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.4rem;border:none;border-radius:12px;background:none;color:var(--paper);font:inherit;cursor:pointer}.handle-bar{width:2.5rem;height:4px;border-radius:2px;background:#ffffff73}.handle-label{font-size:.8rem;font-weight:600;color:var(--muted)}.handle-auto{min-height:2.25rem;padding:0 .75rem;border-radius:999px;border:1px solid rgb(255 255 255 / 25%);background:none;color:var(--muted);font:inherit;font-size:.75rem;font-weight:700;cursor:pointer}.handle-auto.on{border-color:var(--accent);background:#f59e0b33;color:var(--paper)}.host-seat-actions{display:flex;align-items:center;gap:.75rem}.page form{display:flex;flex-direction:column;gap:1rem;align-items:stretch}