/* THE SCREENING ROOM — the product's editorial identity.
   Functional layouts stay in app.css; cinema.css retains mode details. This
   final layer unifies the shell, typography, materials and color hierarchy. */
.personalize-modal { width: min(640px, calc(100vw - 32px)); max-height: min(82vh, 800px); padding: 26px !important; border: 1px solid #4b5d65 !important; border-radius: 6px; background: #1b2328 !important; box-shadow: 0 0 0 100vmax #090d11cc, 0 24px 70px #0008 !important; }
.personalize-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 20px; margin-bottom: 21px; border-bottom: 1px solid #3b4b53; }
.personalize-header h3 { margin: 0; color: #f3f1e9; font-size: 1.35rem; line-height: 1.2; }
.personalize-modal .personalize-close { position: static; float: none; flex: none; margin: 0; width: 34px; height: 34px; min-height: 34px; border: 1px solid #45555e; border-radius: 4px; background: transparent; }
.personalize-upload { display: grid; gap: 12px; }
.personalize-upload>label { font-size: .86rem; font-weight: 600; color: #c9d4d8; }
.personalize-upload input[type="file"] { width: 100%; padding: 10px; min-width: 0; font-size: .82rem; border: 1px solid #455760; border-radius: 4px; background: #141c21; }
.personalize-upload input::file-selector-button { margin-right: 12px; padding: 8px 12px; border: 1px solid #536872; border-radius: 3px; background: #27343b; color: #e1e8e9; font: inherit; cursor: pointer; }
.personalize-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.personalize-modal button:not(.personalize-close) { min-height: 37px; padding: 8px 12px; font-size: .8rem; border-radius: 4px; }
.personalize-modal audio { width: 100%; height: 38px; }
.personalize-modal .status { color: #a5b4bb; font-size: .85rem; line-height: 1.5; }
.personalize-upload>.status:empty { display: none; }
.personalize-modal .personalize-playlist { margin-top: 23px !important; padding: 22px 0 0 !important; border: 0; border-top: 1px solid #3b4b53; border-radius: 0; background: transparent; box-shadow: none; }
.personalize-playlist>strong { color: #e6ebeb; font-size: 1rem; }
.personalize-playlist>.status { margin: 8px 0 15px; }
.personalize-playlist .music-multi-list { gap: 0; margin: 0 0 16px; max-height: clamp(110px, calc(82dvh - 450px), 250px); border-top: 1px solid #34434b; }
.personalize-playlist .music-multi-row { gap: 12px; padding: 10px 2px; border: 0; border-bottom: 1px solid #34434b; background: transparent; }
.music-multi-row span { min-width: 0; overflow-wrap: anywhere; font-size: .88rem; }
.personalize-playlist .music-multi-row button { min-height: 32px; padding: 6px 10px; background: transparent; border-color: #44565f; font-weight: 600; }
.personalize-playlist .music-multi-row:has(input:checked) { background: #253b3066; }
.personalize-playlist input[type="checkbox"] { accent-color: #28c76b; }
@media (max-width: 760px) { .personalize-modal { width: calc(100vw - 24px); max-height: 88dvh; padding: 20px !important; } .personalize-header h3 { font-size: 1.15rem; } .personalize-header { gap: 10px; } }
:root {
  --ink-950: #101518;
  --ink-900: #151b1f;
  --ink-850: #1b2328;
  --ink-800: #212b31;
  --ink-750: #29353d;
  --line-soft: #34434b;
  --line-strong: #52646d;
  --paper: #f3f1e9;
  --copy: #d7dfdf;
  --copy-muted: #a5b4bb;
  --signal: #28c76b;
  --signal-soft: #a9d9bb;
  --cinema-night: var(--ink-950);
  --cinema-base: var(--ink-900);
  --cinema-surface: var(--ink-850);
  --cinema-raised: var(--ink-800);
  --cinema-line: var(--line-soft);
  --cinema-cream: var(--paper);
  --cinema-muted: var(--copy-muted);
  --cinema-radius: 6px;
  --cinema-shadow: none;
}

body:not(.deep-case-active):not(.investigation-lobby-active) {
  background-color: var(--ink-950);
  background-image:
    radial-gradient(ellipse 65% 35% at 50% -18%, #2a373c65, transparent 84%),
    linear-gradient(180deg, #171e22 0, #101518 590px);
}
body { color: var(--paper); }
.wrap { max-width: 1120px; padding-top: clamp(24px, 4vw, 52px); }
.status, .sub { color: var(--copy-muted); }
input:not([type=checkbox]), select, textarea {
  background: #182126;
  border: 1px solid #4a5c65;
  border-radius: 4px;
  color: var(--paper);
}
input:not([type=checkbox]):focus, select:focus, textarea:focus {
  border-color: #9bc9a9;
  box-shadow: 0 0 0 2px #28c76b2d;
}
button { border-radius: 4px; }
.primary { background: var(--signal); border-color: var(--signal); color: #082014; }
.primary:hover:not(:disabled) { background: #4bd887; border-color: #4bd887; }
.secondary, .ghost { background: #2a3840; border-color: #52636c; color: #ecf1ed; }
.secondary:hover:not(:disabled), .ghost:hover:not(:disabled) { background: #35464f; border-color: #879ca5; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [role=button]:focus-visible {
  outline: 2px solid #b8e4c8 !important;
  outline-offset: 3px;
}

/* Masthead: the three lights are the only permanent multicolor brand mark. */
.site-header { height: 66px; background: #11171bec; border-bottom: 1px solid #39474e; box-shadow: none; backdrop-filter: blur(14px); }
.site-header::after { display: block; left: max(16px, calc((100vw - 1120px)/2)); right: auto; bottom: -1px; width: 82px; height: 2px; background: var(--signal); }
.header-inner { width: min(1120px, calc(100% - 32px)); }
.brand { gap: 13px; font-family: "Segoe UI", Arial, sans-serif; font-size: clamp(1.12rem, 2vw, 1.42rem); font-weight: 900; letter-spacing: -.055em; }
.brand-dots i { width: 16px; height: 16px; box-shadow: none; }
.header-tag { padding-left: 16px; border-left: 1px solid #3e4e56; color: #9bafb6; font-size: .65rem; letter-spacing: .19em; }
.language-toggle, .game-mode-toggle { min-height: 37px; background: #222d33; border-color: #485961; }
.language-toggle:hover:not(:disabled), .game-mode-toggle:hover:not(:disabled) { background: #2d3b43; }
.player-profile-toggle { background: #202b31; border-color: #4c5e67; }
.player-profile-toggle:hover { border-color: #96b6a0; transform: none; }
.game-mode-menu { background: #192227; border-right-color: #45555e; }
.game-mode-option { border-radius: 4px; }
.game-mode-option.active { background: #273b31; border-color: #73ad85; }
.game-mode-option::before { border-radius: 4px; background: #27353c; border-color: #566973; color: #e1e9e7; }

/* The foyer feels like a programme cover, not a dashboard hero banner. */
.hero { grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: clamp(24px, 4vw, 56px); max-width: 1088px; margin: 5px auto 34px; padding-bottom: 32px; border-bottom-color: #415057; }
.hero-copy { position: relative; padding-top: 23px; }
.hero-copy::before { content: none; }
.hero h1 { max-width: 720px; font-family: "Segoe UI", Arial, sans-serif; font-size: clamp(2.65rem, 5.2vw, 4.55rem); font-weight: 800; line-height: 1.02; letter-spacing: -.07em; text-transform: none; text-shadow: none; }
.hero h1 #homeHeroLead { color: var(--paper); }
.hero h1 .hero-accent { display: block; margin-top: .06em; color: #70d994; font-family: Georgia, "Times New Roman", serif; font-size: 1.03em; font-style: italic; font-weight: 700; letter-spacing: -.055em; text-transform: none; }
.hero .sub { max-width: 530px; margin-top: 23px; color: #b8c7cc; font-size: clamp(1.02rem, 1.6vw, 1.16rem); line-height: 1.55; }
.hero-guest-art { height: 274px; }
body:not(.account-home) .hero { padding: 32px 36px; border: 1px solid #3b6750; border-radius: 5px; background: radial-gradient(ellipse at 90% 35%, #27c46b12, transparent 55%), linear-gradient(130deg, #1b282e, #141c20); }
body:not(.account-home) .hero-guest-art { width: min(100%, 320px); height: 290px; }
.guest-mode-slide { --preview-accent: #27d96b; position: absolute; inset: 0 0 27px; display: flex; flex-direction: column; align-items: center; opacity: 0; transform: translateY(9px); transition: opacity 420ms ease, transform 420ms ease; }
.guest-mode-slide.is-active { opacity: 1; transform: none; }
.guest-mode-slide .preview-mode-symbol { flex: 1; min-height: 0; }
.guest-mode-slide strong { color: var(--preview-accent); font-size: .88rem; line-height: 1.3; letter-spacing: .14em; }
.guest-mode-slide[data-mode="investigation"] { --preview-accent: #d4ae79; }
.guest-mode-slide[data-mode="festival"] { --preview-accent: #efc17c; }
.guest-mode-slide[data-mode="spectrum"] { --preview-accent: #d9a7f2; }
.guest-mode-slide[data-mode="telephone"] { --preview-accent: #efbd73; }
.guest-mode-slide[data-mode="counterfeit"] { --preview-accent: #e8a4a0; }
.guest-mode-slide[data-mode="fictional"] { --preview-accent: #f2d392; }
.guest-mode-slide[data-mode="solo"] { --preview-accent: #6dcff4; }
.guest-mode-progress { position: absolute; bottom: 0; left: 50%; display: flex; gap: 7px; transform: translateX(-50%); }
.guest-mode-progress span { width: 16px; height: 3px; background: #546168; border-radius: 2px; transition: background 420ms ease; }
.guest-mode-progress span.is-active { background: var(--signal); }
.hero-guest-poster { border-width: 1px; border-radius: 5px; box-shadow: 0 16px 28px #0009, inset 0 0 0 6px #0e171dbb; }
.hero-guest-poster[data-slot="1"] { box-shadow: 0 24px 44px #000b, inset 0 0 0 6px #0e171dbb; }
.hero-guest-poster::before { border-color: #e7f4e278; }
.hero-guest-poster i { border-width: 3px; box-shadow: none; }
.hero-guest-poster strong { letter-spacing: .1em; }

/* The rotating game jacket gets to keep its own palette. */
.home-mode-preview { min-height: 246px; padding: 25px 27px; border-radius: 5px; border-color: color-mix(in srgb, var(--preview-accent) 47%, #56636a); box-shadow: 0 16px 30px #0005; }
.home-mode-preview::before { background: linear-gradient(90deg, #192329f5 0%, #192329ef 43%, #1923291a 100%); }
.home-mode-preview[data-mode="festival"]::before { background: linear-gradient(90deg, #251e25f5 0%, #251e25e8 43%, #251e2512 100%); }
.home-mode-preview[data-mode="investigation"]::before { background: linear-gradient(90deg, #24211df5 0%, #24211de8 43%, #24211d12 100%); }
.home-mode-preview[data-mode="spectrum"]::before { background: linear-gradient(90deg, #211f2af5 0%, #211f2ae8 43%, #211f2a12 100%); }
.home-mode-preview[data-mode="telephone"]::before { background: linear-gradient(90deg, #27211cf5 0%, #27211ce8 43%, #27211c12 100%); }
.home-mode-preview[data-mode="counterfeit"]::before { background: linear-gradient(90deg, #2a1e25f5 0%, #2a1e25e8 43%, #2a1e2512 100%); }
.home-mode-preview[data-mode="fictional"]::before { background: linear-gradient(90deg, #29231df5 0%, #29231de8 43%, #29231d12 100%); }
.home-mode-preview-kicker { font-size: .65rem; letter-spacing: .2em; }
.home-mode-preview h2 { margin-top: 11px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.35rem, 2.15vw, 1.75rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.12; }
.home-mode-preview p { color: #e0e4df; line-height: 1.5; }
.home-mode-preview-meta { gap: 7px; margin-top: 17px; }
.home-mode-preview-meta span { border-color: #ffffff45; background: #111a1da8; color: #f1f3ec; font-weight: 700; }
.preview-art-card { border-width: 1px; box-shadow: 0 13px 22px #0008; }
.preview-art-card i { border: 1px solid #ffffff16; }
.preview-art-beam { opacity: .5; }

/* The home paths and lobby read like adjacent chapters of the same book. */
.card, .ui-panel, .home-account-panel, .home-lobby-panel, .solo-mode-card, .final-gallery-card {
  border-color: #43545d; border-radius: 6px; background: #1c252a; box-shadow: none;
}
#home:has(#homeDashboard.hidden)>#profileLogin, #home:has(#homeDashboard.hidden)>#guestSpectatorJoin {
  position: relative; background: #1c252a; border-color: #43545d; border-top-color: #43545d; border-radius: 6px; box-shadow: none;
}
#home:has(#homeDashboard.hidden)>#profileLogin::before, #home:has(#homeDashboard.hidden)>#guestSpectatorJoin::before,
.home-account-panel::before, .home-lobby-panel::before {
  content: none;
}
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin::before { background: #8aaebb; }
.home-account-panel, .home-lobby-panel { position: relative; }
.home-account-panel::before { background: #8aaebb; }
.profile-login-mark { background: #243e30; border-color: #5c9f72; }
.home :is(#profileLogin,.home-lobby-panel,.spectator-join) h2, .solo-setup h2, .solo-mode-card h3, #lobby h3 {
  font-family: "Segoe UI", Arial, sans-serif; font-size: clamp(1.05rem, 1.75vw, 1.35rem); font-weight: 700; letter-spacing: -.03em; text-transform: none;
}
.home-profile-avatar { box-shadow: 0 0 0 4px #1c252a, 0 0 0 5px #66808a; }
.home-account-actions { gap: 8px; }
.public-lobby-choice, .invite-panel, .spectator-join, #lobby .p { background: #192228; border-color: #42535c; border-radius: 5px; }
.invite-panel { border-left: 2px solid #769ab0; }
.code { background: #11191d; border-left: 3px solid #b9a479; border-radius: 4px; letter-spacing: .2em; box-shadow: none; }
.copy-code { background: #2b3840; }
.solo-mode-card, .solo-mode-card:first-child, .solo-mode-card:last-child { background: #1e282d; border-color: #43545d; border-top-width: 1px; }
.solo-mode-card:first-child::before, .solo-mode-card:last-child::before { color: #d5e9ed0d; }

/* The small programme card is where each mode speaks. */
.experience-card, .experience-card[data-mode] { background: #202b31; border-color: #485a63; border-radius: 5px; box-shadow: none; }
.lobby-session-card { border-left: 3px solid var(--experience-accent); }
.experience-kicker { color: var(--experience-accent); letter-spacing: .18em; }
#lobby .lobby-session-card h3 { margin-top: 8px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.25rem, 2vw, 1.58rem); font-weight: 700; letter-spacing: -.02em; text-transform: none; }
.lobby-session-card p { color: #bdc9cb; }
.experience-meta span { background: #182329; border-color: #53646a; font-weight: 700; }
.experience-card-emblem { border-color: var(--experience-accent); opacity: .16; }
.experience-card-emblem::before, .experience-card-emblem::after { color: var(--experience-accent); }
#lobby .lobby-player-card { border-radius: 4px; }
#lobby .lobby-player-card[data-ready="true"] { background: #23392d; }

/* Screen and poster: the image is the bright object in a dark room. */
#gameCard:not(:has(.deep-case)), #game[data-presentation="counterfeit"] #gameCard,
#game[data-presentation="auction"] #gameCard, #game[data-presentation="creative"] #gameCard,
body.festival-active #game[data-presentation="festival"] #gameCard {
  background: #1d272c; border-color: #485b64; border-radius: 6px; box-shadow: none;
}
#gameCard:not(:has(.deep-case))::after { display: none; }
#game:not([data-presentation="noir"]) .game-toolbar { background: #182228; border: 1px solid #465861; border-left: 2px solid #80ac8e; border-radius: 5px; box-shadow: none; }
#game:not([data-presentation="noir"]) #roundLabel, #roundLabel { background: transparent; border-color: #627882; border-radius: 3px; color: #c4d4d4; font-size: .69rem; letter-spacing: .18em; }
#prompt { font-family: Georgia, "Times New Roman", serif; font-weight: 700; letter-spacing: -.035em; line-height: 1.17; }
#filmTitle { color: #b9c9ca; }
#gameCard .poster { border: 2px solid #536772; border-radius: 4px; box-shadow: 0 12px 25px #0007; }
#choices:not(.rating-scale)>.choice { background: #25333a; border-color: #536771; border-radius: 4px; font-weight: 650; }
#choices:not(.rating-scale)>.choice:hover:not(:disabled) { background: #30424a; border-color: #a3b4ba; }
.score-player, .rank-row, .final-gallery-card { background: #202b31; border-color: #485a63; }
.score-player { box-shadow: none; }
.round-result-feature, .round-result-feature[data-tone="wrong"], .round-result-feature[data-tone="correct"] { background: #222d32; border: 1px solid #50616a; border-left: 3px solid #8ca2a4; border-radius: 4px; }
.round-result-feature[data-tone="correct"] { border-left-color: #53c681; }
.round-result-feature[data-tone="wrong"] { border-left-color: #d2787b; }
.round-result-feature strong { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 700; }

/* Specialty stages use the same matte material; their tools keep their role. */
.movie49-table, .auction-table { background: #1b272b; border-color: #53646a; box-shadow: none; }
.movie49-card, .movie49-card:hover:not(:disabled) { box-shadow: none; }
#game[data-presentation="auction"] .auction-bid .primary, #game[data-presentation="auction"] .auction-table>.primary,
.festival-active #choices.festival-game>.primary, .festival-active #choices.festival-game .festival-vote-actions>.primary { background: var(--signal); border-color: var(--signal); color: #092014; }
.festival-header h2 { color: var(--paper); font-family: Georgia, "Times New Roman", serif; font-weight: 700; letter-spacing: -.03em; text-transform: none; }
.festival-score, .festival-role, .festival-curator, .festival-verdict, .festival-final,
.festival-evidence-board, .festival-memo-controls, .festival-lobby-guide, .festival-lobby-settings,
.spectrum-lobby-guide, .spectrum-lobby-settings, .telephone-lobby-guide, .telephone-lobby-settings,
.counterfeit-lobby-guide, .counterfeit-lobby-settings, .spectrum-board, .telephone-board, .counterfeit-board {
  background: #202b31; border-color: #4c5d65; border-radius: 5px; box-shadow: none;
}
.festival-film { background: #202b31; border-color: #576872; border-radius: 4px; }
.festival-film.selected { background: #26392f; border-color: #76c990; box-shadow: 0 0 0 1px #76c990; }
.festival-office-memo, .festival-claim { background: #29343a; }
.spectrum-track { background: linear-gradient(90deg, #65899b, #a69cbb 50%, #c7a47e); }
.spectrum-range { accent-color: #a593bc; }
.telephone-description { background: #26343a; }
.counterfeit-canvas { border-color: #80919a; }
.podium::after { display: none; }
.podium-place, .podium-place.first { background: #253139; border: 1px solid #546771; box-shadow: none; }
.game-over>h2 { color: var(--paper) !important; font-family: Georgia, "Times New Roman", serif; font-weight: 700; letter-spacing: -.05em; text-transform: none; text-shadow: none; }
.reveal-moment-frame, .reveal-moment[data-mode="quiz"][data-result="wrong"] .reveal-moment-frame,
.reveal-moment[data-mode="quiz"][data-result="neutral"] .reveal-moment-frame,
.reveal-moment[data-mode="festival"] .reveal-moment-frame,
.reveal-moment[data-mode="spectrum"] .reveal-moment-frame,
.reveal-moment[data-mode="telephone"] .reveal-moment-frame,
.reveal-moment[data-mode="counterfeit"] .reveal-moment-frame {
  background: #1f2a2e; border: 1px solid var(--moment-line); border-radius: 5px; box-shadow: 0 20px 55px #000a;
}
.reveal-moment-frame strong { font-family: Georgia, "Times New Roman", serif; font-weight: 700; letter-spacing: -.045em; text-transform: none; }

/* Secondary layers should never outshine the film or the task. */
body:not(.deep-case-active):not(.investigation-lobby-active) :is(.audio-settings,.player-profile-panel,.chat-panel,.app-modal-card) { background: #202b31; border-color: #50616b; border-radius: 6px; box-shadow: 0 18px 48px #0009; }
.sound-category-settings label, .achievement-item, .chat-bubble, .chat-header, .chat-compose { background: #27343b; border-color: #495c65; }
.chat-message.mine .chat-bubble { background: #284a37; }

/* Player record: clear totals and restrained achievement badges. */
body:not(.deep-case-active):not(.investigation-lobby-active) .player-profile-panel {
  background: var(--ink-900); border: 1px solid var(--line-soft); border-radius: 8px; box-shadow: 0 18px 48px #0007;
}
.player-profile-panel { top: 78px; padding: 24px; max-height: calc(100dvh - 94px); scrollbar-width: thin; scrollbar-color: var(--line-soft) transparent; }
.player-profile-panel .panel-close { top: 16px; right: 16px; border-radius: 4px; background: transparent; border-color: var(--line-soft); color: var(--copy-muted); }
.player-profile-panel .panel-close:hover { background: var(--ink-800); color: var(--paper); border-color: var(--line-strong); transform: none; }
.player-profile-heading { gap: 13px; margin-bottom: 26px; }
.player-profile-heading img { width: 50px; height: 50px; flex: none; border: 1px solid var(--line-strong); background: var(--ink-800); }
.player-profile-heading strong { color: var(--paper); font-size: 1.15rem; letter-spacing: -.025em; line-height: 1.25; }
.player-profile-heading span { margin-top: 4px; color: var(--copy-muted); font-size: .75rem; }
.player-stat-grid { gap: 0; border-top: 1px solid var(--line-soft); }
.player-stat-grid > div { gap: 5px; padding: 16px 12px 16px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line-soft); border-radius: 0; }
.player-stat-grid > div:nth-child(even) { padding-left: 16px; }
.player-stat-grid strong { color: var(--paper); font-size: 1.8rem; font-weight: 750; line-height: 1.1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.player-stat-grid span { color: var(--copy-muted); font-size: .75rem; line-height: 1.4; }
.player-stat-grid > div:last-child { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 12px; }
.player-stat-grid #statOscars { color: #d4b477; font-size: 1.4rem; }
.player-profile-panel h3 { margin: 26px 0 14px; color: var(--paper); font-size: .95rem; letter-spacing: -.015em; }
.player-profile-panel .achievement-list { gap: 8px; }
.player-profile-panel .achievement-item { grid-template-columns: 36px minmax(0,1fr); gap: 12px; padding: 13px 12px; border: 1px solid var(--line-soft); border-radius: 5px; background: var(--ink-850); box-shadow: none; }
.player-profile-panel .achievement-item.unlocked { background: #1c2923; border-color: #354a3e; }
.player-profile-panel .achievement-item.locked { opacity: 1; filter: none; background: transparent; border-color: #2b373e; }
.achievement-item .achievement-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 5px; background: var(--ink-800); font-size: 1.3rem; }
.achievement-item.unlocked .achievement-icon { background: #293b2f; }
.achievement-item.locked .achievement-icon { filter: grayscale(1); opacity: .65; }
.achievement-item > div { gap: 5px; }
.achievement-item > div strong { color: var(--paper); font-size: .83rem; font-weight: 650; line-height: 1.35; }
.achievement-item > div span { color: var(--copy-muted); font-size: .76rem; line-height: 1.5; }
.achievement-item.locked > div strong { color: var(--copy-muted); }
.achievement-notification { background: var(--ink-900); border: 1px solid var(--line-soft); border-left: 3px solid var(--signal); border-radius: 6px; box-shadow: 0 14px 40px #0007; }
.achievement-notification small { color: var(--signal-soft); font-size: .65rem; letter-spacing: .08em; font-weight: 650; }
.achievement-notification strong { color: var(--paper); font-size: .95rem; }
.achievement-notification span { color: var(--copy-muted); }
.achievement-notification .achievement-notification-icon { font-size: 1.8rem; filter: none; }
@media(max-width:600px) {
  .player-profile-panel { padding: 22px 20px max(22px,env(safe-area-inset-bottom)); max-height: 85dvh; }
  .player-profile-heading { margin-bottom: 22px; }
}
@media(prefers-reduced-motion:reduce) { .achievement-notification, .achievement-notification.leaving { animation: none; } }

/* Preparation is a quiet intermission, with progress as the focal point. */
body:has(#gameLoading:not(.hidden)) { background: var(--ink-950) !important; }
body:has(#gameLoading:not(.hidden)) #siteHero { display: none; }
#gameLoading { width: 100%; }
#gameLoading .game-loading-card { min-height: min(620px,75dvh); margin: 0; display: grid; place-items: center; background: transparent !important; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
#gameLoading .game-loading-shade { position: static; width: 100%; padding: 48px 24px; background: transparent; }
#gameLoading .game-loading-content { width: min(520px,100%); padding: 0; background: transparent; border: 0; border-radius: 0; backdrop-filter: none; text-align: left; }
.game-loading-mark { width: 80px; height: 64px; margin-bottom: 28px; color: var(--copy-muted); stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.game-loading-mark .game-loading-play { stroke: var(--signal); stroke-width: 2; }
#gameLoading h2 { margin: 0 0 14px; font-size: clamp(1.8rem,4vw,2.5rem); line-height: 1.15; letter-spacing: -.045em; color: var(--paper); }
#gameLoading .status { margin: 0; max-width: 46ch; font-size: .94rem; line-height: 1.7; color: var(--copy-muted); }
#gameLoading .profile-loading { margin-top: 34px; padding-top: 24px; border-top: 1px solid var(--line-soft); }
#gameLoading .loading-track { height: 4px; border: 0; border-radius: 2px; background: var(--ink-800); }
#gameLoading .loading-bar { background: var(--signal); border-radius: 2px; }
#gameLoading .loading-label { margin-top: 16px; color: var(--copy); font-size: .83rem; line-height: 1.5; }
#gameLoading .loading-detail { margin-top: 5px; color: var(--copy-muted); font-size: .72rem; font-variant-numeric: tabular-nums; }
@media(max-width:1319px) {
  #gameLoading .game-loading-card { background-color: var(--ink-950); background-size: cover; background-position: center; background-repeat: no-repeat; background-image: var(--loading-poster) !important; border-radius: 8px; overflow: hidden; }
  #gameLoading .game-loading-shade { min-height: inherit; background: linear-gradient(90deg,#101518ed,#101518c9),linear-gradient(0deg,#101518a6,transparent); }
}
@media(max-width:600px) {
  #gameLoading .game-loading-shade { padding: 32px 14px; }
  #gameLoading .game-loading-card { min-height: 65dvh; }
  .game-loading-mark { margin-bottom: 22px; }
}
@media(prefers-reduced-motion:reduce) { #gameLoading .loading-bar { transition: none; } }

/* Chat and audio share the Screening Room's quiet floating surfaces. */
body:not(.deep-case-active):not(.investigation-lobby-active) :is(.audio-settings,.chat-panel) {
  background: var(--ink-900); border-color: var(--line-soft); border-radius: 8px;
  box-shadow: 0 18px 48px #0007; color: var(--copy);
}
.audio-settings { padding: 22px; max-height: calc(100dvh - 90px); overflow-y: auto; }
.audio-settings h3 { margin: 0 44px 24px 0; color: var(--paper); font-size: 1.12rem; letter-spacing: -.025em; }
.audio-settings > label { display: block; color: var(--copy-muted); font-size: .78rem; font-weight: 600; }
.audio-settings select { width: 100%; min-width: 0; margin: 8px 0 0; padding: 11px 12px; background: var(--ink-950); border-color: var(--line-soft); font-size: .85rem; text-overflow: ellipsis; }
.audio-settings #audioDeviceStatus { margin: 9px 0 20px; font-size: .75rem; line-height: 1.5; color: var(--copy-muted); }
.audio-setting { grid-template-columns: 72px minmax(0,1fr) 43px; gap: 12px; margin: 0; min-height: 54px; border-top: 1px solid var(--line-soft); }
.audio-setting label { font-size: .85rem; }
.audio-setting output { color: var(--copy-muted); font-size: .78rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.audio-settings .audio-setting input[type="range"] { appearance: auto; accent-color: var(--signal); background: transparent; border: 0; box-shadow: none; padding: 0; margin: 0; min-width: 0; height: 28px; cursor: pointer; }
.audio-settings .sound-category-settings { margin-top: 8px; padding-top: 18px; gap: 8px; border-color: var(--line-soft); }
.sound-category-settings > strong { margin-bottom: 4px; font-size: .75rem; font-weight: 600; color: var(--copy-muted); }
.audio-settings .sound-category-settings label { min-height: 40px; padding: 9px 10px; gap: 9px; background: var(--ink-850); border: 1px solid var(--line-soft); border-radius: 4px; font-size: .78rem; }
.sound-category-settings label:has(input:checked) { color: var(--paper); }
.sound-category-settings label:hover { border-color: var(--line-strong); }
.sound-category-settings input { accent-color: var(--signal); width: 15px; height: 15px; margin: 0; }
.audio-settings .panel-close, .chat-header button { width: 34px; height: 34px; min-height: 34px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line-soft); border-radius: 4px; background: transparent; color: var(--copy-muted); }
.audio-settings .panel-close { top: 15px; right: 15px; }
.audio-settings .panel-close:hover, .chat-header button:hover { background: var(--ink-800); color: var(--paper); border-color: var(--line-strong); }
.chat-panel .chat-header { padding: 16px; background: transparent; border-color: var(--line-soft); gap: 12px; }
.chat-header strong { color: var(--paper); font-size: .95rem; letter-spacing: -.015em; display: flex; align-items: center; gap: 10px; }
.chat-header strong::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--signal); flex: none; }
.chat-messages { padding: 18px 14px; gap: 16px; scrollbar-width: thin; scrollbar-color: var(--line-soft) transparent; }
.chat-panel .chat-bubble { background: var(--ink-800); border: 1px solid var(--line-soft); border-radius: 6px; padding: 10px 12px; font-size: .85rem; line-height: 1.5; }
.chat-panel .chat-message.mine .chat-bubble { background: #1b3026; border-color: #304b3c; }
.chat-name { color: var(--copy-muted); font-weight: 600; margin-bottom: 5px; }
.chat-message.mine .chat-name { color: var(--signal-soft); }
.chat-panel .chat-compose { padding: 12px; gap: 9px; background: var(--ink-900); border-color: var(--line-soft); }
.chat-compose #chatInput { background: var(--ink-950); border-color: var(--line-soft); padding: 11px 12px; font-size: .85rem; }
.chat-compose #chatInput::placeholder { color: var(--copy-muted); }
.chat-compose #sendChat { padding: 10px 14px; font-size: .8rem; }
.chat-actions { gap: 8px; }
.chat-actions button { background: transparent; border-color: var(--line-soft); color: var(--copy-muted); font-size: .75rem; font-weight: 600; min-height: 36px; }
.chat-actions button:hover:not(:disabled) { background: var(--ink-800); border-color: var(--line-strong); color: var(--paper); }
.chat-panel .chat-reactions { background: var(--ink-950); border-color: var(--line-soft); padding: 12px; }
.chat-reactions .chat-reaction { background: var(--ink-850); border-color: var(--line-soft); }
.chat-reactions .chat-reaction:hover:not(:disabled) { background: var(--ink-800); border-color: var(--signal); }
.chat-error:empty { display: none; }
@media (max-width: 600px) {
  .audio-settings { top: auto; bottom: 0; width: 100%; max-height: calc(100dvh - 86px); padding: 20px; padding-bottom: max(20px,env(safe-area-inset-bottom)); }
  .chat-panel { max-height: calc(100dvh - 86px); }
  .chat-compose #chatInput, .audio-settings select { font-size: 16px; }
}

@media (max-width: 760px) {
  .wrap { padding: 24px 12px 52px; }
  .hero { display: block; margin-bottom: 21px; padding-bottom: 25px; }
  body:not(.account-home) .hero { padding: 24px 22px; }
  .hero-copy { padding-top: 17px; }
  .hero-copy::before { width: 62px; }
  .hero h1 { font-size: clamp(2.5rem, 10vw, 4.1rem); }
  .hero .sub { margin-top: 17px; }
  .home-mode-preview { min-height: 191px; padding: 18px 20px; }
  .home-mode-preview h2 { font-size: 1.4rem; }
  body.account-home .home-account-panel .home-profile-avatar { box-shadow: 0 0 0 3px #1c252a, 0 0 0 4px #66808a; }
}
@media (max-width: 430px) {
  .site-header { height: 61px; }
  .header-tag { display: none; }
  .hero h1 { font-size: clamp(2.35rem, 10.7vw, 3.35rem); }
  .home-mode-preview-copy { max-width: min(220px, 62%); }
  .home-mode-preview-art { opacity: .8; }
}
@media (prefers-reduced-motion: reduce) {
  .guest-mode-slide, .guest-mode-progress span { transition: none !important; }
  .hero-guest-poster, .preview-art-card { transition: none !important; }
}

/* THE EDITORIAL LAYOUT — preserve the original display lettering, recompose
   the page around open sections, media and a genuine secondary rail. */
.hero h1 {
  font-family: "Arial Black", "Segoe UI", sans-serif;
  font-size: clamp(2.45rem, 5.15vw, 4.55rem);
  font-weight: 900;
  line-height: 1.04;
  letter-spacing: -.065em;
  text-transform: uppercase;
}
.hero h1 .hero-accent {
  margin-top: 0;
  color: #27d96b;
  font-family: "Arial Black", "Segoe UI", sans-serif;
  font-size: 1em;
  font-style: normal;
  font-weight: 900;
  letter-spacing: -.065em;
  text-transform: uppercase;
}
.home-mode-preview h2 {
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  font-weight: 900;
  letter-spacing: -.045em;
}
.home :is(#profileLogin,.home-lobby-panel,.spectator-join) h2,
.solo-setup h2, .solo-mode-card h3, #lobby h3 {
  font-family: "Segoe UI", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
#lobby .lobby-session-card h3 {
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: clamp(1.02rem, 1.8vw, 1.28rem);
  font-weight: 800;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
#prompt { font-family: "Segoe UI", Arial, sans-serif; font-weight: 800; letter-spacing: -.035em; line-height: 1.13; }
.round-result-feature strong { font-family: "Segoe UI", Arial, sans-serif; font-size: clamp(1.15rem, 2vw, 1.55rem); font-weight: 800; }
.festival-header h2 { font-family: "Segoe UI", Arial, sans-serif; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.game-over>h2 { font-family: "Arial Black", "Segoe UI", sans-serif; font-weight: 900; letter-spacing: -.06em; text-transform: uppercase; }
.reveal-moment-frame strong { font-family: "Arial Black", "Segoe UI", sans-serif; font-weight: 900; letter-spacing: -.055em; text-transform: uppercase; }

/* Mode selection becomes a compact programme index, not seven separate tiles. */
.game-mode-menu-options { gap: 0; padding-top: 12px; }
.game-mode-option { min-height: 78px; margin: 0; padding: 12px 10px; border: 0; border-bottom: 1px solid #3e5058; border-left: 2px solid transparent; border-radius: 0; background: transparent; box-shadow: none; }
.game-mode-option:hover, .game-mode-option:focus-visible { background: #25333a; border-color: #50636d; border-left-color: var(--mode-accent); box-shadow: none; }
.game-mode-option.active { background: #26362f; border-color: #4b6955; border-left-color: #51cb7e; box-shadow: none; }
.game-mode-option::before { width: 36px; height: 36px; border-radius: 3px; }

/* The chosen game becomes a wide feature below the headline. */
body.account-home .hero { grid-template-columns: minmax(0, 1fr); gap: 22px; max-width: 1088px; }
body.account-home .hero-copy { max-width: 850px; }
body.account-home .hero .sub { max-width: 700px; }
body.account-home .home-mode-preview { width: 100%; min-height: 228px; padding: 27px 30px; }
body.account-home .home-mode-preview-copy { max-width: min(510px, 65%); }
body.account-home .home-mode-preview h2 { max-width: 460px; }
body.account-home .home-mode-preview p { max-width: 470px; }
body.account-home .home-mode-preview-art { right: 36px; width: 245px; overflow: visible; transform: scale(1.2); transform-origin: right center; }
body.account-home .home-mode-preview::before { background: linear-gradient(90deg, #192329f7 0%, #192329ef 52%, #19232910 100%); }

/* The selected game jacket is the headline, not a second summary below it. */
body.account-home .hero { margin-top: 0; margin-bottom: 23px; padding-bottom: 24px; }
body.account-home .home-mode-preview { min-height: 340px; padding: 28px 36px 31px; }
body.account-home .home-mode-preview .hero-copy { max-width: min(700px, calc(100% - 235px)); padding-top: 21px; }
body.account-home .home-mode-preview .hero-copy::before { background: var(--preview-accent); }
body.account-home .home-mode-preview .hero .sub,
body.account-home .home-mode-preview .sub { max-width: 620px; margin-top: 17px; }
body.account-home .home-mode-preview-copy { max-width: none; }
body.account-home .home-mode-preview-kicker,
body.account-home .home-mode-preview h2,
body.account-home .home-mode-preview-copy>p { display: none; }
body.account-home .home-mode-preview-meta { margin-top: 22px; }
body.account-home .home-mode-preview-art {
  top: 50%; right: 36px; bottom: auto; width: 245px; height: 220px;
  transform: translateY(-50%) scale(1.2); transform-origin: right center;
}
.preview-mode-symbol { display: block; width: 100%; height: 100%; color: var(--preview-accent); filter: drop-shadow(0 16px 22px #0007); }
.preview-mode-symbol>g { display: none; }
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="quiz"] .symbol-quiz,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="investigation"] .symbol-investigation,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="festival"] .symbol-festival,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="spectrum"] .symbol-spectrum,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="telephone"] .symbol-telephone,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="counterfeit"] .symbol-counterfeit,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="fictional"] .symbol-fictional,
:is(.home-mode-preview,.guest-mode-slide,.lobby-session-card)[data-mode="solo"] .symbol-solo { display: block; }
.preview-mode-symbol .symbol-halo { fill: color-mix(in srgb, var(--preview-accent) 10%, transparent); }
.preview-mode-symbol .symbol-panel { fill: #14212ac9; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.preview-mode-symbol .symbol-chip { fill: color-mix(in srgb, var(--preview-accent) 22%, #17222a); stroke: currentColor; stroke-width: 2; }
.preview-mode-symbol .symbol-soft { stroke: color-mix(in srgb, var(--preview-accent) 55%, #dde6e6); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.preview-mode-symbol .symbol-strong { stroke: #f3eee5; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
body.account-home .home-mode-preview-meta { gap: 9px; margin-top: 23px; }
body.account-home .home-mode-preview-meta span { padding: 8px 12px; font-size: .95rem; line-height: 1.25; }

/* First visit: one decisive profile path, with watching as a quiet second row. */
#home:has(#homeDashboard.hidden) { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 1088px; margin-top: 18px; }
#home:has(#homeDashboard.hidden)>#profileLogin {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(350px, .95fr); align-items: center; gap: 16px 32px;
  padding: 27px 30px; border: 1px solid #50626a; border-bottom: 0; border-radius: 5px 5px 0 0;
}
#home:has(#homeDashboard.hidden) #profileLogin .profile-login-heading { margin: 0; }
#home:has(#homeDashboard.hidden) #profileLogin .row { flex-wrap: nowrap; align-items: center; }
#home:has(#homeDashboard.hidden) #profileLogin .row .field { min-width: 0; }
#home:has(#homeDashboard.hidden) #profileLogin .row button { flex: none; }
#home:has(#homeDashboard.hidden) #profileLogin .profile-loading,
#home:has(#homeDashboard.hidden) #profileLogin #profileStatus { grid-column: 1 / -1; margin: 0; }
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin {
  display: grid; grid-template-columns: minmax(250px, .7fr) minmax(0, 1.3fr); align-items: center; gap: 0 30px;
  margin: 0; padding: 19px 30px; border: 1px solid #50626a; border-top-color: #35464d;
  border-radius: 0 0 5px 5px; background: #182126;
}
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin::before { display: none; }
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin h2 { grid-column: 1; margin: 0; padding: 0; border: 0; font-size: 1rem; }
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin>p { grid-column: 1; margin: 4px 0 0; font-size: .79rem; }
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin .row { grid-column: 2; grid-row: 1 / span 2; flex-wrap: nowrap; }
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin .row .field { min-width: 0; }
#home:has(#homeDashboard.hidden)>#guestSpectatorJoin .row button { flex: none; }

/* Returning players: an open profile masthead above a content / sidebar split. */
body.account-home #home { max-width: 1088px; margin: 10px auto 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
body.account-home .home-dashboard { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
body.account-home .home-account-panel {
  display: grid; grid-template-columns: 82px minmax(0, 1fr) minmax(220px, auto); grid-template-rows: auto auto;
  align-items: center; gap: 4px 22px; padding: 8px 0 24px; border: 0; border-bottom: 1px solid #4b5b63;
  border-radius: 0; background: transparent; text-align: left;
}
body.account-home .home-account-panel::before { display: none; }
body.account-home .home-profile-avatar { grid-column: 1; grid-row: 1 / span 2; width: 78px; height: 78px; border: 3px solid #667d87; box-shadow: none; }
body.account-home .home-account-panel>h2 { grid-column: 2; grid-row: 1; width: auto; margin: 0; padding: 0; border: 0; font-size: 1.42rem; text-align: left; }
body.account-home .home-account-panel>#profilePreview { grid-column: 2; grid-row: 2; width: auto; margin: 0; padding: 0; text-align: left; }
body.account-home .home-account-actions { grid-column: 3; grid-row: 1 / span 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 8px; align-self: center; width: min(330px, 100%); max-width: 330px; margin: 0; padding-left: 18px; border-left: 1px solid var(--line-soft); }
body.account-home .home-account-actions button { display: flex; align-items: center; justify-content: flex-start; gap: 9px; min-height: 40px; padding: 8px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--copy-muted); box-shadow: none; font-weight: 600; }
body.account-home .home-account-actions button:hover:not(:disabled), body.account-home .home-account-actions button:focus-visible { color: var(--paper); background: #253137; border-color: #40525c; }
.account-action-icon { flex: none; width: 17px; height: 17px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.home-profile-summary { display: block; color: var(--copy-muted); font-size: .88rem; line-height: 1.5; }
.deep-clue-countdown { display:block; margin-top:8px; color:#b6a38c; font-size:.75rem; font-variant-numeric:tabular-nums; text-align:right; }
/* Refresh feedback is a separate full-width row, never an avatar-sized grid item. */
body.account-home .home-account-panel>#profileLoading,
body.account-home .home-account-panel>#profileStatus { grid-column:1 / -1; grid-row:auto; min-width:0; width:100%; text-align:left; }
body.account-home .home-account-panel>#profileLoading { margin:16px 0 0; padding:14px 16px; background:#172127; border:1px solid #34464f; border-radius:5px; }
body.account-home .home-account-panel>#profileLoading .loading-track { height:5px; }
body.account-home .home-account-panel>#profileLoading .loading-label { margin-top:10px; }
body.account-home .home-account-panel>#profileLoading .loading-detail { display:block; margin-top:4px; line-height:1.5; }
body.account-home .home-account-panel>#profileStatus { margin:10px 0 0; font-size:.85rem; line-height:1.5; }
body.account-home .home-account-panel:has(#profileLoading:not(.hidden))>#profileStatus { display:none; }
body.account-home .home-account-panel>#profileStatus:empty { display:none; }
body.account-home #profilePreview>.profile-update-button,
body.account-home #profilePreview>button.secondary { min-height: 36px; padding: 7px 11px; border-color: #41535c; background: #1d292f; color: var(--copy); font-weight: 600; font-size: .78rem; }
body.account-home #profilePreview>.profile-update-button:hover,
body.account-home #profilePreview>button.secondary:hover { background: #2a3941; border-color: #697f89; }
body.account-home .home-account-actions #changeHomeProfile { grid-column: 1; }
body.account-home .home-account-actions #homeMicrophoneSlot,
body.account-home #homeMicrophoneSlot .microphone-test { display: contents; }
body.account-home #homeMicrophoneSlot .microphone-test-panel {
  grid-column: 1 / -1; width: 100%; margin: 0;
}
body.account-home .home-lobby-panel { padding: 0; border: 0; background: transparent; box-shadow: none; }
body.account-home .home-lobby-panel::before { display: none; }
#homeMultiplayerOptions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(270px, .42fr); gap: 32px; align-items: start; }
.home-play-main { min-width: 0; }
.home-play-main>h2 { margin: 0 0 21px; padding: 0 0 12px; border-bottom: 1px solid #50616a; }
.home-play-main>.row { margin-bottom: 13px; }
.home-play-main>.public-lobby-choice { margin: 0 0 14px; }
.home-play-main .public-lobby-browser { margin-top: 27px; padding-top: 17px; border-top-color: #4e6069; }
#homeMultiplayerOptions>.spectator-join { margin: 0; padding: 19px 0 0; border: 0; border-top: 1px solid #50616a; border-radius: 0; background: transparent; }
#homeMultiplayerOptions>.spectator-join>h2 { margin-top: 0; }
#homeMultiplayerOptions>.spectator-join .row { display: grid; grid-template-columns: minmax(0, 1fr); }
#homeMultiplayerOptions>.spectator-join .row .field { min-width: 0; }
#homeMultiplayerOptions>.spectator-join .row button { width: 100%; }

/* Lobby: programme and admission details lead, settings become a lower chapter. */
#lobby .layout { grid-template-columns: minmax(0, 1fr) minmax(245px, 270px); gap: 26px; align-items: start; }
#lobby .layout>main.card { display: grid; grid-template-columns: minmax(250px, .45fr) minmax(0, 1fr); gap: 16px 20px; padding: 0; border: 0; background: transparent; box-shadow: none; }
#lobby .layout>main.card>#lobbySessionCard { grid-column: 1 / -1; grid-row: 1; min-height: 150px; margin: 0; padding: 22px 24px; }
#lobby .layout>main.card>.lobby-heading { grid-column: 1; grid-row: 2; min-width: 0; align-self: start; align-items: flex-start; padding: 15px 0; border: 0; border-top: 1px solid #4d5f68; background: transparent; }
#lobby .layout>main.card>.invite-panel { grid-column: 2; grid-row: 2; min-width: 0; margin: 0; padding: 15px; grid-template-columns: minmax(0, 1fr) 94px; border: 1px solid #4d5f68; }
body.investigation-lobby-active #lobby .layout>main.card>.invite-panel { border-left: 4px solid #b9905c; }
#lobby .layout>main.card>.invite-panel .invite-qr { width: 94px; height: 94px; justify-self: end; }
#lobby .layout>main.card>.invite-panel .invite-link-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#lobby .layout>main.card>.invite-panel .invite-link-row input { grid-column: 1 / -1; }
#lobby .layout>main.card> :not(#lobbySessionCard):not(.lobby-heading):not(.invite-panel) { grid-column: 1 / -1; }
#lobby .layout>main.card:has(#lobbySessionCard.hidden) { grid-template-columns: minmax(0, 1fr); }
#lobby .layout>main.card:has(#lobbySessionCard.hidden)>.lobby-heading,
#lobby .layout>main.card:has(#lobbySessionCard.hidden)>.invite-panel { grid-column: 1; grid-row: auto; }
#lobby .layout>main.card:has(#lobbySessionCard.hidden)>.invite-panel { grid-template-columns: minmax(0, 1fr) 112px; }
#lobby .layout>main.card>p.status { margin: 0 0 4px; }
#lobby .layout>aside.card { top: 88px; padding: 18px; }
#lobby .layout>aside.card>h3 { margin-top: 0; padding-bottom: 12px; border-bottom: 1px solid #52636b; }
#lobby #hostControls { margin-top: 4px; padding: 20px 23px; background: #1d272d; border-color: #4b5d66; }
#lobby .lobby-mode-switch { border-bottom-color: #50616a; }
@media (max-width: 1850px) {
  #lobby .standalone-tab, #lobby .side-drawer-tab,
  #lobby .standalone-launcher.open .standalone-tab, #lobby .side-drawer.open .side-drawer-tab {
    min-height: 40px; background: #202b31; color: #dbe4e3; border: 1px solid #4d5e66;
    border-left: 3px solid #748a8c; border-radius: 4px !important; box-shadow: none;
  }
  #lobby .standalone-tab { border-left-color: #62b17a; }
  #lobby .rules-drawer .side-drawer-tab { border-left-color: #89aebd; }
  #lobby .advanced-drawer .side-drawer-tab { border-left-color: #b89b71; }
}

/* The play screen loses its large enclosing box but keeps all controls. */
#game .game-toolbar { margin-bottom: 0; border: 0; border-bottom: 1px solid #53646e; border-radius: 0; background: transparent; box-shadow: none; }
#game:not([data-presentation="noir"]) .game-toolbar { border: 0; border-bottom: 1px solid #53646e; border-radius: 0; background: transparent; box-shadow: none; }
#gameCard:not(:has(.deep-case)), #game[data-presentation="counterfeit"] #gameCard,
#game[data-presentation="auction"] #gameCard, #game[data-presentation="creative"] #gameCard,
body.festival-active #game[data-presentation="festival"] #gameCard {
  padding: clamp(18px, 3vw, 34px) 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
#gameCard[data-phase="think"], #gameCard[data-phase="waiting"], #gameCard[data-phase="creating"] { border-top: 0; }
#gameCard .movie { padding-bottom: 25px; border-bottom: 1px solid #3f5059; }
#gameCard .poster { border-color: #63747c; }
#choices:not(.rating-scale)>.choice { border-radius: 3px; }

@media (max-width: 1000px) {
  #lobby .layout>main.card { grid-template-columns: minmax(0, 1fr); }
  #lobby .layout>main.card>#lobbySessionCard { grid-column: 1; grid-row: 1; min-height: 0; }
  #lobby .layout>main.card>.lobby-heading { grid-column: 1; grid-row: 2; }
  #lobby .layout>main.card>.invite-panel { grid-column: 1; grid-row: 3; }
  #lobby .layout>main.card>.invite-panel { grid-template-columns: minmax(0, 1fr) 112px; }
  #lobby .layout>main.card>.invite-panel .invite-qr { width: 112px; height: 112px; }
}
@media (max-width: 760px) {
  .hero h1 { font-size: clamp(2.35rem, 10vw, 4.3rem); }
  body.account-home .hero { display: block; }
  body.account-home .home-mode-preview { min-height: 201px; margin-top: 20px; padding: 18px 19px; }
  body.account-home .home-mode-preview-copy { max-width: min(220px, 62%); }
  body.account-home .home-mode-preview-art { right: 0; width: 145px; overflow: hidden; transform: none; }
  body.account-home .home-mode-preview { min-height: 0; margin-top: 0; padding: 22px 20px 24px; }
  body.account-home .home-mode-preview .hero-copy { max-width: 100%; }
  body.account-home .home-mode-preview-copy { max-width: none; }
  body.account-home .home-mode-preview-art { top: 50%; right: -7px; bottom: auto; width: 155px; height: 220px; opacity: .13; transform: translateY(-50%); }
  #home:has(#homeDashboard.hidden)>#profileLogin { grid-template-columns: minmax(0, 1fr); padding: 20px; border-bottom: 1px solid #50626a; border-radius: 5px; }
  #home:has(#homeDashboard.hidden)>#guestSpectatorJoin { display: block; margin-top: 12px; padding: 18px 20px; border: 1px solid #50626a; border-radius: 5px; }
  #home:has(#homeDashboard.hidden)>#guestSpectatorJoin>p { margin: 8px 0 14px; }
  #home:has(#homeDashboard.hidden)>#guestSpectatorJoin .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #home:has(#homeDashboard.hidden)>#guestSpectatorJoin .row button { grid-column: 1 / -1; width: 100%; }
  body.account-home .home-account-panel { grid-template-columns: 62px minmax(0, 1fr); gap: 4px 14px; padding: 4px 0 20px; }
  body.account-home .home-profile-avatar { width: 60px; height: 60px; }
  body.account-home .home-account-actions { grid-column: 1 / -1; grid-row: 3; justify-content: stretch; width: 100%; max-width: none; margin-top: 12px; padding: 10px 0 0; border-left: 0; border-top: 1px solid var(--line-soft); }
  body.account-home .home-account-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.account-home .home-account-actions button { min-width: 0; }
  body.account-home .home-account-actions #changeHomeProfile { grid-column: 1; }
  #homeMultiplayerOptions { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  #homeMultiplayerOptions>.spectator-join { grid-row: 2; }
  #lobby .layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #lobby .layout>main.card>.invite-panel { grid-template-columns: minmax(0, 1fr) 112px; }
  #lobby .layout>aside.card { position: static; }
}
@media (max-width: 490px) {
  #home:has(#homeDashboard.hidden)>#profileLogin .row { flex-wrap: wrap; }
  #home:has(#homeDashboard.hidden)>#profileLogin .row button { width: 100%; }
  #lobby .code-row { flex-direction: row; flex-wrap: nowrap; }
  #lobby .code-row>* { width: auto; }
  #lobby .code-row .code { font-size: 1.45rem; }
  #lobby .layout>main.card>.invite-panel { grid-template-columns: minmax(0, 1fr); }
  #lobby .layout>main.card>.invite-panel .invite-qr { justify-self: center; }
}

/* The programme index is the recognizable navigation spine of the product. */
.mode-programme { display: none; }
body.account-home:has(#home:not(.hidden)) .mode-programme {
  display: flex; width: min(1088px, calc(100% - 32px)); margin: -8px auto 27px;
  overflow-x: auto; overflow-y: hidden; border-block: 1px solid #4a5b63;
  background: #172026; scrollbar-color: #566971 #172026; scroll-snap-type: x proximity;
}
.programme-mode {
  --programme-accent: #65c984;
  position: relative; display: grid; align-content: center; gap: 7px;
  flex: 1 0 138px; min-width: 0; min-height: 74px; padding: 11px 13px;
  border: 0; border-right: 1px solid #34444c; border-radius: 0;
  background: transparent; color: #c1d0d1; text-align: left;
  font-size: .77rem; font-weight: 800; line-height: 1.12;
  scroll-snap-align: start;
}
.programme-mode:last-child { border-right: 0; }
.programme-mode[data-programme-mode="investigation"] { --programme-accent: #caa06d; }
.programme-mode[data-programme-mode="festival"] { --programme-accent: #dba878; }
.programme-mode[data-programme-mode="spectrum"] { --programme-accent: #b695cf; }
.programme-mode[data-programme-mode="telephone"] { --programme-accent: #d8ad76; }
.programme-mode[data-programme-mode="counterfeit"] { --programme-accent: #d89c9e; }
.programme-mode[data-programme-mode="fictional"] { --programme-accent: #e6c77e; }
.programme-mode[data-programme-mode="solo"] { --programme-accent: #87bfd0; }
.programme-mode .programme-number { color: #81949e; font: 700 .67rem/1 Consolas,monospace; letter-spacing: .14em; }
.programme-mode:hover:not(:disabled) { background: #243139; }
.programme-mode.active { background: #243139; color: #fff; box-shadow: inset 0 2px var(--programme-accent); }
.programme-mode.active .programme-number { color: var(--programme-accent); }
@media (max-width: 760px) {
  body.account-home:has(#home:not(.hidden)) .mode-programme { width: calc(100% - 24px); margin: -5px auto 23px; }
  .programme-mode { flex-basis: 132px; min-height: 68px; }
}

/* Favorite films flank the foyer, but never sit underneath readable content. */
.home-poster-wings { display: none; }
.lobby-favorite-wings { display:none; }
@media(min-width:1320px){
  body:has(:is(#lobby,#gameLoading):not(.hidden)) .lobby-favorite-wings.has-posters { display:flex; position:fixed; inset:0; justify-content:space-between; z-index:0; pointer-events:none; overflow:hidden; }
  .lobby-favorite-rail { position:relative; width:max(0px,calc((100vw - 1120px)/2)); height:100%; overflow:hidden; opacity:.48; filter:saturate(.7); }
  .lobby-favorite-left { mask-image:linear-gradient(to right,#000 0%,#000 35%,transparent 100%); }
  .lobby-favorite-right { mask-image:linear-gradient(to left,#000 0%,#000 35%,transparent 100%); }
  .lobby-favorite-rail img { position:absolute; top:0; display:block; width:max(520px,66.67vh); height:100%; max-width:none; object-fit:cover; border:0; border-radius:0; background:#101518; }
  .lobby-favorite-left img { left:0; object-position:35% center; }
  .lobby-favorite-right img { right:0; object-position:65% center; }
  .lobby-favorite-rail img:not(:first-child) { display:none; }
  body:has(:is(#lobby,#gameLoading):not(.hidden)) #mainContent { position:relative; z-index:1; }
}
@media (min-width: 1320px) {
  body.account-home:has(#home:not(.hidden)) .home-poster-wings.has-posters {
    position: fixed; z-index: 0; inset: 78px 0 0; display: flex;
    justify-content: space-between; pointer-events: none; overflow: hidden;
  }
  .home-poster-wing {
    width: max(82px, calc((100vw - 1180px)/2 - 18px));
    max-width: 245px; height: 100%; overflow: hidden; opacity: .46;
    filter: saturate(.7); mask-image: linear-gradient(180deg, transparent, #000 8%, #000 74%, transparent);
  }
  .home-poster-wing-left { transform: rotate(-3deg) translateX(-10px); }
  .home-poster-wing-right { transform: rotate(3deg) translateX(10px); }
  .home-poster-loop { display: flex; flex-direction: column; animation: poster-rail-up 72s linear infinite; }
  .home-poster-wing-left .home-poster-loop { animation-name: poster-rail-down; }
  .home-poster-loop-set { display: flex; flex-direction: column; gap: 9px; padding-bottom: 9px; }
  .home-poster-wing img { display: block; width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border: 1px solid #54646a; border-radius: 3px; background: #263039; }
  body.account-home #mainContent { position: relative; z-index: 1; }
}
@keyframes poster-rail-up { from { transform: translateY(0); } to { transform: translateY(-50%); } }
@keyframes poster-rail-down { from { transform: translateY(-50%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .home-poster-loop { animation: none !important; }
}

/* One framed action area makes the open profile and spectator rail legible. */
body.account-home .home-dashboard { gap: 16px; }
body.account-home .home-account-panel {
  padding: 8px 0 19px; border: 0; border-bottom: 1px solid #465861;
  border-radius: 0; background: transparent;
}
#homeMultiplayerOptions { gap: 17px; }
.home-play-main {
  padding: 20px 21px 19px; border: 1px solid transparent; border-radius: 10px;
  background: linear-gradient(#1b252a,#1b252a) padding-box,
    linear-gradient(118deg,#49656c 0%,#23c764 52%,#f39a36 100%) border-box;
}
.home-play-main>h2 { margin-bottom: 17px; }
.home-play-main .public-lobby-browser { margin-top: 22px; }
@media (max-width: 760px) {
  body.account-home .home-account-panel { padding: 4px 0 20px; }
  .home-play-main { padding: 17px 15px; }
}

/* Admission and tools belong to the room rather than floating beside it. */
#lobby .dedicated-mode-option { display:none !important; }
#lobby .lobby-tools { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:10px; padding-top:18px; border-top:1px solid #34434a; }
#lobby .lobby-tools .standalone-launcher,#lobby .lobby-tools .side-drawer { position:static!important; transform:none!important; margin:0; width:auto; flex:1 1 210px; align-items:stretch; filter:none; }
#lobby .lobby-tools .standalone-tab,#lobby .lobby-tools .side-drawer-tab { width:100%!important; height:46px; padding:0 16px!important; text-align:left; color:#c8d5db!important; background:#172127!important; border:1px solid #3b4c55!important; border-radius:5px!important; box-shadow:none!important; }
#lobby .lobby-tools .standalone-tab:hover,#lobby .lobby-tools .side-drawer-tab:hover { background:#223038!important; border-color:#7a909a!important; }
#lobby .lobby-tools .open>.standalone-tab,#lobby .lobby-tools .open>.side-drawer-tab { background:#223038!important; color:#fff!important; }
#lobby .lobby-tools .standalone-panel,#lobby .lobby-tools .side-drawer-panel { width:100%!important; max-height:60vh; overflow:auto; padding:18px; margin-top:8px; border:1px solid #3b4c55; border-radius:5px; background:#19242a; }
#lobby .layout.standalone-open { margin-left:0!important; width:100%!important; }

/* The room is a focused session, not a second welcome page. */
body:has(#lobby:not(.hidden)) { background: #101518 !important; }
#lobby { max-width: 1088px; margin: 28px auto; }
#lobby>.lobby-session-card { --preview-accent: var(--experience-accent); position: relative; display: flex; min-height: 204px; margin: 0 0 26px; padding: 28px 32px; border: 1px solid #476057; border-radius: 5px; background: radial-gradient(ellipse at 95% 30%, color-mix(in srgb,var(--experience-accent) 10%,transparent), transparent 55%), #1b252a; box-shadow: none; }
#lobby .lobby-session-card .experience-card-copy { max-width: calc(100% - 245px); }
#lobby .lobby-session-card h3 { margin: 9px 0 10px; font-size: clamp(1.7rem,3vw,2.5rem); line-height: 1.1; letter-spacing: -.035em; }
#lobby .lobby-session-card p { font-size: .97rem; line-height: 1.5; color: #c0ced2; }
#lobby .experience-kicker { color: var(--experience-accent); font-size: .68rem; letter-spacing: .18em; }
#lobby .experience-meta { margin-top: 18px; gap: 9px; }
#lobby .experience-meta span { padding: 6px 10px; font-size: .82rem; border-color: #53646a; background: #141c21; }
.lobby-session-art { position: absolute; right: 26px; top: 50%; width: 220px; height: 176px; transform: translateY(-50%); }
#lobby .layout { grid-template-columns: minmax(0,1fr) 300px; gap: 26px; }
#lobby .layout>main.card { grid-template-columns: minmax(180px,.34fr) minmax(0,1fr); gap: 20px; }
#lobby .layout>main.card>.lobby-heading { grid-column: 1; grid-row: 1; padding: 18px 0; border: 0; }
#lobby .layout>main.card>.invite-panel { grid-column: 2; grid-row: 1; padding: 18px; border: 1px solid #40525a; border-radius: 5px; background: #192228; box-shadow: none; }
#lobby .code-row { align-items: center; gap: 10px; margin-top: 9px; }
#lobby .code-row .code { border: 1px solid #445a63; border-radius: 4px; background: #192329; color: #f3f1e9; font-size: 1.8rem; padding: 10px 14px; }
#lobby .copy-code { min-height: 43px; padding: 8px 13px; border: 1px solid #44565f; border-radius: 4px; background: transparent; }
#lobby .invite-panel strong { font-size: 1rem; color: #e5ebea; }
#lobby .invite-panel .status { font-size: .85rem; line-height: 1.5; }
#lobby .invite-link-row button { min-height: 35px; padding: 7px 10px; font-size: .78rem; background: #243139; border-color: #4b5e68; }
#lobby .layout>aside.card { padding: 20px; border: 1px solid #3c4e57; border-radius: 5px; background: #192228; box-shadow: none; }
#lobby .layout>aside.card>h3 { font-size: 1.12rem; border-bottom-color: #3b4b53; }
#lobby #players { gap: 0; }
#lobby .lobby-player-card, #lobby .lobby-player-card[data-ready="true"], #lobby .lobby-player-card[data-host="true"] { padding: 15px 0; border: 0; border-bottom: 1px solid #34464e; border-radius: 0; background: transparent; box-shadow: none; }
#lobby .lobby-player-card .lobby-avatar { border: 1px solid #687d86; box-shadow: none; }
#lobby .player-row-main { align-items: flex-start; }
#lobby .player-row-main>span:last-child { display: none; }
#lobby .player-identity>span { font-size: .9rem; }
#lobby .host { color: #bacbc4; font-size: .64rem; letter-spacing: .08em; }
#lobby .player-status { background: transparent; padding: 0; font-weight: 500; font-size: .72rem; }
#lobby .player-status.online, #lobby .player-status.ready { color: #8bc69f; }
#lobby .player-actions { gap: 8px; margin-top: 12px; }
#lobby .player-actions button { padding: 6px 9px; min-height: 32px; font-size: .73rem; background: transparent; border-color: #465b65; }
#lobby #microphoneTestToggle { display: flex; align-items: center; justify-content: center; gap: 8px; background: transparent; border-color: #44555e; }
#lobby .explanation-preference { border-top: 1px solid #34464e; padding-top: 15px; font-size: .8rem; color: #a8b9c1; }
#lobby #hostControls { padding: 22px; border: 1px solid #40525b; border-radius: 5px; background: #1a242a; }
#lobby .lobby-mode-switch { gap: 15px; padding: 0 0 18px; border: 0; border-bottom: 1px solid #3d5059; border-radius: 0; background: transparent; }
#lobby .lobby-mode-switch h3 { font-size: 1.08rem; }
#lobby .lobby-mode-switch .status { font-size: .83rem; }
#lobby .lobby-public-switch { border: 0; padding: 0; background: transparent; font-size: .83rem; }
#lobby :is(.investigation-lobby-guide,.festival-lobby-guide,.spectrum-lobby-guide,.telephone-lobby-guide,.counterfeit-lobby-guide) { padding: 18px 0; border: 0; border-top: 1px solid #3c5059; border-radius: 0; background: transparent; box-shadow: none; }
#lobby :is(.investigation-lobby-settings,.festival-lobby-settings,.spectrum-lobby-settings,.telephone-lobby-settings,.counterfeit-lobby-settings) { padding: 15px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#lobby .question-type-details { border-color: #41545d; border-radius: 4px; background: #141d22; }
.quiz-presets { margin: 0 0 20px; }
.quiz-presets-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; }
.quiz-presets-heading h3 { margin:0; font-size:1rem; }
.quiz-preset-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.quiz-preset { display:flex; flex-direction:column; align-items:flex-start; gap:7px; min-height:105px; padding:16px; text-align:left; border:1px solid #40545e; border-radius:6px; background:#172229; color:#edf5f2; cursor:pointer; }
.quiz-preset strong { font-size:1rem; }
.quiz-preset span { color:#9fb8bf; font-size:.8rem; line-height:1.4; }
.quiz-preset:hover { border-color:#87ae9d; background:#1c2b31; }
.quiz-preset.active { border-color:#21d774; background:linear-gradient(145deg,#1d3930,#17262b); box-shadow:inset 0 0 0 1px #21d77455; }
.quiz-preset:focus-visible { outline:2px solid #eaf9d9; outline-offset:3px; }
@media(max-width:650px){.quiz-preset-grid{grid-template-columns:1fr}.quiz-preset{min-height:0;padding:13px}}
#lobby .lobby-guide-details summary { cursor: pointer; color: #c5d2d6; font-size: .88rem; font-weight: 600; }
#lobby .lobby-guide-details[open] summary { margin-bottom: 16px; }
#lobby .lobby-guide-details p { font-size: .9rem; line-height: 1.6; color: #bac9cf; }
#lobby .lb-dropdown-toggle, #lobby .lb-dropdown-menu, #lobby .lb-dropdown-option { background: #141d22; color: #dbe4e6; border-color: #4c626c; }
#lobby .lb-dropdown-option:hover, #lobby .lb-dropdown-option.selected { background: #293b43; color: #fff; }
#lobby .custom-rounds input, #lobby .custom-rounds button { background: #18272f !important; color: #e4eaeb !important; border-color: #4b616d !important; }
#lobby :is(.festival-lobby-settings,.spectrum-lobby-settings,.telephone-lobby-settings,.counterfeit-lobby-settings)>label { display: grid; grid-template-columns: minmax(100px,.4fr) minmax(0,1fr); align-items: center; gap: 14px; }
#lobby :is(.festival-lobby-settings,.spectrum-lobby-settings,.telephone-lobby-settings,.counterfeit-lobby-settings)>label>span { white-space: nowrap; font-size: .9rem; }
#lobby #start { min-height: 44px; padding: 11px 21px; }
#lobby .guest-waiting { border: 1px solid #41545d; border-radius: 5px; background: #1b252b; padding: 22px; box-shadow: none; }
body.investigation-lobby-active #lobby h3 { font-family: "Segoe UI",Arial,sans-serif; color: #f3f1e9; letter-spacing: -.03em; }
body.investigation-lobby-active #lobby .layout>main.card { border: 0; background: transparent; box-shadow: none; }
body.investigation-lobby-active #lobby .layout>aside.card { border: 1px solid #3c4e57; border-radius: 5px; background: #192228; box-shadow: none; }
body.investigation-lobby-active #lobby .layout>main.card>.invite-panel { border: 1px solid #40525a; border-radius: 5px; background: #192228; }
body.investigation-lobby-active #lobby #hostControls { border: 1px solid #40525b; border-radius: 5px; background: #1a242a; }
body.investigation-lobby-active #lobby .lobby-public-switch { border: 0; background: transparent; }
body.investigation-lobby-active #lobby .investigation-lobby-guide { border: 0; border-top: 1px solid #3c5059; border-radius: 0; background: transparent; padding: 18px 0; margin: 0; }
body.investigation-lobby-active #lobby .investigation-lobby-settings { border: 0; background: transparent; }
body.investigation-lobby-active #lobby .investigation-setup-fields { border: 0; background: transparent; padding: 0; }
body.investigation-lobby-active #lobby .investigation-setup-fields>label { display: grid; grid-template-columns: minmax(0,1fr); color: #c4d1d5; }
body.investigation-lobby-active #lobby .investigation-setup-fields :is(select,input) { width: 100%; max-width: none; background: #141d22; border-color: #4b626c; color: #e4ebec; }
body.investigation-lobby-active #lobby .investigation-file-tag { border: 0; background: transparent; color: #b9a58c; padding: 0; font-size: .65rem; }
body.investigation-lobby-active #lobby :is(button.secondary,button.ghost,.copy-code) { border: 1px solid #44565f; background: #243139; color: #dbe4e6; }
body.investigation-lobby-active #lobby :is(button.primary,.ready-toggle.primary) { border: 1px solid #28c76b; background: #28c76b; color: #07160d; box-shadow: none; }
body.investigation-lobby-active #lobby :is(.player-status.ready,.player-status.online,.ready-requirement.ok) { color: #8bc69f; }
body.investigation-lobby-active #lobby .status { color: #a5b4bb; }
body.investigation-lobby-active #lobby input[type="checkbox"] { accent-color: #28c76b; }
@media (max-width: 760px) {
  #lobby { margin-top: 18px; }
  #lobby>.lobby-session-card { min-height: 180px; padding: 22px; margin-bottom: 20px; }
  #lobby .lobby-session-card .experience-card-copy { max-width: 100%; }
  #lobby .lobby-session-card h3 { font-size: 1.8rem; }
  .lobby-session-art { right: -15px; width: 170px; height: 160px; opacity: .1; }
  #lobby .layout { grid-template-columns: minmax(0,1fr); gap: 20px; }
  #lobby .layout>main.card { grid-template-columns: minmax(0,1fr); gap: 15px; }
  #lobby .layout>main.card>.lobby-heading { grid-column: 1; grid-row: 1; padding: 0; }
  #lobby .layout>main.card>.invite-panel { grid-column: 1; grid-row: 2; grid-template-columns: minmax(0,1fr); padding: 18px; }
  #lobby .layout>main.card>.invite-panel .invite-qr { justify-self: center; }
  #lobby #hostControls { padding: 18px; }
  #lobby .layout>aside.card { position: static; }
}

/* A single admission panel: room code, invitation link, and scan target. */
#lobby .layout>main.card { grid-template-columns:minmax(0,1fr); }
#lobby .layout>main.card>.invite-panel { grid-column:1/-1; grid-row:auto; display:grid; grid-template-columns:150px minmax(0,1fr) 94px; gap:20px; align-items:center; padding:22px; }
#lobby #invitePanel .lobby-heading { margin:0; padding:0 20px 0 0; border:0; border-right:1px solid #3b4c55; background:none; align-self:stretch; display:flex; align-items:center; }
#lobby #invitePanel .code-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
#lobby #invitePanel .code { padding:9px 12px; font-size:1.5rem; letter-spacing:.18em; border:0; background:#10191e; }
#lobby #invitePanel .copy-code { padding:7px 12px; }
#lobby #invitePanel .invite-copy>strong { font-size:1rem; }
#lobby #invitePanel .invite-copy>p { font-size:.82rem; line-height:1.5; margin:7px 0 12px; }
#lobby #invitePanel .invite-link-row input { font-size:.85rem; }
@media(max-width:780px){
  #lobby .layout>main.card>.invite-panel { grid-template-columns:minmax(0,1fr) 94px; gap:18px; padding:18px; }
  #lobby #invitePanel .lobby-heading { grid-column:1/-1; border-right:0; border-bottom:1px solid #3b4c55; padding:0 0 16px; }
  #lobby #invitePanel .lobby-heading>div { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; }
  #lobby #invitePanel .code-row { margin:0; }
  #lobby #invitePanel .invite-qr { width:80px; height:80px; }
  #lobby .lobby-tools { gap:8px; }
}
@media(max-width:480px){
  #lobby .layout>main.card>.invite-panel { grid-template-columns:minmax(0,1fr); }
  #lobby #invitePanel .invite-qr { display:none; }
}

/* Gameplay identities: shared controls, distinct cinematic spaces. */
#game { --stage-accent:#8fc5a1; --stage-surface:#17221e; --stage-line:#3b5145; --stage-soft:#b2c5b9; }
#game[data-scene="noir"] { --stage-accent:#d8c59c; --stage-surface:#1c1d1b; --stage-line:#575449; --stage-soft:#c6c1b4; }
#game[data-scene="festival"] { --stage-accent:#e4c890; --stage-surface:#291c24; --stage-line:#684753; --stage-soft:#d6bbc5; }
#game[data-scene="spectrum"] { --stage-accent:#c5b3ec; --stage-surface:#211e30; --stage-line:#534966; --stage-soft:#c2bbd5; }
#game[data-scene="telephone"] { --stage-accent:#dfb67f; --stage-surface:#28231d; --stage-line:#625341; --stage-soft:#cabca7; }
#game[data-scene="counterfeit"] { --stage-accent:#e7a29a; --stage-surface:#282123; --stage-line:#64494c; --stage-soft:#d3b8b9; }
#game[data-scene="card-table"] { --stage-accent:#a8c7b3; --stage-surface:#142a23; --stage-line:#3a6250; --stage-soft:#b3c7bd; }
#game[data-scene="auction"] { --stage-accent:#d4b68b; --stage-surface:#25221d; --stage-line:#60553f; --stage-soft:#c6bdab; }
#game[data-scene="timeline"] { --stage-accent:#9ecad7; --stage-surface:#17252e; --stage-line:#405c6a; --stage-soft:#b1c5ce; }
#game[data-scene="drawing"] { --stage-accent:#b2cbb8; --stage-surface:#202925; --stage-line:#4e6256; --stage-soft:#bdcdc1; }
#game[data-scene="meme"] { --stage-accent:#d4b1dc; --stage-surface:#27212d; --stage-line:#60506a; --stage-soft:#cfc0d5; }
#game[data-scene="sound"] { --stage-accent:#91cacc; --stage-surface:#17272b; --stage-line:#365b63; --stage-soft:#b2cbd0; }
body:has(#game:not(.hidden)) { background-image:none!important; background-color:var(--ink-950); }
#game[data-scene] #gameCard { background:var(--stage-surface); border:1px solid var(--stage-line); border-top:3px solid var(--stage-accent); border-radius:8px; box-shadow:0 16px 48px #0003; }
#game[data-scene] .game-toolbar { background:var(--ink-900); border:1px solid var(--stage-line); border-left:3px solid var(--stage-accent); border-radius:6px; box-shadow:none; }
#game[data-scene] #roundLabel { color:var(--stage-accent); border-color:var(--stage-line); letter-spacing:.12em; }
#game[data-scene] #prompt { font-family:"Segoe UI",Arial,sans-serif; font-weight:800; letter-spacing:-.035em; }
#game[data-scene] #filmTitle { color:var(--stage-soft); }
#game[data-scene] .status { color:var(--stage-soft); }
#game[data-scene] #gameCard .poster { border:1px solid var(--stage-line); padding:5px; background:#101518; border-radius:4px; box-shadow:0 10px 24px #0004; }
#game[data-scene] #choices:not(.rating-scale) > .choice:not(.correct):not(.wrong) { background:#ffffff06; border-color:var(--stage-line); border-radius:5px; }
#game[data-scene] #choices:not(.rating-scale) > .choice:hover:not(:disabled):not(.correct):not(.wrong) { border-color:var(--stage-accent); background:#ffffff0e; }
#game[data-scene] .round-result-feature { background:var(--ink-900); border-top-color:var(--stage-line); border-right-color:var(--stage-line); border-bottom-color:var(--stage-line); }
#game[data-scene] .round-result-feature .experience-kicker { color:var(--stage-accent); }
#game[data-scene] :is(.spectrum-board,.telephone-board,.counterfeit-board) { background:transparent; border:0; padding:clamp(12px,2vw,24px); box-shadow:none; }

/* Festival: a burgundy programme, framed selections and jury paperwork. */
body.festival-active #game[data-presentation="festival"] { background:transparent; }
#game[data-scene="festival"] .festival-header { padding:8px 0 24px; border-bottom:1px solid var(--stage-line); }
#game[data-scene="festival"] .festival-header h2 { font-family:Georgia,serif; font-size:clamp(1.7rem,3vw,2.6rem); letter-spacing:-.035em; color:#f4e9d4; }
#game[data-scene="festival"] .festival-score { background:#17151a; border-color:var(--stage-line); color:var(--stage-accent); border-radius:3px; font-variant-numeric:tabular-nums; }
#game[data-scene="festival"] :is(.festival-role,.festival-curator,.festival-evidence-board,.festival-memo-controls) { background:#21191e; border-color:var(--stage-line); border-radius:4px; box-shadow:none; }
#game[data-scene="festival"] .festival-role { border-left:3px solid var(--stage-accent); }
#game[data-scene="festival"] .festival-film { background:#18151a; border:1px solid #725360; padding:9px; border-radius:3px; box-shadow:0 8px 18px #0003; }
#game[data-scene="festival"] .festival-film strong { color:#f0e7df; font-family:Georgia,serif; line-height:1.4; }
#game[data-scene="festival"] .festival-film.selected { border-color:var(--signal); background:#223429; box-shadow:0 0 0 2px #28c76b44; }
#game[data-scene="festival"] .festival-film-order { background:#edddbb; color:#2c2024; }
#game[data-scene="festival"] :is(.festival-claim,.festival-office-memo) { background:#342a2c; border-left-color:var(--stage-accent); color:#eee5d4; }
#game[data-scene="festival"] .festival-claim.truthful { border-left-color:var(--signal); }
#game[data-scene="festival"] .festival-claim.falsehood { border-left-color:#ed8585; }
#game[data-scene="festival"] :is(.festival-verdict,.festival-final) { background:#1c181b; border:1px solid var(--stage-line); border-top:3px solid var(--stage-accent); padding:24px; }

/* Investigation: charcoal dossier, typewritten evidence, brass file tabs. */
#game[data-scene="noir"] #gameCard { background:linear-gradient(115deg,#272722 0,#181b1b 55%); border-color:#686052; }
#game[data-scene="noir"] :is(.investigation-file-tag,.deep-file-tag) { background:#d8c8a6; color:#25251f; border:0; border-radius:2px; font:700 .72rem/1.5 "Courier New",monospace; letter-spacing:.14em; box-shadow:none; }
#game[data-scene="noir"] :is(.case-private,.case-investigation,.case-proposal,.deep-whiteboard) { background:#222521; border:1px solid #5c5b50; border-radius:3px; box-shadow:none; }
#game[data-scene="noir"] :is(.case-evidence,.deep-finding) { background:#31312a; border:1px solid #6e6857; border-radius:2px; color:#eee6d4; font-family:"Courier New",monospace; }
#game[data-scene="noir"] .case-evidence strong { color:#d8c59c; }
#game[data-scene="noir"] .deep-masked-synopsis { font-family:"Courier New",monospace; line-height:1.8; }
#game[data-scene="noir"] .case-suspect { background:#272b28; border:1px solid #646657; border-bottom:3px solid #9a8d70; border-radius:3px; color:#ede7d9; }
#game[data-scene="noir"] .case-suspect.selected { border-color:#dcc79d; background:#3c3c30; box-shadow:0 0 0 1px #dcc79d; }
#game[data-scene="noir"] .case-suspect.correct { border-color:var(--signal); background:#20392c; }
#game[data-scene="noir"] .case-suspect.wrong { border-color:#e08484; background:#40292a; }
#game[data-scene="noir"] .deep-case-timer { font-family:"Courier New",monospace; color:#e5d4ae; border-color:#75694f; background:#161a19; }
#game[data-scene="noir"] .deep-case-reveal { border-top:3px double #b8a47c; padding-top:24px; }

/* Spectrum: a calibrated instrument with opposing colored endpoints. */
#game[data-scene="spectrum"] .spectrum-intro { border-bottom:1px solid var(--stage-line); padding-bottom:20px; }
#game[data-scene="spectrum"] .spectrum-intro strong { color:#e4dbf6; font-size:1.2rem; }
#game[data-scene="spectrum"] .spectrum-axis { padding:24px 0; }
#game[data-scene="spectrum"] .spectrum-axis > span { color:var(--stage-soft); font-size:.9rem; }
#game[data-scene="spectrum"] .spectrum-track { height:14px; border-radius:3px; background:linear-gradient(90deg,#779bc7,#b6a3cf 50%,#dcae8b); box-shadow:none; }
#game[data-scene="spectrum"] .spectrum-control { background:#191725; border:1px solid var(--stage-line); border-radius:6px; padding:22px; }
#game[data-scene="spectrum"] .spectrum-range { accent-color:#c5b3ec; background:transparent; border:0; padding:0; }
#game[data-scene="spectrum"] .spectrum-readout { color:#e4dbf6; font-family:"Courier New",monospace; font-size:2.2rem; }
#game[data-scene="spectrum"] .spectrum-guess-row { background:#292438; border-color:var(--stage-line); border-radius:4px; }
#game[data-scene="spectrum"] .spectrum-reveal-label { color:var(--stage-accent); }
#game[data-scene="spectrum"] .spectrum-secret-target { display:block; text-align:center; color:#e4dbf6; font:800 clamp(1.5rem,4vw,2.8rem)/1.1 "Courier New",monospace; }
#game[data-scene="spectrum"] .spectrum-film-search { display:flex; gap:12px; width:min(100%,620px); margin:0 auto; }
#game[data-scene="spectrum"] .spectrum-film-search .telephone-guess-input { flex:1; min-width:0; }
#game[data-scene="spectrum"] .spectrum-film-search input { width:100%; }
@media(max-width:600px){#game[data-scene="spectrum"] .spectrum-film-search { flex-direction:column; }}

/* Telephone: private correspondence becomes a connected transcript. */
#game[data-scene="telephone"] .telephone-heading { border-bottom:1px dashed var(--stage-line); padding-bottom:20px; }
#game[data-scene="telephone"] .telephone-heading span { color:var(--stage-accent); font-family:"Courier New",monospace; }
#game[data-scene="telephone"] .telephone-description { position:relative; background:#352e24; border:1px solid #756247; border-left:3px solid var(--stage-accent); border-radius:2px 14px 14px 14px; color:#f3e8d6; padding:24px; font-family:Georgia,serif; line-height:1.6; }
#game[data-scene="telephone"] .telephone-chain { gap:18px; padding-left:18px; border-left:2px dashed var(--stage-line); }
#game[data-scene="telephone"] .telephone-chain-card { background:#211d19; border:1px solid var(--stage-line); border-radius:3px 12px 12px 12px; padding:18px; }
#game[data-scene="telephone"] .telephone-chain-card small { color:var(--stage-accent); font-family:"Courier New",monospace; }
#game[data-scene="telephone"] :is(.telephone-form textarea,.telephone-guess-form input) { background:#1a1917; border-color:var(--stage-line); }
#game[data-scene="telephone"] .telephone-verdict { color:#efdbb9; border-bottom:1px solid var(--stage-line); padding-bottom:18px; }

/* Counterfeit: the canvas is the artwork; roles read like gallery labels. */
#game[data-scene="counterfeit"] .counterfeit-hero { border-bottom:1px solid var(--stage-line); padding-bottom:20px; }
#game[data-scene="counterfeit"] .counterfeit-eyebrow { color:var(--stage-accent); letter-spacing:.16em; }
#game[data-scene="counterfeit"] .counterfeit-role { background:#1d1a1d; border:1px solid var(--stage-line); border-left:3px solid var(--stage-accent); border-radius:2px; }
#game[data-scene="counterfeit"] .counterfeit-role.outsider { border-left-color:#deb773; }
#game[data-scene="counterfeit"] .counterfeit-canvas { border:8px solid #c8bfb1; border-radius:2px; box-shadow:0 12px 28px #0005; }
#game[data-scene="counterfeit"] :is(.counterfeit-clock,.counterfeit-vote) { background:#34282c; border-color:#77535b; color:#f4e5e5; border-radius:4px; }
#game[data-scene="counterfeit"] .counterfeit-vote:hover:not(:disabled) { border-color:var(--stage-accent); background:#443137; }
#game[data-scene="counterfeit"] .counterfeit-reveal { background:#1d191c; border:1px solid var(--stage-line); padding:24px; border-top:3px solid var(--stage-accent); }

/* Movie 38: green felt, crisp card sleeves and a clear centre pile. */
#game[data-scene="card-table"] .movie49-table { background:radial-gradient(ellipse at center,#284c3b,#142b23 75%); border:1px solid #53735e; border-radius:18px; padding:clamp(12px,2vw,26px); }
#game[data-scene="card-table"] .movie49-card { background:#182820; border:1px solid #90a695; border-radius:6px; box-shadow:0 5px 12px #0004; }
#game[data-scene="card-table"] :is(.movie49-hand-title,.movie49-turn,.movie49-meta) { color:#d0e1d4; }
#game[data-scene="card-table"] .movie49-pile { border-color:#90a695; }

/* Auction: a private sale catalogue with a ledger and a featured lot. */
#game[data-scene="auction"] .auction-table { background:#1b1a17; border:1px solid #655b46; border-radius:4px; }
#game[data-scene="auction"] .auction-movie { border-bottom:1px solid var(--stage-line); padding-bottom:22px; }
#game[data-scene="auction"] :is(.auction-player,.auction-private-card,.auction-collection) { background:#2c2921; border-color:#665c47; border-radius:3px; }
#game[data-scene="auction"] .auction-ledger { font-family:"Courier New",monospace; font-variant-numeric:tabular-nums; }
#game[data-scene="auction"] .auction-result { background:#302b21; border-color:var(--stage-accent); }

/* Chronology: an archive timeline, with dated cards and insertion slots. */
#game[data-scene="timeline"] .timeline-track { border-bottom:2px solid var(--stage-line); padding-bottom:20px; }
#game[data-scene="timeline"] :is(.timeline-card,.timeline-candidate) { background:#20333e; border:1px solid #5a7b8b; border-radius:4px; box-shadow:none; }
#game[data-scene="timeline"] .timeline-slot { background:#14232b; border:1px dashed #6d95a5; border-radius:4px; color:#d1e5eb; }
#game[data-scene="timeline"] .timeline-slot:hover:not(:disabled) { background:#2b434e; border-color:#bbdeea; }
#game[data-scene="timeline"] .timeline-summary { border-top:1px solid var(--stage-line); padding-top:18px; }

/* Creative rounds: a drawing desk, an editing suite and a recording booth. */
#game[data-scene="drawing"] :is(.drawing-sidebar,.drawing-tools,.drawing-reference) { background:#18221d; border-color:var(--stage-line); border-radius:4px; }
#game[data-scene="drawing"] :is(#drawingCanvas,.drawing-question-image) { border:6px solid #d5d3c5; border-radius:2px; box-shadow:0 10px 24px #0004; }
#game[data-scene="drawing"] .drawing-workspace { padding:12px; background:#2b342c; border:1px solid var(--stage-line); border-radius:6px; }
#game[data-scene="meme"] :is(.meme-editor,.meme-display) { border:1px solid #806387; background:#17131b; border-radius:5px; box-shadow:none; }
#game[data-scene="meme"] .meme-draw-controls { background:#211b27; border-color:var(--stage-line); }
#game[data-scene="meme"] .meme-controls { border-top:1px solid var(--stage-line); padding-top:16px; }
#game[data-scene="sound"] :is(#voiceoverRecorder,.voiceover-reveal) { background:#112025; border:1px solid var(--stage-line); border-top:3px solid var(--stage-accent); padding:clamp(12px,2vw,24px); border-radius:5px; }
#game[data-scene="sound"] :is(video,audio) { max-width:100%; border-radius:4px; }
#game[data-scene="sound"] .mystery-form { padding-top:18px; border-top:1px solid var(--stage-line); }
#game[data-scene="sound"] #voiceoverStart:not(:disabled) { background:#b95f64; border-color:#d58589; color:#fff; }
@media(max-width:600px) {
  #game[data-scene] #gameCard { border-radius:5px; }
  #game[data-scene] :is(.spectrum-board,.telephone-board,.counterfeit-board) { padding:10px 0; }
  #game[data-scene="spectrum"] .spectrum-control { padding:14px; }
  #game[data-scene="telephone"] .telephone-description { padding:16px; }
  #game[data-scene="telephone"] .telephone-chain { padding-left:10px; gap:12px; }
  #game[data-scene="counterfeit"] .counterfeit-canvas { border-width:4px; }
  #game[data-scene="drawing"] .drawing-workspace { padding:5px; }
}
/* Keep mode boards out of the generic two-column answer grid. */
body.festival-active #game[data-scene="festival"] #gameCard { background:var(--stage-surface); border:1px solid var(--stage-line); border-top:3px solid var(--stage-accent); border-radius:8px; padding:clamp(16px,3vw,32px); }
#game[data-scene] #choices:is(.festival-game,.spectrum-board,.telephone-board,.counterfeit-board) { grid-template-columns:minmax(0,1fr); }
#game[data-scene="festival"] .festival-header h2 { text-transform:none; }
#game[data-scene="festival"] #choices.festival-game > .primary { justify-self:start; min-width:210px; min-height:44px; padding:12px 24px; }
#game[data-scene="festival"] .festival-film-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
#game[data-scene="festival"] .festival-film-grid.proposed { grid-template-columns:repeat(3,minmax(0,1fr)); }
#game[data-scene="festival"] .festival-film img { object-fit:contain; }
#game[data-scene] .game-toolbar { margin-bottom:20px; }
#game .game-turn-status { margin:10px 0 18px; padding:11px 16px; border:1px solid #40545d; border-radius:5px; background:#18242a; color:#e4eee9; font-size:.88rem; line-height:1.4; }
#game .game-turn-status.is-waiting { color:#adc2c8; border-color:#364b55; }
#game .game-turn-status:not(.hidden)::before { content:""; display:inline-block; width:7px; height:7px; margin-right:9px; border-radius:50%; background:#20d86d; vertical-align:2px; }
#game .game-turn-status.is-waiting::before { background:#86a5b4; }
#game[data-scene] #gameToolbarProgress { color:var(--stage-accent); }
#game[data-scene] #gameCard { padding:clamp(16px,2.5vw,30px); }
#game[data-scene] .score-player:not(.round-correct):not(.round-wrong) { background:var(--ink-900); border-color:var(--stage-line); }
#game[data-scene="noir"] #choices :is(.case-private,.case-investigation,.case-proposal,.deep-whiteboard) { background:#222521; border-color:#5c5b50; box-shadow:none; }
#game[data-scene="noir"] #choices .deep-masked-synopsis {
  background:#eee5d1;
  border:1px solid #b8a47f;
  border-left:5px solid #a36d49;
  padding:clamp(16px,2.5vw,26px);
  color:#27231d;
  box-shadow:4px 5px 0 #080b0b70;
}
#game[data-scene="noir"] #choices .deep-masked-synopsis strong { color:#34291e; }
#game[data-scene="noir"] #choices .deep-masked-synopsis p {
  max-width:72ch;
  color:#27231d;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.05rem,1.4vw,1.18rem);
  line-height:1.75;
}
#game[data-scene="noir"] #choices :is(.case-evidence,.deep-finding) { background:#31312a; border-color:#6e6857; box-shadow:none; }
#game[data-scene="noir"] #choices .case-suspect { background:#272b28; border-color:#646657; border-left-color:#9a8d70; box-shadow:none; }
#game[data-scene="noir"] #choices .case-suspect.selected { border-color:#dcc79d; background:#3c3c30; box-shadow:0 0 0 1px #dcc79d; }
#game[data-scene="noir"] #choices .case-suspect.correct { border-color:var(--signal); background:#20392c; }
#game[data-scene="noir"] #choices .case-suspect.wrong { border-color:#e08484; background:#40292a; }
@media(max-width:900px) { #game[data-scene="festival"] .festival-film-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:490px) { #game[data-scene="festival"] .festival-film-grid, #game[data-scene="festival"] .festival-film-grid.proposed { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:420px) {
  #game[data-scene] :is(#drawingPhase,#memePhase) .drawing-sidebar { display:grid; grid-template-columns:80px minmax(0,1fr); grid-template-rows:auto auto auto; width:100%; gap:10px; padding:8px; }
  #game[data-scene] :is(#drawingPhase,#memePhase) .single-color-picker { grid-column:1; grid-row:1; width:80px; }
  #game[data-scene] :is(#drawingPhase,#memePhase) .drawing-color-square { width:80px; }
  #game[data-scene] :is(#drawingPhase,#memePhase) .drawing-toolset { grid-column:2; grid-row:1; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
  #game[data-scene] :is(#drawingPhase,#memePhase) .pen-sizes { grid-column:1/-1; grid-row:2; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
  #game[data-scene] :is(#drawingPhase,#memePhase) .meme-sidebar-actions { grid-column:1/-1; grid-row:3; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  #game[data-scene] .drawing-sidebar :is(.draw-tool,.pen-size,.meme-draw-tool,.meme-pen-size) { min-width:0; width:100%; padding:5px; }
}
.counterfeit-vote-transition { border-top:1px solid var(--stage-line,var(--line-soft)); padding-top:18px; margin-top:6px; text-align:center; }
.counterfeit-vote-transition .status { max-width:60ch; margin:0 auto 14px; font-size:.83rem; line-height:1.6; }

/* Personal watchlist picker; shared film-club materials and colors. */
.header-actions .watchlist-wheel-toggle { display:flex; align-items:center; gap:8px; min-width:40px; padding:9px 12px; }
.watchlist-wheel-toggle svg { width:19px; height:19px; flex:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.watchlist-wheel-dialog { width:min(940px,calc(100vw - 28px)); max-height:90dvh; margin:auto; padding:28px; overflow:auto; border:1px solid #52646d; border-radius:8px; background:#1b2328; color:var(--paper); box-shadow:0 24px 80px #0009; }
.watchlist-wheel-dialog::backdrop { background:#080d11d9; backdrop-filter:blur(5px); }
.watchlist-wheel-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding-bottom:20px; border-bottom:1px solid var(--line-soft); }
.watchlist-wheel-header h2 { margin:0; font-size:clamp(1.3rem,3vw,1.8rem); }
.watchlist-wheel-header p { margin:8px 0 0; font-size:.85rem; }
#watchlistWheelClose { flex:none; padding:5px; width:36px; height:36px; font-size:1.5rem; line-height:1; }
.watchlist-wheel-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:30px; align-items:center; padding-top:24px; }
.watchlist-wheel-stage { position:relative; min-width:0; width:100%; aspect-ratio:1; overflow:hidden; }
#watchlistWheelCanvas { display:block; width:100%; height:100%; transform-origin:center; }
.watchlist-wheel-pointer { position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:2; width:0; height:0; border-inline:12px solid transparent; border-top:26px solid #f3d69c; filter:drop-shadow(0 3px 3px #0008); }
.watchlist-wheel-hub { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:64px; height:64px; display:grid; place-items:center; background:#172126; border:3px solid #92a99b; border-radius:50%; box-shadow:0 3px 15px #0007; }
.watchlist-wheel-hub .brand-dots i { width:14px; height:14px; }
.watchlist-wheel-hub .brand-dots { display:flex; }
.watchlist-wheel-sidebar { min-width:0; }
#watchlistWheelStatus { margin:0 0 18px; line-height:1.6; }
#watchlistWheelSpin { width:100%; min-height:46px; }
.watchlist-wheel-note { margin:12px 0 22px; font-size:.78rem; line-height:1.6; }
.watchlist-wheel-result { display:grid; grid-template-columns:86px minmax(0,1fr); gap:16px; align-items:center; margin-bottom:22px; padding:16px; background:#14241d; border:1px solid #41634e; border-radius:6px; }
.watchlist-wheel-result img { width:86px; aspect-ratio:2/3; object-fit:contain; background:#101518; border-radius:3px; }
.watchlist-wheel-eyebrow { color:#92d2a8; font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; }
.watchlist-wheel-result h3 { margin:8px 0; font-size:1.15rem; line-height:1.3; overflow-wrap:anywhere; }
.watchlist-wheel-result p { margin:0 0 8px; font-size:.8rem; }
.watchlist-wheel-result a { color:#a1d9b4; font-size:.8rem; text-underline-offset:3px; }
#watchlistWheelCollection { border-top:1px solid var(--line-soft); padding-top:16px; }
#watchlistWheelCollection summary { cursor:pointer; color:var(--copy); font-size:.86rem; }
#watchlistWheelSearch { margin-top:14px; width:100%; }
#watchlistWheelFilms { max-height:180px; overflow-y:auto; margin:12px 0 0; padding:0; list-style:none; scrollbar-color:#52646d #141e23; }
#watchlistWheelFilms li { padding:9px 2px; border-bottom:1px solid #303f47; color:var(--copy-muted); font-size:.83rem; line-height:1.4; overflow-wrap:anywhere; }
@media(max-width:1050px){.header-actions .header-tag{display:none}}
@media(max-width:650px){
  .watchlist-wheel-toggle>span { display:none; }
  .header-actions { gap:6px; }
  .header-actions .watchlist-wheel-toggle { min-width:34px; padding:8px; }
  .watchlist-wheel-dialog { padding:20px; width:calc(100vw - 20px); }
  .watchlist-wheel-layout { grid-template-columns:minmax(0,1fr); gap:20px; }
  .watchlist-wheel-stage { max-width:340px; justify-self:center; }
  .watchlist-wheel-result { padding:12px; gap:12px; }
}