/* Shared interface adjustments; game-specific themes stay in each game. */
.page-header p, .game-card-desc, .note, label, input, textarea, .chat-message { font-family: var(--font-body); }
.page-header p, .game-card-desc { color: #c8c3bb; line-height: 1.5; }
.rooms-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); scrollbar-gutter: stable; }
button.room-card { min-width: 0; width: 100%; gap: 12px; text-align: left; text-transform: none; letter-spacing: normal; font-size: 1rem; }
.room-card > span { min-width: 0; }
.room-card > span:last-child { white-space: nowrap; font-size: .85rem; }
.room-card:focus-visible { outline: 2px solid var(--accent-gold); outline-offset: -3px; }
.rooms-status { min-height: 1.5em; font: .8rem/1.5 var(--font-body); color: #c8c3bb; margin-top: 6px; }
.rooms-status.is-error { color: #ffb0a7; }
.game-card-meta { font: .75rem/1.5 var(--font-body); color: #c8c3bb; margin: 10px 0 14px; }
input, textarea { font-family: var(--font-body); }
.modal-content { max-height: calc(100dvh - 32px); overflow-y: auto; }
body.has-dialog { overflow: hidden; }
.modal-content [role=dialog]:focus { outline: none; }
@media (max-width: 520px) {
    .rooms-grid { grid-template-columns: minmax(0, 1fr); max-height: 260px; }
    button.room-card { padding: 10px 12px; }
    .page-header { margin-top: 58px; margin-bottom: 12px; }
    .page-header-icon { width: 100px !important; height: 100px !important; object-fit: contain; margin-bottom: 8px !important; }
    .page-header h1 { font-size: 1.5rem; letter-spacing: 1px; }
    .page-header p { font-size: .8rem; }
    #setup-screen { margin-top: 0; padding: 18px; }
    .feedback-fab { bottom: 12px; left: 12px; }
    .cn-card-word.is-xlong { font-size: .72rem; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Radiance/Reaver have stronger strokes than the previous Garamond fonts. */
body { font-weight: 400; font-synthesis: none; }
h1, h2, h3, h4, .page-header h1, .game-card-title, .cn-lobby-title { font-weight: 400; }
.page-header h1 { text-shadow: 0 2px 4px rgba(0, 0, 0, .65); }
label, input, select, textarea, button, .back-to-hub, .game-card-play, .feedback-fab { font-weight: 400; }
button.room-card { font-family: var(--font-body); font-weight: 400; }
.cn-card-word, .cn-clue-word, .word-card, .card-title { font-weight: 400; }
.cn-progress-num, .winner-team-score, .winner-team-name, .team-score { font-weight: 600; }
strong, b { font-weight: 600; }
