/* Ascent Arcade release shell. Canonical game presentation remains scoped to each game root. */
:root {
  color-scheme: dark;
  --arcade-bronze: #C6A88A;
  --arcade-navy: #1A1A2E;
  --arcade-slate: #2E3B55;
  --arcade-gold: #B8922A;
  --arcade-cream: #F5F0E8;
  --ascent-midnight: var(--arcade-navy);
  --ascent-panel: var(--arcade-slate);
  --ascent-aqua: var(--arcade-bronze);
  --ascent-gold: var(--arcade-gold);
  --ascent-coral: #ff637d;
  --ascent-cloud: var(--arcade-cream);
  --ascent-muted: var(--arcade-bronze);
  --ascent-line: color-mix(in srgb, var(--arcade-bronze) 42%, transparent);
  --aa-bg: var(--arcade-navy);
  --aa-surface: var(--arcade-slate);
  --aa-surface-2: color-mix(in srgb, var(--arcade-slate) 82%, var(--arcade-navy));
  --aa-text: var(--arcade-cream);
  --aa-muted: color-mix(in srgb, var(--arcade-bronze) 65%, var(--arcade-cream));
  --aa-line: color-mix(in srgb, var(--arcade-bronze) 48%, transparent);
  --aa-input: color-mix(in srgb, var(--arcade-navy) 78%, black);
  --aa-shadow: rgba(0, 0, 0, 0.35);
  --aa-accent: var(--arcade-gold);
}

html[data-theme="light"] {
  color-scheme: light;
  --aa-bg: var(--arcade-cream);
  --aa-surface: #ffffff;
  --aa-surface-2: color-mix(in srgb, var(--arcade-cream) 78%, var(--arcade-bronze));
  --aa-text: var(--arcade-navy);
  --aa-muted: var(--arcade-slate);
  --aa-line: color-mix(in srgb, var(--arcade-slate) 42%, transparent);
  --aa-input: #fffdf9;
  --aa-shadow: rgba(19, 48, 81, 0.16);
  --aa-accent: #725811;
}

html,
body { max-width: 100%; overflow-x: clip; }

.public-arcade-skip-link {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  min-height: 44px;
  position: fixed;
  z-index: 2147483647;
  top: 0.5rem;
  left: 0.5rem;
  padding: 0.75rem 1rem;
  border-radius: 0.65rem;
  background: var(--ascent-gold);
  color: #17213d;
  font: 800 0.9rem/1 system-ui, sans-serif;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 160ms ease;
}
.public-arcade-skip-link:focus { transform: translateY(0); }

.public-arcade-shell,
.public-arcade-footer {
  box-sizing: border-box;
  color: var(--ascent-cloud);
  font-family: "Atkinson Hyperlegible", "Trebuchet MS", system-ui, sans-serif;
}

.public-arcade-shell {
  position: relative;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 72px;
  padding: 0.65rem max(1rem, env(safe-area-inset-right)) 0.65rem max(1rem, env(safe-area-inset-left));
  border-bottom: 1px solid var(--ascent-line);
  background: color-mix(in srgb, var(--arcade-navy) 96%, transparent);
  box-shadow: 0 12px 32px rgba(2, 8, 24, 0.3);
}

.public-arcade-shell__brand {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  color: var(--arcade-cream);
  text-decoration: none;
}
.public-arcade-shell__mark {
  display: block;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  object-fit: contain;
}
.public-arcade-shell__brand strong,
.public-arcade-shell__brand small { display: block; }
.public-arcade-shell__brand strong { font-size: 1.05rem; letter-spacing: 0.01em; }
.public-arcade-shell__brand small { margin-top: 0.12rem; color: var(--arcade-bronze); font-size: 0.72rem; }

.public-arcade-shell__controls { display: flex; align-items: center; gap: 0.4rem; }

.public-arcade-shell__nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.25rem; }
.public-arcade-shell__nav a,
.public-arcade-shell__menu,
.public-arcade-shell__theme {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 0.7rem;
  color: var(--arcade-cream);
  font: 800 0.83rem/1 system-ui, sans-serif;
}
.public-arcade-shell__nav a { display: inline-flex; align-items: center; padding: 0 0.85rem; text-decoration: none; }
.public-arcade-shell__nav a:hover { border-color: var(--arcade-bronze); background: color-mix(in srgb, var(--arcade-bronze) 12%, transparent); color: var(--arcade-gold); }
.public-arcade-shell__menu { display: none; padding: 0 0.9rem; background: var(--arcade-slate); cursor: pointer; }
.public-arcade-shell__theme { padding: 0 0.85rem; background: var(--arcade-slate); cursor: pointer; }
.public-arcade-shell__page-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.65rem;
  padding: 0.65rem clamp(1rem, 4vw, 2rem);
  border-bottom: 1px solid var(--ascent-line);
  background: var(--ascent-midnight);
}
.public-arcade-shell__page-actions button { min-height: 44px; }
.public-arcade-shell a:focus-visible,
.public-arcade-shell button:focus-visible,
.public-arcade-footer a:focus-visible,
.public-arcade-launchpad a:focus-visible,
.public-arcade-dialog button:focus-visible { outline: 3px solid var(--ascent-gold); outline-offset: 3px; }

.public-arcade-footer {
  position: relative;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.25rem max(1rem, env(safe-area-inset-right)) calc(1.25rem + env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
  border-top: 1px solid var(--ascent-line);
  background: var(--arcade-navy);
  color: var(--arcade-cream);
}
.public-arcade-footer span { color: var(--arcade-bronze); }
.public-arcade-footer a { color: var(--arcade-cream); }
.public-arcade-footer a:hover { color: var(--arcade-gold); }

/* One product system. Source-page architecture may vary; public output does not. */
body[data-arcade-surface="product"],
body[data-arcade-surface="legal"] {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--ascent-aqua) 12%, transparent), transparent 30rem),
    radial-gradient(circle at 100% 25%, color-mix(in srgb, var(--ascent-coral) 9%, transparent), transparent 34rem),
    var(--aa-bg) !important;
  color: var(--aa-text) !important;
  font-family: "Avenir Next", "Segoe UI", system-ui, sans-serif !important;
}
html[data-theme="dark"] body[data-arcade-surface="product"],
html[data-theme="dark"] body[data-arcade-surface="legal"],
html[data-theme="dark"] body[data-arcade-surface="game"],
body.public-arcade-theme--dark[data-arcade-surface] { background-color: var(--arcade-navy) !important; }
html[data-theme="light"] body[data-arcade-surface="product"],
html[data-theme="light"] body[data-arcade-surface="legal"],
html[data-theme="light"] body[data-arcade-surface="game"],
body.public-arcade-theme--light[data-arcade-surface] { background-color: var(--arcade-cream) !important; }
body[data-arcade-surface="product"] :where(main, .wrap, .shell, .page, .workspace, .hero, .panel, .card, .gate, .state-card, .toolbar, .filters, .bank-card, .report-card, .content-card),
body[data-arcade-surface="legal"] :where(main, .legal-shell, article) {
  color: var(--aa-text);
}
body[data-arcade-surface="product"] :where(
  .panel,
  .card,
  .gate,
  .state-card,
  .toolbar,
  .filters,
  .search-deck,
  .dialog,
  dialog,
  .bank-card,
  .report-card,
  .content-card,
  .recent-report,
  .plan-card,
  .list > li,
  .media-editor,
  .toast,
  .modal,
  .gate__instrument,
  .empty-workspace__glyph,
  .save-recovery,
  .template-review__status,
  .template-review__route > div,
  .template-course,
  .review-confirmations > label,
  .question-tab,
  .icon-button,
  .kpi,
  .list-item,
  .change,
  .receipt,
  .selection-option,
  .access-rail,
  .control-deck,
  .entry-card,
  .selection-card,
  .global-status,
  .consent,
  .metric-grid,
  .metric,
  .workspace-option[aria-current="true"],
  .empty-card,
  .action-card,
  .lifecycle-card,
  .record,
  .record-empty,
  .setup-card,
  .check-row,
  .workspace,
  .library,
  .editor__toolbar,
  .question-editor,
  .visibility-card,
  .template-card,
  .template-panel,
  .template-browser,
  .template-entry,
  .template-ledger,
  .template-review,
  .dialog__head,
  .dialog__body,
  .dialog__actions,
  .template-filters,
  .template-list__empty,
  .publish-summary > div,
  .preview-answer li,
  .diff-summary article,
  .question-editor__head,
  .answer-panel__head,
  .teacher-chip,
  .answer-panel,
  .preview-question,
  .preview-answer,
  .preview-rationale,
  .review-confirmations,
  .return-notice,
  .plan-pass,
  .recovery-callout,
  .privacy-plate,
  .metric-strip,
  .meter,
  .report-loader,
  .access-section,
  .table-wrap,
  .boundary-ledger,
  .legal-rail,
  .notice,
  table
),
body[data-arcade-surface="legal"] :where(
  .legal-shell,
  article,
  .boundary-ledger,
  .legal-rail,
  .notice,
  .data-table,
  table
) {
  border-color: var(--aa-line) !important;
  background: color-mix(in srgb, var(--aa-surface) 96%, transparent) !important;
  box-shadow: 0 18px 48px var(--aa-shadow) !important;
}
body[data-arcade-surface="product"] :where(h1, h2, h3, h4, strong, label),
body[data-arcade-surface="legal"] :where(h1, h2, h3, h4, strong) { color: var(--aa-text) !important; }
body[data-arcade-surface="product"] :where(p, small, .meta, .lede, .field-note),
body[data-arcade-surface="legal"] :where(p, li) { color: var(--aa-muted) !important; }
/* The public Avatar and Lounge experiences intentionally retain their midnight
 * branded cards in both release themes. Keep inherited release copy tokens from
 * repainting dark-card text to light-theme slate. */
body[data-arcade-surface="product"] .pae-page :where(.pae-page__hero, .pae-card) :where(h1, h2, h3, p) {
  color: var(--pae-cream) !important;
}
body[data-arcade-surface="product"] .pae-page :where(.pae-page__hero, .pae-card) .pae-eyebrow {
  color: var(--pae-bronze) !important;
}
body[data-arcade-surface="product"] .pae-page > .pae-status {
  color: var(--aa-text) !important;
}
body[data-arcade-surface="product"] :where(
  .metric span,
  .kpi .meta,
  .list-item .meta,
  .change .meta,
  .receipt .meta,
  .workspace-option small,
  .workspace-option p,
  .access-section p
) { color: var(--aa-muted) !important; }
body[data-arcade-surface="product"] :where(input, select, textarea) {
  border-color: var(--aa-line) !important;
  background: var(--aa-input) !important;
  color: var(--aa-text) !important;
}
body[data-arcade-surface="product"] :where(.button:not(.button--primary, .button--accent, .button--danger, .button--warning)) {
  border-color: var(--aa-line) !important;
  background: var(--aa-surface-2) !important;
  color: var(--aa-text) !important;
}
body[data-arcade-surface="product"] :where(.button--quiet) { background: var(--aa-surface-2) !important; }

/*
 * Source pages predate the release theme and contain fixed light-paper cards.
 * Repaint every interactive product surface from release tokens so selecting
 * dark mode cannot leave pale text on a white source component (or vice versa).
 */
body[data-arcade-surface="product"] :where(
  .selection-card,
  .global-status,
  .consent,
  .metric-grid,
  .workspace-option[aria-current="true"],
  .empty-card,
  .record-empty,
  .notice,
  .privacy-note,
  .return-notice,
  .plan-pass,
  .recovery-callout,
  .privacy-plate,
  .metric-strip,
  .meter,
  .report-loader,
  .access-section,
  .table-wrap,
  .recent-report,
  .plan-card,
  .list > li,
  .media-editor,
  .toast,
  .modal,
  .gate__instrument,
  .empty-workspace__glyph,
  .save-recovery,
  .template-review__status,
  .template-review__route > div,
  .template-course,
  .dialog__head,
  .dialog__body,
  .dialog__actions,
  .template-filters,
  .template-list__empty,
  .publish-summary > div,
  .preview-answer li,
  .diff-summary article,
  .question-editor__head,
  .answer-panel__head,
  .review-confirmations > label,
  .question-tab,
  .icon-button,
  .kpi,
  .list-item,
  .change,
  .receipt,
  .selection-option,
  .boundary-ledger,
  .legal-rail,
  table,
  thead,
  tbody,
  tr,
  th,
  td
) {
  border-color: var(--aa-line) !important;
  background: var(--aa-surface-2) !important;
  color: var(--aa-text) !important;
}
body[data-arcade-surface="product"] :where(
  .entry-card__number,
  .control-deck::before,
  .control-deck::after
) { color: color-mix(in srgb, var(--aa-text) 8%, transparent) !important; }
body[data-arcade-surface="product"] :where(
  .selection-card a,
  .consent a,
  .privacy-note > span,
  .workspace-option[aria-current="true"] a
) { color: var(--aa-accent) !important; }
body[data-arcade-surface="product"] :where(
  .dialog__head,
  .dialog__body,
  .dialog__actions,
  .template-filters,
  .publish-summary > div,
  .template-card,
  .preview-answer li,
  .diff-summary article
) :where(h1, h2, h3, h4, h5, strong, label, legend, summary) { color: var(--aa-text) !important; }
body[data-arcade-surface="product"] :where(
  .dialog__head,
  .dialog__body,
  .dialog__actions,
  .template-filters,
  .publish-summary > div,
  .template-card,
  .preview-answer li,
  .diff-summary article
) :where(p, small, span:not(.status, .pill)) { color: var(--aa-muted) !important; }
body[data-arcade-surface="product"] :where(.notice--error, .inline-error, .gate--error, [role="alert"]),
body[data-arcade-surface="legal"] :where(.notice--limit) {
  border-color: color-mix(in srgb, var(--ascent-coral) 68%, var(--aa-line)) !important;
  background: color-mix(in srgb, var(--ascent-coral) 14%, var(--aa-surface)) !important;
  color: var(--aa-text) !important;
}
body[data-arcade-surface="product"] :where(.status) {
  border-color: var(--aa-line) !important;
  background: var(--aa-surface-2) !important;
  color: var(--aa-text) !important;
}
body[data-arcade-surface="product"] :where(.meter > i) { background: var(--aa-accent) !important; }
body[data-arcade-surface="product"] :where(th),
body[data-arcade-surface="legal"] :where(th) { background: var(--aa-surface-2) !important; color: var(--aa-text) !important; }
body[data-arcade-surface="product"] :where(td),
body[data-arcade-surface="legal"] :where(td) { color: var(--aa-text) !important; }
body[data-arcade-surface="product"] :where(input, select, textarea, button, a):focus-visible,
body[data-arcade-surface="legal"] :where(a, button):focus-visible { outline: 3px solid var(--ascent-gold) !important; outline-offset: 3px; }

/* The Library hero is intentionally midnight in both themes. Keep its copy readable. */
body.public-arcade-library-page .hero :where(h1, h2, h3, h4, strong, label) { color: #f6faff !important; }
body.public-arcade-library-page .hero :where(p, small) { color: #c7d7e5 !important; }
body.public-arcade-library-page .hero .eyebrow { color: #62e0df !important; }
body.public-arcade-library-page .hero__catalog :where(strong) { color: #0c2038 !important; }
/* Game-picker cards also stay midnight in both themes. Repaint their child copy
   after the shared paper-surface rules so light theme cannot reduce contrast. */
body.public-arcade-library-page .game-choice :where(strong) { color: #edf6ff !important; }
body.public-arcade-library-page .game-choice :where(span) { color: #b9c9db !important; }
body.public-arcade-library-page .game-choice :where(i) { color: #65e6df !important; }
body.public-arcade-library-page .specialized-game-grid article :where(strong) { color: #ffd16a !important; }
body.public-arcade-library-page .specialized-game-grid article :where(span) { color: #aebfd1 !important; }

/* Theme the page around each canonical game while preserving its authored arena art. */
body[data-arcade-surface="game"] {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--ascent-aqua) 10%, transparent), transparent 30rem),
    var(--aa-bg) !important;
  color: var(--aa-text) !important;
}
body[data-arcade-surface="game"] :where(#main-content, .site-main) { color: var(--aa-text); }
html[data-theme="light"] body[data-arcade-surface="game"] :where(
  #engineGameContainer,
  #game-coordinate-conquest,
  #game-equation-auction,
  #game-function-forge,
  #game-proof-chain,
  #game-lab-meltdown,
  #game-nexus .nx-container,
  #watershed-game-container,
  #fml-root,
  #etymology-root
) {
  border: 1px solid var(--aa-line);
  box-shadow: 0 24px 64px var(--aa-shadow);
}

.public-arcade-auth-gate {
  width: min(92vw, 44rem);
  margin: clamp(3rem, 10vh, 8rem) auto;
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px solid var(--aa-line);
  border-radius: 1.4rem;
  background: var(--aa-surface);
  color: var(--aa-text);
  box-shadow: 0 24px 70px var(--aa-shadow);
  text-align: center;
}
.public-arcade-auth-gate h1 { margin: 0; color: var(--aa-text); font: 900 clamp(2rem, 5vw, 3.4rem)/1 "Avenir Next", system-ui, sans-serif; }
.public-arcade-auth-gate p:not(.public-arcade-launchpad__eyebrow) { color: var(--aa-muted); line-height: 1.6; }
.public-arcade-auth-gate a { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 1.2rem; border-radius: 0.85rem; background: var(--ascent-aqua); color: #071a2e; font-weight: 900; text-decoration: none; }
body[data-arcade-access="teacher"][data-arcade-auth="signed-in"] > .public-arcade-auth-gate { display: none !important; }
body[data-arcade-access="teacher"]:not([data-arcade-auth="signed-in"]) > :not(.public-arcade-shell):not(.public-arcade-auth-gate):not(.public-arcade-skip-link):not(script) { display: none !important; }
[hidden] { display: none !important; }
.public-arcade-footer > div { display: grid; gap: 0.25rem; }
.public-arcade-footer strong { color: var(--aa-accent); }
.public-arcade-footer span { color: var(--aa-muted); font-size: 0.8rem; }
.public-arcade-footer nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.2rem; }
.public-arcade-footer a { display: inline-flex; min-height: 44px; align-items: center; padding: 0 0.65rem; color: var(--aa-muted); font-size: 0.78rem; text-decoration: none; }
.public-arcade-footer a:hover { color: var(--aa-text); text-decoration: underline; text-underline-offset: 0.2rem; }

/*
 * Immersive game-layout contract.
 *
 * The release shell owns the wide workspace. Individual games still own readable
 * question, tutorial, form, and dialog measures inside that workspace.
 */
body[data-arcade-surface="game"] #main-content.site-main {
  width: 100%;
  max-width: none;
}

body[data-arcade-surface="game"] #game-engine-wrap {
  width: 100%;
  max-width: none;
  margin-inline: 0 !important;
  box-sizing: border-box;
}

body[data-arcade-surface="game"] #main-content.site-main > .container,
body[data-arcade-surface="game"] #main-content.site-main > :is(.max-w-5xl, .max-w-7xl),
body[data-arcade-surface="game"] #main-content.site-main > .wrap,
body[data-arcade-surface="game"] #main-content.wrap,
body[data-arcade-surface="game"] #engineGameContainer {
  width: min(calc(100% - clamp(1rem, 4vw, 4rem)), 108rem) !important;
  max-width: 108rem !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}

body[data-arcade-surface="game"] :is(
  #game-coordinate-conquest,
  #game-equation-auction,
  #game-function-forge,
  #game-proof-chain,
  #game-lab-meltdown,
  #game-nexus .nx-container,
  #watershed-game-container,
  #fml-root,
  #etymology-root,
  #engineGameContainer > [id$="root"]
) {
  width: min(100%, 108rem) !important;
  max-width: 108rem !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}

body[data-arcade-surface="game"] :is(
  #game-coordinate-conquest > .cc-shell,
  #game-equation-auction > .ea-shell,
  #game-function-forge > .ff-shell,
  #game-proof-chain > .pc-shell
) {
  width: min(calc(100% - clamp(1rem, 2vw, 2rem)), 108rem) !important;
  max-width: 108rem !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}

body[data-arcade-surface="game"] :is(
  #ccScreenResults,
  #eaScreenResults,
  #ffScreenResults,
  #pcScreenResults,
  #nx-screen-results,
  #lmSecureResults
) {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  box-sizing: border-box;
}

body[data-arcade-surface="game"] #engineGameContainer :is(
  [id$="LiveProjector"],
  [id$="LiveScholarBuzz"],
  [id$="LiveRoundResult"],
  [id$="LiveFinal"],
  [id$="LiveScholarFinal"],
  [id$="LiveScholarSpectator"],
  .cb-screen[id$="scholarGame"],
  .cb-screen[id$="projector"],
  .cb-screen[id$="final"],
  .rr-screen[id$="scholar"],
  .rr-screen[id$="projector"],
  .rr-screen[id$="results"],
  .tb-screen[id$="hostGame"],
  .tb-screen[id$="scholarGame"],
  .tb-screen[id$="final"]
) {
  width: 100%;
  max-width: none !important;
  min-width: 0;
  box-sizing: border-box;
}

/* Award, podium, leaderboard, and final-score collections use the wide stage. */
body[data-arcade-surface="game"] :is(
  .ba-podium-wrap,
  .ba-live-leaderboard,
  .rr-podium,
  .rr-full-rankings,
  .tb-podium-wrap,
  .cb-podium,
  .cc-results-list,
  .ea-results-grid,
  .ff-results-grid,
  .pc-results-grid,
  .lm-leaderboard,
  .nx-results-list,
  .nx-awards-grid,
  .fml-results-grid,
  .wcc-results-rounds,
  .wg-endscreen-stats,
  #results-stats,
  [id$="finalList"],
  [id$="LiveFullLeaderboard"],
  [id$="LiveRoundLeaderboard"],
  [id$="LiveScholarFinalBoard"],
  [id$="LiveSpectLeaderboard"]
) {
  width: min(100%, 90rem) !important;
  max-width: 90rem !important;
  margin-inline: auto !important;
  min-width: 0;
  box-sizing: border-box;
}

body[data-arcade-surface="game"] #screen-results > .text-center.max-w-lg {
  width: min(100%, 90rem) !important;
  max-width: 90rem !important;
}

body[data-arcade-surface="game"] #screen-results > .text-center.max-w-lg > :is(p, .glass-game) {
  width: min(100%, 48rem);
  margin-inline: auto;
}

body[data-arcade-surface="game"] :is(
  #screen-quiz > .glass-game,
  .wcc-question-area,
  .se-question-panel,
  .dkey-container,
  .fml-intro-desc,
  .public-arcade-auth-gate
) {
  width: min(100%, 48rem);
  max-width: 48rem !important;
  margin-inline: auto;
}

body[data-arcade-surface="game"] :is(.ba-podium-wrap, .tb-podium-wrap) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 17rem));
  align-items: end;
  justify-content: center;
  gap: clamp(1rem, 2.5vw, 2rem);
  padding-inline: clamp(0.25rem, 1.5vw, 1rem);
}

body[data-arcade-surface="game"] :is(.ba-podium-stand, .tb-podium-slot, .cb-podium-place, .rr-podium-card) {
  width: 100%;
  min-width: 0 !important;
  max-width: none !important;
}

body[data-arcade-surface="game"] :is(
  .ba-podium-name,
  .tb-podium-name,
  .cb-podium-place,
  .rr-podium-name,
  .lm-leaderboard,
  .nx-results-row
) {
  overflow-wrap: anywhere;
  min-width: 0;
}

@media (max-width: 700px) {
  body[data-arcade-surface="game"] #main-content.site-main > .container,
  body[data-arcade-surface="game"] #main-content.site-main > :is(.max-w-5xl, .max-w-7xl),
  body[data-arcade-surface="game"] #main-content.site-main > .wrap,
  body[data-arcade-surface="game"] #main-content.wrap,
  body[data-arcade-surface="game"] #engineGameContainer {
    width: 100% !important;
  }

  body[data-arcade-surface="game"] #main-content.site-main > .container {
    padding-inline: 0.5rem !important;
  }

  body[data-arcade-surface="game"] #main-content.site-main .glass-card-static:has(#watershed-game-container) > div {
    padding-inline: 0.25rem !important;
  }

  body[data-arcade-surface="game"] :is(.ba-podium-wrap, .tb-podium-wrap) {
    display: flex !important;
    justify-content: flex-start;
    gap: 0.75rem;
    width: 100%;
    padding: 0.25rem 0.25rem 0.75rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
    scrollbar-gutter: stable;
  }

  body[data-arcade-surface="game"] :is(.ba-podium-stand, .tb-podium-slot) {
    flex: 0 0 clamp(9.5rem, 72vw, 12rem) !important;
    scroll-snap-align: center;
  }

  body[data-arcade-surface="game"] :is(.ba-podium-stand, .tb-podium-slot):only-child {
    margin-inline: auto;
  }

  body[data-arcade-surface="game"] :is(
    .rr-podium,
    .cc-results-list,
    .ea-results-grid,
    .ff-results-grid,
    .pc-results-grid,
    .fml-results-grid,
    .wcc-results-rounds,
    .wg-endscreen-stats,
    #results-stats
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

.public-arcade-launchpad {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(240px, 0.9fr) minmax(0, 1.4fr);
  gap: clamp(1.25rem, 3vw, 2.5rem);
  margin: clamp(1rem, 2.5vw, 2rem) auto clamp(2rem, 5vw, 4rem);
  padding: clamp(1.3rem, 3vw, 2.4rem);
  border: 1px solid var(--ascent-line);
  border-radius: 1.4rem;
  background:
    radial-gradient(circle at 12% 8%, rgba(52, 230, 210, 0.18), transparent 34%),
    radial-gradient(circle at 88% 92%, rgba(255, 99, 125, 0.14), transparent 32%),
    linear-gradient(145deg, var(--arcade-navy), var(--arcade-slate));
  box-shadow: 0 22px 60px rgba(2, 8, 24, 0.34);
  color: var(--ascent-cloud);
}
.public-arcade-launchpad::before {
  content: "";
  position: absolute;
  inset: 1rem auto 1rem 1rem;
  width: 4px;
  border-radius: 99px;
  background: linear-gradient(var(--ascent-aqua), var(--ascent-gold), var(--ascent-coral));
}
.public-arcade-launchpad__intro { align-self: center; padding-left: 1rem; }
.public-arcade-launchpad__eyebrow,
.public-arcade-launchpad__action-eyebrow { margin: 0 0 0.5rem; color: var(--ascent-gold); font: 800 0.7rem/1.3 ui-monospace, monospace; letter-spacing: 0.12em; text-transform: uppercase; }
.public-arcade-launchpad__intro h1,
.public-arcade-launchpad__intro h2 { margin: 0; color: var(--ascent-cloud); font: 900 clamp(2rem, 4vw, 3.3rem)/0.98 "Trebuchet MS", system-ui, sans-serif; letter-spacing: -0.045em; text-wrap: balance; }
.public-arcade-launchpad__intro > p:not(.public-arcade-launchpad__eyebrow) { max-width: 38rem; margin: 1rem 0 0; color: var(--ascent-muted); line-height: 1.55; }
.public-arcade-launchpad__primary { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1.25rem; }
.public-arcade-launchpad__primary a { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 1.15rem; border: 2px solid var(--ascent-aqua); border-radius: 0.85rem; font-weight: 900; text-decoration: none; }
.public-arcade-launchpad__primary-action { background: var(--ascent-aqua); color: #071a2e; }
.public-arcade-launchpad__secondary-action { color: var(--ascent-cloud); }
.public-arcade-launchpad__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.public-arcade-launchpad .public-arcade-launchpad__action { position: relative; display: grid; align-content: start; min-width: 0; min-height: 132px; padding: 1rem 3rem 1rem 1rem; border: 1px solid var(--ascent-line); border-radius: 1rem; background: rgba(8, 19, 43, 0.72); color: var(--ascent-muted); text-align: left; text-decoration: none !important; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.public-arcade-launchpad .public-arcade-launchpad__action:hover { border-color: var(--ascent-aqua); box-shadow: 0 8px 24px rgba(2, 8, 24, 0.28); color: var(--ascent-cloud); transform: translateY(-2px); }
.public-arcade-launchpad__action strong { color: var(--ascent-cloud); font-size: 1rem; line-height: 1.25; }
.public-arcade-launchpad__action > span:not(.public-arcade-launchpad__action-eyebrow):not(.public-arcade-launchpad__action-arrow) { margin-top: 0.45rem; font-size: 0.84rem; line-height: 1.42; }
.public-arcade-launchpad__action-arrow { position: absolute; top: 50%; right: 1rem; color: var(--ascent-aqua); font-size: 1.35rem; font-weight: 900; transform: translateY(-50%); }

.public-arcade-library-status {
  max-width: 900px;
  margin: 2.5rem auto;
  padding: 1.25rem 1.4rem;
  border: 1px dashed var(--ascent-line);
  border-radius: 1rem;
  background: rgba(8, 19, 43, 0.48);
  color: var(--ascent-cloud);
  text-align: center;
}
.public-arcade-library-status h2 { margin: 0; color: var(--ascent-cloud); font-size: clamp(1.25rem, 3vw, 1.7rem); text-wrap: balance; }
.public-arcade-library-status > p:last-child { max-width: 44rem; margin: 0.7rem auto 0; color: var(--ascent-muted); line-height: 1.55; }

.public-arcade-dialog { width: min(92vw, 34rem); max-height: min(86vh, 46rem); padding: 0; border: 1px solid var(--ascent-line); border-radius: 1.25rem; background: var(--ascent-panel); color: var(--ascent-cloud); box-shadow: 0 24px 80px rgba(0, 0, 0, 0.58); }
.public-arcade-dialog::backdrop { background: rgba(2, 8, 24, 0.78); backdrop-filter: blur(5px); }
.public-arcade-dialog__body { padding: clamp(1.25rem, 4vw, 2rem); }
.public-arcade-dialog h2 { margin: 0 0 0.8rem; color: var(--ascent-aqua); font: 900 clamp(1.45rem, 4vw, 2rem)/1.05 "Trebuchet MS", system-ui, sans-serif; }
.public-arcade-dialog p { margin: 0.65rem 0; color: var(--ascent-muted); line-height: 1.6; }
.public-arcade-dialog button { min-height: 46px; margin-top: 1rem; padding: 0 1.1rem; border: 0; border-radius: 0.75rem; background: var(--ascent-aqua); color: #071a2e; font-weight: 900; cursor: pointer; }

@media (max-width: 1180px) {
  .public-arcade-shell { flex-wrap: wrap; }
  .public-arcade-shell__menu { display: inline-flex; align-items: center; }
  .public-arcade-shell__nav { display: none; width: 100%; flex-direction: column; align-items: stretch; padding-bottom: 0.4rem; }
  .public-arcade-shell__nav[data-open="true"] { display: flex; }
  .public-arcade-shell__nav a { justify-content: center; }
  .public-arcade-footer { align-items: stretch; flex-direction: column; }
  .public-arcade-footer nav { justify-content: flex-start; }
}

@media (max-width: 768px) {
  .public-arcade-launchpad { grid-template-columns: 1fr; margin-inline: 0; padding: 1.2rem; }
  .public-arcade-launchpad__actions { grid-template-columns: 1fr; }
  .public-arcade-launchpad .public-arcade-launchpad__action { min-height: 96px; }
}

@media (prefers-reduced-motion: reduce) {
  .public-arcade-skip-link,
  .public-arcade-launchpad .public-arcade-launchpad__action { transition: none; }
  .public-arcade-launchpad .public-arcade-launchpad__action:hover { transform: none; }
}

@media print {
  .public-arcade-shell,
  .public-arcade-footer { display: none !important; }
}