:root{--bg: var(--tg-theme-bg-color, #f2f1ec);--surface: var(--tg-theme-secondary-bg-color, #e8e6df);--text: var(--tg-theme-text-color, #1d1f22);--hint: var(--tg-theme-hint-color, #7c8188);--button: var(--tg-theme-button-color, #2a6b45);--button-text: var(--tg-theme-button-text-color, #ffffff);--online: #2a9d5c;--offline: #c73b3b;--connecting: #b58a2a;--felt: #2f6b4a;--felt-dark: #26593d;--card-bg: #fdfcf8;--card-ink: #1b1d21;--card-red: #b8262b;--card-back: #7a2a2e;--accent: #e8b84a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,Segoe UI,Roboto,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}button{font:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.screen{min-height:100%;display:grid;grid-template-rows:auto 1fr;padding:16px 20px calc(24px + env(safe-area-inset-bottom));gap:12px}.screen-table{padding:0;grid-template-rows:1fr;background:var(--felt);color:#fff}.top{display:flex;justify-content:space-between;align-items:center;font-size:15px;gap:12px}.who{display:flex;align-items:center;gap:10px;min-width:0}.avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;flex:none}.avatar-letter{display:grid;place-items:center;background:var(--button);color:var(--button-text);font-weight:600;font-size:16px}.who-text{display:grid;line-height:1.25;min-width:0}.name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rank{color:var(--hint);font-size:13px}.rank em{font-style:normal;opacity:.8}.status{display:inline-flex;align-items:center;gap:6px;color:var(--hint);font-size:14px;white-space:nowrap}.status i{width:8px;height:8px;border-radius:50%;background:var(--connecting)}.status-online i{background:var(--online)}.status-offline i{background:var(--offline)}.error{color:var(--offline);font-size:14px;max-width:32ch;margin:0}.lobby,.waiting{display:grid;grid-template-rows:1fr auto auto auto;gap:20px;align-content:end}.hero{display:grid;align-content:center;justify-items:center;text-align:center;gap:8px}.hero h1{margin:0;font-size:56px;font-weight:700;letter-spacing:-.02em;line-height:1}.hero p{margin:0;color:var(--hint);font-size:15px}.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:12px}.code{font-family:ui-monospace,Consolas,monospace;letter-spacing:.12em}.sizes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.decks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:-10px}.chip{padding:10px 4px;border-radius:10px;border:1px solid var(--surface);background:var(--surface);color:var(--text);font-size:14px;font-weight:500}.chip-on{background:var(--button);border-color:var(--button);color:var(--button-text)}.lobby-actions{display:grid;gap:10px}.play{width:100%;padding:18px;border:0;border-radius:14px;background:var(--button);color:var(--button-text);font-size:18px;font-weight:600}.play:disabled{opacity:.45}.secondary{width:100%;padding:14px;border-radius:12px;border:1px solid var(--hint);background:transparent;color:inherit;font-size:16px;font-weight:500}.secondary:disabled{opacity:.45}.join{display:grid;grid-template-columns:1fr auto;gap:8px}.join input{padding:12px 14px;border-radius:12px;border:1px solid var(--hint);background:transparent;color:inherit;font:inherit;font-family:ui-monospace,Consolas,monospace;letter-spacing:.1em;text-transform:uppercase;min-width:0}.join .secondary{width:auto;padding-inline:20px}.hint{margin:0;color:var(--hint);font-size:13px;text-align:center}.seats{list-style:none;margin:0;padding:0;display:grid;gap:6px}.seats li{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:10px;background:var(--surface)}.seat-free{color:var(--hint);font-style:italic}.tag{font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:2px 6px;border-radius:4px;background:var(--accent);color:#2b2100;font-weight:600}.tag-off{background:var(--offline);color:#fff}.table{display:grid;grid-template-rows:auto 1fr auto auto;min-height:100%;padding:12px 12px calc(12px + env(safe-area-inset-bottom));gap:8px;background:radial-gradient(ellipse at 50% 40%,var(--felt) 0%,var(--felt-dark) 100%)}.opponents{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.opponent{display:grid;justify-items:center;gap:2px;padding:6px 8px;border-radius:12px;min-width:84px;max-width:108px;background:#0000001f;transition:background .2s,box-shadow .2s}.opponent-pending{background:#e8b84a2e;box-shadow:0 0 0 2px var(--accent)}.opponent-out{opacity:.5}.opponent-cards{display:flex;align-items:center;height:40px;position:relative;padding-right:14px}.opponent-cards .card-sm{width:26px;height:38px}.opponent-cards .count{position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:12px;font-weight:600;opacity:.9}.opponent-name{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:600;max-width:100%}.opponent-name .tag{font-size:9px;padding:1px 4px}.opponent-name>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.opponent-role{font-size:11px;opacity:.75;min-height:14px}.middle{display:grid;grid-template-columns:76px 1fr 78px;align-items:center;gap:8px}.side{display:grid;justify-items:center;align-content:center;gap:16px}.deck{display:grid;justify-items:center}.deck-stack{position:relative;width:72px;height:50px}.deck-stack .trump{position:absolute;left:30px;top:1px;transform:rotate(-90deg);z-index:0}.deck-stack .deck-top{position:absolute;left:0;top:0;z-index:1}.deck-stack .count{position:absolute;left:4px;top:4px;z-index:2;font-size:12px;font-weight:700;background:#00000080;padding:1px 5px;border-radius:6px}.deck-empty{font-size:12px;opacity:.85;text-align:center}.deck-empty b{font-size:20px;display:block}.deck-empty .red{color:#ff8a8f}.discard{font-size:12px;opacity:.75;min-height:48px;display:grid;align-content:center}.pairs{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:10px 14px;min-height:120px}.table-hint{margin:0;opacity:.7;font-size:14px;text-align:center}.pair{position:relative;width:60px;height:98px}.pair .card{position:absolute;left:0;top:0}.pair .defense{left:14px;top:18px;transform:rotate(8deg)}.pair-target .card:first-child{box-shadow:0 0 0 3px var(--accent)}.pair-hover .card:first-child{box-shadow:0 0 0 4px var(--accent),0 8px 16px #0006;transform:scale(1.06)}.middle{border-radius:14px;transition:box-shadow .15s,background .15s}.middle.drop-hot{box-shadow:inset 0 0 0 2px #e8b84ab3;background:#e8b84a14}.controls{display:grid;gap:8px;justify-items:center;padding-bottom:4px}.turn{margin:0;font-size:14px;opacity:.9;text-align:center;min-height:20px}.timer{font-variant-numeric:tabular-nums;font-weight:700;color:var(--accent)}.timer-hot{color:#ff8a8f}.actions{display:grid;align-content:center;min-height:62px}.action{min-width:70px;min-height:62px;padding:8px 6px;border:0;border-radius:14px;font-size:16px;font-weight:700;line-height:1.1;touch-action:manipulation;box-shadow:0 4px 12px #0006;animation:action-in .18s ease-out both}.action:active{transform:scale(.96)}.action-pass{background:var(--accent);color:#2b2100}.action-take{background:#00000059;color:#fff;box-shadow:0 4px 12px #0006,inset 0 0 0 2px #fffc}@keyframes action-in{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}.hand{display:flex;justify-content:center;align-items:flex-end;padding:50px 6px 4px;overflow-x:auto;min-height:144px}.hand .card{margin-left:-16px;flex:none;touch-action:pan-x;user-select:none;-webkit-user-select:none}.hand-many .card{margin-left:-30px}.hand .card:first-child{margin-left:0}.hand .card-active{transform:none;box-shadow:0 1px 2px #00000059,0 0 0 2px var(--accent);cursor:pointer}.hand .card-dimmed{opacity:1}.hand .card-selected{transform:translateY(-46px) scale(1.06);z-index:2;box-shadow:0 10px 18px #00000080,0 0 0 3px var(--accent)}.hand .card-dragging{opacity:.3;transform:none}.card{position:relative;display:block;padding:0;border:0;width:60px;height:84px;border-radius:7px;background:var(--card-bg);color:var(--card-ink);box-shadow:0 1px 2px #00000059,0 0 0 1px #00000014;font-family:Georgia,Times New Roman,serif;text-align:left;transition:transform .15s,box-shadow .15s,opacity .15s}.card-sm{width:34px;height:48px;border-radius:5px}.card-red{color:var(--card-red)}.card-back{background:repeating-linear-gradient(45deg,rgba(255,255,255,.12) 0 4px,transparent 4px 8px),var(--card-back);border:3px solid var(--card-bg)}.card-corner{position:absolute;left:5px;top:3px;font-size:15px;font-weight:700;line-height:1;display:grid}.card-corner i{font-style:normal;font-size:12px}.card-suit{position:absolute;right:6px;bottom:2px;font-size:26px;line-height:1}.card-sm .card-corner{display:none}.card-sm .card-suit{right:4px;bottom:2px;font-size:16px}.card-active{box-shadow:0 4px 10px #0006,0 0 0 2px var(--accent);cursor:pointer}.card-selected{box-shadow:0 6px 14px #00000073,0 0 0 3px var(--accent)}.card-dimmed{opacity:.55}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0000008c;padding:24px;z-index:10;animation:fade-in .25s ease-out both}.result{background:var(--bg);color:var(--text);border-radius:18px;padding:28px 24px;display:grid;gap:12px;text-align:center;width:min(100%,360px);animation:slide-up .36s cubic-bezier(.2,.8,.2,1) both}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(48px) scale(.97)}to{opacity:1;transform:none}}.rating-roll{font-variant-numeric:tabular-nums}.result h2{margin:0;font-size:28px}.result p{margin:0;color:var(--hint)}.toast{position:fixed;left:50%;bottom:calc(120px + env(safe-area-inset-bottom));transform:translate(-50%);background:#141414e6;color:#fff;padding:10px 16px;border-radius:10px;font-size:14px;z-index:20;max-width:calc(100% - 32px);text-align:center}.toast-warn{background:var(--connecting)}.link{background:none;border:0;color:var(--hint);text-decoration:underline;font-size:14px;padding:8px}.friends{display:grid;gap:10px}.searching{display:grid;grid-template-rows:1fr auto;gap:20px;align-content:end}.searching-title{font-size:28px}.spinner{width:44px;height:44px;border-radius:50%;margin-bottom:8px;border:4px solid var(--surface);border-top-color:var(--button);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}.muted{color:var(--hint);font-size:14px;margin:0}.delta{margin:0;font-size:20px;font-weight:600}.delta-up{color:var(--online)}.delta-down{color:var(--offline)}.standings{list-style:none;margin:0;padding:0;display:grid;gap:4px;text-align:left}.standings li{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:var(--surface);font-size:15px}.standings li.me{outline:2px solid var(--button)}.standings .place{font-weight:700;color:var(--hint);text-align:center;font-variant-numeric:tabular-nums}.standings .who-name{display:flex;align-items:center;gap:6px;min-width:0}.standings .who-delta{font-variant-numeric:tabular-nums;color:var(--hint)}.result-actions{display:grid;gap:8px}.league{font-weight:600}.league-novice{color:var(--hint)}.league-bronze{color:#a8632a}.league-silver{color:#6f7f8f}.league-gold{color:#b8860b}.league-platinum{color:#3c8f8f}.league-diamond{color:#4b6fd6}.board{display:grid;grid-template-rows:auto auto 1fr auto;gap:14px;min-height:0}.board-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.board-head h1{margin:0;font-size:24px}.back{background:none;border:0;color:var(--button);font-size:15px;padding:6px 0;font-weight:500}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px}.rows{list-style:none;margin:0;padding:0;display:grid;gap:4px;align-content:start}.rows li{display:grid;grid-template-columns:32px 36px 1fr auto;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:var(--surface)}.rows li.me{outline:2px solid var(--button)}.rows .place{font-weight:700;color:var(--hint);text-align:center;font-variant-numeric:tabular-nums}.rows .row-name{display:grid;min-width:0;line-height:1.2}.rows .row-name>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.rows .row-name small{font-size:12px}.rows .score{font-variant-numeric:tabular-nums;font-weight:600}.rows .score.up{color:var(--online)}.rows .score.down{color:var(--offline)}.you-row{padding-top:8px;border-top:1px solid var(--surface)}.empty{color:var(--hint);text-align:center;padding:32px 0;margin:0}@keyframes deal{0%{opacity:0;transform:translateY(-18px) scale(.92)}to{opacity:1;transform:none}}@keyframes deal-defense{0%{opacity:0;transform:translateY(-18px) rotate(8deg) scale(.92)}to{opacity:1;transform:rotate(8deg)}}.hand .card{animation:deal .25s ease-out backwards}.banner{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:max-content;height:max-content;max-width:90%;white-space:nowrap;text-align:center;padding:8px 18px;border-radius:999px;background:#0009;color:#fff;font-size:18px;font-weight:700;letter-spacing:.02em;pointer-events:none;animation:banner 1.2s ease-out both}@keyframes banner{0%{opacity:0;transform:scale(.9)}15%{opacity:1;transform:scale(1)}75%{opacity:1}to{opacity:0}}.pairs{position:relative}.discard-pile{display:inline-grid;justify-items:center;gap:2px;font-size:12px;opacity:.8}.discard-pile .card{transform:rotate(12deg)}@media(prefers-reduced-motion:reduce){.hand .card,.banner,.result,.overlay,.action{animation:none}.card{transition:none}}.ghost{position:fixed;z-index:30;pointer-events:none}.ghost .card{width:100%;height:100%}.drag-ghost{position:fixed;z-index:31;pointer-events:none;transform:rotate(-4deg) scale(1.1);transform-origin:center}.drag-ghost .card{width:100%;height:100%;box-shadow:0 18px 30px #0000008c,0 0 0 3px var(--accent)}