:root{--bg: #15181f;--panel: #1f242e;--panel-2: #272d3a;--text: #e8e6df;--muted: #9aa0ab;--accent: #38b2ac;--accent-2: #e3a51a;--danger: #e0453a;--tile-face: #f4eddd;--radius: 12px;font-size:16px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 700px at 50% -10%,#232a38,var(--bg));color:var(--text);font-family:Avenir Next,Segoe UI,system-ui,-apple-system,sans-serif;overscroll-behavior:none;-webkit-user-select:none;user-select:none}h1,h2{margin:0 0 .5rem}button{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid #3a4254;border-radius:10px;padding:.55rem 1rem;cursor:pointer;transition:transform .08s,background .15s,opacity .15s}button:active:not(:disabled){transform:scale(.96)}button:disabled{opacity:.4;cursor:default}button.primary{background:linear-gradient(180deg,#41c8c1,#2d9a94);border-color:#2d9a94;color:#06302d;font-weight:700}input{font:inherit;color:var(--text);background:#141821;border:1px solid #3a4254;border-radius:10px;padding:.6rem .8rem;width:100%}input:focus{outline:2px solid var(--accent);border-color:transparent}.card{background:var(--panel);border:1px solid #303848;border-radius:var(--radius);padding:1.25rem;box-shadow:0 18px 50px #00000073}.muted{color:var(--muted)}.center-screen{height:100%;display:grid;place-items:center;padding:1rem}.logo{font-size:2.6rem;letter-spacing:-.03em;font-weight:800}.logo span{background:linear-gradient(90deg,#e0453a,#e3a51a,#15a8c4,#8d4bbf);-webkit-background-clip:text;background-clip:text;color:transparent}.logo.small{font-size:1.5rem}.name-gate{width:min(380px,92vw);display:flex;flex-direction:column;gap:.9rem;text-align:center}.sso-buttons{display:flex;flex-direction:column;gap:.55rem}.sso{display:block;text-decoration:none;text-align:center;font-weight:700;padding:.6rem 1rem;border-radius:10px;border:1px solid #3a4254;color:var(--text);background:var(--panel-2);transition:background .15s}.sso:hover{background:#313950}.sso.google b{color:#4285f4;margin-right:.3rem}.sso.apple{background:#f4eddd;color:#15181f;border-color:#c9bfa6}.sso-divider{color:var(--muted);font-size:.85rem;margin-top:.2rem}.signed-in-note{color:var(--muted);font-size:.9rem;margin:0}.nametag{background:var(--panel);border:1px solid #303848;border-radius:999px;padding:.4rem .9rem;display:flex;align-items:center;gap:.4rem}.nametag:hover{background:var(--panel-2)}.nametag-badge{color:var(--accent);font-size:.85rem}.nametag-caret{color:var(--muted);font-size:.7rem}.profile-modal h3{margin:.4rem 0 .2rem;font-size:1rem}.profile-providers{display:flex;flex-direction:column;gap:.5rem}.provider-row{display:flex;justify-content:space-between;align-items:center;background:var(--panel-2);border-radius:10px;padding:.5rem .8rem}.pill.linked{background:#38b2ac29;color:var(--accent);font-weight:700}.linkbtn{text-decoration:none;padding:.35rem .9rem;border-radius:8px;background:linear-gradient(180deg,#41c8c1,#2d9a94);color:#06302d;font-weight:700}.linkish{background:none;border:none;color:var(--accent);cursor:pointer;padding:0 0 0 .7rem;font-size:.9rem;text-decoration:none}.linkish:hover{text-decoration:underline}.tagline{color:var(--muted);margin:0}.lobby{height:100%;display:flex;flex-direction:column}.lobby-header{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.2rem}.lobby-main{flex:1;overflow:auto;display:flex;flex-direction:column;gap:1rem;padding:0 1.2rem 1.2rem;max-width:760px;width:100%;margin:0 auto}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem}.game-list,.history-list,.seat-list{list-style:none;margin:0;padding:0}.game-row{display:flex;justify-content:space-between;align-items:center;padding:.7rem .4rem;border-top:1px solid #2c3342;gap:.6rem}.game-name{font-weight:700}.game-join{display:flex;gap:.6rem;align-items:center}.pill{font-size:.8rem;padding:.2rem .55rem;border-radius:999px;background:#2c3342}.pill.playing{background:#4a3a17;color:var(--accent-2)}.pill.solo{background:#e3a51a29;color:var(--accent-2);font-weight:700}.solo-chip{background:#e3a51a24;border:1px solid rgba(227,165,26,.35);color:var(--accent-2);border-radius:999px;padding:.35rem .8rem;font-size:.88rem;font-weight:700;white-space:nowrap}.solo-toggle{flex-direction:row!important;align-items:center;gap:.6rem!important}.solo-toggle input{width:auto;accent-color:var(--accent-2)}.pill.turn{background:#38b2ac2e;color:var(--accent);font-weight:700;animation:turn-pulse 1.6s ease-in-out infinite}@keyframes turn-pulse{50%{box-shadow:0 0 10px #38b2ac8c}}.game-row.your-turn .game-name{color:var(--accent)}.back-btn{border-radius:999px;padding:.3rem .65rem;font-size:1.05rem;line-height:1;flex:0 0 auto}.history-row{display:grid;grid-template-columns:1.6rem 1fr auto auto;gap:.6rem;align-items:center;padding:.45rem .2rem;border-top:1px solid #2c3342}.pos{color:#6fd388;font-weight:700}.neg{color:#e08884;font-weight:700}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#080a0ea8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:grid;place-items:center;z-index:40;padding:1rem}.modal{width:min(440px,94vw);max-height:90vh;overflow:auto;display:flex;flex-direction:column;gap:.8rem}.modal label{display:flex;flex-direction:column;gap:.35rem;font-size:.95rem}.modal-actions{display:flex;justify-content:flex-end;gap:.6rem;align-items:center}.swatches i{display:inline-block;width:16px;height:16px;border-radius:4px;margin-right:4px}.game-room{height:100%;display:grid;grid-template-rows:auto 1fr auto auto}.board-wrap{position:relative;touch-action:none;min-height:0}.board-wrap canvas{display:block}.board-wrap.my-turn{box-shadow:inset 0 0 0 3px #38b2ac8c}@media(orientation:landscape)and (min-width:700px){.game-room{grid-template-rows:auto 1fr;grid-template-columns:1fr 290px;grid-template-areas:"strip strip" "board side"}.players-strip{grid-area:strip}.board-wrap{grid-area:board}.hand-rack{grid-area:side;flex-direction:row;flex-wrap:wrap;align-content:flex-start;overflow-y:auto;border-left:1px solid #2c3342}.hand-rack .tile{touch-action:pan-y}.action-bar{grid-area:side;align-self:end;border-left:1px solid #2c3342}.game-room:has(.hand-rack){grid-template-areas:"strip strip" "board side" "board actions";grid-template-rows:auto 1fr auto}.action-bar{grid-area:actions}}.players-strip{display:flex;gap:.5rem;align-items:center;padding:.5rem .8rem;overflow-x:auto}.player-chip{position:relative;display:flex;gap:.45rem;align-items:center;background:var(--panel);border:1px solid #303848;padding:.35rem .7rem;border-radius:999px;white-space:nowrap;font-size:.92rem}.player-chip.active{border-color:var(--accent);box-shadow:0 0 12px #38b2ac59}.player-chip.away{opacity:.55}.player-chip.me .player-name{color:var(--accent);font-weight:700}.meld-dot{color:var(--accent-2);font-size:.6rem}.player-tiles{color:var(--muted);font-size:.85rem}.pool-chip{margin-left:auto;background:#2c3342;border-radius:999px;padding:.35rem .8rem;font-size:.85rem;white-space:nowrap}.emote-overlay{position:absolute;top:.7rem;left:.7rem;z-index:6;display:flex;flex-direction:column;gap:.35rem;pointer-events:none}.emote-pop{display:flex;align-items:center;gap:.45rem;animation:emote-pop 1.3s ease forwards}.emote-pop-emoji{font-size:2.6rem;line-height:1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}.emote-pop-name{font-size:.85rem;font-weight:700;color:var(--text);background:#141821b3;border-radius:999px;padding:.15rem .6rem}@keyframes emote-pop{0%{opacity:0;transform:scale(.3) translateY(8px)}10%{opacity:.8;transform:scale(1.15)}18%{transform:scale(1)}77%{opacity:.8}to{opacity:0;transform:translateY(-12px)}}.emotes.cooling .emote-btn{opacity:.35}.board-tools{position:absolute;top:.7rem;right:.7rem;z-index:5;display:flex;flex-direction:column;gap:.4rem;align-items:flex-end}.magnifier{border-radius:999px;background:#1f242ed9;font-variant-numeric:tabular-nums;white-space:nowrap}.turn-banner{position:absolute;top:.7rem;left:50%;transform:translate(-50%);background:#1f242ed9;border:1px solid #303848;padding:.3rem .9rem;border-radius:999px;font-size:.9rem;pointer-events:none}.turn-banner.mine{border-color:var(--accent);color:var(--accent);font-weight:700}.hand-rack{display:flex;gap:.45rem;padding:.6rem .8rem;overflow-x:auto;min-height:4.4rem;align-items:center;background:linear-gradient(180deg,rgba(0,0,0,.25),transparent);overscroll-behavior:contain}.hand-empty{color:var(--accent-2);font-weight:700}.hand-controls{position:sticky;left:0;z-index:2;display:flex;flex-direction:column;gap:.3rem;padding-right:.35rem;background:linear-gradient(90deg,var(--bg) 70%,transparent)}.hand-controls button{padding:.25rem .5rem;font-size:.8rem;font-weight:800;letter-spacing:.05em;color:var(--muted)}.hand-controls button:hover{color:var(--text)}.hand-controls button.sort-active{background:#2ecc7138;border-color:#2ecc71;color:#7ee2a8}.tile.selected,.hand-rack .tile.selected{outline:2px solid #2ecc71;outline-offset:1px;touch-action:none}.tile-badge{position:absolute;top:-.45rem;right:-.45rem;width:1.25rem;height:1.25rem;border-radius:50%;background:#2ecc71;color:#06301a;font-size:.8rem;font-weight:800;display:grid;place-items:center;box-shadow:0 2px 6px #0006}.tile.flash{animation:draw-flash .3s ease}@keyframes draw-flash{0%{box-shadow:0 0 #2ecc71f2,0 3px #b9af97}60%{box-shadow:0 0 18px 7px #2ecc71bf,0 3px #b9af97}to{box-shadow:0 0 #2ecc7100,0 3px #b9af97}}.ghost-count{position:absolute;top:-.6rem;left:-.6rem;background:#2ecc71;color:#06301a;font-weight:800;font-size:.85rem;border-radius:999px;padding:.1rem .45rem}.tile{position:relative;flex:0 0 auto;width:3rem;height:3.9rem;touch-action:pan-x;-webkit-touch-callout:none;border-radius:9px;background:linear-gradient(168deg,#fffaf0 0%,var(--tile-face) 55%,#d9d0ba 100%);box-shadow:0 3px #b9af97,0 6px 14px #00000073;display:grid;place-items:center;color:#222;transition:transform .1s}.tile.draggable{cursor:grab;-webkit-tap-highlight-color:transparent}@media(hover:hover)and (pointer:fine){.tile.draggable:hover{transform:translateY(-4px)}}.tile.hidden{opacity:.25}.tile-number{font-size:2rem;font-weight:900;font-style:italic;-webkit-text-stroke:.6px rgba(28,20,16,.35);text-shadow:0 -1.5px 1.5px rgba(0,0,0,.45),0 1.5px 1.5px rgba(255,255,255,.9)}.tile.joker{background:linear-gradient(168deg,#f6d878,#d9a93c 55%,#a87b1c);box-shadow:0 3px #8a6516,0 6px 14px #00000073}.tile-joker{font-size:1.9rem;font-style:italic;color:#6b4a08;text-shadow:0 -1px 1px rgba(0,0,0,.35),0 1px 1px rgba(255,235,170,.9)}.drag-ghost{position:fixed;z-index:60;pointer-events:none;transform:translate(-50%,-70%) scale(1.18);filter:drop-shadow(0 14px 12px rgba(0,0,0,.5))}.action-bar{display:flex;justify-content:space-between;align-items:center;gap:.7rem;padding:.55rem .8rem .8rem;flex-wrap:wrap}.emotes{display:flex;gap:.3rem}.emote-btn{font-size:1.15rem;padding:.35rem .5rem;border-radius:999px}.turn-actions{display:flex;gap:.55rem;align-items:center;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.meld-hint{color:var(--accent-2);font-size:.85rem;white-space:nowrap}button.submit{background:linear-gradient(180deg,#41c8c1,#2d9a94);border-color:#2d9a94;color:#06302d;font-weight:800;padding:.65rem 1.5rem}button.draw{background:linear-gradient(180deg,#e9b53a,#c98f15);border-color:#c98f15;color:#3c2a00;font-weight:800}.joker-picker{width:min(560px,96vw)}.joker-grid{display:flex;flex-direction:column;gap:.3rem}.joker-row{display:flex;gap:.25rem;flex-wrap:wrap}.joker-cell{width:2.2rem;height:2.4rem;padding:0;font-weight:800;background:var(--tile-face);border-color:#c9bfa6}.seat-list li{padding:.55rem .7rem;border-radius:8px;margin-bottom:.4rem;background:var(--panel-2)}.seat-list li.empty{color:var(--muted);border:1px dashed #3a4254;background:transparent}.score-table{width:100%;border-collapse:collapse}.score-table td{padding:.5rem .4rem;border-top:1px solid #2c3342}.winner-row{background:#e3a51a14}.win-screen h1{text-align:center}.toasts{position:fixed;bottom:5.6rem;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:.4rem;z-index:70;pointer-events:none;align-items:center}.toast{background:#141821f2;border:1px solid #3a4254;border-radius:999px;padding:.45rem 1rem;font-size:.9rem;animation:toast-in .18s ease;max-width:90vw}.toast-error{border-color:var(--danger);color:#ffb4ae}.toast-win{border-color:var(--accent-2);color:var(--accent-2);font-weight:700}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}.conn-pill{position:fixed;top:.6rem;left:50%;transform:translate(-50%);z-index:100;pointer-events:none;padding:.3rem .9rem;border-radius:999px;font-size:.85rem;font-weight:700;background:#e3a51aeb;color:#3c2a00;box-shadow:0 6px 18px #0006;animation:toast-in .25s ease}.admin-tag{font-size:.8rem;background:var(--danger);color:#fff;border-radius:999px;padding:.1rem .5rem;vertical-align:middle;-webkit-text-fill-color:#fff}.lobby-main.wide{max-width:1100px}.admin-table{width:100%;border-collapse:collapse;font-size:.92rem}.admin-table th{text-align:left;color:var(--muted);font-weight:600;padding:.35rem .5rem;border-bottom:1px solid #303848}.admin-table td{padding:.45rem .5rem;border-bottom:1px solid #242b38}.admin-actions{display:flex;gap:.4rem;justify-content:flex-end}.admin-actions button{padding:.3rem .7rem;font-size:.85rem}button.danger{background:#e0453a26;border-color:var(--danger);color:#ffb4ae}.spectate-banner{position:absolute;bottom:.7rem;left:50%;transform:translate(-50%);background:#141821eb;border:1px solid var(--accent-2);color:var(--accent-2);border-radius:999px;padding:.4rem 1rem;font-weight:700;z-index:6}.spectate-banner a{color:var(--accent)}.conn-pill.severe{background:#e0453af2;color:#fff}