:root {
  --hero-bg: #27201b;
  --hero-ink: #fffaf2;
  --hero-muted: rgba(255, 250, 242, .72);
  --hero-button: #efc34d;
  --hero-button-ink: #221c14;
  --hero-line: rgba(255, 250, 242, .18);
  --paper: #fffaf4;
  --ink: #28211d;
  --ink-raised: #372d27;
  --ink-soft: #4a3c34;
  --mist: #d7cec4;
  --muted: #8b7e73;
  --line: rgba(255, 250, 244, .18);
  --acid: var(--hero-button);
  --acid-ink: var(--hero-button-ink);
  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans SC", sans-serif;
  --mono: "SFMono-Regular", "Cascadia Mono", "PingFang SC", monospace;
}

html, body { min-height: 100%; margin: 0; background: #151312; font-family: var(--sans); }
body > .candidate-loader { min-height: 100vh; display: grid; place-items: center; padding: 24px; color: #fffaf4; background: var(--hero-bg); text-align: center; }
body > .candidate-loader p { max-width: 28rem; margin: 0; line-height: 1.7; }
body > .candidate-loader.is-error { color: #ffd9d1; }
body > iframe { width: 100%; min-height: 100vh; display: block; border: 0; background: var(--hero-bg); }
body.is-loading > iframe { display: none; }
body:not(.is-loading) > .candidate-loader { display: none; }

.candidate-shell { background: var(--hero-bg); }
.candidate-shell i[data-lucide] { display: none; }
.candidate-shell .app-header { position: relative; z-index: 4; }
.candidate-shell .brand-mark { color: var(--hero-button-ink); background: var(--hero-button); }
.candidate-shell .brand { color: var(--hero-ink); }
.candidate-shell .header-note { color: var(--hero-muted); }
.candidate-shell .setup-screen { position: relative; min-height: calc(100vh - 90px); align-items: flex-start; padding: 36px 0 72px; overflow: visible; }
.candidate-shell .setup-layout { position: relative; width: min(1140px, 100%); min-height: 620px; padding: 64px 0 0; text-align: left; }
.candidate-shell .setup-layout > .eyebrow,
.candidate-shell .setup-layout > h1,
.candidate-shell .setup-layout > p,
.candidate-shell .setup-card { position: relative; z-index: 2; width: min(590px, 56%); margin-left: 0; margin-right: 0; }
.candidate-shell .setup-layout > .eyebrow { color: var(--hero-button); }
.candidate-shell .setup-layout > h1 { max-width: 560px; margin-top: 12px; color: var(--hero-ink); font-family: Georgia, "Songti SC", "STSong", serif; font-size: clamp(42px, 5.3vw, 72px); line-height: 1.04; text-wrap: pretty; }
.candidate-shell .setup-layout > p { color: var(--hero-muted); font-size: 16px; }
.candidate-shell .setup-card { margin-top: 30px; padding: 22px; background: color-mix(in srgb, var(--hero-bg) 78%, #ffffff 22%); border-color: var(--hero-line); box-shadow: 0 26px 70px rgba(0, 0, 0, .18); }
.candidate-shell .mode-option { background: color-mix(in srgb, var(--hero-bg) 72%, #ffffff 28%); }
.candidate-shell .mode-option.active { color: var(--hero-ink); background: var(--hero-button); border-color: var(--hero-button); }
.candidate-shell .mode-option.active span { color: color-mix(in srgb, var(--hero-button-ink) 76%, transparent); }
.candidate-shell .question-box { background: color-mix(in srgb, var(--hero-bg) 85%, #ffffff 15%); }
.candidate-shell .question-input { color: var(--hero-ink); }
.candidate-shell .question-input::placeholder { color: var(--hero-muted); }
.candidate-shell .goal-chip.active,
.candidate-shell .primary-button { color: var(--hero-button-ink); background: var(--hero-button); border-color: var(--hero-button); }
.candidate-shell .secondary-button,
.candidate-shell .control-button { color: var(--hero-ink); background: color-mix(in srgb, var(--hero-bg) 70%, #ffffff 30%); border-color: var(--hero-line); }
.candidate-shell .theme-hero { position: absolute; top: 0; right: 0; width: min(51%, 550px); min-height: 620px; display: grid; place-items: center; z-index: 1; pointer-events: none; }
.candidate-shell .theme-hero::before { content: ""; position: absolute; inset: 6% 4%; border: 1px solid var(--hero-line); border-radius: 50% 48% 45% 52%; transform: rotate(-4deg); }
.candidate-shell .theme-hero-copy { position: absolute; top: 4%; right: 4%; z-index: 2; width: 208px; padding: 14px 0; color: var(--hero-ink); text-align: right; }
.candidate-shell .theme-hero-copy span { display: block; color: var(--hero-muted); font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.candidate-shell .theme-hero-copy strong { display: block; margin-top: 8px; font-family: Georgia, "Songti SC", serif; font-size: 24px; line-height: 1.2; }
.candidate-shell .theme-hero-copy p { margin: 8px 0 0; color: var(--hero-muted); font-size: 12px; line-height: 1.55; }
.candidate-shell .theme-hero-start { min-height: 42px; margin-top: 15px; padding: 0 14px; border: 1px solid var(--hero-button); border-radius: 7px; color: var(--hero-button-ink); background: var(--hero-button); font-weight: 800; pointer-events: auto; }
.candidate-shell .theme-hero-start:hover { transform: translateY(-1px); }
.candidate-shell .theme-hero img { position: relative; z-index: 1; width: min(92%, 520px); height: 540px; object-fit: contain; filter: saturate(.96) contrast(.98); }
.candidate-shell .practice-screen,
.candidate-shell .report-screen,
.candidate-shell .history-screen { background: var(--hero-bg); }
.candidate-shell .practice-stage,
.candidate-shell .report-card,
.candidate-shell .history-wrap { border: 1px solid color-mix(in srgb, var(--hero-bg) 18%, #ffffff 82%); box-shadow: 0 30px 78px rgba(0, 0, 0, .18); }
.candidate-shell .stage-timer { color: var(--ink); }
.candidate-shell .timer-progress span { background: var(--hero-button); }
.candidate-shell .transcript:focus { border-color: var(--hero-button); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hero-button) 38%, transparent); }
.candidate-shell .quick-menu-toggle { color: var(--hero-button-ink); background: var(--hero-button); border-color: var(--hero-button); }
.candidate-shell button:focus-visible,
.candidate-shell input:focus-visible,
.candidate-shell textarea:focus-visible { outline: 3px solid var(--hero-button); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .candidate-shell *, .candidate-shell *::before, .candidate-shell *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

@media (max-width: 720px) {
  .candidate-shell .setup-screen { padding-top: 8px; }
  .candidate-shell .setup-layout { min-height: 0; padding-top: 20px; }
  .candidate-shell .setup-layout > .eyebrow,
  .candidate-shell .setup-layout > h1,
  .candidate-shell .setup-layout > p,
  .candidate-shell .setup-card { width: 100%; }
  .candidate-shell .setup-layout > h1 { font-size: clamp(40px, 13vw, 57px); }
  .candidate-shell .theme-hero { position: relative; top: auto; right: auto; width: 100%; min-height: 290px; margin: 8px 0 20px; }
  .candidate-shell .theme-hero-copy { top: 0; right: 2%; width: 176px; }
  .candidate-shell .theme-hero-copy strong { font-size: 19px; }
  .candidate-shell .theme-hero img { width: min(88%, 360px); height: 282px; }
  .candidate-shell .setup-card { margin-top: 0; }
}
