:root{--bg: #1f5c3f;--bg-deep: #174a32;--panel: rgba(255, 255, 255, .94);--panel-solid: #ffffff;--text: #1d1d1f;--muted: #6b6b70;--on-felt: #f2f7f3;--on-felt-muted: #b9d3c3;--accent: #f2b632;--accent-ink: #3b2a00;--link: #1f6feb;--red: #c62828;--border: rgba(0, 0, 0, .15);--card-face: #fffdf8;--card-edge: #b8b2a3;--card-red: #c62828;--card-black: #1d1d1f;--card-back: #2a4f9e;--card-back-line: #6f8fd6;--card-w-md: 54px;--card-w-sm: 44px;--card-w-xs: 24px;--radius: 12px;color-scheme:light}@media(prefers-color-scheme:dark){:root{--bg: #0f2e21;--bg-deep: #0b2419;--panel: rgba(32, 35, 40, .95);--panel-solid: #202328;--text: #ececef;--muted: #9a9aa2;--link: #5b9dff;--border: rgba(255, 255, 255, .14);--card-face: #f4f1e8;color-scheme:dark}}@media(min-width:700px){:root{--card-w-md: 72px;--card-w-sm: 58px;--card-w-xs: 30px}}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:radial-gradient(ellipse at top,var(--bg),var(--bg-deep));background-attachment:fixed;color:var(--on-felt);font-family:system-ui,-apple-system,Segoe UI,sans-serif;-webkit-tap-highlight-color:transparent}.app{max-width:980px;margin:0 auto;padding:8px 16px 32px}.top{display:flex;justify-content:space-between;align-items:center}h1{margin:4px 0;font-size:1.4rem;letter-spacing:.5px}.panel{background:var(--panel);color:var(--text);border-radius:var(--radius);padding:14px;margin:10px 0;box-shadow:0 6px 20px #0000002e}.panel h2{margin-top:0}label{display:flex;flex-direction:column;gap:4px;margin:8px 0}label.check{flex-direction:row;align-items:center}input,select,button{font:inherit;padding:9px 12px;border-radius:9px;border:1px solid var(--border);background:var(--panel-solid);color:var(--text)}button{background:var(--accent);color:var(--accent-ink);border:none;font-weight:600;cursor:pointer}button.secondary{background:transparent;color:inherit;border:1px solid currentColor}button.link{background:transparent;color:inherit;border:none;text-decoration:underline;padding:6px 4px}button:disabled{opacity:.5;cursor:default}.panel button.link,.panel button.secondary{color:var(--link)}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}.muted{color:var(--muted)}.error{background:#fde8e8;color:var(--red);border-radius:8px;padding:8px 12px;cursor:pointer}.notice{color:var(--on-felt-muted)}.code{font-family:ui-monospace,monospace;letter-spacing:3px;font-size:1.4em}.rooms,.seats{padding-left:18px}.rooms li,.seats li{margin:6px 0}.rooms button{margin-left:8px;padding:4px 10px}fieldset{border:1px solid var(--border);border-radius:8px}.card{position:relative;width:var(--card-w-md);aspect-ratio:60 / 84;flex:none;border-radius:6px;-webkit-user-select:none;user-select:none;touch-action:none;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease}.card-sm{width:var(--card-w-sm)}.card-xs{width:var(--card-w-xs)}.card-svg{display:block;width:100%;height:100%;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}.card.movable{cursor:grab}.card.movable .card-svg{filter:drop-shadow(0 0 2px var(--accent)) drop-shadow(0 0 4px var(--accent))}.card.selected{transform:translateY(-10px)}.card.selected .card-svg{filter:drop-shadow(0 0 3px var(--accent)) drop-shadow(0 0 7px var(--accent))}.card.dimmed{opacity:.55}.card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.card.placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:2px dashed rgba(255,255,255,.35);color:var(--on-felt-muted);font-size:.7rem;text-align:center;line-height:1.1}@keyframes deal{0%{transform:translateY(18px) scale(.9);opacity:0}}@keyframes pop{0%{transform:scale(1.25)}}@keyframes flip{0%{transform:rotateY(90deg)}}.card.deal{animation:deal .25s ease-out}.card.pop{animation:pop .22s ease-out}.card.flip{animation:flip .3s ease-out}@media(prefers-reduced-motion:reduce){.card,.card.deal,.card.pop,.card.flip{animation:none;transition:none}}.table{display:flex;flex-direction:column;gap:10px}.table.dragging{cursor:grabbing}.table-bar{display:flex;align-items:center;gap:12px;color:var(--on-felt-muted);font-size:.9rem}.table-bar .link{margin-left:auto}.code-chip{font-family:ui-monospace,monospace;letter-spacing:2px;background:#00000040;padding:3px 8px;border-radius:6px;color:var(--on-felt)}.stock-chip{display:inline-flex;align-items:center;gap:6px}.opponents{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}@media(min-width:700px){.opponents{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}}.opponent{background:#00000038;border:2px solid transparent;border-radius:10px;padding:6px 8px;font-size:.85rem;min-width:0}.opponent.current{border-color:var(--accent);box-shadow:0 0 12px #f2b63273}.opponent.offline{opacity:.6}.opp-head{display:flex;gap:6px;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge{font-size:.7rem;background:#fff3;border-radius:4px;padding:0 4px}.opp-body{display:flex;align-items:center;gap:10px;margin:4px 0}.opp-bus{display:flex;align-items:center;gap:6px}.opp-storage{display:flex;gap:4px}.mini-slot{flex:1;text-align:center;background:#ffffff1a;border-radius:4px;padding:1px 2px;font-size:.75rem;white-space:nowrap}.piles{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:calc(var(--card-w-sm) * 1.4 + 26px);padding:10px;border-radius:var(--radius);background:#0000001f}.pile{display:flex;flex-direction:column;align-items:center;gap:3px;border-radius:8px;padding:3px;font-size:.72rem;color:var(--on-felt-muted);transition:opacity .15s ease}.valid-target{outline:2px dashed var(--accent);outline-offset:2px;background:#f2b63229;cursor:pointer}.valid-target.hover{outline-style:solid;background:#f2b63259}.invalid-target{opacity:.4}.hint{margin:0;text-align:center;font-weight:600;color:var(--on-felt-muted);min-height:1.4em}.hint.my-turn{color:var(--accent)}.mine{background:#0003;border:2px solid transparent;border-radius:var(--radius);padding:10px;display:flex;flex-direction:column;gap:10px}.mine.active{border-color:var(--accent)}.bus-and-storage{display:flex;gap:10px;align-items:flex-start}.bus-area,.joker-slot,.slot{display:flex;flex-direction:column;align-items:center;gap:3px;border-radius:8px;padding:3px;transition:opacity .15s ease}.label{font-size:.72rem;color:var(--on-felt-muted)}.bus-stack{position:relative}.bus-stack .under{position:absolute;top:3px;left:3px}.storage{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;flex:1}.fan{display:flex;flex-direction:column}.fan .card+.card{margin-top:calc(var(--card-w-sm) * -1.15)}.hand{display:flex;justify-content:center;padding-top:12px;min-height:calc(var(--card-w-md) * 1.4 + 14px)}.hand .card+.card{margin-left:-10px}@media(min-width:700px){.hand .card+.card{margin-left:6px}}.turn-actions{display:flex;justify-content:center;gap:10px;min-height:42px}.moves{font-size:.85rem;color:var(--on-felt-muted)}.moves summary{cursor:pointer}.moves ol{margin:6px 0;padding-left:20px}.moves li:first-child{color:var(--on-felt)}.drag-ghost{position:fixed;pointer-events:none;transform:translate(-50%,-60%) rotate(-4deg);z-index:50}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;padding:16px;z-index:40}.end-card{background:var(--panel-solid);color:var(--text);border-radius:var(--radius);padding:18px;width:100%;max-width:420px;animation:pop .25s ease-out}.end-card h2{margin:4px 0 12px}.scores{width:100%;border-collapse:collapse}.scores th,.scores td{padding:6px 4px;text-align:right;border-bottom:1px solid var(--border)}.scores th:first-child,.scores td:first-child{text-align:left}.scores tr.winner td{font-weight:700}.top-actions{display:flex;align-items:center;gap:4px}button.link.icon{text-decoration:none;font-size:1.1rem;min-width:36px}.timer-chip{font-variant-numeric:tabular-nums;background:#00000040;padding:3px 8px;border-radius:6px;color:var(--on-felt)}.timer-chip.urgent{background:var(--red);color:#fff}.timer-chip.urgent.mine{animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.08)}}.scoreboard h3{margin:12px 0 4px;font-size:1rem}fieldset p.muted{margin:4px 0}.rules-overlay{align-items:flex-start;overflow-y:auto;z-index:50}.rules-card{background:var(--panel-solid);color:var(--text);border-radius:var(--radius);padding:16px 18px 20px;width:100%;max-width:640px;margin:auto 0;line-height:1.45;animation:pop .2s ease-out}.rules-head{display:flex;justify-content:space-between;align-items:center;gap:8px;position:sticky;top:-16px;background:var(--panel-solid);padding:4px 0}.rules-head h2{margin:0}.rules-card h3{margin:14px 0 4px;font-size:1rem}.rules-card p{margin:4px 0}.rules-card button.secondary{color:var(--link)}.scores td:first-child{overflow-wrap:anywhere;width:100%}.scores th{font-size:.8rem;font-weight:600;vertical-align:bottom}.scores td:not(:first-child){white-space:nowrap}.reaction-picker{position:relative}.reaction-row{position:absolute;top:calc(100% + 4px);right:0;z-index:45;display:grid;grid-template-columns:repeat(4,44px);gap:4px;padding:6px;background:var(--panel-solid);border-radius:var(--radius);box-shadow:0 6px 20px #0000004d;animation:pop .15s ease-out}.end-card .reaction-row{top:auto;bottom:calc(100% + 4px)}.reaction-row button.emoji{background:transparent;font-size:1.5rem;padding:4px 0;line-height:1.2}.reaction-row button.emoji:hover,.reaction-row button.emoji:focus-visible{background:#00000014}.end-card .reaction-picker button.link{color:inherit}.opponent,.mine{position:relative}.reaction-bubble{position:absolute;top:-10px;right:6px;z-index:5;font-size:1.8rem;line-height:1;pointer-events:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35));animation:reaction 3s ease-out forwards}.reaction-bubble.inline{position:static;display:inline-block;margin-left:6px;font-size:1.2rem}@keyframes reaction{0%{transform:translateY(8px) scale(.6);opacity:0}10%{transform:translateY(0) scale(1.15);opacity:1}20%{transform:scale(1)}85%{opacity:1}to{transform:translateY(-10px);opacity:0}}@media(prefers-reduced-motion:reduce){.reaction-bubble{animation:none}}
