:root{--felt-hue:152;--felt-core:hsl(var(--felt-hue) 42% 27%);--felt-mid:hsl(var(--felt-hue) 48% 17%);--felt-edge:hsl(var(--felt-hue) 55% 7%);--glow:#f7d445;--glow-soft:#f7d4456b;--ink:#10151c;--card-red:#cc2229;--card-black:#16181d;--paper:#fdfdfb;--card-w:78px;--card-h:110px;--text:#f3f6f4;--text-dim:hsl(var(--felt-hue) 18% 74%);--plate:hsl(var(--felt-hue) 30% 12% / .82);--shadow-card:0 1px 2px #00000073, 0 7px 16px #00000061;--ease:cubic-bezier(.34, .8, .32, 1)}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--felt-edge);color:var(--text);margin:0;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,sans-serif;overflow:hidden}.btn{font:inherit;letter-spacing:.01em;border:1px solid hsl(var(--felt-hue) 25% 70% / .35);background:hsl(var(--felt-hue) 25% 16% / .9);color:var(--text);cursor:pointer;transition:transform .12s var(--ease), background .15s, box-shadow .15s;border-radius:999px;padding:.5rem 1.05rem;font-size:.86rem;font-weight:600}.btn:hover:not(:disabled){background:hsl(var(--felt-hue) 25% 24% / .95);transform:translateY(-1px)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{color:#2a1c00;background:linear-gradient(#facc42,#f59f0a);border-color:#fbda74;box-shadow:0 4px 18px #f9b00659}.btn--primary:hover:not(:disabled){background:linear-gradient(#ffd65c,#f9a91f)}.btn--ghost{border-color:hsl(var(--felt-hue) 20% 60% / .3);color:var(--text-dim);background:0 0}.btn--wide{width:100%;padding:.7rem;font-size:.95rem}.playing-card{--w:var(--card-w);--h:var(--card-h);width:var(--w);height:var(--h);border-radius:calc(var(--w) * .11);box-shadow:var(--shadow-card);cursor:default;background:linear-gradient(158deg,#fff 0%,#f6f7fa 58%,#e8eaf1 100%);border:1px solid #ffffffb3;flex:none;padding:0;font-family:inherit;display:block;position:relative;overflow:hidden}button.playing-card{cursor:pointer}.playing-card--red{color:var(--card-red)}.playing-card--black{color:var(--card-black)}.playing-card--small{--w:calc(var(--card-w) * .62);--h:calc(var(--card-h) * .62)}.playing-card--tiny{--w:calc(var(--card-w) * .44);--h:calc(var(--card-h) * .44)}.playing-card--large{--w:calc(var(--card-w) * 1.14);--h:calc(var(--card-h) * 1.14)}.playing-card:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,#ffffff80,#0000 42%);position:absolute;inset:0}.playing-card__index{top:calc(var(--h) * .045);left:calc(var(--w) * .07);flex-direction:column;align-items:center;font-weight:800;line-height:.94;display:flex;position:absolute}.playing-card__index--flip{top:auto;left:auto;bottom:calc(var(--h) * .045);right:calc(var(--w) * .07);transform:rotate(180deg)}.playing-card__rank{font-size:calc(var(--w) * .28);letter-spacing:-.04em}.playing-card__suit{font-size:calc(var(--w) * .24)}.playing-card__pip{font-size:calc(var(--w) * .62);opacity:.15;place-items:center;display:grid;position:absolute;inset:0}.playing-card--wild{background:linear-gradient(158deg,#fffdf2 0%,#fdf3d4 60%,#f6e4ad 100%);border-color:#f4dd9a}.playing-card--back{background:repeating-linear-gradient(45deg, hsl(var(--felt-hue) 40% 24%) 0 6px, hsl(var(--felt-hue) 45% 19%) 6px 12px), hsl(var(--felt-hue) 45% 20%);border:1px solid hsl(var(--felt-hue) 30% 45% / .7);place-items:center;display:grid}.playing-card__emblem{aspect-ratio:1;background:hsl(var(--felt-hue) 40% 14%);border:2px solid var(--glow-soft);width:54%;color:var(--glow);font-weight:800;font-size:calc(var(--w) * .3);border-radius:50%;place-items:center;display:grid}.is-flying{visibility:hidden}.table-stage{background:radial-gradient(ellipse 62% 52% at 50% 46%, var(--felt-core) 0%, var(--felt-mid) 46%, var(--felt-edge) 100%);width:100%;height:100%;position:relative;overflow:hidden}.table-glow{background:radial-gradient(circle 34% at 50% 46%, hsl(var(--felt-hue) 55% 45% / .35), transparent 70%);pointer-events:none;position:absolute;inset:0}.table-rays{background:repeating-conic-gradient(from 0deg, hsl(var(--felt-hue) 60% 60% / .055) 0deg 14deg, transparent 14deg 30deg);pointer-events:none;width:150vmax;height:150vmax;animation:90s linear infinite rays;position:absolute;top:46%;left:50%;translate:-50% -50%}@keyframes rays{to{rotate:360deg}}.table-top{z-index:30;justify-content:space-between;align-items:center;gap:1rem;padding:.7rem 1.1rem;display:flex;position:absolute;inset:0 0 auto}.table-top__brand{letter-spacing:.06em;text-transform:uppercase;font-size:.9rem;font-weight:800}.table-top__round{color:var(--text-dim);letter-spacing:.02em;margin-left:.5rem;font-weight:600}.scoreboard{gap:.5rem;display:flex}.scoreboard__team{background:var(--plate);border:1px solid hsl(var(--felt-hue) 25% 55% / .25);border-radius:999px;align-items:center;gap:.5rem;padding:.3rem .7rem;font-size:.78rem;display:flex}.scoreboard__team.is-you{border-color:var(--glow-soft)}.scoreboard__name{color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;max-width:12ch;overflow:hidden}.scoreboard__score{font-size:.95rem;font-weight:800}.scoreboard__tags{gap:.25rem;display:flex}.tag{text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);background:#ffffff17;border-radius:999px;padding:.12rem .38rem;font-size:.62rem}.tag--red{color:#f6acac;background:#c322224d}.tag--against{color:#f8b377;background:#ffffff17}.seat{z-index:12;flex-direction:column;align-items:center;gap:.35rem;display:flex;position:absolute}.seat--top{top:3.4rem;left:50%;translate:-50%}.seat--upper-left{top:4.2rem;left:4%}.seat--upper-right{top:4.2rem;right:4%}.seat--left{top:46%;left:1.5%;translate:0 -50%}.seat--right{top:46%;right:1.5%;translate:0 -50%}.seat__plate{background:var(--plate);border:1px solid hsl(var(--felt-hue) 25% 55% / .28);border-radius:999px;align-items:center;gap:.45rem;padding:.28rem .7rem .28rem .28rem;transition:box-shadow .3s,border-color .3s;display:flex}.seat--active .seat__plate{border-color:var(--glow);box-shadow:0 0 0 1px var(--glow-soft), 0 0 26px var(--glow-soft)}.seat__avatar{background:linear-gradient(160deg, hsl(var(--felt-hue) 30% 42%), hsl(var(--felt-hue) 35% 26%));border:1px solid #ffffff40;border-radius:50%;place-items:center;width:1.85rem;height:1.85rem;font-weight:800;display:grid}.seat__name{align-items:baseline;gap:.35rem;font-size:.82rem;font-weight:600;display:flex}.seat__team{text-transform:uppercase;letter-spacing:.06em;color:var(--glow);font-size:.6rem}.seat__count{text-align:center;background:#ffffff1f;border-radius:6px;min-width:1.5rem;padding:.1rem .35rem;font-size:.78rem;font-weight:800}.seat__hand{height:calc(var(--card-h) * .68);justify-content:center;align-items:flex-start;display:flex}.seat__card{margin:0 calc(var(--card-w) * -.19);transform:rotate(var(--rot)) translateY(var(--lift));transform-origin:50% 120%}.seat--left .seat__hand,.seat--right .seat__hand{scale:.85}.seat__melds{flex-direction:column;align-items:center;gap:.25rem;max-width:30vw;display:flex}.meld-area{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:.55rem;display:flex}.meld-area--empty{color:hsl(var(--felt-hue) 15% 60% / .75);padding:.4rem 0;font-size:.75rem;font-style:italic}.meld-group{transition:border-color .15s, background .15s, transform .15s var(--ease);border:1px solid #0000;border-radius:10px;padding:.3rem .45rem .5rem;position:relative}.meld-group--addable{cursor:pointer;border-color:var(--glow-soft);background:#f5d03d14}.meld-group--addable:hover{background:#f5d03d2e;transform:translateY(-2px)}.meld-group--natural{background:#eebd2b24;border-color:#f0c44280}.meld-group--mixed{background:#94bdd11f;border-color:#a6c8d966}.meld-group__cards{display:flex}.meld-group__slot{margin-left:calc(var(--card-w) * -.36)}.meld-group__slot:first-child{margin-left:0}.meld-group--compact .meld-group__slot{margin-left:calc(var(--card-w) * -.26)}.meld-group__badge{letter-spacing:.08em;background:var(--glow);color:#2a1c00;white-space:nowrap;border-radius:999px;padding:.1rem .4rem;font-size:.55rem;font-weight:800;position:absolute;bottom:-.35rem;left:50%;translate:-50%}.red-three-zone{min-height:calc(var(--card-h) * .44);align-items:center;display:flex}.red-three-zone__slot{margin-left:calc(var(--card-w) * -.3)}.red-three-zone__slot:first-child{margin-left:0}.red-three-zone.is-filled{background:#a3292929;border-radius:8px;padding:.2rem .35rem}.center-piles{z-index:14;gap:2.2rem;display:flex;position:absolute;top:45%;left:50%;translate:-50% -50%}.pile-slot{flex-direction:column;align-items:center;gap:.4rem;display:flex}.pile{cursor:pointer;transition:transform .15s var(--ease), filter .15s;background:0 0;border:none;border-radius:12px;padding:0;position:relative}.pile:disabled{cursor:default}.pile:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-4px)}.pile--stock:before,.pile--stock:after{content:"";border-radius:calc(var(--card-w) * .11);background:hsl(var(--felt-hue) 45% 15%);border:1px solid hsl(var(--felt-hue) 30% 40% / .6);position:absolute;inset:0}.pile--stock:before{translate:4px 4px}.pile--stock:after{translate:2px 2px}.pile--stock>*{z-index:1;position:relative}.pile__empty{width:calc(var(--card-w) * 1.14);height:calc(var(--card-h) * 1.14);border-radius:calc(var(--card-w) * .11);border:2px dashed #ffffff2e;display:block}.pile__label{color:var(--text-dim);letter-spacing:.04em;font-size:.72rem}.pile__hint{color:var(--glow);text-align:center;max-width:11rem;font-size:.66rem}.pile__hint--blocked{color:#f8b377;max-width:13rem;line-height:1.25}@keyframes breathe{0%,to{box-shadow:0 0 #f7d44500,0 0 #f7d44500}50%{box-shadow:0 0 0 3px #f7d4458c,0 0 34px 10px #f7d44566}}.pile--live{border-radius:calc(var(--card-w) * .11);animation:2.6s ease-in-out infinite breathe}.pile--target{animation:1.8s ease-in-out infinite breathe}.you-zone{z-index:20;flex-direction:column;align-items:center;gap:.3rem;padding-bottom:.4rem;display:flex;position:absolute;inset:auto 0 0}.you-zone__table{min-height:calc(var(--card-h) * .7);align-items:flex-end;gap:1rem;padding:0 1rem;display:flex}.tray{background:hsl(var(--felt-hue) 35% 10% / .72);border:1px solid var(--glow-soft);animation:trayIn .22s var(--ease);border-radius:14px;align-items:center;gap:.9rem;padding:.45rem .9rem;display:flex;box-shadow:0 8px 30px #00000059}@keyframes trayIn{0%{opacity:0;transform:translateY(10px)}}.tray__groups{gap:.9rem;display:flex}.tray__group{flex-direction:column;align-items:center;gap:.2rem;display:flex}.tray__cards{display:flex}.tray__slot{margin-left:calc(var(--card-w) * -.3)}.tray__slot:first-child{margin-left:0}.tray__meta{color:var(--text-dim);letter-spacing:.03em;font-size:.68rem}.tray__meta em{color:#f7ad64;font-style:normal}.tray__meta b{color:var(--glow);font-weight:700}.tray__slot--pile .playing-card{box-shadow:0 0 0 2px var(--glow), var(--shadow-card)}.tray__group--warn .tray__meta{color:#f7ad64}.tray__threshold{border-left:1px solid #ffffff1f;align-items:baseline;gap:.3rem;padding-left:.8rem;display:flex}.tray__total{color:#f7ad64;font-size:1.3rem;font-weight:800}.tray__threshold.is-met .tray__total{color:var(--glow)}.tray__of{color:var(--text-dim);font-size:.7rem}.action-bar{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;min-height:2.1rem;display:flex}.action-bar__turn{color:var(--text-dim);letter-spacing:.02em;font-size:.8rem}.action-bar__turn.is-you{color:var(--glow);font-weight:700}.action-bar__note{color:#f4b371;font-size:.72rem}.action-bar__error{color:#f99494;background:#981b1b59;border-radius:999px;padding:.2rem .6rem;font-size:.75rem}.hand-fan{height:calc(var(--card-h) + 1.4rem);justify-content:center;align-items:flex-end;padding-top:1.4rem;display:flex}.hand-fan__slot{margin:0 calc(var(--card-w) * -.32);transform:rotate(var(--rot)) translateY(var(--lift));transform-origin:50% 135%;transition:transform .16s var(--ease), filter .16s;z-index:var(--i)}.hand-fan__slot:hover{transform:rotate(var(--rot)) translateY(calc(var(--lift) - 30px)) scale(1.07);z-index:99;filter:drop-shadow(0 10px 18px #00000080)brightness(1.06)}.hand-fan__slot:hover .playing-card{border-color:var(--glow);box-shadow:0 0 0 2px var(--glow-soft), var(--shadow-card)}.flight-layer{pointer-events:none;z-index:60;position:fixed;inset:0}.flight{will-change:transform;filter:drop-shadow(0 14px 22px #00000073);position:absolute;top:0;left:0}.table-stage--summary{place-items:center;display:grid}.summary-card{background:hsl(var(--felt-hue) 35% 9% / .9);border:1px solid hsl(var(--felt-hue) 25% 50% / .3);text-align:center;border-radius:20px;flex-direction:column;align-items:center;gap:1rem;width:min(30rem,92vw);padding:2rem;display:flex;box-shadow:0 30px 80px #0000008c}.summary-card__title{letter-spacing:-.01em;margin:0;font-size:1.6rem}.summary-card__lede{color:var(--text-dim);margin:0;font-size:.9rem}.summary-card__wait{color:var(--text-dim);margin:0;font-size:.85rem}.summary-card .scoreboard{flex-direction:column;width:100%}.summary-card .scoreboard__team{justify-content:space-between}.boot{height:100%;color:var(--text-dim);place-items:center;gap:1rem;display:grid}.boot__pulse{background:hsl(var(--felt-hue) 40% 22%);border:1px solid hsl(var(--felt-hue) 30% 45%);border-radius:8px;width:3rem;height:4.2rem;animation:1.8s ease-in-out infinite breathe}.portal{background:radial-gradient(ellipse 70% 60% at 50% 30%, var(--felt-core), var(--felt-mid) 45%, var(--felt-edge));height:100%;position:relative;overflow-y:auto}.portal__glow{background:radial-gradient(circle 30% at 50% 22%, hsl(var(--felt-hue) 60% 50% / .3), transparent 70%);pointer-events:none;position:absolute;inset:0}.portal__inner{flex-direction:column;gap:1rem;width:min(30rem,92vw);margin:0 auto;padding:3rem 0;display:flex;position:relative}.portal__title{letter-spacing:-.03em;text-align:center;margin:0;font-size:2.7rem;font-weight:800}.portal__sub{text-align:center;color:var(--text-dim);margin:-.6rem 0 .6rem;font-size:.9rem}.portal__error{color:#fbb6b6;background:#981b1b59;border-radius:10px;margin:0;padding:.6rem .9rem;font-size:.85rem}.portal__wait{text-align:center;color:var(--text-dim);font-size:.9rem}.panel{background:hsl(var(--felt-hue) 35% 10% / .62);border:1px solid hsl(var(--felt-hue) 25% 50% / .22);border-radius:16px;flex-direction:column;gap:.8rem;padding:1.1rem;display:flex}.panel--code{align-items:center;gap:.3rem}.panel__title{text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);align-items:center;gap:.5rem;margin:0;font-size:.78rem;font-weight:700;display:flex}.panel__count{color:var(--text)}.panel__mode{text-transform:none;letter-spacing:.02em;color:var(--glow);margin-left:auto}.panel__hint{color:var(--text-dim);margin:0;font-size:.8rem}.room-code{letter-spacing:.28em;color:var(--glow);text-shadow:0 0 30px var(--glow-soft);padding-left:.28em;font-size:2.6rem;font-weight:800}.field{flex-direction:column;gap:.35rem;display:flex}.field--inline{flex-direction:row;justify-content:space-between;align-items:center}.field__label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);font-size:.75rem;font-weight:600}.field__input{font:inherit;border:1px solid hsl(var(--felt-hue) 25% 50% / .35);background:hsl(var(--felt-hue) 40% 8% / .7);color:var(--text);border-radius:10px;outline:none;padding:.6rem .8rem}.field__input:focus{border-color:var(--glow);box-shadow:0 0 0 3px var(--glow-soft)}.field__input--code{letter-spacing:.3em;text-align:center;text-transform:uppercase;flex:1;font-size:1.4rem;font-weight:800}.mode-grid{grid-template-columns:1fr 1fr;gap:.6rem;display:grid}.mode-card{cursor:pointer;text-align:left;border:1px solid hsl(var(--felt-hue) 25% 50% / .28);background:hsl(var(--felt-hue) 35% 14% / .6);color:var(--text);font:inherit;transition:border-color .15s, background .15s, transform .12s var(--ease);border-radius:12px;flex-direction:column;align-items:flex-start;gap:.15rem;padding:.7rem .8rem;display:flex}.mode-card:hover{background:hsl(var(--felt-hue) 35% 20% / .7);transform:translateY(-2px)}.mode-card.is-active{border-color:var(--glow);box-shadow:0 0 0 1px var(--glow-soft);background:#f5d03d1f}.mode-card__label{letter-spacing:.02em;font-size:1rem;font-weight:800}.mode-card__blurb{color:var(--text-dim);font-size:.72rem}.mode-card__seats{color:var(--glow);text-transform:uppercase;letter-spacing:.06em;font-size:.65rem}.join-row{gap:.5rem;display:flex}.seat-list{flex-direction:column;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.seat-list__row{background:hsl(var(--felt-hue) 40% 8% / .5);opacity:.55;border-radius:10px;align-items:center;gap:.6rem;padding:.4rem .5rem;display:flex}.seat-list__row.is-filled{opacity:1}.seat-list__avatar{background:linear-gradient(160deg, hsl(var(--felt-hue) 30% 42%), hsl(var(--felt-hue) 35% 26%));border-radius:50%;place-items:center;width:1.8rem;height:1.8rem;font-weight:800;display:grid}.seat-list__name{align-items:center;gap:.4rem;font-size:.9rem;display:flex}.seat-list__you,.seat-list__host{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);background:#ffffff1f;border-radius:999px;padding:.1rem .35rem;font-size:.6rem}.seat-list__host{color:var(--glow);background:#f5d03d33}@media (width<=900px){:root{--card-w:62px;--card-h:88px}}@media (height<=720px){:root{--card-w:64px;--card-h:90px}}
