: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}.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)}.turn{background:#e9ecf0;border-radius:10px;padding:8px 12px;font-weight:600}.turn.mine{background:var(--accent);color:#fff}.team{background:var(--surface);border:1px solid var(--line);border-radius:12px;margin:10px 0;padding:10px 12px}.team.mine{border-color:#b9cdf2}.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:8px;margin-top:8px;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;cursor:pointer;border-radius:10px;flex-direction:column;justify-content:flex-end;align-items:flex-start;width:calc(33.3333% - 5.33333px);max-width:124px;height:96px;padding:6px 8px;display:flex;position:relative}.meld.clean{border-color:var(--heart)}.meld-pip{opacity:.28;flex-direction:column;align-items:center;line-height:1;display:flex;position:absolute;top:5px;right:7px}.meld-pip b{letter-spacing:-1px;font-size:20px;font-weight:800}.meld-pip i{font-size:16px;font-style:normal}.meld-kind{white-space:nowrap;font-size:.75rem;font-weight:700}.meld.clean .meld-pip,.meld.clean .meld-kind{color:var(--heart)}.meld.dirty .meld-pip,.meld.dirty .meld-kind{color:var(--spade)}.meld-count{color:var(--muted);font-size:.75rem;line-height:1.25}.meld.target{outline:2px dashed var(--accent);outline-offset:2px}.meld-cards{flex-wrap:wrap;gap:6px;margin:12px 0;display:flex}.piles{gap:10px;margin:10px 0;display:flex}.pile{border:1px solid var(--line);background:var(--surface);text-align:left;cursor:pointer;border-radius:12px;flex:1;align-items:center;gap:10px;padding:8px 10px;display:flex}.pile.ready{border-color:var(--accent)}.pile.active{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.pile-text{flex-direction:column;display:flex}.pile-text small{color:var(--muted)}.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{flex-wrap:wrap;row-gap:8px;max-height:40vh;padding:14px 0 4px 18px;display:flex;overflow-y:auto}.actions{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px;display:grid}.actions.two{grid-template-columns:1fr 1.4fr}.complete{text-align:center;padding-top:6px}.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 0 0 -18px;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.group-start{margin-left:-8px}.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}.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){.hand{column-gap:4px;padding-left:0}.card{margin-left:0}.card.group-start{margin-left:10px}.overlay{align-items:center}.sheet{border-radius:16px}}
