.app-shell{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--space-2);padding:max(var(--space-4),env(safe-area-inset-top)) max(var(--space-4),env(safe-area-inset-right)) max(var(--space-4),env(safe-area-inset-bottom)) max(var(--space-4),env(safe-area-inset-left));background:var(--board-bg)}.app-shell--board{justify-content:flex-start;align-items:stretch;text-align:left;overflow-y:auto}.mute-button{position:fixed;top:max(.6rem,env(safe-area-inset-top));right:max(.6rem,env(safe-area-inset-right));z-index:50;width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;border:2px solid var(--line);border-radius:var(--radius-pill);background:#0e172699;color:var(--text);cursor:pointer;transition:transform .08s var(--ease)}.mute-button:active{transform:scale(.92)}.mute-button[data-muted=true]{opacity:.7}.install-hint{position:fixed;left:50%;bottom:max(.8rem,env(safe-area-inset-bottom));transform:translate(-50%);z-index:60;display:flex;align-items:center;gap:var(--space-2);max-width:min(36rem,calc(100vw - 1.6rem));padding:.7rem .9rem;border:2px solid var(--line);border-radius:var(--radius-lg);background:#0e1726eb;color:var(--text);box-shadow:var(--shadow-card)}.install-hint__icon{font-size:1.6rem;flex:0 0 auto}.install-hint__text{margin:0;font-size:.95rem;line-height:1.3}.install-hint__close{flex:0 0 auto;min-height:var(--tap-min);padding:.45rem 1rem;font-weight:800;border:none;border-radius:var(--radius-md);background:var(--accent);color:var(--accent-ink);cursor:pointer}.install-hint__close:active{transform:scale(.96)}.card{position:relative;box-sizing:border-box;width:var(--card-w);aspect-ratio:5 / 7;padding:var(--space-2);border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--surface-line);box-shadow:var(--shadow-card);overflow:hidden}.card:after{content:"";position:absolute;inset:calc(var(--card-w) * .035);border:2px solid rgba(29,39,64,.12);border-radius:calc(var(--radius-lg) - var(--card-w) * .035);pointer-events:none}.card__corner{position:absolute;top:calc(var(--card-w) * .045);width:calc(var(--card-w) * .24);height:calc(var(--card-w) * .24);padding:calc(var(--card-w) * .035);display:block;border-radius:var(--radius-pill);background:#fff;box-shadow:var(--shadow-soft);z-index:1}.card__corner--left{left:calc(var(--card-w) * .045)}.card__corner--right{right:calc(var(--card-w) * .045)}.card__corner svg,.card__fallback-emblem svg,.card__joker-art svg{width:100%;height:100%;display:block}.card__center{position:absolute;inset:calc(var(--card-w) * .32) calc(var(--card-w) * .06) calc(var(--card-w) * .06);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);background:linear-gradient(160deg,#fffdf8,#f1ece0);box-shadow:inset 0 0 0 1px #1d274014;overflow:hidden}.card__image{width:100%;height:100%;object-fit:cover}.card__fallback{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;height:100%;padding:var(--space-2)}.card__fallback-emblem{display:flex;align-items:center;justify-content:center;width:42%;aspect-ratio:1 / 1;padding:calc(var(--card-w) * .055);border-radius:var(--radius-pill);background:#fff;box-shadow:var(--shadow-soft)}.card--joker{display:flex;align-items:center;justify-content:center;background:conic-gradient(from 210deg,#e0322e,#f2761a,#f2c200,#2e9e4f,#0ea192,#2d6fe0,#8b5cf6,#ec4899,#e0322e)}.card--joker:after{border-color:#ffffff8c}.card__joker-art{display:flex;align-items:center;justify-content:center;width:66%;aspect-ratio:1 / 1;padding:calc(var(--card-w) * .078);border-radius:var(--radius-pill);background:#fff;box-shadow:var(--shadow-card);z-index:1}.game-board{width:100%;min-height:100%;display:grid;grid-template-rows:auto 1fr auto auto;gap:var(--space-3);align-content:start}.game-board__status{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:center}.player-status{display:flex;flex-direction:column;align-items:center;gap:.3rem;min-width:7rem;padding:.45rem .9rem;border-radius:var(--radius-lg);background:#ffffff12;border:2px solid transparent;transition:transform .12s var(--ease)}.player-status--active{border-color:var(--accent);background:#f2c20029;transform:translateY(-2px)}.player-status__name{font-weight:800;letter-spacing:.01em}.player-status__pips{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}.pip{width:.6rem;height:.6rem;border-radius:var(--radius-pill);background:#ffffff29}.pip--filled{background:var(--accent);box-shadow:0 0 6px #f2c200b3}.player-status__level{font-size:.95rem;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}.player-status--active .player-status__level{color:var(--text)}.game-board__middle{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-5)}.draw-pile{position:relative;min-width:calc(var(--card-w) * .52);min-height:calc(var(--card-w) * .73);padding:0;border:none;border-radius:var(--radius-md);cursor:pointer;background:var(--card-back);box-shadow:var(--shadow-card);color:#fff;display:flex;align-items:center;justify-content:center;transition:transform .1s var(--ease)}.draw-pile:before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid rgba(255,255,255,.28);pointer-events:none}.draw-pile:active{transform:scale(.97)}.draw-pile__count{position:relative;font-size:1.6rem;font-weight:900;padding:.1rem .6rem;border-radius:var(--radius-pill);background:#0e17268c;text-shadow:0 1px 3px rgba(0,0,0,.5)}.discard-piles{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center}.discard-pile{min-width:var(--tap-min);min-height:var(--tap-min);padding:.2rem;border:2px dashed var(--line);border-radius:var(--radius-md);background:#ffffff0a;cursor:pointer;display:flex;align-items:center;justify-content:center}.discard-pile[data-empty=true]{border-style:dashed}.discard-pile__empty{font-size:2rem;color:var(--line)}.game-board__own{display:flex;justify-content:center}.tile-tray{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center}.tile{position:relative;min-width:var(--tap-min);min-height:var(--tap-min);padding:.4rem;border:2px solid var(--line);border-radius:var(--radius-md);background:var(--bg-1);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .1s var(--ease)}.tile:active{transform:scale(.96)}.tile--covered .tile__back{width:100%;height:100%;min-height:48px;border-radius:var(--radius-sm);background:var(--card-back);box-shadow:inset 0 0 0 2px #ffffff2e}.tile--open{background:var(--surface);border-color:var(--surface-line)}.tile--open .tile__emblem{animation:tile-reveal .25s var(--ease) both}@keyframes tile-reveal{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}.tile__emblem{display:block;width:calc(var(--card-w) * .3);height:calc(var(--card-w) * .3)}.tile__emblem svg{width:100%;height:100%;display:block}.tile--center{cursor:default}.tile--highlight{border-color:var(--accent)}.tile--highlight:after{content:"";position:absolute;inset:-4px;border-radius:var(--radius-lg);box-shadow:0 0 0 3px var(--accent),0 0 18px #f2c200d9;opacity:.9;pointer-events:none;animation:pip-pulse 1s ease-in-out infinite alternate}@keyframes pip-pulse{0%{opacity:.4}to{opacity:1}}.tile--hint:not(.tile--highlight):after{content:"";position:absolute;inset:-3px;border-radius:var(--radius-lg);box-shadow:0 0 0 2px var(--hint, #5cc8ff),0 0 10px #5cc8ff8c;opacity:.7;pointer-events:none;animation:hint-glow 1.6s ease-in-out infinite alternate}.hand__card--hint:not(.hand__card--selected){border-color:var(--hint, #5cc8ff);box-shadow:0 0 10px #5cc8ff80;animation:hint-glow 1.6s ease-in-out infinite alternate}@keyframes hint-glow{0%{opacity:.45}to{opacity:.85}}@media(prefers-reduced-motion:reduce){.tile--hint:not(.tile--highlight):after,.hand__card--hint:not(.hand__card--selected){animation:none;opacity:.75}}.game-board__controls{display:flex;justify-content:center}.help-toggle{min-height:var(--tap-min);padding:.4rem 1.1rem;font-size:1.05rem;font-weight:800;border:2px solid var(--line);border-radius:var(--radius-pill);background:#ffffff0d;color:var(--muted);cursor:pointer;transition:transform .1s var(--ease),border-color .1s var(--ease)}.help-toggle:active{transform:scale(.97)}.help-toggle--on{border-color:var(--hint, #5cc8ff);color:var(--text);background:#5cc8ff24}.game-board__hand{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center;padding-top:var(--space-1)}.hand__card{flex:0 0 auto;padding:0;border:3px solid transparent;border-radius:var(--radius-lg);background:transparent;cursor:pointer;transition:transform .12s var(--ease)}.hand__card[disabled]{cursor:default}.hand__card--selected{border-color:var(--accent);transform:translateY(-.7rem)}.action-bar{display:flex;gap:var(--space-4);justify-content:center;padding:var(--space-1) 0 var(--space-2)}.action-button{min-width:8rem;min-height:var(--tap-min);padding:.6rem 1.4rem;font-size:1.25rem;font-weight:900;border:none;border-radius:var(--radius-md);cursor:pointer;color:var(--ink);box-shadow:var(--shadow-pop);transition:transform .08s var(--ease)}.action-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px #00000047}.action-button--fulfill{background:var(--positive);color:#fff}.action-button--fulfill:not(:disabled){animation:reward-pulse 1.1s var(--ease) infinite}@keyframes reward-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.action-button--discard{background:var(--accent)}.action-button:disabled{opacity:.4;cursor:default;box-shadow:none}[data-feedback=shake]{animation:tap-shake .32s ease;outline:3px solid var(--danger);outline-offset:2px}@keyframes tap-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.handoff-overlay{grid-row:3 / span 2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);min-height:12rem;border:none;border-radius:var(--radius-xl);cursor:pointer;color:var(--text);background:linear-gradient(160deg,#20406b,#0e1726);box-shadow:var(--shadow-card)}.handoff-overlay__title{font-size:clamp(1.6rem,5vw,2.6rem);font-weight:900}.handoff-overlay__hint{font-size:1.1rem;color:var(--muted)}.board-lock{text-align:center;padding:var(--space-3);font-weight:800;color:var(--accent)}@media(max-width:700px){.game-board{gap:var(--space-2)}.player-status{min-width:0;flex:1 1 auto;padding:.3rem .5rem;gap:.2rem}.player-status__name{font-size:.9rem}.player-status__pips{gap:2px}.pip{width:.45rem;height:.45rem}.game-board__hand{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-block:.8rem}.hand__card{flex:0 0 auto;scroll-snap-align:center}.hand__card--selected{transform:translateY(-.4rem)}.action-button{min-width:6.5rem;font-size:1.1rem}}@media(orientation:landscape)and (max-height:480px){.game-board{gap:var(--space-1)}.player-status{flex-direction:row;align-items:center;gap:.4rem;min-width:0;padding:.15rem .5rem}.player-status__pips{display:none}.game-board__middle{gap:var(--space-3)}.game-board__controls{margin:0}.help-toggle{min-height:0;padding:.15rem .7rem;font-size:.8rem}.game-board__hand{flex-wrap:nowrap;justify-content:center;overflow-x:hidden;overflow-y:visible;gap:var(--space-2);padding-block:.2rem}.hand__card{flex:0 0 auto}.hand__card--selected{transform:translateY(-.2rem)}.action-bar{padding:var(--space-1) 0}.action-button{min-height:var(--tap-min);padding:.3rem 1rem;font-size:.95rem}.handoff-overlay{min-height:6rem}}@media(orientation:landscape)and (min-height:481px)and (max-height:820px){.game-board{gap:var(--space-2)}.action-bar{padding:var(--space-1) 0}}.winner-screen{position:relative;overflow:hidden;width:100%;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-5);text-align:center}.winner-screen__eyebrow{margin:0;font-size:clamp(1.2rem,4vw,2rem);font-weight:800;color:var(--muted)}.winner-screen__name{margin:0;font-size:clamp(2.6rem,12vw,7rem);font-weight:900;line-height:1.05;background:linear-gradient(90deg,#2e9e4f,#2d6fe0,#ec4899,#f2c200);-webkit-background-clip:text;background-clip:text;color:transparent;animation:winner-pop .6s ease-out both}@keyframes winner-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}.winner-screen__actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.winner-screen__change{min-width:12rem;min-height:var(--tap-min);padding:.9rem 2rem;font-size:1.3rem;font-weight:800;color:var(--text);background:#ffffff14;border:2px solid var(--line);border-radius:var(--radius-lg);cursor:pointer;transition:transform .08s var(--ease)}.winner-screen__change:active{transform:translateY(3px)}.winner-screen__restart{min-width:12rem;min-height:var(--tap-min);padding:.9rem 2.4rem;font-size:1.5rem;font-weight:900;color:var(--ink);background:var(--accent);border:none;border-radius:var(--radius-lg);cursor:pointer;box-shadow:var(--shadow-pop);transition:transform .08s var(--ease)}.winner-screen__restart:active{transform:translateY(3px);box-shadow:0 1px #00000047}.winner-screen__confetti{position:absolute;inset:0;pointer-events:none}.confetti{position:absolute;top:-10%;width:.7rem;height:1rem;border-radius:2px;opacity:0;animation-name:confetti-fall;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes confetti-fall{0%{transform:translateY(-10%) rotate(0);opacity:0}10%{opacity:1}to{transform:translateY(120vh) rotate(540deg);opacity:1}}@media(prefers-reduced-motion:reduce){.winner-screen__name,.winner-screen__restart,.confetti{animation:none;transition:none}.confetti{opacity:0}}.setup-screen{width:100%;min-height:100%;display:flex;flex-direction:column;align-items:center;gap:var(--space-5);padding:var(--space-4)}.setup-screen__title{margin:0;font-size:clamp(2.2rem,9vw,4.5rem);font-weight:900;letter-spacing:.01em;background:linear-gradient(90deg,#2e9e4f,#2d6fe0,#ec4899,#f2c200);-webkit-background-clip:text;background-clip:text;color:transparent}.setup-group{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);width:100%;max-width:48rem}.setup-group__label{margin:0;font-size:1.2rem;font-weight:800;color:var(--muted)}.setup-options{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center}.setup-seats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3);width:100%}.setup-seat{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;justify-content:center;padding:var(--space-2);border-radius:var(--radius-lg);background:#ffffff0a}.setup-seat__name{min-width:2.4rem;height:2.4rem;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:900;color:var(--ink);background:var(--accent);border-radius:var(--radius-pill)}.setup-chip{min-width:var(--tap-min);min-height:var(--tap-min);padding:.5rem 1.2rem;font-size:1.2rem;font-weight:800;color:var(--text);background:#ffffff12;border:2px solid var(--line);border-radius:var(--radius-md);cursor:pointer;transition:transform .08s var(--ease)}.setup-chip:active:not(:disabled){transform:scale(.96)}.setup-chip--small{min-width:56px;min-height:56px;font-size:1rem}.setup-chip--active{border-color:var(--accent);background:#f2c20033;color:#fff}.setup-chip--disabled,.setup-chip:disabled{opacity:.4;cursor:default}.setup-start{margin-top:var(--space-2);min-width:14rem;min-height:72px;padding:1rem 2.5rem;font-size:1.7rem;font-weight:900;color:#fff;background:var(--positive);border:none;border-radius:var(--radius-lg);cursor:pointer;box-shadow:var(--shadow-pop);transition:transform .08s var(--ease)}.setup-start:active{transform:translateY(3px);box-shadow:0 1px #00000047}:root{--font-sans: ui-rounded, "SF Pro Rounded", "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--c-h1: #2e9e4f;--c-h2: #e0322e;--c-h3: #2d6fe0;--c-h4: #f2c200;--c-h5: #0ea192;--c-h6: #ec4899;--c-h7: #f2761a;--c-h8: #8b5cf6;--c-h9: #b8c0cc;--accent: #f2c200;--accent-ink: #2a2300;--positive: #2e9e4f;--danger: #e0322e;--bg-deep: #0e1726;--bg-1: #16233c;--bg-2: #1d3252;--board-bg: radial-gradient(circle at 50% 20%, #244a78 0%, #101b2e 72%);--surface: #fbf7ef;--surface-line: #e4ddcf;--ink: #1d2740;--text: #f5f7fa;--muted: #9fb0c8;--line: #3a4d70;--radius-sm: .5rem;--radius-md: .9rem;--radius-lg: 1.2rem;--radius-xl: 1.6rem;--radius-pill: 999px;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--card-w: 9rem;--shadow-soft: 0 2px 6px rgba(6, 12, 24, .25);--shadow-card: 0 8px 20px rgba(6, 12, 24, .4);--shadow-pop: 0 4px 0 rgba(0, 0, 0, .28);--tap-min: 64px;--ease: cubic-bezier(.2, .7, .3, 1);--card-back: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .16) 0 18%, transparent 19%) 0 0 / 14px 14px, repeating-linear-gradient(45deg, #2d6fe0 0 9px, #2657ad 9px 18px)}@media(max-width:700px){:root{--card-w: 5.5rem;--tap-min: 44px;--space-3: .5rem;--space-4: .6rem;--space-5: .9rem;--space-6: 1.2rem}}@media(orientation:landscape)and (max-height:480px){:root{--card-w: 3.4rem;--tap-min: 44px;--space-2: .3rem;--space-3: .35rem;--space-4: .45rem;--space-5: .55rem}}@media(orientation:landscape)and (min-height:481px)and (max-height:820px){:root{--card-w: 8rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}:root{font-family:var(--font-sans);color-scheme:dark;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;width:100%}body{background:var(--bg-deep);color:var(--text);overscroll-behavior:none;-webkit-tap-highlight-color:transparent}