:root{--color-bg:#f5ead8;--color-surface:#ebddc5;--color-text:#201e1d;--color-accent:#c67139;--color-accent-2:#7a8a5e;--color-divider:#201e1d29;--color-neutral-100:#f9f4ed;--color-neutral-200:#eee7db;--color-neutral-300:#dcd3c4;--color-neutral-400:#c0b6a5;--color-neutral-500:#a19786;--color-neutral-600:#82796a;--color-neutral-700:#645c50;--color-neutral-800:#474238;--color-neutral-900:#2e2b25;--color-accent-100:#fff2eb;--color-accent-200:#ffe1d0;--color-accent-300:#ffc6a5;--color-accent-400:#f6a06b;--color-accent-500:#d67f48;--color-accent-600:#b2622d;--color-accent-700:#8c491a;--color-accent-800:#643312;--color-accent-900:#402310;--color-accent-2-100:#f0fae1;--color-accent-2-200:#e1eecc;--color-accent-2-300:#ccdbb2;--color-accent-2-400:#aebf92;--color-accent-2-500:#8fa073;--color-accent-2-600:#728157;--color-accent-2-700:#56633f;--color-accent-2-800:#3d472b;--color-accent-2-900:#272e1b;--font-heading:"Caprasimo", system-ui, sans-serif;--font-heading-weight:400;--font-body:"Figtree", system-ui, sans-serif;--space-1:4.4px;--space-2:8.8px;--space-3:13.2px;--space-4:17.6px;--space-6:26.4px;--space-8:35.2px;--radius-sm:8px;--radius-md:16px;--radius-lg:28px;--shadow-sm:0 1px 2px #2e2b2524;--shadow-md:0 3px 10px #2e2b2529;--shadow-lg:0 12px 32px #2e2b2538}*,:before,:after{box-sizing:border-box}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);margin:0;font-size:15px;font-weight:400;line-height:1.55}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--font-heading-weight);letter-spacing:-.015em;margin:0 0 var(--space-2);line-height:1.12}h1{font-size:42px}h2{font-size:32px}h3{font-size:25px}h4{font-size:20px}h5{font-size:16px}h6{letter-spacing:.08em;text-transform:uppercase;font-size:13px}p{margin:0 0 var(--space-3)}a{color:var(--color-accent);text-underline-offset:3px}.text-muted{color:color-mix(in srgb, var(--color-text) 55%, transparent)}:focus{outline:none}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}::selection{background:color-mix(in srgb, var(--color-accent) 30%, transparent)}.hr{height:1px;margin:var(--space-4) 0;background:var(--color-divider);border:0}.btn{cursor:pointer;font-family:var(--font-heading);font-weight:var(--font-heading-weight);color:var(--color-text);padding:var(--space-2) calc(var(--space-3) * 1.2);border-radius:var(--radius-md);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;gap:6px;font-size:14px;line-height:1.2;text-decoration:none;display:inline-flex}.btn svg{display:block}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--color-accent);color:var(--color-bg)}.btn-primary:hover:not(:disabled){background:var(--color-accent-600)}.btn-primary:active:not(:disabled){background:var(--color-accent-700)}.btn-secondary{border-color:var(--color-divider)}.btn-secondary:hover:not(:disabled){background:color-mix(in srgb, var(--color-text) 7%, transparent)}.btn-secondary:active:not(:disabled){background:color-mix(in srgb, var(--color-text) 14%, transparent)}.btn-ghost{color:var(--color-accent);padding-inline:var(--space-1)}.btn-ghost:hover:not(:disabled){background:color-mix(in srgb, var(--color-accent) 10%, transparent)}.btn-ghost:active:not(:disabled){background:color-mix(in srgb, var(--color-accent) 18%, transparent)}.btn-icon{width:36px;height:36px;padding:0}.btn-block{width:100%;margin-top:var(--space-2)}.card{gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-surface);flex-direction:column;display:flex}.card-kicker{letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent);font-size:10px}.card-title{font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:17px;line-height:1.2}.card-body{opacity:.8;flex:1;margin:0;font-size:13px}.card-meta{color:color-mix(in srgb, var(--color-text) 50%, transparent);align-items:center;gap:6px;font-size:11px;display:flex}.elev-sm{box-shadow:var(--shadow-sm)}.elev-md{box-shadow:var(--shadow-md)}.elev-lg{box-shadow:var(--shadow-lg)}.tag{letter-spacing:.02em;border-radius:calc(var(--radius-md) * .75);align-items:center;padding:3px 10px;font-size:11px;display:inline-flex}.tag-accent{background:var(--color-accent-100);color:var(--color-accent-800)}.tag-accent-2{background:var(--color-accent-2-100);color:var(--color-accent-2-800)}.tag-neutral{background:var(--color-neutral-100);color:var(--color-neutral-800)}.tag-outline{border:1px solid var(--color-accent);color:var(--color-accent)}.dialog-backdrop{padding:var(--space-4);background:color-mix(in srgb, var(--color-neutral-900) 50%, transparent);place-items:center;display:grid;position:fixed;inset:0}.dialog{gap:var(--space-3);width:min(440px,100%);padding:var(--space-4);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-lg);flex-direction:column;display:flex}.dialog-title{font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:20px}.dialog-body{opacity:.85;font-size:14px}.dialog-actions{justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-2);display:flex}.card,.dialog{border-radius:calc(var(--radius-lg) * 1.15)}.btn,.tag{border-radius:999px}#root,.screen{flex-direction:column;min-height:100vh;display:flex}.home{width:100%;max-width:480px;padding:var(--space-8) var(--space-4) var(--space-6);gap:var(--space-6);flex-direction:column;flex:1;margin:0 auto;display:flex}.home-title{margin-bottom:2px;font-size:44px}.home-subtitle{color:var(--color-neutral-700);margin:0}.start-card{background:var(--color-accent-2-800);color:var(--color-accent-2-100);border-radius:calc(var(--radius-lg) * 1.15);padding:var(--space-6);gap:var(--space-4);box-shadow:var(--shadow-lg);flex-direction:column;display:flex}.start-card h2{color:var(--color-accent-2-100);margin:0;font-size:24px}.start-card p{color:var(--color-accent-2-300);margin:0}.points-toggle{gap:6px;display:inline-flex}.points-toggle button{cursor:pointer;font-family:var(--font-heading);color:var(--color-accent-2-400);background:0 0;border:none;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700}.points-toggle button[aria-pressed=true]{background:var(--color-accent);color:var(--color-bg)}.nav-row{gap:var(--space-2);display:flex}.game{background:var(--color-neutral-200);flex-direction:column;flex:1;display:flex}.game-header{justify-content:space-between;align-items:center;gap:8px var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-divider);background:var(--color-bg);flex-wrap:wrap;flex:none;display:flex}.game-header .header-title{align-items:baseline;gap:16px;display:flex}.game-header .header-status{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.game-header .brand{font-family:var(--font-heading);font-size:22px}.game-header .meta{color:var(--color-neutral-700);white-space:nowrap;font-size:12.5px}.trump-chip{background:var(--color-accent-200);color:var(--color-accent-700);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12.5px;font-weight:700;display:inline-flex}.game-body{flex-direction:column;flex:1;min-height:0;display:flex}.sidebar{padding:var(--space-3) var(--space-4);flex-flow:wrap;flex:none;gap:8px;display:flex}.sidebar h6,.sidebar .stiche-block{display:none}.score-row{border-radius:var(--radius-lg);background:var(--color-surface);flex:auto;align-items:center;gap:8px;min-width:74px;padding:6px 10px;display:flex}.score-row.is-you{background:var(--color-accent-2-800)}.score-row.is-you .score-name{color:var(--color-accent-2-100)}.score-row .avatar{flex:none}.score-row .score-name{white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:12.5px;font-weight:700;overflow:hidden}.score-row .score-value{font-family:var(--font-heading);font-size:16px}.avatar{width:32px;height:32px;font-family:var(--font-heading);border-radius:999px;flex:none;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.avatar-0{background:var(--color-accent);color:var(--color-bg)}.avatar-1{background:var(--color-accent-2-500);color:var(--color-accent-2-900)}.avatar-2{background:var(--color-accent-400);color:var(--color-accent-900)}.avatar-3{background:var(--color-neutral-300);color:var(--color-neutral-800)}.bid-dots{gap:6px;display:flex}.bid-dot{background:var(--color-neutral-300);border-radius:999px;width:11px;height:11px}.bid-dot.is-filled{background:var(--color-accent)}.felt-wrap{min-width:0;padding:var(--space-4) var(--space-2) 160px;flex:1;display:flex}.felt-wrap.has-panel{padding-bottom:440px}.felt{border-radius:var(--radius-lg);background:var(--color-accent-2-900);flex:1;min-height:320px;position:relative;overflow:hidden;box-shadow:inset 0 0 60px #00000059}.felt-seat{flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute}.felt-seat--top{top:20px;left:50%;transform:translate(-50%)}.felt-seat--left{top:50%;left:12px;transform:translateY(-50%)}.felt-seat--right{top:50%;right:12px;transform:translateY(-50%)}.felt-seat .seat-id{align-items:center;gap:6px;display:flex}.felt-seat .seat-name{color:var(--color-accent-2-300);white-space:nowrap;font-size:11.5px;font-weight:700}.felt-seat .seat-substat{opacity:.85;font-size:10px;font-weight:600}.felt-seat.is-turn .avatar{box-shadow:0 0 0 3px var(--color-accent)}.felt-seat.is-home{opacity:.4}.card-back{background:var(--color-accent-700);border:1px solid var(--color-accent-900);border-radius:6px;width:40px;height:56px}.card-back-row{display:flex}.card-back-row .card-back+.card-back{margin-left:-24px}.card-back-col{flex-direction:column;display:flex}.card-back-col .card-back+.card-back{margin-top:-32px}.trick-pile{width:220px;height:170px;position:absolute;top:54%;left:50%;transform:translate(-50%,-50%)}.trick-note{text-align:center;color:var(--color-accent-2-300);font-size:12.5px;position:absolute;bottom:12px;left:0;right:0}.turn-note{text-align:center;color:var(--color-accent-400);font-size:12.5px;font-weight:700;position:absolute;top:14px;left:0;right:0}.playing-card{border-radius:var(--radius-sm);background:var(--color-neutral-100);border:1px solid var(--color-neutral-300);width:74px;height:104px;box-shadow:var(--shadow-md);flex-direction:column;justify-content:space-between;padding:8px;transition:transform .15s,opacity .15s,box-shadow .15s;display:flex}.playing-card .rank{font-family:var(--font-heading);font-size:16px;line-height:1}.playing-card .foot{letter-spacing:.06em;color:var(--color-neutral-500);font-size:9px;font-weight:700}.playing-card .glyph{align-self:center}.playing-card.is-playable{border-color:var(--color-accent);cursor:pointer;box-shadow:var(--shadow-lg);border-width:2px}.playing-card.is-playable .foot{color:var(--color-accent-600)}.playing-card.is-weli{border-color:var(--color-accent);background:var(--color-accent-100);border-width:2px}.playing-card.is-dim{opacity:.42}.playing-card.is-selected{border-color:var(--color-accent);box-shadow:var(--shadow-lg);border-width:2px;transform:translateY(-10px)}.trick-card-slot{width:62px;height:88px;position:absolute}.action-dock{z-index:5;padding:0 var(--space-4) 16px;flex-direction:column;align-items:center;gap:12px;max-height:100vh;display:flex;position:fixed;bottom:0;left:0;right:0;overflow-y:auto}.hand{justify-content:center;align-items:flex-end;display:flex}.hand .playing-card{margin-left:-20px}.hand .playing-card:first-child{margin-left:0}.action-panel{background:var(--color-bg);border-radius:var(--radius-lg);width:min(480px,100%);box-shadow:var(--shadow-lg);padding:var(--space-4);gap:var(--space-3);flex-direction:column;display:flex}.action-panel h3{margin:0}.action-panel .sheet-lead{color:var(--color-neutral-700);margin:0;font-size:13.5px}.bid-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.bid-grid button,.suit-grid button,.join-grid button,.exchange-grid button{cursor:pointer;border-radius:var(--radius-lg);background:var(--color-surface);font-family:var(--font-heading);border:none;padding:10px 8px;font-size:16px}.bid-grid button[aria-pressed=true]{background:var(--color-accent);color:var(--color-bg)}.bid-grid button:disabled{opacity:.4;cursor:not-allowed}.bid-grid button.is-mulatschak,.bid-grid button.is-pass{grid-column:span 4}.bid-grid button.is-mulatschak{background:var(--color-accent-200);border:2px solid var(--color-accent);color:var(--color-accent-700)}.suit-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.suit-grid button{flex-direction:column;justify-content:center;align-items:center;gap:5px;height:76px;font-size:13px;display:flex}.suit-grid button.is-herz{background:var(--color-accent-200);border:2px solid var(--color-accent);color:var(--color-accent-700)}.join-grid{gap:8px;display:flex}.join-grid button{flex:1}.join-grid .go{background:var(--color-accent);color:var(--color-bg)}.exchange-grid{align-items:center;gap:8px;display:flex}.exchange-grid button{flex:1}.exchange-grid .go{background:var(--color-accent);color:var(--color-bg)}.exchange-grid button:disabled{opacity:.4;cursor:not-allowed}.exchange-count{font-family:var(--font-heading);color:var(--color-neutral-700);text-align:center;min-width:68px;font-size:13px}.waiting-note{text-align:center;padding:var(--space-4);color:var(--color-neutral-700);font-size:14px}.score-recap{width:100%;max-width:480px;padding:var(--space-6) var(--space-4) var(--space-8);gap:var(--space-4);flex-direction:column;flex:1;margin:0 auto;display:flex}.recap-row{border-radius:var(--radius-lg);background:var(--color-surface);align-items:center;gap:14px;padding:14px 16px;display:flex}.recap-row.is-you{background:var(--color-accent-2-800);color:var(--color-accent-2-100)}.recap-row.is-you .recap-detail{color:var(--color-accent-2-300)}.recap-detail{color:var(--color-neutral-700);font-size:12.5px}.recap-delta{font-family:var(--font-heading);text-align:right;min-width:52px;font-size:20px}.recap-delta.is-negative{color:var(--color-accent-2-700)}.recap-delta.is-positive{color:var(--color-accent-700)}.recap-transition{color:var(--color-neutral-700);text-align:right;font-size:11px}.score-bars{align-items:flex-end;gap:10px;min-height:120px;display:flex}.score-bar-col{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.score-bar{border-radius:var(--radius-md) var(--radius-md) 0 0;background:var(--color-accent-2-400);width:100%}.score-bar.is-you{background:var(--color-accent)}.winner-banner{text-align:center;padding:var(--space-6);border-radius:var(--radius-lg);background:var(--color-accent-2-800);color:var(--color-accent-2-100)}.rules{width:100%;max-width:560px;padding:var(--space-6) var(--space-4) var(--space-8);gap:var(--space-4);flex-direction:column;flex:1;margin:0 auto;display:flex}.rule-step{gap:var(--space-3);padding:var(--space-4);border-radius:var(--radius-lg);background:var(--color-surface);display:flex}.rule-step .step-num{background:var(--color-bg);width:34px;height:34px;font-family:var(--font-heading);color:var(--color-accent-700);border-radius:999px;flex:none;justify-content:center;align-items:center;display:flex}.weli-callout{gap:var(--space-4);padding:var(--space-4);border-radius:var(--radius-lg);background:var(--color-accent-2-800);color:var(--color-accent-2-100);align-items:center;display:flex}@media (width>=900px){.game-body{padding:var(--space-4);gap:var(--space-4);flex-direction:row}.felt-wrap,.felt-wrap.has-panel{padding-bottom:var(--space-4)}.action-dock{margin-top:var(--space-4);padding:0;position:static}.felt{min-height:460px}.sidebar{gap:var(--space-4);width:220px;padding:var(--space-4) 0;flex-flow:column;flex:none}.sidebar h6,.sidebar .stiche-block{display:block}.score-row{min-width:0;padding:10px 14px}.score-row .score-name{font-size:14px}.score-row .score-value{font-size:18px}}
