:root {
    color-scheme: light;
    --bg: #f5f7fb;
    --panel: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --border: #dbe2ea;
    --accent: #243b53;
    --danger: #9b1c1c;
    --success: #17633a;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); }
a { color: var(--accent); }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 6px; }
h2 { font-size: 1.12rem; margin-bottom: 8px; }
.site-header { background: var(--panel); border-bottom: 1px solid var(--border); }
.site-header__inner { max-width: 1180px; margin: 0 auto; padding: 14px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { font-weight: 750; text-decoration: none; color: var(--text); }
.container { max-width: 1180px; margin: 0 auto; padding: 28px 20px 64px; }
.card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 22px; box-shadow: 0 6px 24px rgba(31,41,55,.05); }
.card--flush { padding: 0; overflow: hidden; }
.dashboard-card { text-decoration: none; color: inherit; transition: transform .12s ease, box-shadow .12s ease; }
.dashboard-card:hover { transform: translateY(-1px); box-shadow: 0 9px 28px rgba(31,41,55,.09); }
.stack { display: grid; gap: 16px; }
.grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.page-heading { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; }
.eyebrow { margin-bottom: 5px; font-size: .82rem; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.eyebrow a { color: inherit; }
label { font-weight: 650; display: block; margin-bottom: 6px; }
input, select, textarea, button { font: inherit; }
input, select, textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--border); border-radius: 9px; background: #fff; color: var(--text); }
textarea { resize: vertical; line-height: 1.45; }
button, .button { display: inline-block; border: 1px solid transparent; border-radius: 9px; padding: 10px 14px; background: var(--accent); color: #fff; text-decoration: none; cursor: pointer; line-height: 1.2; }
.button--secondary { background: #526777; color: #fff; }
.button--small { padding: 7px 10px; font-size: .9rem; }
.button--danger-outline { background: #fff; color: var(--danger); border-color: #d8a8a8; }
.alert { border-radius: 10px; padding: 12px 14px; border: 1px solid var(--border); background: #fff; margin-bottom: 16px; }
.alert ul { margin-bottom: 0; }
.alert--error { border-color: #efb8b8; background: #fff7f7; color: var(--danger); }
.alert--success { border-color: #b9dbc8; background: #f4fbf7; color: var(--success); }
.muted { color: var(--muted); }
.inline { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.inline--end { justify-content: flex-end; }
.nav { display: flex; gap: 14px; align-items: center; }
.nav--primary a:not(.brand) { text-decoration: none; font-weight: 650; }
.nav form, .table form, .media-card form { margin: 0; }
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.table th { font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); background: #f9fafc; }
.table tbody tr:last-child td { border-bottom: 0; }
.table-actions { text-align: right !important; white-space: nowrap; }
.question-prompt { max-width: 560px; min-width: 260px; }
.question-prompt a { font-weight: 650; text-decoration: none; }
.badge { display: inline-flex; align-items: center; border: 1px solid var(--border); border-radius: 999px; padding: 4px 9px; background: #f8fafc; color: var(--text); font-size: .8rem; font-weight: 700; }
.tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--border); }
.tab { padding: 9px 13px; text-decoration: none; color: var(--muted); border-bottom: 3px solid transparent; margin-bottom: -1px; }
.tab.is-active { color: var(--text); border-bottom-color: var(--accent); font-weight: 700; }
.empty-state { padding: 42px 24px; text-align: center; }
.choice-list { display: grid; gap: 9px; }
.choice-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.choice-row .choice-correct { width: 20px; height: 20px; margin: 0; }
.segmented { display: flex; gap: 12px; flex-wrap: wrap; }
.segmented label { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 18px; border: 1px solid var(--border); border-radius: 10px; background: #fff; cursor: pointer; }
.segmented input { width: auto; margin: 0; }
.form-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.field-help { color: var(--muted); font-size: .88rem; margin: 7px 0 0; }
.media-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.media-card { border: 1px solid var(--border); border-radius: 11px; padding: 12px; display: grid; gap: 10px; align-content: start; }
.media-card img { display: block; width: 100%; max-height: 210px; object-fit: contain; border-radius: 7px; background: #f2f4f7; }
.media-card audio { width: 100%; }
.media-card__meta { display: grid; gap: 2px; overflow-wrap: anywhere; }
.danger-zone { display: flex; justify-content: space-between; gap: 18px; align-items: center; border-color: #e2c3c3; }
[hidden] { display: none !important; }
@media (max-width: 760px) {
    .site-header__inner, .page-heading, .danger-zone { align-items: stretch; flex-direction: column; }
    .site-header__inner { display: flex; }
    .nav { flex-wrap: wrap; }
    .choice-row { grid-template-columns: 28px minmax(0, 1fr); }
    .choice-row .button { grid-column: 2; justify-self: start; }
    .table-actions { white-space: normal; }
}

/* Game management */
.badge--draft { background: #fff8e8; border-color: #ead59c; }
.badge--ready { background: #f0faf4; border-color: #b8dcc6; color: var(--success); }
.badge--archived { background: #f3f4f6; color: var(--muted); }
.round-card { scroll-margin-top: 18px; }
.round-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.round-heading h2 { margin: 3px 0 0; }
.round-number { color: var(--muted); font-size: .8rem; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.round-settings { display: grid; grid-template-columns: minmax(220px, 2fr) minmax(120px, .75fr) minmax(180px, 1fr) minmax(120px, .7fr) auto; gap: 12px; align-items: end; padding: 14px; background: #f9fafc; border: 1px solid var(--border); border-radius: 11px; }
.round-settings__actions { align-self: end; }
.add-question-form { display: grid; grid-template-columns: minmax(300px, 2.4fr) minmax(130px, .7fr) minmax(170px, 1fr) minmax(105px, .55fr) auto; gap: 12px; align-items: end; padding-top: 4px; }
.add-question-form__action, .inline-form-row__action { align-self: end; }
.inline-form-row { display: grid; grid-template-columns: minmax(280px, 1fr) auto; gap: 12px; align-items: end; }
.inline-form { display: inline-block; margin-left: 6px !important; }
.input--compact { min-width: 90px; padding: 7px 8px; }
.input--timer { width: 86px; }
.timing-override { display: flex; gap: 7px; align-items: center; min-width: 220px; }
.empty-inline { border: 1px dashed var(--border); border-radius: 10px; padding: 16px; color: var(--muted); background: #fbfcfd; }
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 4px; }
.game-question-table td:first-child { width: 52px; }
.game-question-table td:nth-child(3) { width: 120px; }
.game-question-table td:nth-child(4) { width: 250px; }
.game-question-table .table-actions { min-width: 145px; }

@media (max-width: 980px) {
    .round-settings, .add-question-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .round-settings__actions, .add-question-form__action { grid-column: span 2; }
}

@media (max-width: 620px) {
    .round-heading { flex-direction: column; }
    .round-settings, .add-question-form, .inline-form-row { grid-template-columns: 1fr; }
    .round-settings__actions, .add-question-form__action { grid-column: auto; }
}

/* Question organization */
.grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.filter-grid { display: grid; grid-template-columns: minmax(260px, 2fr) repeat(4, minmax(135px, 1fr)) auto; gap: 12px; align-items: end; }
.filter-grid__actions { display: flex; gap: 8px; align-items: end; }
.bulk-panel { border-style: dashed; }
.bulk-panel__heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.bulk-panel__controls { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(220px, 1fr) minmax(220px, 1fr) auto; gap: 10px; align-items: center; }
.checkbox-cell { width: 42px; text-align: center !important; }
.checkbox-cell input { width: 18px; height: 18px; }
.clamp-1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 560px; }
.tag-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.tag-choice { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); border-radius: 999px; padding: 7px 10px; margin: 0; font-weight: 600; background: #fff; }
.tag-choice input { width: auto; margin: 0; }
.section-heading { padding: 18px 22px 8px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.section-heading--border { padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.section-footer { padding: 16px 22px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; }
.inline-form-row--wide { grid-template-columns: minmax(220px, 1fr) minmax(280px, 2fr) auto; }
.row--muted { opacity: .58; background: #fafafa; }
.round-add-tools { display: grid; grid-template-columns: 1fr 1.25fr; gap: 14px; padding-top: 4px; }
.round-add-tools > * { border: 1px solid var(--border); border-radius: 11px; padding: 16px; background: #fbfcfd; }
.round-add-tools h3 { margin: 0 0 6px; font-size: 1rem; }
.round-settings--from-set { grid-template-columns: minmax(220px, 1.3fr) minmax(180px, 1fr) minmax(120px, .6fr) minmax(180px, 1fr) minmax(110px, .55fr) auto; }

@media (max-width: 1000px) {
    .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .filter-grid__search { grid-column: span 2; }
    .bulk-panel__controls { grid-template-columns: 1fr 1fr; }
    .round-add-tools { grid-template-columns: 1fr; }
    .round-settings--from-set { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
    .grid--two, .grid--three, .filter-grid, .bulk-panel__controls { grid-template-columns: 1fr; }
    .filter-grid__search { grid-column: auto; }
    .bulk-panel__heading, .section-heading { flex-direction: column; }
    .round-settings--from-set { grid-template-columns: 1fr; }
}

/* v0.4.1 game-round collapsing */
.rounds-section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.round-collapse-controls { flex-shrink: 0; }
.round-toggle { min-width: 82px; }
.round-card--collapsed { gap: 0; }
.round-body[hidden] { display: none !important; }
@media (max-width: 700px) {
    .rounds-section-heading { align-items: stretch; flex-direction: column; }
    .round-collapse-controls { justify-content: flex-start; }
}

/* v0.6.0 Session foundation */
.badge--session-draft { background: #fff8e8; border-color: #ead59c; }
.badge--session-registration { background: #eef7ff; border-color: #b9d7ef; }
.badge--session-live { background: #f0faf4; border-color: #b8dcc6; color: var(--success); }
.badge--session-paused { background: #fff3df; border-color: #e9c887; }
.badge--session-complete { background: #f3f4f6; color: var(--muted); }
.badge--session-cancelled { background: #fff4f4; border-color: #e6bcbc; color: var(--danger); }
.badge--round-pending { background: #f8fafc; }
.badge--round-live { background: #f0faf4; border-color: #b8dcc6; color: var(--success); }
.badge--round-complete { background: #f3f4f6; color: var(--muted); }
.join-code-panel { display: grid; gap: 3px; justify-items: end; min-width: 150px; }
.join-code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1.6rem; letter-spacing: .14em; }
.join-code--small { font-size: .95rem; letter-spacing: .08em; }
.session-controls form { margin: 0; }
.session-round { scroll-margin-top: 18px; }
.session-round .table { font-size: .94rem; }
@media (max-width: 700px) {
    .join-code-panel { justify-items: start; }
}

/* v0.7.0 playable Sessions */
.host-display-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.public-play-shell { max-width: 760px; margin: 0 auto; }
.public-play-heading { align-items: flex-start; }
.public-join-form { max-width: 520px; margin: 0 auto; width: 100%; }
.join-code-input { font-size: 2rem; letter-spacing: .22em; text-transform: uppercase; text-align: center; font-weight: 800; }
.team-chip { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.team-question-card { overflow: hidden; }
.team-question-prompt { font-size: clamp(1.5rem, 4vw, 2.4rem); line-height: 1.2; }
.team-question-image, .host-question-image { display: block; max-width: 100%; max-height: 440px; object-fit: contain; border-radius: 12px; margin: 0 auto; }
.team-choice-list { display: grid; gap: 10px; }
.team-choice { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--border, #d9d9d9); border-radius: 12px; cursor: pointer; }
.team-choice input { width: auto; flex: 0 0 auto; }
.team-choice:has(input:checked) { outline: 2px solid currentColor; }
.question-countdown, .display-countdown { font-variant-numeric: tabular-nums; }
.question-countdown.is-expired, .display-countdown.is-expired { font-weight: 800; }
.locked-answer-panel, .answer-reveal-box { padding: 16px; border-radius: 12px; background: rgba(127,127,127,.08); }
.answer-reveal-box strong { font-size: 1.35rem; }
.public-standings { display: grid; gap: 8px; padding-left: 1.6rem; }
.public-standings li { padding: 10px 12px; }
.public-standings li span { display: inline-block; min-width: 65%; }
.public-standings li strong { float: right; }
.mini-check { display: inline-flex; align-items: center; gap: 4px; font-size: .85rem; }
.mini-check input { width: auto; }
.session-question { border: 1px solid var(--border, #ddd); border-radius: 12px; overflow: hidden; scroll-margin-top: 110px; }
.host-question-context { padding: 14px 16px; border-radius: 12px; background: rgba(127,127,127,.07); }
.host-question-prompt { margin-top: 4px; font-size: 1.18rem; line-height: 1.4; font-weight: 750; }
.host-question-choice-list { margin: 10px 0 0; padding-left: 1.5rem; display: grid; gap: 4px; }
.host-question-choice-list li { padding-left: 2px; }
.session-question > summary { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 14px 16px; cursor: pointer; font-weight: 700; }
.session-question > summary::-webkit-details-marker { display: none; }
.session-question__body { padding: 16px; border-top: 1px solid var(--border, #ddd); }
.session-question__summary-prompt { min-width: 0; }
.question-number-pill { display: inline-flex; min-width: 36px; height: 36px; border-radius: 999px; align-items: center; justify-content: center; background: rgba(127,127,127,.12); }
.question-meta-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; font-size: .9rem; }
.host-answer-form { display: flex; gap: 8px; align-items: center; min-width: 300px; }
.host-answer-form input, .host-answer-form select { min-width: 0; }
.score-controls { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.score-display { min-width: 65px; font-variant-numeric: tabular-nums; }
.score-input { width: 72px; }
.answer-review-table td { vertical-align: middle; }
.badge--question-open { font-weight: 800; }
.badge--question-locked { opacity: .8; }
.badge--question-revealed { font-weight: 700; }

.display-body { margin: 0; min-height: 100vh; background: #101114; color: #f7f7f8; }
.trivia-display { min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; padding: 24px 34px; box-sizing: border-box; }
.trivia-display__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
.trivia-display__venue { font-size: 1rem; opacity: .72; }
.trivia-display__session { font-size: clamp(1.2rem, 2.5vw, 2rem); font-weight: 800; }
.trivia-display__code-block { text-align: right; display: flex; flex-direction: column; gap: 4px; opacity: .9; }
.trivia-display__join-code { font-size: clamp(1.8rem, 4vw, 3.2rem); letter-spacing: .14em; }
.trivia-display__stage { display: flex; align-items: center; justify-content: center; padding: 30px 0; min-height: 0; }
.trivia-display__footer { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 44px; }
.display-center { text-align: center; width: min(1100px, 96vw); }
.display-eyebrow { text-transform: uppercase; letter-spacing: .16em; font-weight: 800; opacity: .7; }
.display-title { font-size: clamp(3rem, 8vw, 7rem); line-height: 1; margin: .1em 0; }
.display-subtitle, .display-join-path { font-size: clamp(1.2rem, 2.6vw, 2rem); opacity: .8; }
.display-big-code { font-size: clamp(4rem, 13vw, 10rem); line-height: 1; font-weight: 900; letter-spacing: .1em; }
.display-question { width: min(1200px, 96vw); }
.display-question__meta { display: flex; justify-content: space-between; gap: 20px; font-size: clamp(1rem, 2vw, 1.5rem); opacity: .75; }
.display-question__prompt { font-size: clamp(2.4rem, 6vw, 5.5rem); line-height: 1.08; margin: .25em 0; }
.display-question__image { display: block; max-width: 82vw; max-height: 45vh; object-fit: contain; margin: 0 auto; border-radius: 16px; }
.display-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.display-choice { display: flex; align-items: center; gap: 14px; padding: 18px 22px; border: 2px solid rgba(255,255,255,.24); border-radius: 16px; font-size: clamp(1.25rem, 2.6vw, 2rem); }
.display-choice__letter { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 999px; background: rgba(255,255,255,.12); font-weight: 900; }
.display-choice.is-correct { border-width: 4px; transform: scale(1.01); }
.display-state-banner { text-align: center; font-size: clamp(2rem, 5vw, 4rem); font-weight: 900; text-transform: uppercase; letter-spacing: .08em; padding-top: 14px; }
.display-reveal { text-align: center; padding: 18px; border-radius: 16px; background: rgba(255,255,255,.1); font-size: clamp(1.4rem, 3vw, 2.4rem); }
.display-reveal strong { display: block; font-size: clamp(2rem, 5vw, 4rem); }
.display-standings { display: grid; gap: 12px; list-style-position: inside; padding: 0; margin: 20px auto 0; width: min(900px, 92vw); }
.display-standings li { display: grid; grid-template-columns: 1fr auto; gap: 20px; text-align: left; padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,.18); font-size: clamp(1.4rem, 3vw, 2.4rem); }
.display-standings li strong { font-variant-numeric: tabular-nums; }
.display-placeholder { font-size: 2rem; opacity: .7; }

@media (max-width: 700px) {
  .host-display-actions { justify-content: flex-start; }
  .team-chip { align-items: flex-start; }
  .session-question > summary { grid-template-columns: auto 1fr; }
  .session-question > summary .badge { grid-column: 2; justify-self: start; }
  .host-answer-form { min-width: 0; flex-direction: column; align-items: stretch; }
  .trivia-display { padding: 16px; }
  .trivia-display__header { flex-direction: column; }
  .trivia-display__code-block { text-align: left; }
  .display-choice-grid { grid-template-columns: 1fr; }
  .trivia-display__footer { flex-direction: column; text-align: center; }
}

/* v0.7.0 host-only scoring reference */
.host-scoring-reference {
    border: 1px dashed var(--border, #cbd5e1);
    border-radius: 10px;
    padding: 12px 14px;
    background: rgba(127, 127, 127, 0.06);
}

/* v0.7.2 live host refresh, compact team play, and reveal fitting */
.team-play-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel);
    box-shadow: 0 3px 14px rgba(31,41,55,.04);
}
.team-play-bar__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.05rem;
}
.team-play-bar__score { flex: 0 0 auto; white-space: nowrap; }
.team-play-bar__score > strong { font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.team-score-tally {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #f8fafc;
}
.team-score-tally > span { font-weight: 750; color: var(--muted); }
.team-score-tally > strong { font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.team-question-points { margin: 8px 0 0; }
.answer-reveal-box,
.answer-reveal-box strong,
.answer-reveal-box p { overflow-wrap: anywhere; }

.trivia-display__stage { overflow: hidden; }
.trivia-display--gameplay .trivia-display__header { align-items: center; min-height: 42px; }
.trivia-display--gameplay .trivia-display__venue { display: none; }
.trivia-display--gameplay .trivia-display__session { font-size: clamp(1rem, 1.8vw, 1.35rem); opacity: .78; }
.trivia-display--gameplay .trivia-display__code-block > span {
    display: block;
    max-width: min(34vw, 520px);
    font-size: clamp(.78rem, 1.2vw, 1rem);
    line-height: 1.2;
    opacity: .78;
    overflow-wrap: anywhere;
}
.trivia-display--gameplay .trivia-display__join-code { font-size: clamp(1rem, 1.8vw, 1.4rem); letter-spacing: .1em; opacity: .72; }
.display-question--reveal {
    max-height: 100%;
    justify-content: center;
    align-content: center;
}
.display-question--reveal .display-question__prompt {
    font-size: clamp(1.45rem, 3.2vw, 3rem);
    line-height: 1.08;
    margin: .15em 0 .35em;
    overflow-wrap: anywhere;
}
.display-question--reveal .display-reveal {
    width: min(1100px, 94vw);
    margin: 0 auto;
    padding: clamp(14px, 2.3vw, 26px);
    overflow-wrap: anywhere;
}
.display-reveal__answer {
    display: block;
    font-size: clamp(1.7rem, 4.6vw, 4rem) !important;
    line-height: 1.05;
    overflow-wrap: anywhere;
    word-break: normal;
}
.display-reveal__detail {
    margin: .55em 0 0;
    font-size: clamp(1rem, 2.1vw, 1.7rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

@media (max-width: 700px) {
    .public-play-shell--joined { gap: 8px; }
    .public-play-shell--joined .card { padding: 14px; }
    .public-play-shell--joined .empty-state { padding: 24px 14px; }
    .team-play-bar { padding: 8px 11px; border-radius: 10px; }
    .team-play-bar__name { font-size: .98rem; }
    .team-question-card { gap: 12px; }
    .team-question-prompt { font-size: clamp(1.35rem, 6vw, 1.9rem); line-height: 1.15; margin-bottom: 0; }
    .team-choice-list { gap: 8px; }
    .team-choice { padding: 11px 12px; }
    .question-meta-row { gap: 7px; }
    .locked-answer-panel, .answer-reveal-box { padding: 12px; }
    .team-score-tally { padding: 11px 12px; }
    .team-score-tally > strong { font-size: 1.3rem; }
}

/* v0.7.3 host answer refresh and streamlined round review */
.session-question__summary-badges {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}
.answer-received-badge { font-variant-numeric: tabular-nums; }
.session-question[open] {
    border-color: rgba(62, 91, 115, .45);
    box-shadow: 0 5px 18px rgba(31, 41, 55, .06);
}
.round-review-bar {
    display: grid;
    gap: 6px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(127, 127, 127, .06);
}
.round-review-bar > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.round-review-bar p { margin: 0; color: var(--muted); }
.answer-submission-meta {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
    font-size: .8rem;
}
.team-total-cell {
    min-width: 82px;
    font-variant-numeric: tabular-nums;
    font-size: 1.05rem;
}
@media (max-width: 700px) {
    .session-question__summary-badges { grid-column: 2; justify-self: start; }
    .round-review-bar > div { align-items: flex-start; flex-direction: column; gap: 3px; }
}

/* v0.7.5 tap-to-save team answers */
.choice-answer-saving .team-choice { pointer-events: none; opacity: .72; }
.choice-answer-saving .team-choice:has(input:checked) { opacity: 1; }


/* v0.7.9 display join QR and host-console usability */
.trivia-display__join-block {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 14px;
}
.trivia-display__qr {
    width: 132px;
    height: 132px;
    flex: 0 0 132px;
    padding: 6px;
    border-radius: 10px;
    background: #fff;
    display: grid;
    place-items: center;
    color: #111;
    font-weight: 900;
}
.trivia-display__qr svg { display: block; width: 100%; height: 100%; }
.trivia-display__qr.is-unavailable { background: rgba(255,255,255,.12); color: rgba(255,255,255,.65); }
.trivia-display--gameplay .trivia-display__qr {
    width: 92px;
    height: 92px;
    flex-basis: 92px;
    padding: 4px;
}
.host-console-nav {
    position: sticky;
    top: 10px;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 6px 20px rgba(31,41,55,.08);
    backdrop-filter: blur(8px);
}
.host-console-nav__context,
.host-console-nav__links { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.host-console-nav__context strong { font-size: .95rem; }
.host-console-nav__links a {
    text-decoration: none;
    font-size: .9rem;
    font-weight: 700;
    padding: 7px 9px;
    border-radius: 8px;
}
.host-console-nav__links a:hover { background: #f2f5f8; }
.session-details-compact { padding: 0; overflow: hidden; }
.session-details-compact > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    cursor: pointer;
    font-weight: 750;
}
.session-details-compact > summary::-webkit-details-marker { display: none; }
.session-details-compact__body { padding: 0 18px 18px; }
.session-detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.session-detail-grid > div { display: grid; gap: 2px; }
.session-detail-grid span { color: var(--muted); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.session-round--complete { box-shadow: none; }
.session-round--pending { box-shadow: none; background: #fbfcfd; }

@media (max-width: 760px) {
    .host-console-nav { position: static; align-items: flex-start; flex-direction: column; }
    .trivia-display__join-block { width: 100%; justify-content: space-between; }
    .trivia-display__qr { width: 96px; height: 96px; flex-basis: 96px; }
}
.host-console-nav, #teams, #rounds, #standings { scroll-margin-top: 82px; }
.session-controls--compact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 16px;
    padding-bottom: 16px;
}
.session-controls--compact h2 { margin-bottom: 3px; }
.session-controls--compact p { margin-bottom: 0; }
@media (max-width: 760px) {
    .session-controls--compact { align-items: stretch; flex-direction: column; }
}


/* v0.7.10 host-console round collapsing */
[data-host-round-body][hidden] { display: none !important; }
.host-round-heading__tools { justify-content: flex-end; }
.session-round--questions-collapsed { gap: 12px; }
.session-round--questions-collapsed .host-round-heading { margin-bottom: 0; }
@media (max-width: 700px) {
    .host-round-heading { align-items: flex-start; }
    .host-round-heading__tools { justify-content: flex-start; }
}

/* v0.7.13 raise the public display stage */
@media (min-width: 701px) {
    .trivia-display__stage {
        align-items: flex-start;
        padding-top: clamp(20px, 4vh, 48px);
        padding-bottom: 16px;
    }
}