:root{--font-body: system-ui, -apple-system, "Segoe UI", sans-serif;--radius: .75rem}:root[data-theme=light]{--bg: #f6f4ef;--surface: #ffffff;--text: #1c1b1a;--text-muted: #6b6660;--accent: #0a6e4f;--accent-contrast: #ffffff;--suit-red: #b3262a;--suit-black: #1c1b1a;--border: #dcd7cd}:root[data-theme=dark]{--bg: #14201b;--surface: #1e2d26;--text: #ece9e2;--text-muted: #a4aca5;--accent: #3fae85;--accent-contrast: #0e1713;--suit-red: #e06c70;--suit-black: #ece9e2;--border: #32423a}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:var(--font-body);transition:background-color .25s ease,color .25s ease}.wrap{max-width:40rem;margin:0 auto;padding:1.5rem 1rem 3rem}header.topbar{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--border)}.brand{font-size:1.4rem;font-weight:700;letter-spacing:.02em}.brand .suits{margin-left:.35rem;font-size:1.1rem}.suit-red{color:var(--suit-red)}.suit-black{color:var(--suit-black)}.controls{display:flex;gap:1rem;flex-wrap:wrap}.control-group{display:flex;align-items:center;gap:.4rem}.control-group>span{font-size:.8rem;color:var(--text-muted)}.seg{display:inline-flex;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--surface)}.seg button{border:0;background:transparent;color:var(--text);font:inherit;font-size:.85rem;padding:.35rem .7rem;cursor:pointer}.seg button[aria-pressed=true]{background:var(--accent);color:var(--accent-contrast)}main.hero{margin-top:2rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:2rem 1.5rem;box-shadow:0 2px 12px #00000014}main.hero h1{margin:0 0 .5rem;font-size:1.6rem}.tagline{color:var(--text-muted);margin:0 0 1.5rem}.phase{display:inline-block;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);border:1px solid var(--accent);border-radius:999px;padding:.15rem .7rem;margin-bottom:1rem}.ruleset{margin-top:1.5rem;font-size:.85rem;color:var(--text-muted)}.ruleset code{color:var(--text)}.wrap.game{max-width:64rem}.btn{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit;padding:.45rem .9rem;cursor:pointer}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast)}.btn.muted{color:var(--text-muted)}.btn.red{color:var(--suit-red)}.btn:disabled{opacity:.4;cursor:default}.btn-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.status{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.chip{font-size:.8rem;border:1px solid var(--border);border-radius:999px;padding:.2rem .7rem;background:var(--surface)}.chip.strong{border-color:var(--accent);color:var(--accent)}.table-grid{margin-top:1rem;display:flex;flex-direction:column;gap:.75rem;background:radial-gradient(ellipse at center,rgb(255 255 255 / 4%),transparent 70%),var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.table-middle{display:grid;grid-template-columns:1fr 2fr 1fr;gap:.75rem;align-items:start}.seat{border:1px dashed transparent;border-radius:var(--radius);padding:.4rem}.seat.active{border-color:var(--accent)}.seat-head{display:flex;justify-content:space-between;gap:.5rem;font-size:.8rem;margin-bottom:.3rem}.seat-name{font-weight:700}.seat-tricks{color:var(--text-muted)}.hand{display:flex;flex-wrap:wrap;gap:.25rem}.card{display:inline-flex;align-items:center;justify-content:center;min-width:2.3rem;height:3.1rem;border:1px solid var(--border);border-radius:.4rem;background:var(--surface);color:var(--suit-black);font:inherit;font-size:.95rem;font-weight:600;padding:0 .25rem;cursor:default}button.card:not(:disabled){cursor:pointer;border-color:var(--accent);box-shadow:0 1px 4px #00000026}button.card:not(:disabled):hover{transform:translateY(-3px)}button.card:disabled{opacity:.55}.card.red{color:var(--suit-red)}.card.back{min-width:1.1rem;background:repeating-linear-gradient(45deg,var(--accent),var(--accent) 3px,transparent 3px,transparent 6px),var(--surface);opacity:.6}.trick{min-height:6.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem}.trick-label{font-size:.75rem;color:var(--text-muted)}.trick-cards{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.trick-cell{text-align:center}.trick-player{font-size:.7rem;color:var(--text-muted);margin-bottom:.15rem}.panel{margin-top:1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.panel h2{margin:0 0 .5rem;font-size:1.1rem}.hint{color:var(--text-muted);margin:.25rem 0}.strong{font-weight:700;margin:.25rem 0}.made{color:var(--accent);font-weight:600}.failed{color:var(--suit-red);font-weight:600}.bidlog{font-size:.85rem;color:var(--text-muted);margin-bottom:.5rem}.score-table{border-collapse:collapse;margin:.75rem 0;font-size:.9rem}.score-table th,.score-table td{border:1px solid var(--border);padding:.3rem .7rem;text-align:center}.score-table th{color:var(--text-muted);font-weight:600}@media(max-width:40rem){.table-middle{grid-template-columns:1fr}}.btn.sound{padding:.35rem .6rem;font-size:1rem}.level-picker{margin:1rem 0 .25rem}@keyframes card-in{0%{opacity:0;transform:translateY(.6rem) scale(.9)}to{opacity:1;transform:none}}@keyframes panel-in{0%{opacity:0;transform:translateY(.4rem)}to{opacity:1;transform:none}}.trick-cell{animation:card-in .25s ease-out both}.hand .card{animation:card-in .3s ease-out both}.hand .card:nth-child(2n){animation-duration:.36s}.hand .card:nth-child(3n){animation-duration:.42s}.panel,main.hero{animation:panel-in .25s ease-out both}button.card:not(:disabled){transition:transform .12s ease-out}.seat.active{transition:border-color .2s ease-out}@media(prefers-reduced-motion:reduce){.trick-cell,.hand .card,.panel,main.hero{animation:none}button.card:not(:disabled){transition:none}}.options{margin:1rem 0 .5rem;padding:.75rem;border:1px dashed var(--border);border-radius:var(--radius)}.options-title{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:.5rem}.options .control-group{flex-wrap:wrap;margin:.35rem 0}.sb-input{font:inherit;padding:.35rem .5rem;border:1px solid var(--border);border-radius:.4rem;background:var(--surface);color:var(--text);width:6rem}.sb-name{width:10rem}.sb-table td,.sb-table th{min-width:3rem}tr.sb-total th,tr.sb-total td{font-weight:700;border-top:2px solid var(--accent)}.sb-del{padding:.1rem .45rem;font-size:.85rem}.sb-newround{margin:1rem 0;padding:.75rem;border:1px dashed var(--border);border-radius:var(--radius)}.sb-inputs{display:flex;flex-wrap:wrap;gap:.75rem;margin:.5rem 0}.sb-inputcell{text-align:center}.sb-inputcell .sb-input{width:4.5rem}.sb-select{width:auto;min-width:8rem}.sb-wiezen{display:flex;flex-wrap:wrap;gap:.75rem 1rem;margin:.5rem 0}.sb-roundlabel{font-weight:600;text-align:left;white-space:nowrap}