.page-shell:has(.game-page) .breadcrumbs { display: none; }.game-page {
  --game-ink: var(--mtt-navy, #122c4b);
  --game-blue: #245fc0;
  --game-soft: #edf4fa;
  --game-teal: #197368;
  --game-sand: #fff3df;
  --game-muted: #52667a;
  width: min(1220px, calc(100% - 40px));
  margin: 0 auto 60px;
  color: var(--game-ink);
  overflow-anchor: none;
}.game-page [hidden] { display: none; }.game-page .eyebrow { color: var(--game-muted); font-size: .72rem; font-weight: 500; letter-spacing: .14em; }.game-hero.hero.compact { display: block; min-height: 0; padding: 30px 0 20px; margin: 0; border: 0; border-radius: 0; background: transparent; text-align: center; }.game-hero.hero.compact::after { display: none; }.game-back { display: flex; align-items: center; min-height: 44px; width: fit-content; color: var(--game-muted); font-size: .85rem; }.game-hero h1 { max-width: 880px; margin: 0 auto 14px; color: var(--game-ink); font-size: clamp(2rem, 3.8vw, 3.55rem); letter-spacing: -.045em; line-height: 1.08; }.game-hero .lead { max-width: 660px; margin: 0 auto; color: var(--game-muted); font-size: 1rem; line-height: 1.6; }.game-hero-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 30px; margin-block-start: 24px; padding-block: 14px; }.game-hero-status > span { display: inline-flex; align-items: baseline; gap: 5px; color: var(--game-muted); font-size: .85rem; }.game-hero-status strong { color: var(--game-ink); font-size: 1.25rem; font-weight: 500; }.game-page .game-shell { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 28px; align-items: start; padding: 0; margin: 0 auto 24px; overflow-anchor: none; }.game-arena, .game-play-card { min-width: 0; border: 0; box-shadow: none; }.game-arena { overflow: hidden; border-radius: 14px; background: var(--game-soft); }.game-arena-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 24px 24px 0; }.game-arena-head h2 { margin: 0; color: var(--game-ink); font-size: clamp(1.3rem, 2.2vw, 1.9rem); line-height: 1.2; letter-spacing: -.025em; }.game-text-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--game-blue); font-size: .85rem; text-decoration: underline; text-underline-offset: 4px; white-space: nowrap; }.game-progress { height: 4px; margin: 20px 24px 0; overflow: hidden; border-radius: 4px; background: #dce6ef; }.game-progress span { display: block; height: 100%; border-radius: inherit; background: var(--game-blue); transition: width 250ms ease; }.game-visual { position: relative; display: grid; place-items: center; min-height: 410px; border: 0; border-radius: 0; background: transparent; padding: 32px 24px 88px; }.flag-card, .capital-card, .outline-card { width: 100%; max-width: 480px; text-align: center; }.flag-card img { display: block; width: 100%; height: 250px; border: 0; border-radius: 0; object-fit: contain; filter: drop-shadow(0 10px 15px #122c4b12); }.capital-card { display: grid; justify-items: center; gap: 12px; }.capital-card img { width: 120px; height: 80px; object-fit: contain; }.capital-card span { color: var(--game-muted); font-size: .72rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }.capital-card strong { max-width: 100%; color: var(--game-ink); font-size: clamp(2rem, 3.5vw, 3rem); line-height: 1.1; letter-spacing: -.035em; overflow-wrap: anywhere; }.capital-card em { padding: 8px 16px; border-radius: 7px; background: #dceee8; color: var(--game-teal); font-style: normal; font-weight: 500; }.game-page--capital .game-visual { padding-block-end: 32px; }.outline-image { display: block; width: 100%; height: 280px; object-fit: contain; }.is-outline-loading .outline-image { visibility: hidden; }.game-outline-error { position: absolute; inset: 40% 20px auto; text-align: center; }.game-outline-error button { min-height: 44px; }.game-source-note { color: var(--game-muted); font-size: .8rem; text-align: center; }.game-reveal { position: absolute; inset-inline: 24px; bottom: 20px; display: grid; gap: 4px; text-align: center; }.game-reveal span { color: var(--game-muted); font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .12em; }.game-reveal span.is-success { color: var(--game-teal); }.game-reveal span.is-error { color: #985417; }.game-reveal strong { color: var(--game-ink); font-size: 1.3rem; line-height: 1.2; overflow-wrap: anywhere; }.game-play-card { display: grid; gap: 14px; padding: 8px 0 0; background: transparent; overflow-anchor: none; }.game-card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.game-card-head .eyebrow { margin: 0; }.game-card-head strong { color: var(--game-ink); font-size: 1.25rem; }.game-feedback { margin: 0; padding: 16px; border: 0; border-radius: 10px; background: var(--game-soft); color: var(--game-ink); font-size: .9rem; line-height: 1.5; }.game-feedback.success { background: #e8f4ef; color: var(--game-teal); }.game-feedback.error-text { background: var(--game-sand); color: #85501c; }.answer-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }.game-page .answer-grid button { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 12px; row-gap: 2px; align-items: center; width: 100%; min-height: 72px; margin: 0; padding: 13px 18px; border: 2px solid transparent; border-radius: 10px; background: var(--game-soft); color: var(--game-ink); box-shadow: none; text-align: start; transition: transform 160ms ease, border-color 160ms ease; }.game-page .answer-grid button:nth-of-type(even) { background: var(--game-sand); }.game-page .answer-grid button:not(:disabled):hover { border-color: var(--game-blue); transform: translateY(-2px); }.game-page .answer-grid button span { grid-row: 1 / 3; color: var(--game-muted); font-size: .85rem; font-weight: 500; }.game-page .answer-grid button strong { color: inherit; font-size: 1rem; line-height: 1.25; font-weight: 500; overflow-wrap: anywhere; }.game-page .answer-grid button small { grid-column: 2; color: var(--game-muted); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }.game-page .answer-grid button.is-pending { border-color: var(--game-blue); }.game-page .answer-grid button.is-correct { border-color: var(--game-teal); background: #e8f4ef; color: var(--game-teal); }.game-page .answer-grid button.is-wrong { border-color: #b47729; background: var(--game-sand); color: #85501c; }.game-page .answer-grid button:disabled { opacity: 1; cursor: default; transform: none; }.game-next-form { margin: 0; }.game-next-form button, .game-final-actions .button-link { display: inline-flex; justify-content: center; align-items: center; min-height: 46px; margin: 0; padding: 11px 24px; border: 0; border-radius: 7px; background: var(--game-blue); color: white; box-shadow: none; font-size: .94rem; font-weight: 500; }.game-next-form button { width: 100%; }.game-next-form button:hover, .game-final-actions .button-link:hover { background: #194a9c; }.game-final-actions .button-link.secondary { background: var(--game-soft); color: var(--game-ink); }.game-side-actions, .game-final-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }.game-side-actions a { display: inline-flex; align-items: center; min-height: 44px; color: var(--game-blue); font-size: .8rem; text-decoration: underline; text-underline-offset: 4px; }.game-side-map { position: relative; overflow: hidden; min-height: 240px; border-radius: 14px; background: var(--game-soft); }.game-side-map-label { position: absolute; top: 16px; inset-inline-start: 16px; z-index: 2; display: grid; gap: 4px; max-width: calc(100% - 32px); }.game-side-map-label span { color: var(--game-muted); font-size: .68rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }.game-side-map-label strong { color: var(--game-ink); font-size: 1rem; line-height: 1.2; overflow-wrap: anywhere; }.game-side-map .world-svg-map {
  position: absolute;
  left: 50%;
  bottom: 8px;
  width: 100%;
  height: auto;
  max-height: calc(100% - 64px);
  max-width: none;
  transform: translateX(-50%);
}.game-side-map .world-svg-map path {
  fill: #d8e5f4;
  stroke: #b7cce4;
  stroke-width: 1;
  opacity: 0.98;
  transition: fill 220ms var(--ease-standard), stroke 220ms var(--ease-standard), opacity 220ms var(--ease-standard);
}.game-side-map .world-svg-map path.is-game-answer {
  fill: var(--mtt-blue);
  stroke: var(--mtt-blue-dark);
  opacity: 1;
}.game-side-map .world-svg-map path.is-game-selected {
  fill: var(--mtt-red);
  stroke: #a72636;
  opacity: 1;
}.game-side-map .world-svg-map path.is-game-answer.is-game-selected { fill: var(--game-teal); stroke: var(--game-teal); }.game-map-point {
  position: absolute;
  z-index: 2;
  width: 11px;
  height: 11px;
  border: 2px solid #fff;
  border-radius: 999px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}.game-map-point[hidden] {
  display: none;
}.game-map-point.is-answer {
  background: var(--mtt-blue);
}.game-map-point.is-selected {
  background: var(--mtt-red);
}.game-final-hero.hero.compact { padding-block: 55px; }.game-final-score { display: flex; justify-content: center; align-items: baseline; gap: 8px; margin-block: 24px; }.game-final-score strong { color: var(--game-blue); font-size: clamp(4rem, 8vw, 6rem); font-weight: 500; line-height: 1; letter-spacing: -.05em; }.game-final-score span { color: var(--game-muted); font-size: 1.5rem; }.game-progress.is-complete { height: 4px; max-width: 480px; margin-inline: auto; }.game-final-actions { justify-content: center; margin-block-start: 24px; }.game-page :is(a, button):focus-visible { outline: 3px solid var(--game-blue); outline-offset: 4px; }@media (max-width: 900px) {
  .game-page .game-shell { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .game-visual { min-height: 350px; }
  .game-side-map { min-height: 280px; }
  .game-side-map .world-svg-map { width: 100%; max-height: 250px; }
}@media (max-width: 600px) {
  .game-page { width: calc(100% - 24px); }
  .game-hero.hero.compact { padding-block: 18px 16px; }
  .game-hero h1 { font-size: 2.05rem; }
  .game-hero-status { gap: 16px; margin-block-start: 12px; }
  .game-hero-status > span { font-size: .75rem; }
  .game-hero-status strong { font-size: 1.1rem; }
  .game-arena-head { padding: 18px 16px 0; gap: 12px; }
  .game-arena-head h2 { font-size: 1.3rem; }
  .game-text-link { font-size: .75rem; }
  .game-progress { margin-inline: 16px; }
  .game-visual { min-height: 290px; padding: 24px 20px 72px; }
  .flag-card img { height: 170px; }
  .outline-image { height: 210px; }
  .game-side-map { min-height: 230px; }
  .game-final-actions { flex-direction: column; align-items: stretch; }
}@media (prefers-reduced-motion: reduce) { .game-page *, .game-page *::after { transition: none; animation: none; } }