.game-page[data-engine="landmarkarchive"] .game-shell {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  background:
    linear-gradient(90deg, rgba(2, 10, 18, .98), rgba(3, 18, 30, .8) 50%, rgba(2, 9, 16, .98)),
    url("/assets/covers/landmark-quiz.webp") center 48% / cover;
  border-color: #9c7437;
  box-shadow: 0 24px 60px rgba(0, 4, 9, .72), inset 0 0 0 1px rgba(213, 165, 77, .25);
}

.game-page[data-engine="landmarkarchive"] .game-status {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 10px 14px;
}

.game-page[data-engine="landmarkarchive"] .game-status strong { max-width: 54%; }
.game-page[data-engine="landmarkarchive"] .game-status span { text-align: right; }
.game-page[data-engine="landmarkarchive"] .game-root { min-width: 0; }

.lma-game {
  --lma-night: #03101b;
  --lma-blue: #0b2635;
  --lma-paper: #e7d4ae;
  --lma-ink: #182127;
  --lma-brass: #c29445;
  --lma-brass-dark: #533817;
  --lma-teal: #6dd9d5;
  --lma-jade: #93d885;
  --lma-coral: #e97861;
  width: min(980px, 100%);
  margin: 0 auto;
  color: #f4e5c6;
  font-family: Georgia, "Times New Roman", serif;
}

.lma-title {
  margin: 0 0 13px;
  color: #efd8a7;
  font-size: clamp(2rem, 5vw, 4rem);
  font-weight: 800;
  letter-spacing: .065em;
  line-height: .95;
  text-align: center;
  text-shadow: 0 3px 0 #453016, 0 9px 28px rgba(0, 0, 0, .84);
  text-transform: uppercase;
}

.lma-archive {
  position: relative;
  padding: 14px;
  border: 2px solid #a67b38;
  border-radius: 9px;
  background:
    radial-gradient(circle at 50% 0, rgba(31, 81, 96, .18), transparent 38%),
    repeating-linear-gradient(90deg, transparent 0 107px, rgba(255, 255, 255, .012) 107px 108px),
    linear-gradient(145deg, rgba(6, 24, 36, .97), rgba(1, 9, 16, .995));
  box-shadow: inset 0 0 0 3px #01060b, inset 0 0 0 5px rgba(196, 148, 69, .16), 0 18px 42px rgba(0, 0, 0, .62);
}

.lma-archive::before {
  position: absolute;
  z-index: 3;
  inset: 4px 8px auto;
  height: 4px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--lma-coral), var(--lma-brass) calc(var(--time-ratio, 1) * 100%), #183745 0);
  box-shadow: 0 0 12px rgba(194, 148, 69, .45);
  content: "";
  transition: background .2s linear;
}

.lma-summary {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  margin-bottom: 13px;
  overflow: hidden;
  border: 2px solid #75562c;
  border-radius: 5px;
  background: #020b12;
  box-shadow: inset 0 0 0 2px #15303d, 0 5px 12px rgba(0, 0, 0, .48);
}

.lma-summary > span {
  min-width: 0;
  padding: 8px 7px 7px;
  border-right: 1px solid #604720;
  text-align: center;
}

.lma-summary > span:last-child { border-right: 0; }
.lma-summary small,
.lma-summary strong { display: block; }

.lma-summary small {
  color: var(--lma-teal);
  font: 800 .61rem/1 Arial, sans-serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.lma-summary svg,
.lma-actions svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.65;
}

.lma-summary svg { margin-right: 4px; vertical-align: -2px; }

.lma-summary strong {
  margin-top: 3px;
  color: #f7e8c9;
  font: 800 clamp(.95rem, 2vw, 1.35rem)/1 Arial, sans-serif;
  font-variant-numeric: tabular-nums;
}

.lma-summary > span:nth-child(2) strong { color: #f2c976; }
.lma-summary > span:nth-child(3) strong { color: var(--lma-teal); }
.lma-summary > span:nth-child(4) strong { color: var(--lma-jade); }
.lma-summary > span:nth-child(5) strong { color: #f29178; }

.lma-dossier {
  position: relative;
  display: grid;
  min-height: 225px;
  padding: 31px 124px 28px 45px;
  border: 5px solid #60421b;
  border-radius: 7px;
  background:
    radial-gradient(circle at 24px 36px, #1a1710 0 6px, transparent 7px),
    radial-gradient(circle at 24px 82px, #1a1710 0 6px, transparent 7px),
    radial-gradient(circle at 24px 128px, #1a1710 0 6px, transparent 7px),
    repeating-linear-gradient(0deg, rgba(72, 49, 25, .03) 0 1px, transparent 1px 4px),
    radial-gradient(circle at 45% 30%, #fff3d7, var(--lma-paper));
  box-shadow: inset 0 0 0 3px #c69649, inset 0 0 0 6px #362411, 0 9px 20px rgba(0, 0, 0, .6);
  text-align: center;
  place-content: center;
}

.lma-kicker {
  color: #8b4a39;
  font: 900 .7rem/1 Arial, sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.lma-clue {
  display: block;
  max-width: 720px;
  margin: 15px auto 14px;
  color: var(--lma-ink);
  font-size: clamp(1.15rem, 2.7vw, 1.75rem);
  font-weight: 700;
  line-height: 1.27;
  text-wrap: balance;
}

.lma-tag {
  display: block;
  max-width: 700px;
  margin: 0 auto;
  color: #266b70;
  font: 900 clamp(.62rem, 1.4vw, .83rem)/1.35 Arial, sans-serif;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.lma-permits {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 17px;
  display: grid;
  gap: 8px;
  transform: translateY(-50%);
}

.lma-permits small {
  width: 82px;
  color: #684925;
  font: 900 .45rem/1.15 Arial, sans-serif;
  letter-spacing: .065em;
  text-align: center;
  text-transform: uppercase;
}

.lma-permits span {
  position: relative;
  display: grid;
  width: 76px;
  height: 42px;
  border: 2px dashed #8b5b27;
  border-radius: 3px;
  color: #764b20;
  opacity: .2;
  place-items: center;
  transform: rotate(-3deg);
}

.lma-permits span:nth-of-type(2) { transform: rotate(2deg); }
.lma-permits span:nth-of-type(3) { transform: rotate(-1deg); }
.lma-permits span::before { content: "PERMIT"; font: 900 .44rem/1 Arial, sans-serif; letter-spacing: .11em; }
.lma-permits i { position: absolute; right: 6px; bottom: 4px; font: 900 .56rem/1 Arial, sans-serif; font-style: normal; }
.lma-permits span.active { filter: drop-shadow(0 2px 1px rgba(67, 40, 14, .22)); opacity: .96; }

.lma-progress {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  padding: 13px 24px 2px;
}

.lma-progress span {
  position: relative;
  z-index: 1;
  display: grid;
  width: 31px;
  min-height: 31px;
  border: 2px solid #6f5937;
  border-radius: 50%;
  background: #020d16;
  color: #748a92;
  font: 900 .72rem/1 Arial, sans-serif;
  place-self: center;
  place-items: center;
}

.lma-progress span:not(:last-child)::after {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 31px;
  width: calc((min(980px, 100vw) - 171px) / 5);
  height: 3px;
  background: linear-gradient(#6b512c 0 33%, #b88942 33% 66%, #6b512c 66%);
  content: "";
}

.lma-progress span.active { border-color: var(--lma-teal); color: var(--lma-teal); box-shadow: 0 0 12px rgba(109, 217, 213, .58); }
.lma-progress span.done { border-color: var(--lma-jade); background: #315f3d; color: #efffe8; }
.lma-progress span.done::before { content: "\2713"; }

.lma-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 9px;
}

.lma-choice {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  min-height: 68px;
  align-items: center;
  padding: 8px 12px;
  border: 2px solid #a47a3a;
  border-radius: 5px;
  background: linear-gradient(180deg, #102b39, #03111b);
  box-shadow: inset 0 0 0 3px #01070c, inset 0 0 0 5px rgba(198, 148, 70, .11), 0 5px 0 #442e14, 0 8px 15px rgba(0, 0, 0, .46);
  color: #f2e1bf;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: transform .12s ease, filter .12s ease, border-color .12s ease;
}

.lma-choice:hover:not(:disabled) { border-color: #e4bc6a; filter: brightness(1.13); transform: translateY(-2px); }
.lma-choice:focus-visible { outline: 4px solid var(--lma-teal); outline-offset: 3px; }

.lma-choice > span {
  display: grid;
  width: 39px;
  height: 43px;
  border: 2px solid #b78742;
  border-radius: 50%;
  background: #09202c;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .04), 0 3px 0 #3d2912;
  color: #eed7aa;
  font: 900 1.2rem/1 Georgia, serif;
  place-items: center;
}

.lma-choice strong { padding: 0 10px; font-size: clamp(.95rem, 2.1vw, 1.22rem); line-height: 1.13; }
.lma-choice i { color: #718d97; font: 900 .5rem/1 Arial, sans-serif; font-style: normal; letter-spacing: .09em; text-transform: uppercase; }
.lma-choice.correct { border-color: #9ade8d; background: linear-gradient(180deg, #315f42, #0b271b); box-shadow: inset 0 0 0 3px #061108, inset 0 0 22px rgba(147, 216, 133, .18), 0 0 18px rgba(147, 216, 133, .34); }
.lma-choice.correct strong,
.lma-choice.correct i { color: #c9efbc; }
.lma-choice.wrong { border-color: #ef7760; background: linear-gradient(180deg, #502820, #1a0e0c); animation: lma-shake .26s linear; }
.lma-choice.wrong i { color: #ff9b87; }
.lma-choice.rejected { border-color: #304a54; box-shadow: inset 0 0 0 3px #01070b; filter: grayscale(.8); opacity: .38; transform: none; }

.lma-actions { display: flex; justify-content: center; gap: 11px; margin-top: 12px; }
.lma-actions button {
  display: inline-flex;
  min-width: 174px;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 15px;
  border: 2px solid #a57a37;
  border-radius: 5px;
  background: linear-gradient(#12303d, #04131d);
  box-shadow: inset 0 0 0 2px #01070b, 0 4px 0 #432d13;
  color: var(--lma-teal);
  cursor: pointer;
  font: 900 .71rem/1 Arial, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.lma-actions button:last-child { color: #ef8a73; }
.lma-actions button:focus-visible { outline: 3px solid #fff0c9; outline-offset: 3px; }
.lma-actions button:disabled { cursor: default; filter: grayscale(.65); opacity: .42; }
.lma-note { min-height: 34px; max-width: 820px; margin: 12px auto 0; color: #d8ccb2; font-size: .84rem; line-height: 1.35; text-align: center; }
.lma-prompt { min-height: 17px; margin: 5px 0 0; color: #7f97a0; font: 700 .67rem/1.3 Arial, sans-serif; letter-spacing: .035em; text-align: center; }
.lma-game.paused .lma-dossier,
.lma-game.paused .lma-choices,
.lma-game.paused .lma-progress { filter: brightness(.5) grayscale(.3); }
.lma-game.complete .lma-archive { box-shadow: inset 0 0 0 3px #01060b, inset 0 0 0 5px rgba(147, 216, 133, .28), 0 0 30px rgba(147, 216, 133, .2); }

@keyframes lma-shake { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

@media (max-width: 720px) {
  .game-page[data-engine="landmarkarchive"] .game-status { align-items: flex-start; flex-direction: column; gap: 7px; }
  .game-page[data-engine="landmarkarchive"] .game-status strong { max-width: none; }
  .lma-archive { padding: 11px; }
  .lma-dossier { min-height: 225px; padding: 29px 104px 26px 39px; }
  .lma-permits { right: 11px; }
  .lma-permits span { width: 65px; height: 38px; }
  .lma-permits small { width: 69px; }
  .lma-choice { grid-template-columns: 42px 1fr; min-height: 66px; }
  .lma-choice i { display: none; }
}

@media (max-width: 520px) {
  .lma-title { margin-bottom: 10px; font-size: clamp(1.5rem, 8vw, 2.5rem); letter-spacing: .025em; }
  .lma-archive { border-radius: 7px; }
  .lma-summary > span { padding: 7px 2px 6px; }
  .lma-summary small { font-size: .43rem; letter-spacing: .025em; }
  .lma-summary svg { display: none; }
  .lma-summary strong { font-size: .8rem; }
  .lma-dossier { min-height: 228px; padding: 30px 15px 72px 27px; }
  .lma-clue { margin: 10px auto; font-size: clamp(1rem, 5vw, 1.35rem); line-height: 1.25; }
  .lma-kicker { font-size: .56rem; }
  .lma-tag { font-size: .52rem; letter-spacing: .035em; }
  .lma-permits { top: auto; right: 50%; bottom: 10px; grid-template-columns: repeat(3, 61px); gap: 6px; transform: translateX(50%); }
  .lma-permits small { grid-column: 1 / -1; width: auto; font-size: .42rem; }
  .lma-permits span { width: 61px; height: 29px; }
  .lma-permits span::before { font-size: .4rem; }
  .lma-permits i { font-size: .48rem; }
  .lma-progress { gap: 7px; padding: 9px 4px 2px; }
  .lma-progress span { width: 25px; min-height: 25px; font-size: .62rem; }
  .lma-progress span:not(:last-child)::after { left: 25px; width: calc((100vw - 108px) / 5); }
  .lma-choices { grid-template-columns: 1fr; gap: 8px; margin-top: 9px; }
  .lma-choice { grid-template-columns: 37px 1fr auto; min-height: 54px; padding: 5px 8px; }
  .lma-choice > span { width: 31px; height: 36px; font-size: 1rem; }
  .lma-choice strong { padding: 0 7px; font-size: .92rem; }
  .lma-choice i { display: block; font-size: .42rem; }
  .lma-actions { margin-top: 11px; }
  .lma-actions button { min-width: 0; min-height: 46px; flex: 1; padding: 8px; font-size: .59rem; }
  .lma-note { min-height: 42px; margin-top: 9px; font-size: .71rem; }
  .lma-prompt { margin-top: 3px; font-size: .53rem; }
}

@media (prefers-reduced-motion: reduce) {
  .lma-choice,
  .lma-archive::before { animation: none; transition: none; }
}