/* Opt-in site theme. Editor and host pages do not load this stylesheet.
   Game canvases and state-dependent game controls keep their own colours. */
body[data-site-theme][data-site-surface] {
  --site-bg: #163552;
  --site-panel: #234967;
  --site-raised: #2c587c;
  --site-line: #6385a5;
  --site-text: #f7fbff;
  --site-muted: #cfdeed;
  --site-gold: #ffd75b;
  --site-radius: 24px;
  --site-shadow: 0 18px 48px #07172940;
  --bg: var(--site-bg); --panel: var(--site-panel); --line: var(--site-line); --muted: var(--site-muted);
  --ui-bg: var(--site-bg); --ui-panel: var(--site-panel); --ui-muted: var(--site-muted); --ui-line: var(--site-line);
  --premium-bg: var(--site-bg); --premium-panel: var(--site-panel); --premium-muted: var(--site-muted);
  color: var(--site-text);
  background: radial-gradient(ellipse 65% 45% at 8% 0,#3977ac55,transparent 74%),var(--site-bg);
  font-family: Inter,"Segoe UI",system-ui,sans-serif;
  min-height: 100vh;
  color-scheme: dark;
}
body[data-site-theme] :where(a,button,input,select,textarea,summary):focus-visible {
  outline: 2px solid var(--site-gold);
  outline-offset: 3px;
}
body[data-site-theme][data-site-surface] :is(.auth-header,.site-header,.topbar) {
  border-bottom: 1px solid var(--site-line);
  background: #183b5bee;
  color: var(--site-text);
}
body[data-site-theme][data-site-surface] .brand { color: var(--site-text); }
/* Header background spans the viewport; its contents follow the page grid. */
body[data-site-theme][data-site-surface="marketing"] .site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  width: 100%;
  max-width: none;
  min-height: 76px;
  height: auto;
  margin: 0;
  padding: 12px max(20px,calc((100% - 1200px)/2));
  border-radius: 0;
  border-top: 0;
  border-inline: 0;
  backdrop-filter: blur(16px);
}
body[data-site-theme][data-site-surface="marketing"] #site-nav :is(a,button,summary) {
  font-size: 16px;
  font-weight: 650;
  line-height: 1.25!important;
  letter-spacing: 0;
}
body[data-site-theme][data-site-surface="account"] :is(h1,h2,h3),
body[data-site-theme][data-site-surface="status"] :is(h1,h2,h3) {
  color: var(--site-text);
  letter-spacing: -.035em;
}
body[data-site-theme][data-site-surface="account"] :is(.auth-card,.legal-card,.card,.panel,.login-card,dialog),
body[data-site-theme][data-site-surface="status"] main {
  border: 1px solid var(--site-line)!important;
  border-radius: var(--site-radius)!important;
  background: linear-gradient(145deg,var(--site-raised),var(--site-panel))!important;
  color: var(--site-text)!important;
  box-shadow: var(--site-shadow)!important;
}
body[data-site-theme][data-site-surface="account"] :is(.auth-card,.legal-card,.card,.panel,.login-card) :is(p,.muted,.hint,.sub,.help,small),
body[data-site-theme][data-site-surface="status"] p { color: var(--site-muted); }
body[data-site-theme][data-site-surface="account"] :is(.error,.project-delete-error,.security-message.error),
body[data-site-theme][data-site-surface="account"] .message.error { color: #ffbac3; }
body[data-site-theme][data-site-surface="account"] :is(button,.button,.btn):not(.secondary):not(.danger):not(.button-link):not(.support-row):not(.bug-fab),
body[data-site-theme][data-site-surface="status"] main a {
  background: var(--site-gold)!important;
  border: 1px solid var(--site-gold)!important;
  color: #142438!important;
  border-radius: 12px;
  font-weight: 800;
  box-shadow: 0 8px 24px #ffd75b16!important;
}
/* Support list entries and the report shortcut are secondary blue surfaces. */
body[data-site-theme][data-site-surface="account"] button.support-row {
  background: #193c5a!important;
  color: #f7fbff!important;
  border-color: #6385a5!important;
  box-shadow: none!important;
}
body[data-site-theme][data-site-surface="account"] button.support-row small { color: #cfdeed; }
body[data-site-theme][data-site-surface="account"] button.support-row.new { border-color: #ffd75b!important; }
body[data-site-theme][data-site-surface="account"] button.support-row:hover { background: #285878!important; }
body[data-site-theme] button.bug-fab {
  background: #305f87!important;
  color: #fff!important;
  border-color: #7a9fbe!important;
  box-shadow: 0 4px 12px #07172940!important;
  opacity: 1;
}
body[data-site-theme][data-site-surface="account"] :is(.secondary,.site-home-button) {
  background: #305f87!important;
  color: var(--site-text)!important;
  border: 1px solid var(--site-line)!important;
}
body[data-site-theme][data-site-surface="account"] :is(button,.button,.btn).danger {
  background: #a93146!important;
  border-color: #d54d63!important;
  color: #fff!important;
}
body[data-site-theme][data-site-surface="account"] :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]),
body[data-site-theme][data-site-surface="player"] :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]) {
  box-sizing: border-box;
  max-width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  border: 1px solid var(--site-line)!important;
  border-radius: 12px!important;
  background: #153650!important;
  color: var(--site-text)!important;
  font: inherit;
}
body[data-site-theme] :is(input[type="checkbox"],input[type="radio"]) { accent-color: var(--site-gold); }
body[data-site-theme][data-site-surface="account"] :is(input,textarea)::placeholder,
body[data-site-theme][data-site-surface="player"] :is(input,textarea)::placeholder { color: var(--site-muted); }
body[data-site-theme][data-site-surface="account"] textarea { width: 100%; min-height: 130px; resize: vertical; }
body[data-site-theme][data-site-surface="account"] :is(.links,.login-links,.legal-card) a:not(.button):not(.btn) { color: #91beff; }
body[data-site-theme][data-site-surface="status"] { margin: 0; padding: 24px; box-sizing: border-box; }
body[data-site-theme][data-site-surface="status"] main { width: min(540px,100%); padding: clamp(24px,5vw,40px); box-sizing: border-box; }
body[data-site-theme][data-site-surface="status"] main a { display: inline-flex; align-items: center; min-height: 46px; padding: 0 18px; margin-top: 12px; text-decoration: none; }
body[data-site-theme][data-site-surface="status"] p { line-height: 1.6; }
body[data-site-theme][data-site-surface="account"] dialog::backdrop { background: #020914b8; backdrop-filter: blur(6px); }

body[data-site-theme][data-site-surface="marketing"] :is(.steps article,.corp-grid article,.corp-showcase,.corp-custom,.cta,.contact form,#published-reviews article,.site-auth-dialog) {
  background: linear-gradient(145deg,var(--site-raised),var(--site-panel))!important;
  border-color: var(--site-line)!important;
  border-radius: var(--site-radius);
  box-shadow: var(--site-shadow);
}
body[data-site-theme][data-site-surface="marketing"] :is(.corp-cards article,.corp-custom li,.form-disclosure>summary,.mobile-auth-menu,.auth-dialog-secondary,.auth-dialog-close) {
  background: #305f87;
  border-color: var(--site-line);
  color: var(--site-text);
}
body[data-site-theme][data-site-surface="marketing"] :is(.contact,.join-strip,.site-auth-dialog) :is(input,select,textarea):not([type="checkbox"]) {
  background: #153650!important;
  border-color: var(--site-line)!important;
  color: var(--site-text)!important;
}
body[data-site-theme][data-site-surface="marketing"] .join-strip { background: linear-gradient(110deg,#285878,#316d9c); border-color: var(--site-line); }
body[data-site-theme][data-site-surface="marketing"] .button { background: var(--site-gold); color: #142438; box-shadow: 0 8px 24px #ffd75b16; }
body[data-site-theme][data-site-surface="marketing"] .interface-preview { background: var(--site-panel); border-color: var(--site-line); }
body[data-site-theme][data-site-surface="marketing"] .interface-preview figcaption { background: linear-gradient(to right,transparent 0,var(--site-panel) 94px); }
body[data-site-theme][data-site-surface="marketing"] :is(.auth-dialog-switch,.auth-dialog-email) { background: #193c5a; border-color: var(--site-line); }
body[data-site-theme][data-site-surface="marketing"] :is(.feature-media-copy p,.hero-facts span,footer,footer small) { color: var(--site-muted); }
body[data-site-theme][data-site-surface="account"] :is(.metric:not(.alert),.system-item,.audit-item) { background: var(--site-panel); border-color: var(--site-line); }
body[data-site-theme][data-site-surface="account"] th { color: var(--site-muted); background: #193c5a; }

/* Player chrome only: the buzzer, timer progress and bonus states stay semantic. */
body[data-site-theme][data-site-surface="player"] {
  --site-bg: #245170;
  --site-panel: #326582;
  --site-raised: #3d7696;
  --site-line: #87adc7;
  --site-muted: #dce9f3;
  --ink: var(--site-text); --muted: var(--site-muted); --card: var(--site-panel); --line: var(--site-line);
  background: radial-gradient(ellipse 75% 42% at 8% 0,#5b97bd66,transparent 72%),var(--site-bg);
}
body[data-site-theme][data-site-surface="player"] :is(.screen,.modal-card,.auction-card,.auth-card) {
  background: linear-gradient(145deg,var(--site-raised),var(--site-panel))!important;
  color: var(--site-text)!important;
  border: 1px solid var(--site-line)!important;
  border-radius: var(--site-radius)!important;
  box-shadow: var(--site-shadow)!important;
}
body[data-site-theme][data-site-surface="player"] :is(.stage,.leaders,.controls,.sound-check,.captain-member-row,.cat-choice-btn,.cat-price-btn,.settings-btn) {
  background: var(--site-panel);
  color: var(--site-text);
  border-color: var(--site-line);
}
body[data-site-theme][data-site-surface="player"] :is(.modal-card h3,.auth-card h3,.auction-card h3,#stage-line,.stage-line,.captain-member-name) { color: var(--site-text); }
body[data-site-theme][data-site-surface="player"] :is(.modal-card p,.auth-card p,.auction-row,#round-line,.round-line,.captain-member-role) { color: var(--site-muted); }
body[data-site-theme][data-site-surface="player"] :is(.score-pill,#bid-status) { background: #3f7698; color: var(--site-gold); }
body[data-site-theme][data-site-surface="player"] .score-pill b { color: var(--site-gold); }
body[data-site-theme][data-site-surface="player"] .score-pill b.negative { color: #ffb9c5; }
body[data-site-theme][data-site-surface="player"] :is(.score-rank,.auth-field label) { color: var(--site-muted); }
body[data-site-theme][data-site-surface="player"] #teamJoinFields { background: #193c5a; border-color: var(--site-line); }
body[data-site-theme][data-site-surface="player"] .auth-join { background: var(--site-gold); color: #142438; }
body[data-site-theme][data-site-surface="player"] .auth-cancel { background: #3f7698; color: var(--site-text); }
body[data-site-theme][data-site-surface="player"] :is(.leader,.chip) { background: #3f7698; color: var(--site-text); }
body[data-site-theme][data-site-surface="player"] .controls button { background: #3f7698; color: var(--site-text); border-color: var(--site-line); }
body[data-site-theme][data-site-surface="player"] .controls button.active { background: var(--site-gold); color: #142438; }
body[data-site-theme][data-site-surface="player"] #actionBtn.action-btn { border-radius: 50%!important; }
body[data-site-theme][data-site-surface="player"] .timer-ring::before { background: var(--site-panel); }
body[data-site-theme][data-site-surface="player"] .leaders :is(.leader,.leader-row) { border-color: var(--site-line); }

/* Display content is authored by the host; only surrounding chrome is themed. */
body[data-site-theme][data-site-surface="display"] :is(.empty-card,.media-control-panel) {
  background: var(--site-panel);
  color: var(--site-text);
  border-color: var(--site-line);
}
body[data-site-theme][data-site-surface="display"] .topbar {
  background: transparent!important;
  border-color: transparent!important;
  box-shadow: none!important;
  backdrop-filter: none!important;
}
body[data-site-theme][data-site-surface="display"] .footer-note { color: var(--site-muted); }
body[data-site-theme][data-site-surface="display"] .player-stage { background: linear-gradient(145deg,var(--site-raised),var(--site-panel)); border-color: var(--site-line); }
@media(max-width:620px) {
  body[data-site-theme][data-site-surface="marketing"] .site-header {
    position: relative;
    top: auto;
    padding-inline: 16px;
  }
  body[data-site-theme][data-site-surface="marketing"] .mobile-menu-home {
    color: #ffffff;
    border: 1px solid var(--site-line);
    background: #214d72;
  }
  body[data-site-theme][data-site-surface="account"] .auth-header { gap: 14px; font-size: 14px; }
  body[data-site-theme][data-site-surface="account"] .portal-heading { flex-wrap: wrap; }
  body[data-site-theme][data-site-surface="account"] .login-card { padding: 24px; }
}
@media(max-width:720px) {
  body[data-site-theme][data-site-surface="marketing"] .interface-preview figcaption { background: linear-gradient(to bottom,transparent 0,var(--site-panel) 78px); }
}
