:root {
  color-scheme: dark;
  --ink: #0b0805;
  --panel: #181008;
  --gold: #d8b46a;
  --gold-soft: #f1dca8;
  --parchment: #f4ead3;
  --line: rgba(234, 211, 155, 0.24);
}

* { box-sizing: border-box; }
html { background: var(--ink); }
body {
  min-height: 100vh;
  margin: 0;
  color: var(--parchment);
  background:
    radial-gradient(circle at 50% -10%, rgba(141, 93, 34, 0.32), transparent 34rem),
    linear-gradient(180deg, #130d08, var(--ink));
  font-family: Georgia, "Times New Roman", serif;
}

a, button { -webkit-tap-highlight-color: transparent; }
.download-hero { max-width: 1240px; margin: 0 auto; padding: 36px 28px 25px; }
.back-link { color: var(--gold-soft); font: 600 14px/1.2 system-ui, sans-serif; text-decoration: none; }
.back-link:hover { text-decoration: underline; }
.eyebrow { margin: 54px 0 8px; color: var(--gold); font: 700 12px/1.2 system-ui, sans-serif; letter-spacing: 0.2em; text-transform: uppercase; }
h1 { max-width: 850px; margin: 0; color: #fff5dc; font-size: clamp(42px, 7vw, 82px); font-weight: 500; line-height: 0.98; }
.download-hero > p:last-child { max-width: 680px; margin: 22px 0 0; color: rgba(244, 234, 211, 0.7); font: 17px/1.6 system-ui, sans-serif; }
main { max-width: 1240px; margin: 0 auto; padding: 0 28px 70px; }
.archive-tabs { display: flex; gap: 30px; margin: 28px 0 26px; border-bottom: 1px solid var(--line); }
.archive-tab { padding: 15px 0 13px; color: rgba(244, 234, 211, 0.55); border: 0; border-bottom: 3px solid transparent; background: none; font: 700 15px/1.2 system-ui, sans-serif; cursor: pointer; }
.archive-tab span { display: inline-grid; place-items: center; min-width: 28px; height: 22px; margin-left: 6px; padding: 0 7px; border-radius: 999px; background: rgba(216, 180, 106, 0.13); font-size: 12px; }
.archive-tab.is-active { color: var(--gold-soft); border-bottom-color: var(--gold); }
.archive-tab:focus-visible, .download-button:focus-visible, .view-link:focus-visible, .back-link:focus-visible { outline: 3px solid var(--gold-soft); outline-offset: 4px; }
.download-section[hidden] { display: none; }
.download-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 19px; }
.download-card { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(180deg, rgba(36, 24, 13, 0.94), rgba(19, 13, 8, 0.98)); box-shadow: 0 16px 45px rgba(0, 0, 0, 0.25); }
.download-card picture { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #050403; }
.portrait-grid .download-card picture { aspect-ratio: 8.5 / 11; }
.download-card img { display: block; width: 100%; height: 100%; object-fit: contain; }
.download-copy { padding: 17px; }
.download-copy h2 { margin: 0; color: #fff5dc; font-size: 20px; font-weight: 500; line-height: 1.18; }
.download-copy p { min-height: 34px; margin: 7px 0 15px; color: rgba(244, 234, 211, 0.55); font: 13px/1.35 system-ui, sans-serif; }
.download-actions { display: flex; align-items: center; gap: 13px; }
.download-button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 15px; color: #160d05; border-radius: 7px; background: linear-gradient(180deg, #efd38c, #c79743); font: 800 13px/1 system-ui, sans-serif; text-decoration: none; }
.download-button:hover { filter: brightness(1.08); }
.view-link { color: var(--gold-soft); font: 600 12px/1.3 system-ui, sans-serif; }
footer { padding: 25px 28px 45px; color: rgba(244, 234, 211, 0.42); border-top: 1px solid var(--line); text-align: center; font: 12px/1.5 system-ui, sans-serif; }

@media (max-width: 600px) {
  .download-hero { padding: 24px 18px 16px; }
  .eyebrow { margin-top: 40px; }
  main { padding: 0 18px 50px; }
  .archive-tabs { gap: 18px; }
  .download-grid { grid-template-columns: 1fr; }
}
