.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:.65rem 1rem;font-weight:800;color:var(--color-text);background:var(--color-surface-raised);transition:transform var(--transition-fast),border-color var(--transition-fast)}
.button:hover:not(:disabled){transform:translateY(-1px);border-color:var(--color-muted)}
.button--primary{border-color:var(--color-primary);background:var(--color-primary);color:var(--color-primary-ink)}
.button--danger{border-color:var(--color-danger);color:var(--color-danger);background:transparent}
.button--quiet{background:transparent}
.hero-card,.lobby-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--surface-shadow)}
.uno-status{padding:.55rem 1rem;border:1px solid var(--color-primary);border-radius:var(--radius-pill);background:var(--color-primary);color:var(--color-primary-ink);font-weight:950;letter-spacing:.04em}
.notifications{position:fixed;right:var(--space-md);bottom:var(--space-md);z-index:50;display:grid;gap:var(--space-sm);width:min(24rem,calc(100% - 2rem))}
.notification{padding:.8rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-raised);box-shadow:var(--surface-shadow)}
.notification--error{border-color:var(--color-danger)}
.notification--success{border-color:var(--color-success)}
.dialog{width:min(30rem,calc(100% - 2rem));border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);color:var(--color-text);background:var(--color-surface);box-shadow:var(--surface-shadow)}
.dialog::backdrop{background:var(--color-overlay)}
.dialog h2{margin-bottom:var(--space-md)}
.color-options{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm);margin-bottom:var(--space-md)}
.color-choice{min-height:4rem;border-radius:var(--radius-md);font-weight:900;color:var(--color-card-ink)}
.color-choice--red{background:var(--color-red)}
.color-choice--yellow{background:var(--color-yellow)}
.color-choice--green{background:var(--color-green)}
.color-choice--blue{background:var(--color-blue)}