:root{--bg:#f4f5f7;--surface:#fff;--line:#dde1e7;--text:#1d2430;--muted:#5b6573;--accent:#1f6feb;--accent-soft:#e6efff;--error:#b42318;--error-soft:#fdeceb;--ok:#1a7f37;--gold-line:#d4a017;--gold-soft:#fff5d9;--spade:#111;--heart:#c62828;--diamond:#c62828;--club:#111;--joker:#9a5b00}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);-webkit-tap-highlight-color:transparent;margin:0;font:16px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{height:100%}button{font:inherit;color:inherit}h1{margin:0 0 8px;font-size:1.6rem}h2{margin:0 0 8px;font-size:1.1rem}h3{margin:16px 0 4px;font-size:1rem}.muted{color:var(--muted)}.small{font-size:.85rem}.page{max-width:560px;margin:0 auto;padding:24px 16px 40px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;margin:16px 0;padding:16px}.field{margin:12px 0 6px;font-weight:600;display:block}input[type=text],select{width:100%;font:inherit;border:1px solid var(--line);color:var(--text);background:#fff;border-radius:8px;padding:11px 12px;font-size:1.05rem}.row{gap:8px;display:flex}.row input{flex:1;min-width:0}.check{align-items:center;gap:10px;margin-top:12px;display:flex}.check input{width:22px;height:22px}ul.plain{margin:0;padding:0;list-style:none}ul.plain li{padding:6px 0}.btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;min-height:48px;padding:0 16px;font-weight:600;display:inline-flex}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn:disabled{opacity:.4;cursor:default}.btn.block{width:100%;display:flex}.btn.gap{margin-top:12px}.btn.small-btn{min-height:36px;padding:0 12px}.topbar>div:first-child{font-size:.88rem}.topbar-actions{flex:none;gap:4px;display:flex}.topbar-actions .small-btn{min-height:32px;padding:0 8px;font-size:.85rem}.settings-table{border-collapse:collapse;width:100%;margin:8px 0}.settings-table td{border-bottom:1px solid var(--line);padding:8px 4px}.settings-table td:last-child{text-align:right;white-space:nowrap;font-weight:700}.rule-on{color:var(--ok)}.rule-off{color:var(--muted)}.test-ok{color:var(--ok);margin:8px 0 0}ul.games{margin:0;padding:0;list-style:none}.game-row{align-items:center;gap:4px;margin-top:8px;display:flex}.game-item{border:1px solid var(--line);background:var(--surface);text-align:left;cursor:pointer;border-radius:10px;flex-direction:column;flex:1;align-items:flex-start;gap:2px;min-width:0;padding:10px 12px;display:flex}.game-item:disabled{cursor:default;opacity:.7}.game-item.your-turn{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.game-players{font-weight:600}.game-state{color:var(--muted);font-size:.9rem}.game-state.accent{color:var(--accent);font-weight:600}ol.steps{padding-left:22px}ol.steps li{margin:6px 0}.error-text{color:var(--error);margin:10px 0 0}.offline{z-index:20;color:#7a4b00;text-align:center;background:#fff4d6;padding:6px;font-weight:600;position:fixed;top:0;left:0;right:0}.dot{background:#b8bec7;border-radius:50%;width:9px;height:9px;margin-right:6px;display:inline-block}.dot.on{background:var(--ok)}.table{flex-direction:column;max-width:760px;height:100dvh;margin:0 auto;display:flex}.table-scroll{flex:1;padding:10px 12px;overflow-y:auto}.topbar{justify-content:space-between;align-items:center;gap:8px;display:flex}.scores{gap:8px;margin:8px 0;display:flex}.score{background:var(--surface);border:1px solid var(--line);border-radius:10px;flex:1;justify-content:space-between;align-items:baseline;gap:6px;min-width:0;padding:6px 10px;display:flex}.score span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.score b{font-variant-numeric:tabular-nums;font-size:1.2rem}.score.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.tint-mine{--tint-bg:var(--accent-soft);--tint-line:#b9cdf2;--tint-ink:#0b3d91}.tint-1{--tint-bg:#fff3dc;--tint-line:#eec67f;--tint-ink:#7a4b00}.tint-2{--tint-bg:#e6f4ea;--tint-line:#a8d5b5;--tint-ink:#1e5a32}.tint-3{--tint-bg:#f1ebfb;--tint-line:#cdb8ee;--tint-ink:#4a2d7a}.tint-4{--tint-bg:#e3f3f3;--tint-line:#9fd0d0;--tint-ink:#1f5656}.tint-5{--tint-bg:#fdebf2;--tint-line:#ebb3cb;--tint-ink:#7a2a4f}.tint-6{--tint-bg:#eceff3;--tint-line:#b9c1cc;--tint-ink:#3a4350}.score.tinted{background:var(--tint-bg);border-color:var(--tint-line);color:var(--tint-ink)}.turn{background:#e9ecf0;border-radius:10px;padding:8px 12px;font-weight:600}.turn.mine{background:var(--accent);color:#fff}.order{flex-wrap:wrap;align-items:center;gap:4px 2px;margin:0 0 8px;font-size:.88rem;display:flex}.order-label{color:var(--muted);margin-right:4px;font-size:.78rem}.order-item{align-items:center;display:inline-flex}.order-arrow{color:var(--muted);margin:0 3px}.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;align-items:baseline;gap:4px;padding:2px 9px;display:inline-flex}.chip.tinted{background:var(--tint-bg);border-color:var(--tint-line);color:var(--tint-ink)}.chip.now{border:2px solid var(--text);font-weight:700}.chip-tag{text-transform:uppercase;color:var(--muted);font-size:.68rem;font-weight:700}.team{background:var(--surface);border:1px solid var(--line);border-radius:12px;margin:10px 0;padding:10px 12px}.team.tinted{background:var(--tint-bg);border-color:var(--tint-line)}.team-role{font-weight:700}.team-names{font-weight:500}.team.tinted .team-head h2{color:var(--tint-ink)}.team-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 10px;display:flex}.team-head h2{margin:0;font-size:1rem}.books,.player-line,.opening{color:var(--muted);font-size:.88rem}.opening.met{color:var(--ok);font-weight:600}.melds{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.section-label{color:var(--muted);margin:8px 0 0;font-size:.78rem;font-weight:600}.meld{border:2px solid var(--spade);background:var(--surface);text-align:left;white-space:nowrap;cursor:pointer;border-radius:8px;align-items:center;gap:6px;width:calc(50% - 3px);max-width:200px;height:34px;padding:0 8px;display:flex;overflow:hidden}.meld.clean{border-color:var(--heart)}.meld-sym{font-size:.95rem;font-weight:800}.meld.short{border-width:1.5px;border-radius:6px;gap:4px;width:100%;max-width:none;height:24px;padding:0 5px}.meld.short .meld-sym{font-size:.78rem}.meld.short .meld-kind,.meld.short .meld-count{font-size:.7rem}.meld-kind{text-overflow:ellipsis;font-size:.78rem;font-weight:700;overflow:hidden}.meld.clean .meld-sym,.meld.clean .meld-kind{color:var(--heart)}.meld.dirty .meld-sym,.meld.dirty .meld-kind{color:var(--spade)}.meld-count{color:var(--muted);margin-left:auto;font-size:.75rem}.meld.target{outline:2px dashed var(--accent);outline-offset:2px}.meld-cards{flex-wrap:wrap;gap:6px;margin:12px 0;display:flex}.board{background:#1e5a3c;border-radius:14px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"top top top""left piles right";align-items:start;gap:6px;margin:8px 0;padding:6px;display:grid}.board.one{grid-template-areas:"top top top""piles piles piles"}.board.two{grid-template-areas:"left piles right"}.board .team{margin:0}.board-top{flex-direction:column;grid-area:top;gap:6px;display:flex}.board-left{grid-area:left}.board-right{grid-area:right}.board-piles{grid-area:piles;justify-content:center;align-self:center;gap:6px;display:flex}.pile-card{color:#fff;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:10px;flex-direction:column;align-items:center;gap:3px;padding:4px 3px;font-size:.72rem;display:flex}.pile-card.ready,.pile-card.active{box-shadow:0 0 0 2px #fff}.pile-note{opacity:.85;font-size:.65rem}.board .empty-pile{border-color:#ffffff80}.team.side{padding:6px}.team.side .team-head{flex-direction:column;align-items:flex-start;gap:0}.team.side .team-head h2{font-size:.85rem}.side-name{color:var(--tint-ink);font-size:.72rem;line-height:1.3}.melds.stack{flex-flow:column;gap:4px}.books-divider{border:0;border-top:1.5px solid var(--tint-line);flex-basis:100%;width:100%;height:0;margin:1px 0}.card-back,.empty-pile{border-radius:6px;flex:none;width:44px;height:62px}.card-back{box-shadow:0 0 0 1px var(--line);background:repeating-linear-gradient(45deg,#3a6fd8 0 5px,#2d59b3 5px 10px);border:3px solid #fff}.empty-pile{border:2px dashed var(--line)}.bottom{background:var(--surface);border-top:1px solid var(--line);padding:8px 12px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -4px 12px #0000000a}.notice{text-align:left;cursor:pointer;border:0;border-radius:8px;width:100%;margin-bottom:4px;padding:8px 12px;font-weight:500;display:block}.notice.error{background:var(--error-soft);color:var(--error)}.notice.info{background:var(--accent-soft);color:#0b3d91}.hint{color:var(--muted);padding:4px 0;font-size:.92rem}.meter{margin:8px 0 0;font-weight:600}.meter.met{color:var(--ok)}.hand-head{color:var(--muted);justify-content:space-between;gap:8px;margin-top:2px;font-size:.85rem;display:flex}.hand{max-height:40vh;padding:12px 0 2px;overflow-y:auto}.hand-row{display:flex}.hand-row+.hand-row{margin-top:6px}.actions{grid-template-columns:repeat(5,1fr);gap:6px;margin-top:8px;display:grid}.actions .btn{min-height:38px;padding:0 4px;font-size:.95rem}.btn.danger{background:var(--error);border-color:var(--error);color:#fff}.link.danger-link{color:var(--error)}.confirm{background:var(--error-soft);border-radius:10px;margin:6px 0 4px;padding:8px 10px}.confirm p{margin:0 0 6px}.actions.two{grid-template-columns:1fr 1.4fr}.complete{text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px 12px 10px}.complete b{font-size:1.1rem}.pickup-head{align-items:center;gap:12px;margin-bottom:6px;display:flex}.pickup-head h2{margin:0}.pickup-box{border:1px solid var(--line);cursor:pointer;border-radius:10px;margin:8px 0;padding:6px 8px 8px}.pickup-box.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.pickup-box-head{color:var(--muted);justify-content:space-between;gap:8px;font-size:.85rem;display:flex}.pickup-cards{flex-wrap:wrap;gap:5px;margin-top:6px;display:flex}.pickup-cards .card.selected{transform:none}button.card.small{cursor:pointer}.link{color:var(--accent);cursor:pointer;background:0 0;border:0;padding:0 0 0 10px;font-weight:600}.card{cursor:pointer;background:#fff;border:1.5px solid #c5cbd3;border-radius:8px;flex-direction:column;flex:none;align-items:flex-start;width:56px;height:78px;margin:0;padding:4px 0 0 5px;line-height:1;transition:transform .12s;display:flex;position:relative;box-shadow:-2px 0 3px #00000014}.card .rank{letter-spacing:-1px;font-size:24px;font-weight:800}.card .suit{margin-top:2px;font-size:22px}.card.wild{background:var(--gold-soft)}.card.three{background:#fcebeb}.card.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent), 0 4px 8px #00000026;transform:translateY(-12px)}.card .new{letter-spacing:.02em;color:#fff;background:var(--accent);border-radius:3px;padding:2px 3px;font-size:9px;font-weight:800;position:absolute;bottom:4px;left:3px}.card.small,.card.pile{box-shadow:none;cursor:default;width:44px;height:62px;margin:0}.card.small .rank,.card.pile .rank{font-size:20px}.card.small .suit,.card.pile .suit{font-size:18px}.s-S{color:var(--spade)}.s-H{color:var(--heart)}.s-D{color:var(--diamond)}.s-C{color:var(--club)}.s-J{color:var(--joker)}.overlay{z-index:10;background:#14192373;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);width:100%;max-width:560px;max-height:90dvh;padding:18px 16px calc(18px + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;overflow-y:auto}.scroll-x{overflow-x:auto}.how{background:var(--accent-soft);border:1px solid #b9cdf2;border-radius:10px;margin:4px 0 10px;padding:8px 10px}.how-title{color:#0b3d91}.how-need{color:#0b3d91;margin:2px 0 6px;font-size:.85rem}.how-list{flex-direction:column;gap:5px;display:flex}.how-book{align-items:center;gap:6px;display:flex}.how .meld{cursor:default;flex:none;width:172px}.new-tag{color:#fff;background:var(--accent);border-radius:4px;padding:2px 5px;font-size:.65rem;font-weight:700}.how-sub{color:var(--muted);margin:6px 0 0;font-size:.8rem}.scoretable{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;margin:8px 0}.scoretable th,.scoretable td{text-align:right;border-bottom:1px solid var(--line);white-space:nowrap;padding:8px 6px}.scoretable th{color:var(--muted);font-size:.85rem;font-weight:600}.scoretable th:first-child,.scoretable td:first-child{text-align:left}.scoretable .total{font-weight:700}.scoretable .neg{color:var(--error)}@media (width>=640px){.overlay{align-items:center}.sheet{border-radius:16px}}
