:root{--ink: #1d2a3a;--muted: #6b7684;--paper: #f6f3ec;--panel: #ffffff;--line: #e2ddd2;--felt: #1f5a3d;--felt-dark: #174630;--accent: #c8102e;--gold: #e7b84a;--pos: #1c7c4a;--neg: #b3261e;--card-w: clamp(40px, 7.5vw, 64px);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;background:var(--paper)}button,input,select{font:inherit}button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:6px 12px;cursor:pointer}button:hover:not(:disabled){border-color:var(--ink)}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--ink);color:#fff;border-color:var(--ink)}button.link{border:none;background:none;color:var(--muted);text-decoration:underline;padding:2px 6px}input,select{border:1px solid var(--line);border-radius:8px;padding:6px 10px;background:#fff}.app{min-height:100vh;display:flex;flex-direction:column}header.top{display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--panel);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.15rem;color:var(--ink);text-decoration:none;font-family:Georgia,serif}.tagline{color:var(--muted);font-size:.85rem}.spacer{flex:1}.offline{color:var(--accent);font-size:.85rem}main{flex:1;padding:16px;max-width:1200px;width:100%;margin:0 auto}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}.panel h2{margin:0 0 12px;font-size:1.05rem}.center{text-align:center;max-width:480px;margin:40px auto}.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}.muted{color:var(--muted)}.small{font-size:.82rem}.red{color:var(--accent)}.ok{color:var(--pos);font-size:.85rem}.pos{color:var(--pos);font-weight:600}.neg{color:var(--neg);font-weight:600}.error{color:var(--neg)}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#c9c4b8;margin-right:6px}.dot.on{background:#2fbf6b}.join{max-width:420px;margin:40px auto;display:flex;flex-direction:column;gap:12px}.join h1{margin:0;font-family:Georgia,serif}.join label{display:flex;flex-direction:column;gap:6px}.lobby{display:grid;grid-template-columns:2fr 1fr;gap:16px}.tables,.members,.seats{list-style:none;margin:0;padding:0}.tables li,.members li,.seats li{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--line)}.tables a{color:var(--ink)}.badge{font-size:.75rem;padding:2px 8px;border-radius:99px;background:#eee}.badge.playing{background:#dff3e6;color:var(--pos)}.badge.lobby{background:#fff4d6;color:#8a6400}.invite{margin-top:12px;padding:10px;background:var(--paper);border-radius:8px}.invite p{margin:0 0 6px;font-size:.85rem}.invite code{word-break:break-all;font-size:.85rem}.table-head{display:flex;align-items:baseline;gap:12px;margin-bottom:12px;flex-wrap:wrap}.table-head h1{margin:0;font-size:1.3rem;font-family:Georgia,serif}.gathering,.finished{display:grid;grid-template-columns:1fr 1fr;gap:16px}.check{display:flex;gap:8px;align-items:center;margin:8px 0}.game{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}.game aside{display:flex;flex-direction:column;gap:12px}.felt{background:radial-gradient(ellipse at center,var(--felt) 0%,var(--felt-dark) 100%);border-radius:18px;padding:14px;color:#fff;display:flex;flex-direction:column;gap:14px;min-height:520px}.felt .muted{color:#b9d3c3}.opponents{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.opp{display:flex;flex-direction:column;gap:6px;min-width:0}.mine{display:flex;flex-direction:column;gap:8px;margin-top:auto}@media (min-width: 861px){.felt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:auto 1fr auto;align-items:start}.felt.around2{grid-template-areas:"left center right" "left center right" "mine mine mine"}.felt.around3{grid-template-areas:"left top right" "left center right" "mine mine mine"}.felt .opponents{display:contents}.opp.left{grid-area:left;align-self:center}.opp.top{grid-area:top;align-items:center}.opp.right{grid-area:right;align-self:center;align-items:flex-end}.opp.right .hand{justify-content:flex-end}.opp.top .hand{justify-content:center}.felt .center-area{grid-area:center;align-self:center}.felt .mine{grid-area:mine;align-items:center}.felt .mine>.actions,.felt .mine>.result{align-self:stretch}.felt .mine .hand{justify-content:center}}.tag{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:3px 8px;border-radius:8px}.tag.turn{background:#e7b84a40;outline:2px solid var(--gold)}.pill{font-size:.78rem;background:#ffffff26;padding:1px 8px;border-radius:99px}.pill.strong{background:#fff;color:var(--ink);font-weight:700}.pill .red,.card.red{color:var(--accent)}.center-area{display:flex;flex-direction:column;align-items:center;gap:10px;flex:1;justify-content:center}.status{background:#0003;padding:6px 14px;border-radius:99px;text-align:center}.status .you{color:var(--gold);font-weight:700}.status .red{color:#ff9aa5}.trick{display:flex;gap:14px;min-height:calc(var(--card-w) * 1.45 + 20px);align-items:center}.played,.last,.talon{display:flex;flex-direction:column;align-items:center;gap:2px}.calls{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.calls .red{color:#ff9aa5}.hand{display:flex;flex-wrap:wrap;gap:4px}.card{width:var(--card-w);height:calc(var(--card-w) * 1.4);border-radius:7px;background:#fff;color:var(--ink);border:1px solid #c9c4b8;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;line-height:1;padding:0;box-shadow:0 1px 2px #00000040;font-size:calc(var(--card-w) * .3);-webkit-user-select:none;user-select:none}.card .suit{font-size:1.25em}.card.small{--card-w: clamp(26px, 4.2vw, 38px)}.card.back{background:repeating-linear-gradient(45deg,#7a1c2c 0,#7a1c2c 5px,#93263a 5px,#93263a 10px);border-color:#fff}.hand>.card.back+.card.back{margin-left:calc(var(--card-w) * -.6)}button.card:disabled{opacity:.55}button.card.playable:not(:disabled){transform:translateY(-4px);box-shadow:0 4px 10px #00000059;outline:2px solid var(--gold)}button.card.playable:hover:not(:disabled){transform:translateY(-8px)}button.card.playable.selected:not(:disabled),button.card.selected{transform:translateY(-16px);outline:3px solid var(--accent);box-shadow:0 6px 14px #00000073;opacity:1}.discard-slots{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.discard-slots .slot{width:clamp(26px,4.2vw,38px);height:calc(clamp(26px,4.2vw,38px)*1.4);border:2px dashed rgba(255,255,255,.5);border-radius:7px}.discard-slots button.primary{margin-left:auto;background:var(--gold);color:var(--ink);border-color:var(--gold);font-weight:700}.discard-slots button.primary:disabled{background:#fff3;color:#fff}.actions{background:#00000040;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}.actions.row{flex-direction:row;margin:0}.bids{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.bids button{padding:6px 0}.bids button.misere{grid-column:span 5}.bids button.chosen{outline:3px solid var(--gold)}.result{background:#fffffff2;color:var(--ink);border-radius:12px;padding:10px 14px}.result ul{margin:6px 0;padding-left:18px}.votes:empty{display:none}.vote p{margin:0 0 6px}.sheet table{width:100%;border-collapse:collapse;font-size:.9rem}.sheet th,.sheet td{text-align:left;padding:5px 4px;border-bottom:1px solid var(--line);vertical-align:top}.sheet tr.me th{color:var(--accent)}.podium{font-size:1.15rem;line-height:2}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:var(--ink);color:#fff;padding:10px 18px;border-radius:10px;box-shadow:0 6px 20px #00000040}@media (max-width: 860px){main{padding:10px}.tagline{display:none}.lobby,.gathering,.finished,.game{grid-template-columns:1fr}.felt{min-height:0;padding:10px}.hand{gap:2px}}@media (max-width: 480px){:root{--card-w: 34px}.card.small{--card-w: 24px}}.practice-bar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:#fff4d6;border:1px solid #f0d58a;border-radius:10px;padding:6px 12px;margin-bottom:12px}.practice-bar .check{margin:0}.acting{color:var(--accent)}.chat .lines{max-height:260px;overflow-y:auto;display:flex;flex-direction:column;gap:4px;font-size:.9rem}.chat .line{line-height:1.35}.chat .table-voice{color:#6b4e00;font-style:italic}.chat form input{flex:1;min-width:0}.timer{display:flex;gap:8px;align-items:center;font-size:.82rem;color:#d7e7dd}button.nudge{padding:2px 10px;font-size:.82rem}.nudge-banner{position:sticky;top:0;z-index:5;text-align:center;font-weight:700;background:var(--gold);color:var(--ink);padding:10px;border-radius:10px;margin-bottom:10px;animation:pulse 1s ease-in-out 3}@keyframes pulse{50%{transform:scale(1.03)}}.video iframe{width:100%;height:260px;border:0;border-radius:8px;background:#111}a.button{display:inline-block;text-decoration:none;border-radius:8px;padding:6px 12px}a.button.primary{background:var(--ink);color:#fff}.spread{justify-content:space-between;align-items:center}.deals ul,.history ul{list-style:none;padding:0;margin:0}.deals li,.history li{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:5px 0;border-bottom:1px solid var(--line);font-size:.9rem}.deals li .link{margin-left:auto}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#0000008c;display:flex;align-items:flex-start;justify-content:center;padding:16px;overflow-y:auto}.replay{background:var(--panel);border-radius:14px;padding:14px;width:min(860px,100%);display:flex;flex-direction:column;gap:10px}.replay h2{margin:0;font-size:1.05rem}.felt.replay-felt{display:flex;min-height:0}.replay-felt .tag{flex-direction:row}.replay-felt .tag .hand{flex-basis:100%}.replay .controls{justify-content:center;align-items:center}.replay .controls button{min-width:48px;font-size:1.1rem}.status .move .card{display:inline-flex;vertical-align:middle}.history li .who{flex:1;min-width:0}.lobby .history{grid-column:1 / -1}.played.from-talon .card{transform:rotate(-6deg);box-shadow:0 0 0 3px var(--gold)}.sheet-head{margin-top:0}.sheet-head h2{margin:0}.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}.seg button{border:none;border-radius:0;padding:3px 9px;font-size:.8rem}.seg button.on{background:var(--ink);color:#fff}.paper-sheet{width:100%;max-width:420px;display:block;margin:8px auto;font-family:Georgia,serif}.paper-sheet .paper{fill:#fbf9f0}.paper-sheet .rule{fill:none;stroke:#6b665c;stroke-width:1}.paper-sheet text{text-anchor:middle;dominant-baseline:central}.paper-sheet .num{font-size:17px;fill:var(--ink)}.paper-sheet .who{font-size:11px;fill:var(--muted);font-family:system-ui,sans-serif}.paper-sheet .mine .who{fill:var(--accent);font-weight:700}.paper-sheet .box{fill:#c9c6bb}.paper-sheet .bal{font-size:12px;font-weight:700;font-family:system-ui,sans-serif}.paper-sheet .bal.pos{fill:#1f5a1f}.paper-sheet .bal.neg{fill:#9b1c1c}.paper-sheet .target{fill:#8cb86a}.paper-sheet .target-num{font-size:16px;font-weight:700;fill:#1d2a1d;font-family:system-ui,sans-serif}
