/*
 * Hollywood Link — “Premiere” luxury cinema theme (body.theme-theater only).
 * Hollywood (retro) theme is unchanged; all rules are scoped below.
 */

/* --- Auditorium: deep house + seat row; disable global retro vignette overlay --- */
body.theme-theater::after {
  display: none;
}

/* Seat photo on its own layer; mask fades ceiling/void at top while keeping most of the seat backs visible. */
body.theme-theater::before {
  content: "";
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  width: 100%;
  height: var(--theater-seat-strip-h, min(38vh, 360px));
  background-image: url("/images/theater-seats-footer.png");
  background-position: center bottom;
  background-repeat: no-repeat;
  /* Full viewport width; height follows aspect ratio (may clip above the box; position bottom keeps seats) */
  background-size: 100% auto;
  pointer-events: none;
  z-index: 0;
  /* Tiny void at top; gentle ramp so almost the full seat row reads */
  mask-image: linear-gradient(to bottom, transparent 0%, transparent 14%, black 95%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, transparent 14%, black 95%);
  mask-size: 100% 100%;
  -webkit-mask-size: 100% 100%;
}

body.theme-theater {
  /* “Screen” width: comfortable on phones; widens toward a cinematic aspect on larger viewports */
  --theater-screen-max: 42rem;
  --theater-seat-strip-h: min(38vh, 360px);
  font-family: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 1.08rem;
  line-height: 1.55;
  color: rgba(245, 240, 232, 0.92);
  background-color: #060504;
  /* Order: ceiling haze, ceiling lamp, floor spill (under seats), deep house. Seat art is ::before + mask. */
  background-image:
    linear-gradient(180deg, rgba(255, 248, 235, 0.045) 0%, transparent 24%),
    radial-gradient(ellipse 95% 42% at 50% 0%, rgba(180, 140, 95, 0.09), transparent 52%),
    radial-gradient(ellipse 110% 75% at 50% 100%, rgba(120, 78, 62, 0.5) 0%, rgba(28, 18, 14, 0.88) 38%, transparent 62%),
    linear-gradient(180deg, #161210 0%, #0c0a08 42%, #050403 100%);
  background-position:
    center top,
    center top,
    center bottom,
    center center;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
  background-size:
    100% 38%,
    100% 32%,
    100% min(48vh, 420px),
    100% 100%;
}

@media (prefers-reduced-motion: reduce) {
  body.theme-theater {
    --theater-seat-strip-h: min(34vh, 320px);
    background-size:
      100% 38%,
      100% 32%,
      100% min(44vh, 380px),
      100% 100%;
  }
}

@media (min-width: 40rem) {
  body.theme-theater:not(.splash-body) {
    --theater-screen-max: min(94vw, 54rem);
  }
}

@media (min-width: 64rem) {
  body.theme-theater:not(.splash-body) {
    --theater-screen-max: min(90vw, 72rem);
  }
}

/* --- Screen stack: nav + main + site footer read as one illuminated panel --- */
body.theme-theater:not(.splash-body) {
  /* Pad past the fixed seat strip so the “screen” stack ends above the seats (no overlap). */
  padding-bottom: calc(var(--theater-seat-strip-h) + 1.5rem);
}

body.theme-theater:not(.splash-body) header.site {
  position: relative;
  z-index: 3;
  max-width: var(--theater-screen-max);
  width: calc(100% - 1.5rem);
  margin: 0.85rem auto 0;
  padding: 0.6rem 1rem 0.7rem;
  border: none;
  border-radius: 16px 16px 0 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.65) 0%, transparent 55%),
    linear-gradient(180deg, #fffcf7 0%, #f3eee6 100%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.55),
    0 0 0 2px rgba(24, 20, 16, 0.28),
    0 0 48px rgba(255, 220, 170, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  border-bottom: 1px solid rgba(24, 20, 16, 0.1);
}

body.theme-theater:not(.splash-body) header.site::before {
  display: none;
}

body.theme-theater:not(.splash-body) main#main-content {
  position: relative;
  z-index: 2;
  max-width: var(--theater-screen-max);
  width: calc(100% - 1.5rem);
  margin: 0 auto;
  padding: 1.15rem 1.1rem 1.85rem;
  color: var(--body-text);
  color-scheme: light;
  background:
    radial-gradient(ellipse 85% 55% at 50% 0%, rgba(255, 255, 255, 0.55), transparent 58%),
    linear-gradient(180deg, #f3eee6 0%, #ebe4db 48%, #e5ded4 100%);
  border-left: 1px solid rgba(24, 20, 16, 0.12);
  border-right: 1px solid rgba(24, 20, 16, 0.12);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0 2px rgba(24, 20, 16, 0.22),
    0 8px 40px rgba(0, 0, 0, 0.38);
}

body.theme-theater:not(.splash-body) .site-footer {
  position: relative;
  z-index: 2;
  max-width: var(--theater-screen-max);
  width: calc(100% - 1.5rem);
  margin: 0 auto 0.5rem;
  padding: 0.95rem 1rem 1.15rem;
  border: none;
  border-radius: 0 0 16px 16px;
  border-top: 1px solid rgba(24, 20, 16, 0.1);
  color: var(--body-text);
  color-scheme: light;
  background: linear-gradient(180deg, #e3dcd2 0%, #d8d0c5 100%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.35),
    0 0 0 2px rgba(24, 20, 16, 0.2),
    0 16px 48px rgba(0, 0, 0, 0.42);
}

body.theme-theater:not(.splash-body) .site-footer-inner {
  color: rgba(37, 34, 32, 0.82);
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.98rem;
}

body.theme-theater:not(.splash-body) .site-footer-inner a {
  color: var(--link);
}

body.theme-theater:not(.splash-body) .site-footer-inner a:hover {
  color: var(--link-hover);
}

body.theme-theater .theme-switcher-label {
  color: rgba(37, 34, 32, 0.55);
}

body.theme-theater .theme-switcher-label-text,
body.theme-theater .theme-switcher-select {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

body.theme-theater .theme-switcher-select {
  border-radius: 6px;
  border: 1px solid rgba(24, 20, 16, 0.2);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* --- Typography (elegant display + readable UI) --- */
body.theme-theater .brand {
  font-family: "Cormorant Garamond", "Palatino Linotype", Palatino, Georgia, serif;
  font-weight: 600;
  font-size: clamp(0.95rem, 2.4vw, 1.15rem);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #2a2420;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

body.theme-theater .brand:hover {
  color: var(--link-hover);
}

body.theme-theater h1,
body.theme-theater h2 {
  font-family: "Cormorant Garamond", "Palatino Linotype", Palatino, Georgia, serif;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.02em;
  line-height: 1.28;
  text-shadow: none;
}

body.theme-theater h1 {
  font-size: clamp(1.35rem, 3.2vw, 1.85rem);
  color: var(--ink);
}

body.theme-theater h2 {
  font-size: clamp(1.05rem, 2.4vw, 1.4rem);
  color: var(--ink-dim);
}

body.theme-theater .card h1,
body.theme-theater .card h2 {
  text-shadow: none;
}

body.theme-theater .card h2 {
  color: var(--ink-dim);
}

body.theme-theater header.site nav a,
body.theme-theater header.site nav button {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: none;
  border-radius: 6px;
}

body.theme-theater header.site nav a {
  color: var(--link);
  border: 1px solid transparent;
}

body.theme-theater header.site nav a:hover {
  color: var(--link-hover);
  background: rgba(10, 79, 99, 0.06);
}

body.theme-theater header.site nav button {
  color: var(--body-text);
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(24, 20, 16, 0.15);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

body.theme-theater header.site nav button:hover {
  background: rgba(255, 255, 255, 0.85);
}

body.theme-theater .language-switcher {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
}

body.theme-theater .language-switcher > summary {
  border-radius: 8px;
  border: 1px solid rgba(24, 20, 16, 0.18);
  background: linear-gradient(180deg, #fff 0%, #f2ebe3 100%);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07);
}

body.theme-theater .language-switcher-list a {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

/* --- Cards & panels on the “screen” --- */
body.theme-theater .card {
  border-radius: 10px;
  border: 1px solid rgba(24, 20, 16, 0.12);
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.5) 0%, transparent 42%),
    linear-gradient(180deg, #fffcf9 0%, #f5f0e8 100%);
  box-shadow:
    0 2px 14px rgba(0, 0, 0, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

body.theme-theater .card::before {
  display: none;
}

body.theme-theater .card::after {
  display: none;
}

/* --- Forms --- */
body.theme-theater label {
  color: var(--ink-dim);
}

body.theme-theater input[type="text"],
body.theme-theater input[type="password"],
body.theme-theater input[type="email"] {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 1.05rem;
  border-radius: 8px;
  border: 1px solid rgba(24, 20, 16, 0.2);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}

body.theme-theater input[type="file"] {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

body.theme-theater code {
  font-family: ui-monospace, "Cascadia Code", monospace;
  font-size: 1em;
}

/* --- Buttons: charcoal + champagne trim (AA on screen) --- */
body.theme-theater button,
body.theme-theater .button {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
  border-radius: 8px;
  text-shadow: none;
  border: 1px solid rgba(201, 164, 58, 0.45);
  background: linear-gradient(180deg, #3a3430 0%, #2a2420 40%, #1c1916 100%);
  color: #faf6f0;
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body.theme-theater button:hover,
body.theme-theater .button:hover {
  color: #fff;
  border-color: rgba(232, 200, 120, 0.65);
  background: linear-gradient(180deg, #454039 0%, #322c28 45%, #242019 100%);
}

body.theme-theater button.secondary,
body.theme-theater .button.secondary {
  background: linear-gradient(180deg, #fffcf9 0%, #ebe4db 100%);
  color: var(--ink);
  border: 1px solid rgba(24, 20, 16, 0.18);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

body.theme-theater button.secondary:hover,
body.theme-theater .button.secondary:hover {
  color: var(--ink);
  background: linear-gradient(180deg, #fff 0%, #f2ebe4 100%);
}

/* --- Tables --- */
body.theme-theater table {
  border-radius: 8px;
  border: 1px solid rgba(24, 20, 16, 0.14);
  background: rgba(255, 255, 255, 0.75);
}

body.theme-theater th,
body.theme-theater td {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

body.theme-theater th {
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* --- Flash & home / play UI that used pixel fonts --- */
body.theme-theater .flash-error,
body.theme-theater .flash-info {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.95rem;
  line-height: 1.5;
  text-shadow: none;
}

body.theme-theater .home-zone-title,
body.theme-theater .home-zone-title-label {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.02em;
  text-shadow: none;
}

/* Base .home-big-choice-title is 0.52rem (pixel); size up so it clearly leads the card vs 1.15rem desc + stats */
body.theme-theater .home-big-choice-title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.02em;
  text-shadow: none;
  font-size: clamp(1.22rem, 3.2vw, 1.48rem);
  line-height: 1.15;
}

/* Step 4 Easy/Hard: one-word titles need extra scale so they don’t look like tiny captions vs the sans description */
body.theme-theater .home-choice-grid--mode .home-big-choice-title {
  font-size: clamp(1.4rem, 4.2vw, 1.78rem);
  line-height: 1.1;
}

body.theme-theater .home-zone-title {
  font-size: clamp(0.95rem, 2.2vw, 1.15rem);
  line-height: 1.35;
}

body.theme-theater .home-step-num {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  border-radius: 8px;
  background: linear-gradient(180deg, #3a3430 0%, #2a2420 100%);
  color: #faf6f0;
  border: 1px solid rgba(201, 164, 58, 0.4);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

body.theme-theater .home-zone--active {
  background: rgba(255, 255, 255, 0.35);
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(201, 164, 58, 0.25);
}

/* Sibling steps share a heavy border-top from style.css; rounded “active” panels read as one block — add air between steps */
body.theme-theater .card.home-onboarding > .home-zone + .home-zone {
  margin-top: 1rem;
}

/* Slightly softer step dividers on the lit screen (still visible, less VGA slab) */
body.theme-theater .card.home-onboarding > .home-zone {
  border-top-width: 1px;
  border-top-color: rgba(24, 20, 16, 0.14);
}

/* Optional email CTA: full panel width + no dashed “VGA” divider (style.css uses 36rem + border-top dashed) */
body.theme-theater .home-email-invite {
  max-width: none;
  width: 100%;
  border-top: none;
  padding-top: 1rem;
}

body.theme-theater .home-email-invite-form input[type="email"] {
  max-width: 100%;
  width: 100%;
}

body.theme-theater .home-big-choice-desc,
body.theme-theater .home-zone-hint,
body.theme-theater .muted,
body.theme-theater .play-session-stats {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

/* Stats line + nested spans (Thymeleaf puts the sentence on inner spans without classes) */
body.theme-theater .home-big-choice .home-big-choice-remaining,
body.theme-theater .home-big-choice .home-big-choice-remaining *,
body.theme-theater .home-big-choice .home-big-choice-remaining-score,
body.theme-theater .home-big-choice .home-big-choice-remaining-score span,
body.theme-theater .home-big-choice .home-big-choice-remaining-extra,
body.theme-theater .home-big-choice .home-big-choice-remaining-extra span {
  font-family: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-variant-numeric: tabular-nums;
}

body.theme-theater .error-page-eyebrow,
body.theme-theater .error-page-code,
body.theme-theater .error-page-title {
  font-family: "Cormorant Garamond", Georgia, serif;
  text-shadow: none;
}

body.theme-theater .error-page-eyebrow {
  font-size: 0.65rem;
  letter-spacing: 0.16em;
}

body.theme-theater .error-page-code {
  font-size: clamp(1.5rem, 5vw, 2.1rem);
}

/* --- Splash: same auditorium; hero sits inside a lit frame --- */
body.theme-theater.splash-body {
  --theater-screen-max: 40rem;
  --theater-seat-strip-h: min(36vh, 340px);
  /* Keep splash content above the fixed seat strip */
  padding-bottom: calc(var(--theater-seat-strip-h) + 1.25rem);
  background-color: #060504;
  background-image:
    linear-gradient(180deg, rgba(255, 248, 235, 0.04) 0%, transparent 22%),
    radial-gradient(ellipse 110% 75% at 50% 100%, rgba(120, 78, 62, 0.48) 0%, rgba(28, 18, 14, 0.9) 40%, transparent 62%),
    linear-gradient(180deg, #14110f 0%, #0a0807 100%);
  background-position: center top, center bottom, center center;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-size: 100% 32%, 100% min(46vh, 400px), 100% 100%;
}

@media (min-width: 40rem) {
  body.theme-theater.splash-body {
    --theater-screen-max: min(94vw, 52rem);
  }
}

@media (min-width: 64rem) {
  body.theme-theater.splash-body {
    --theater-screen-max: min(90vw, 68rem);
  }
}

body.theme-theater .splash-stage {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem min(1.25rem, 4vw) 1.25rem;
  background: transparent;
  border: none;
  box-shadow: none;
}

body.theme-theater .splash-art {
  max-height: min(62vh, 78dvh);
  border-radius: 12px;
  box-shadow:
    0 0 0 2px rgba(24, 20, 16, 0.35),
    0 0 0 4px rgba(201, 164, 58, 0.25),
    0 0 60px rgba(255, 220, 180, 0.12),
    0 24px 64px rgba(0, 0, 0, 0.55);
}

body.theme-theater .splash-reviews {
  max-width: var(--theater-screen-max);
  margin: 0 auto;
  padding: 1.25rem 1.25rem 1rem;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(180deg, #f7f4ef 0%, #ebe4db 100%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.5),
    0 0 0 2px rgba(24, 20, 16, 0.15),
    0 -8px 40px rgba(0, 0, 0, 0.25);
}

body.theme-theater .splash-review {
  color: var(--ink-dim);
  border-bottom-color: rgba(24, 20, 16, 0.1);
}

body.theme-theater .splash-review p {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.28rem;
  font-style: italic;
  color: var(--ink);
}

body.theme-theater .splash-review footer {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 1rem;
  color: var(--ink-dim);
}

body.theme-theater .splash-review-outlet {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6b4e18;
}

body.theme-theater .splash-footer {
  background: linear-gradient(180deg, #e3dcd2 0%, #cfc6b8 100%);
  border-top: 1px solid rgba(24, 20, 16, 0.12);
}

body.theme-theater .splash-tagline {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(0.95rem, 2.8vw, 1.2rem);
  letter-spacing: 0.06em;
  color: var(--ink);
  text-shadow: none;
}

body.theme-theater .splash-a11y {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 1.05rem;
}

@media (prefers-reduced-motion: reduce) {
  body.theme-theater .splash-tagline--flaky {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

/* --- Play countdown overlay (full-bleed; sits above screen metaphor) --- */
body.theme-theater .play-countdown-overlay {
  background: rgba(4, 3, 2, 0.94);
  box-shadow: inset 0 0 0 3px rgba(201, 164, 58, 0.32);
}

body.theme-theater .play-countdown-pretitle {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  color: #e8d49a;
}

body.theme-theater .play-countdown-number {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  color: #fffaf3;
  text-shadow:
    0 0 56px rgba(255, 210, 150, 0.22),
    0 2px 0 rgba(0, 0, 0, 0.45);
}

body.theme-theater .play-countdown-sub {
  font-family: "Source Sans 3", system-ui, sans-serif;
  color: rgba(245, 238, 228, 0.9);
}

body.theme-theater .timer {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  border-radius: 10px;
  border: 1px solid rgba(201, 164, 58, 0.45);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

body.theme-theater .clue {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.35rem;
  border-left-width: 4px;
  border-radius: 0 8px 8px 0;
}

body.theme-theater .play-feedback-banner {
  border-radius: 10px;
  border-width: 1px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

body.theme-theater .play-feedback-heading,
body.theme-theater .play-answer-feedback-track {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
}

body.theme-theater .play-answer-feedback-track {
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.theme-theater label.play-mcq-option span {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

body.theme-theater .avatar-name {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.theme-theater tr:nth-child(even) td {
  background: rgba(24, 20, 16, 0.04);
}

/* --- Home “Your stats” block: explicit sans body + display caps for mode --- */
body.theme-theater .home-your-stats-verify,
body.theme-theater .home-your-stats-line {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

/* MOVIE LINK / ACTOR LINK: beat .home-your-stats-mode { Press Start 2P } from style.css */
body.theme-theater .card.home-your-stats strong.home-your-stats-mode {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.35;
}

body.theme-theater .home-your-stats-table {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

body.theme-theater .home-your-stats-table th {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  background: transparent;
}

body.theme-theater .home-your-stats-table td {
  font-family: "Source Sans 3", system-ui, sans-serif;
}

/* <kbd> in i18n strings (e.g. “Press Enter”) — was VT323 + chunky retro border */
body.theme-theater kbd {
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.88em;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
  padding: 0.14em 0.48em 0.1em;
  border: 1px solid rgba(24, 20, 16, 0.22);
  border-radius: 5px;
  background: linear-gradient(180deg, #ffffff 0%, #ebe4db 100%);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.85),
    0 1px 3px rgba(0, 0, 0, 0.07);
  color: var(--ink);
}

/* Step 4 fieldset legends were still Press Start */
body.theme-theater fieldset.quiz-fieldset legend {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: none;
  line-height: 1.4;
  color: var(--ink-dim);
}

/* Guest “continue on another device” strip: base CSS uses parchment tones for dark page — illegible on light screen */
body.theme-theater .home-continue-footer.muted {
  color: var(--ink-dim);
}

body.theme-theater .home-continue-footer .muted {
  color: rgba(37, 34, 32, 0.78);
}