html,body,#root{min-height:100svh;margin:0;padding:0}:root{--bg:#1a1814;--bg-elev:#25221c;--bg-card:#2f2b23;--fg:#f3ecdc;--fg-dim:#b8ad95;--accent:#c9a227;--danger:#c0392b;--border:#4a4338}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;font-size:14px}.app{max-width:1280px;margin:0 auto;padding:1.5rem 1.25rem 4rem}.app-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.app-header h1{letter-spacing:.02em;color:var(--accent);margin:0;font-size:1.75rem}.tagline{color:var(--fg-dim);margin:.25rem 0 0;font-size:.85rem}.tagline a{color:var(--fg-dim);text-decoration:underline}.tagline a:hover{color:var(--accent)}.toggle{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.5rem;font-size:.9rem;display:inline-flex}.toggle input{width:1rem;height:1rem;accent-color:var(--accent)}.score-bar{z-index:10;background:var(--bg-elev);border-top:1px solid var(--border);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);justify-content:space-between;align-items:center;margin:0 -1.25rem 1.5rem;padding:.75rem 1rem;display:flex;position:sticky;top:0}.score-total{align-items:baseline;gap:.75rem;display:flex}.score-label{color:var(--fg-dim);text-transform:uppercase;letter-spacing:.1em;font-size:.75rem}.score-value{color:var(--accent);font-variant-numeric:tabular-nums;font-size:2rem;font-weight:700}.hand-meta{color:var(--fg-dim);align-items:center;gap:1rem;font-size:.85rem;display:flex}.hand-meta button{color:var(--fg-dim);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:4px;padding:.4rem .75rem;font-size:.8rem}.hand-meta button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.hand-meta button:disabled{opacity:.4;cursor:not-allowed}.hand-section,.deck-section{margin-bottom:2rem}.hand-section h2,.deck-section h2{text-transform:uppercase;letter-spacing:.08em;color:var(--fg-dim);margin:0 0 .75rem;font-size:.95rem}.hand-grid,.suit-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem;display:grid}.suit-group{margin-bottom:1.25rem}.suit-group>summary.suit-title{text-transform:uppercase;letter-spacing:.1em;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:4px;justify-content:space-between;align-items:center;margin:0 0 .4rem;padding:.35rem .5rem;font-size:.8rem;list-style:none;display:flex}.suit-group>summary.suit-title::-webkit-details-marker{display:none}.suit-group>summary.suit-title:before{content:"▾";color:var(--fg-dim);margin-right:.5rem;font-size:.7rem;transition:transform .15s;display:inline-block}.suit-group:not([open])>summary.suit-title:before{transform:rotate(-90deg)}.suit-group>summary.suit-title:hover{background:#ffffff0a}.suit-name{flex:1}.suit-count{color:var(--fg-dim);font-variant-numeric:tabular-nums;letter-spacing:0;font-size:.75rem}.card-chip{background:var(--bg-card);color:var(--fg);border:1px solid var(--border);cursor:pointer;text-align:left;border-left-width:4px;border-radius:4px;justify-content:space-between;align-items:center;gap:.5rem;padding:.55rem .75rem;font-family:inherit;font-size:.85rem;transition:transform 80ms,background .1s;display:flex}.card-chip:hover{background:#3a352b;transform:translateY(-1px)}.card-chip.in-hand{border-color:var(--accent);background:#4a3f28}.card-chip.blanked{opacity:.45;text-decoration:line-through}.card-name{font-weight:500}.card-strength{color:var(--fg-dim);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.85rem}.card-delta strong{color:var(--accent)}.hand-card{flex-direction:column;gap:.25rem;display:flex}.card-action{background:#c9a22714;border:1px solid #c9a2274d;border-radius:4px;flex-direction:column;gap:.25rem;padding:.4rem .6rem;font-size:.78rem;display:flex}.card-action-row{color:var(--fg-dim);align-items:center;gap:.4rem;display:flex}.card-action-row span{flex:none}.card-action-row select{background:var(--bg-card);min-width:0;color:var(--fg);border:1px solid var(--border);font-family:inherit;font-size:inherit;cursor:pointer;border-radius:3px;flex:1;padding:.2rem .3rem}.card-action-row select:focus{border-color:var(--accent);outline:none}.app-footer{border-top:1px solid var(--border);color:var(--fg-dim);text-align:center;margin-top:3rem;padding-top:1rem;font-size:.8rem}.app-footer a{color:var(--fg-dim);text-decoration:underline}.app-footer a:hover{color:var(--accent)}
