:root{--bg:#15181f;--surface:#20262f;--surface2:#272e39;--line:#333b47;--ink:#ece6d8;--muted:#98a1ae;--faint:#5c6573;--red:#c36d5c;--suit-red:#e25b4c;--gold:#c9a24b;--gold-soft:#c9a24b24;--green:#8fa96b;--felt:#1f4a3a;--felt-dark:#143528;--rail:#2a2119;--serif:"Hoefler Text", Georgia, "Times New Roman", serif;--sans:-apple-system, "Segoe UI", Roboto, system-ui, sans-serif;--card-w:min(17vw, 76px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--sans);margin:0}body{overscroll-behavior:none}#app{max-width:480px;height:100dvh;margin:0 auto;position:relative;overflow:hidden}button{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:12px;min-height:42px;padding:10px 14px}button:disabled{opacity:.35;cursor:default}button.primary{background:var(--gold);color:#1a1408;border-color:var(--gold);font-weight:600}h1,h2,h3{font-family:var(--serif);margin:0 0 8px;font-weight:400}.muted{color:var(--muted)}.small{font-size:13px}.red{color:var(--suit-red)}.card{width:var(--card-w);aspect-ratio:100/140;filter:drop-shadow(0 2px 3px #00000073)}.card svg{width:100%;height:100%;display:block}.card.trump-up{width:52px}.home{text-align:center;padding:48px 20px}.home .suits{letter-spacing:10px;color:var(--gold);font-size:22px}.home h1{margin-top:8px;font-size:36px}.home .sub{color:var(--muted);margin-top:0}.panel{background:var(--surface);border:1px solid var(--line);text-align:left;border-radius:14px;margin:28px 0 16px;padding:18px}.sizes{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;display:grid}.draw{text-align:center;padding:32px 20px}.draw-grid{flex-wrap:wrap;justify-content:center;gap:14px;margin:24px 0;display:flex}.draw-seat{opacity:.75;flex-direction:column;align-items:center;gap:6px;font-size:13px;display:flex}.draw-seat.dealer{opacity:1;color:var(--gold)}.draw-seat.dealer .card{outline:2px solid var(--gold);border-radius:7px}.table-screen{flex-direction:column;display:flex;position:absolute;inset:0}.top{justify-content:space-between;align-items:center;padding:12px 16px 4px;display:flex}.hand-no{font-family:var(--serif);font-size:18px}.hand-no small{font-family:var(--sans);color:var(--muted);font-size:12px;display:block}.trump{align-items:center;gap:10px;display:flex}.trump-label{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;flex-direction:column;align-items:center;font-size:10px;line-height:1.1;display:flex}.trump-label b{color:var(--ink);letter-spacing:0;font-size:24px}.trump-label b.suit-H,.trump-label b.suit-D,.suit-H,.suit-D{color:var(--suit-red)}:root[data-colours=four] .suit-D,:root[data-colours=four] .trump-label b.suit-D{color:#5b9be0}:root[data-colours=four] .suit-C,:root[data-colours=four] .trump-label b.suit-C{color:#4cb36e}.round{width:40px;height:40px;min-height:0;color:var(--gold);border-radius:50%;padding:0;font-size:18px}.felt{background:radial-gradient(ellipse at 50% 45%, #2a6049 0%, var(--felt) 45%, var(--felt-dark) 100%);min-height:300px;box-shadow:0 0 0 9px var(--rail), 0 0 0 10px #c9a24b73, inset 0 0 40px #00000073;border-radius:160px;flex:auto;margin:6px 12px 0;position:relative}.seat{text-align:center;flex-direction:column;align-items:center;gap:2px;width:104px;display:flex;position:absolute;transform:translate(-50%,-50%)}.avatar{background:var(--surface2);width:44px;height:44px;font-family:var(--serif);border:2px solid var(--line);border-radius:50%;justify-content:center;align-items:center;font-size:18px;display:flex;position:relative}.seat.turn .avatar{box-shadow:0 0 0 3px var(--gold-soft), 0 0 12px #c9a24b99}.style-cautious{border-color:var(--green)}.style-aggressive{border-color:var(--red)}.style-tricky,.style-dealer{border-color:var(--gold)}.style-zero{border-color:#7fa3c9}.style-balanced{border-color:var(--muted)}.name{font-size:12px;font-weight:600;line-height:1.15}.style{color:var(--muted);font-size:10.5px}.dia{color:var(--gold);letter-spacing:1px;font-size:9px}.pill{font-variant-numeric:tabular-nums;white-space:nowrap;background:#00000059;border-radius:10px;padding:2px 8px;font-size:11px}.dealer-chip{background:var(--gold);color:#1a1408;width:19px;height:19px;font:700 11px var(--sans);border-radius:50%;justify-content:center;align-items:center;display:inline-flex;position:absolute;bottom:-4px;right:-6px}.dealer-chip.inline{margin-left:4px;position:static}.backs{height:28px;margin-top:2px;position:relative}.back{width:20px;position:absolute;top:0}.back svg{width:100%;display:block}.card.trick{width:calc(var(--card-w) * .85);position:absolute}.card.trick.winner{outline:2px solid var(--gold);border-radius:7px}.felt-bottom{flex-direction:column;align-items:center;gap:7px;padding:0 22px;display:flex;position:absolute;bottom:30px;left:0;right:0}.peek{min-height:0;color:var(--gold);background:#00000059;border-color:#c9a24b66;padding:5px 10px;font-size:12px}.bid-total{color:var(--ink);font-variant-numeric:tabular-nums;background:#0000004d;border-radius:10px;padding:3px 10px;font-size:12px}.bid-total.under{color:#9fd0ff}.bid-total.over{color:#ffb38a}.status{color:var(--muted);border:1px solid var(--line);background:#15181fbf;border-radius:16px;padding:5px 14px;font-size:13px}.status.mine{color:var(--gold);background:#28210fd9;border-color:#c9a24b80}.me{justify-content:space-between;align-items:center;width:100%;max-width:250px;font-size:12.5px;display:flex}.me .who{font-family:var(--serif);font-size:16px}.me .score{color:var(--ink);opacity:.8}.bid-panel{flex-direction:column;align-items:center;gap:8px;display:flex}.bid-row{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.bid{background:#15181fd9;min-width:40px;padding:6px 0}.bid.selected{border:2px solid var(--gold);color:var(--gold)}.hint{text-align:center;color:var(--ink);opacity:.85;font-size:12px}.hand{--hand-card:min(21vw, 96px);height:calc(var(--hand-card) * 1.4 + 28px);--spacing:min(50px, calc((min(100vw, 480px) - var(--hand-card) - 92px) / max(var(--n) - 1, 1)));flex:none;position:relative}.card.in-hand{width:var(--hand-card);left:calc(50% - var(--hand-card) / 2);transform-origin:50% 130%;transition:transform .12s ease-out;position:absolute;bottom:10px}.card.in-hand.illegal{filter:brightness(.5)drop-shadow(0 2px 3px #00000073)}.card.in-hand.legal{cursor:pointer}.card.in-hand.legal svg{outline:2px solid var(--gold);outline-offset:-1px;border-radius:7px}.card.in-hand.lifted svg{outline-width:3px}.overlay{z-index:10;background:#080a0eb3;justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0}.sheet{background:var(--surface);border:1px solid var(--line);border-radius:16px;flex-direction:column;gap:12px;width:100%;max-height:90%;padding:18px;display:flex;overflow:auto}.sheet table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:14px}.sheet td,.sheet th{text-align:right;border-bottom:1px solid var(--line);padding:6px 4px}.sheet td:first-child,.sheet th:first-child{text-align:left}.sheet th{color:var(--muted);font-size:12px;font-weight:400}.made .pts,td.made{color:var(--green)}.missed .pts,td.missed{color:var(--red)}.grid td,.grid th{padding:3px;font-size:12px}.scroll{overflow-x:auto}.peek-row{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.peek-card{color:var(--muted);flex-direction:column;align-items:center;gap:4px;font-size:11px;display:flex}.peek-card.winner{color:var(--gold)}.peek-card.winner .card{outline:2px solid var(--gold);border-radius:7px}.error{border:1px solid var(--red);z-index:20;background:#4a1d1d;border-radius:10px;padding:10px 12px;font-size:13px;position:absolute;bottom:12px;left:12px;right:12px}.menu{flex-direction:column;gap:10px;max-width:280px;margin:32px auto 20px;display:flex}.bar{align-items:center;gap:8px;margin-bottom:8px;display:flex}.bar h2{margin:0}.nav-back{border-radius:50%;width:40px;min-height:40px;padding:0;font-size:26px;line-height:1}.setup,.gallery{height:100%;padding:16px;overflow-y:auto}.setup section{margin:14px 0 18px}.setup h3{margin-bottom:6px;font-size:17px}.row-head{justify-content:space-between;align-items:baseline;display:flex}.link{color:var(--gold);background:0 0;border:none;min-height:0;padding:4px 0}.chips{flex-wrap:wrap;gap:6px;margin:6px 0;display:flex}.chip{text-transform:capitalize;border-radius:17px;min-height:34px;padding:4px 12px;font-size:14px}.chip.on{background:var(--gold-soft);border-color:var(--gold);color:var(--gold)}.seat-row{align-items:center;gap:8px;margin:6px 0;display:flex}.seat-label{width:64px;color:var(--muted);flex:none;font-size:12px}.char{text-align:left;flex:1;align-items:center;gap:10px;padding:8px 10px;display:flex}.char .avatar{flex:none;width:38px;height:38px;font-size:16px}.avatar.empty{color:var(--muted);border-style:dashed}.char-text{flex-direction:column;gap:1px;line-height:1.3;display:flex}.x{width:36px;min-height:36px;color:var(--muted);border-radius:50%;padding:0;font-size:18px}.stepper{align-items:center;gap:10px;margin:6px 0;display:flex}.stepper span{flex:1}.stepper button{width:40px;padding:0;font-size:20px}.stepper b{text-align:center;width:28px;font-size:17px}.wide{width:100%;margin:8px 0 24px}.char-list{flex-direction:column;gap:6px;display:flex}.profile{background:var(--surface);border:1px solid var(--line);border-radius:14px;margin:10px 0;padding:14px}.profile-head{align-items:center;gap:12px;display:flex}.profile-head h3{margin:0}.tagline{font-family:var(--serif);margin:10px 0 4px;font-style:italic}@keyframes arrive{0%{left:var(--fx);top:var(--fy);opacity:.4}}.card.trick.arrive{animation:.22s ease-out arrive}@keyframes sweep{to{left:var(--wx);top:var(--wy);opacity:0;scale:.5}}.card.trick.sweep{animation:.32s ease-in forwards sweep}@keyframes deal-in{0%{opacity:0;translate:0 -48vh;scale:.4}}.card.in-hand.dealt{animation:.38s ease-out backwards deal-in;animation-delay:var(--d)}@keyframes fade-in{0%{opacity:0;scale:.6}}.back.dealt{animation:.28s ease-out backwards fade-in;animation-delay:var(--d)}@keyframes pop{0%{background:var(--gold);color:#1a1408;scale:1.5}}.pill.pop{animation:.3s ease-out pop}@keyframes flip-in{0%{opacity:0;rotate:y 90deg}}.card.drawn{animation:.36s ease-out backwards flip-in;animation-delay:var(--d)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.thinking{background:var(--ink);border-radius:10px;gap:3px;padding:4px 6px;display:flex;position:absolute;top:-8px;left:-12px;box-shadow:0 1px 3px #0006}.thinking i{background:var(--bg);border-radius:50%;width:5px;height:5px;animation:1s ease-in-out infinite think-dot}.thinking i:nth-child(2){animation-delay:.15s}.thinking i:nth-child(3){animation-delay:.3s}@keyframes think-dot{0%,80%,to{opacity:.25}40%{opacity:1}}.history{height:100%;padding:16px;overflow-y:auto}.history h3{margin:14px 0 6px;font-size:16px}.btn-sub{opacity:.8;font-size:12px;font-weight:400;display:block}.game-row{text-align:left;flex-direction:column;gap:3px;width:100%;margin:6px 0;padding:10px 12px;display:flex}.gr-top{justify-content:space-between;gap:8px;display:flex}.won{color:var(--gold)}.sheet.flat{padding:10px 12px}.file-btn{background:var(--surface2);border:1px solid var(--line);cursor:pointer;border-radius:12px;padding:10px 14px;display:inline-block}.file-btn input{display:none}.notice{background:var(--gold-soft);color:var(--gold);border:1px solid #c9a24b66;border-radius:10px;padding:10px 12px;font-size:14px}code{font-size:.92em}