:root {
  color-scheme: dark;
  --ink: #101719;
  --paper: #f8f4e8;
  --muted: #adbab8;
  --line: #34403f;
  --orange: #ffa263;
  --serif: Georgia, 'Times New Roman', serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; background: var(--ink); color: var(--paper); font: 16px/1.55 Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
::selection { background: #ffa263; color: #101719; }
a { color: inherit; text-decoration: none; }
a, button { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }
button { font: inherit; cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
svg { display: block; }
p, h1, h2, h3, figure { margin: 0; }
[hidden] { display: none !important; }
.wrap { width: min(1280px, calc(100% - 88px)); margin-inline: auto; }
.skip { position: fixed; top: 8px; left: 8px; transform: translateY(-160%); padding: 12px 20px; background: var(--paper); color: var(--ink); border-radius: 8px; z-index: 20; }
.skip:focus { transform: none; }
.header { min-height: 104px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); gap: 28px; }
.identity { display: flex; align-items: center; gap: 13px; font-size: 18px; font-weight: 700; line-height: 1.25; }
.compass { width: 39px; height: 39px; flex: none; color: var(--orange); transform: rotate(-9deg); }
.identity-note { display: block; font-size: 12px; font-weight: 400; color: var(--muted); margin-top: 5px; }
.nav { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; font-size: 14px; }
.nav a { padding-block: 10px; }
.nav a[aria-current] { color: var(--orange); }
.nav a:hover, .footer a:hover, .back-top:hover { color: var(--orange); }
.intro { padding-block: 54px 48px; display: grid; grid-template-columns: 1.7fr 1fr; align-items: end; gap: 45px; }
.eyebrow { display: flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .11em; }
.intro .eyebrow { color: var(--muted); }
.line { width: 24px; height: 7px; background: var(--orange); border-radius: 10px; transform: rotate(-12deg); }
h1 { font-size: clamp(40px, 4.7vw, 68px); font-weight: 600; line-height: 1.04; letter-spacing: -.055em; margin-top: 22px; }
h1 em { font: italic 1.08em/1.08 var(--serif); color: var(--orange); letter-spacing: -.055em; }
.intro-aside { max-width: 342px; justify-self: end; }
.intro-copy { color: #c0cdca; font-size: 15px; line-height: 1.7; }
.film-link { display: inline-flex; align-items: center; gap: 12px; font-size: 13px; border-bottom: 1px solid #596461; padding-block: 13px 8px; }
.film-link:hover { color: var(--orange); }
.play-mark { color: var(--orange); font-size: 10px; }
.section-label { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 2px; }
.section-label h2 { font-size: 15px; font-weight: 400; }
.section-label > span { color: var(--muted); font-size: 13px; }
.guide { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-radius: 32px; isolation: isolate; overflow: hidden; overflow: clip; }
.featured { color: #123f3c; background: #9ce5dc; }
.guide-body { position: relative; z-index: 2; padding: 40px 12px 38px 44px; min-width: 0; }
.issue { justify-content: space-between; gap: 15px; flex-wrap: wrap; }
.status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid currentColor; border-radius: 20px; font-size: 11px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.ready { background: #123f3c; color: #e2fff6; border-color: #123f3c; }
.ready i { width: 5px; height: 5px; background: #a3eec6; border-radius: 50%; }
.guide h3 { font-size: clamp(68px, 7.2vw, 100px); font-weight: 700; line-height: .98; letter-spacing: -.065em; margin-top: 28px; }
.guide-subtitle { font: italic 27px/1.25 var(--serif); letter-spacing: -.03em; margin-top: 10px; }
.guide-heading { margin-bottom: 26px; }
.downloads { display: grid; gap: 9px; max-width: 450px; }
.button { min-height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid transparent; border-radius: 14px; padding: 13px 18px; transition: background .2s ease, box-shadow .2s ease; }
.button strong { display: block; font-size: 16px; font-weight: 600; }
.button small { display: block; font-size: 11px; opacity: .8; margin-top: 3px; }
.button svg { width: 22px; height: 22px; flex: none; }
.primary { background: #123f3c; color: #fffef4; box-shadow: 0 3px 0 #062d2940; }
.primary:hover { background: #215a50; box-shadow: 0 5px 16px #123f3c2b; }
.secondary { background: #c1f0e7; border-color: #41867b; }
.secondary:hover { background: #dff9ec; }
.download-note { font-size: 12px; line-height: 1.55; margin-top: 13px; max-width: 410px; color: #30665e; }
.guide-description { margin-top: 23px; max-width: 450px; font-size: 16px; line-height: 1.65; }
.guide-features { margin: 18px 0 0; padding: 0; list-style: none; font-size: 13px; line-height: 1.6; }
.guide-features li { display: flex; align-items: baseline; gap: 9px; margin-block: 5px; }
.guide-features li::before { content: '+'; font-size: 15px; }
.follow-short { display: inline-block; font-size: 12px; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #43867c; margin-top: 19px; }
.guide-art { position: relative; min-width: 0; min-height: 640px; display: flex; flex-direction: column; justify-content: space-between; padding: 28px 30px 27px; }
.ples-art { background: radial-gradient(ellipse at 65% 39%, #d5ffdf 0, #d5ffdf00 67%); }
.art-top, .art-bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; position: relative; z-index: 5; font-size: 10px; letter-spacing: .02em; }
.art-top { padding-bottom: 12px; border-bottom: 1px solid #123f3c30; }
.art-bottom { font-size: 11px; }
.art-stamp { border: 1px solid currentColor; border-radius: 5px; padding: 5px 9px; transform: rotate(-4deg); white-space: nowrap; }
.collage { position: absolute; inset: 66px 15px 66px; pointer-events: none; }
.art-orbit { position: absolute; width: 83%; height: 80%; left: 8%; top: 10%; border: 1px solid #15534a30; border-radius: 50%; transform: rotate(-25deg); }
.art-orbit::after { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 50%; left: 7%; top: 12%; background: currentColor; opacity: .5; }
[data-depth] { transform: translate3d(var(--px, 0px), var(--py, 0px), 0); }
.photo-layer, .cover-layer, .sticker { position: absolute; }
.photo-print { padding: 6px 6px 0; background: #fffcf2; border-radius: 6px; box-shadow: 2px 8px 20px #103e3b33; color: #173f3b; transform: rotate(var(--tilt, 0deg)); }
.photo-print img { width: 100%; height: 100%; aspect-ratio: 1 / 1.05; object-fit: cover; border-radius: 3px; }
.photo-print figcaption { padding: 7px 2px 9px; font: italic 12px/1.15 var(--serif); text-align: center; }
.photo-back { width: 39%; right: 3%; top: 6%; --tilt: 9deg; z-index: 1; }
.photo-front { width: 44%; left: 1%; bottom: 7%; --tilt: -10deg; z-index: 3; }
.photo-front .photo-print img { aspect-ratio: 1.2; }
.cover-layer { width: 48%; left: 27%; top: 18%; z-index: 2; }
.cover { border-radius: 3px; transform: rotate(-5deg); box-shadow: 2px 2px 0 #e6e0ce, 4px 4px 0 #6a7b7133, 9px 15px 24px #0927244a; }
.sticker { z-index: 4; filter: drop-shadow(2px 7px 5px #1a313142); }
.sticker img { width: 100%; aspect-ratio: 1; object-fit: contain; transform: rotate(var(--tilt, 0deg)); }
.sticker-window { width: 32%; left: -2%; top: 1%; --tilt: -13deg; }
.sticker-boat { width: 45%; right: -1%; bottom: -6%; --tilt: 10deg; }
.paper-note { position: absolute; z-index: 4; right: 2%; bottom: 20%; color: #234f45; font: italic clamp(15px, 1.5vw, 21px)/1.2 var(--serif); transform: rotate(-8deg); }
.upcoming { margin-top: 28px; color: #fcf0e2; background: #542975; }
.upcoming-body { padding-block: 40px; }
.upcoming h3 { font-size: clamp(60px, 6.7vw, 92px); margin-top: 39px; }
.upcoming .guide-subtitle { color: #ead5f0; }
.upcoming .guide-description { color: #f3e5f6; margin-top: 26px; }
.guide-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 25px; font-size: 12px; }
.guide-tags span { padding: 6px 10px; border: 1px solid #be9ec9; border-radius: 20px; }
.fact-source { text-decoration: underline; text-decoration-color: #cbb0d5; text-underline-offset: 4px; }
.fact-source:hover { color: #ffd397; }
.release-date { margin-top: 27px; font-size: 12px; color: #dbc4e9; }
.release-date time { display: block; font-size: 20px; line-height: 1.4; margin-top: 5px; color: #fff0d7; }
.announce { margin-top: 20px; max-width: 360px; min-height: 57px; background: #faedce; color: #4c286a; font-weight: 600; font-size: 15px; }
.announce:hover { background: #fff9ea; box-shadow: 0 7px 18px #230c3c30; }
.announce > span:last-child { font-size: 22px; font-weight: 400; }
.suzdal-art { background: radial-gradient(ellipse at 35% 40%, #9062b3a6 0, #54297500 66%); }
.suzdal-art .art-top { border-color: #efd4fc40; }
.suzdal-art .art-orbit { border-color: #e4c8f94f; }
.suzdal-art .photo-back { width: 45%; left: 1%; right: auto; top: 6%; --tilt: -9deg; }
.suzdal-art .photo-back img { aspect-ratio: 1.2; object-position: 35% center; }
.suzdal-art .photo-front { width: 48%; left: auto; right: 1%; bottom: 3%; --tilt: 8deg; }
.suzdal-art .photo-front img { aspect-ratio: 1.15; }
.suzdal-art .cover-layer { left: 24%; top: 24%; width: 44%; }
.suzdal-cover { transform: rotate(4deg); }
.sticker-gate { width: 35%; right: -1%; top: -1%; --tilt: 10deg; }
.suzdal-art .paper-note { color: #f0d3fb; right: auto; left: 1%; bottom: 8%; transform: rotate(-8deg); }
.release-plan { margin-top: 48px; }
.release-plan .section-label { border-top: 1px solid var(--line); padding-top: 22px; padding-bottom: 22px; }
.release-grid { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; }
.release-item { --card: #e6d2f1; --text: #4b2566; position: relative; display: flex; flex-direction: column; min-height: 188px; padding: 22px; background: var(--card); color: var(--text); border-radius: 20px; overflow: hidden; }
.release-index { align-self: flex-start; font-size: 12px; line-height: 1; border: 1px solid currentColor; border-radius: 50%; width: 29px; height: 29px; display: grid; place-items: center; }
.release-item h3 { font-size: clamp(22px, 2.1vw, 29px); font-weight: 600; letter-spacing: -.045em; line-height: 1.15; margin-block: 23px 7px; }
.release-item h3 small { display: block; font-size: 12px; font-weight: 400; letter-spacing: 0; line-height: 1.4; margin-top: 4px; }
.release-item time { margin-top: auto; padding-top: 9px; font-size: 12px; font-variant-numeric: tabular-nums; }
.release-item::after { content: ''; position: absolute; right: -24px; top: -44px; width: 125px; height: 125px; border: 1px solid currentColor; opacity: .15; border-radius: 50%; }
.release-item:nth-child(2) { --card: #f2dcb1; --text: #77501d; }
.release-item:nth-child(3) { --card: #c9ddcc; --text: #304d3b; }
.release-item:nth-child(4) { --card: #b9caef; --text: #203e69; }
.release-item:nth-child(5) { --card: #f7babc; --text: #832f42; }
.release-item:nth-child(6) { --card: #bce3e4; --text: #20505b; }
.release-item:nth-child(7) { --card: #efc295; --text: #743c27; }
.release-item:nth-child(8) { --card: #d8e8ff; --text: #274d78; }
.follow { position: relative; margin-top: 42px; padding: 46px; background: #faad75; color: #482d22; border-radius: 28px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: center; gap: 65px; }
.follow .eyebrow { font-size: 10px; }
.follow h2 { font-size: clamp(30px, 3.6vw, 47px); font-weight: 600; line-height: 1.07; letter-spacing: -.045em; margin-top: 20px; }
.follow-copy > p:last-child { font-size: 15px; line-height: 1.65; margin-top: 22px; max-width: 405px; }
.follow-links { display: grid; gap: 10px; }
.follow-links a { min-height: 71px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 18px; border: 1px solid #915e41; border-radius: 14px; background: #ffc89966; font-size: 19px; letter-spacing: -.015em; transition: background .2s; }
.follow-links a:hover { background: #ffe0bc; }
.follow-links a small { display: block; font-size: 11px; letter-spacing: 0; margin-top: 1px; }
.follow-links a > span:last-child { font-size: 25px; }
.closing { margin-top: 48px; padding-block: 28px 35px; display: flex; align-items: center; gap: 21px; }
.closing-mark { flex: none; display: grid; place-items: center; width: 53px; height: 53px; border: 1px solid #67716b; border-radius: 50%; font: italic 24px var(--serif); color: var(--orange); transform: rotate(-10deg); }
.closing p { font: 21px/1.5 var(--serif); }
.closing p span { color: var(--muted); }
.back-top { display: inline-flex; align-items: center; gap: 20px; margin-left: auto; font-size: 13px; }
.footer { padding-block: 25px 30px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.footer-socials { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; font-size: 12px; }
.motion-toggle { border: 1px solid #5b6864; background: transparent; color: #c8d1c9; padding: 8px 12px; border-radius: 20px; font-size: 11px; }
.motion-toggle:hover { background: #25302e; }
/* Motion is an enhancement: all content and download links work without JS. */
.motion-on .scene-visible .sticker img { animation: sticker-float 6s ease-in-out infinite; }
.motion-on .scene-visible .sticker-boat img { animation-name: boat-rock; animation-duration: 5.2s; }
.motion-on .scene-visible .sticker-gate img { animation-delay: -2s; animation-duration: 7s; }
.reveal-ready { opacity: 0; translate: 0 20px; }
.reveal-ready.is-visible { opacity: 1; translate: 0 0; transition: opacity .65s ease, translate .65s cubic-bezier(.2,.6,.2,1); }
@keyframes sticker-float { 0%, 100% { transform: translateY(0) rotate(var(--tilt, 0deg)); } 50% { transform: translateY(-9px) rotate(calc(var(--tilt, 0deg) + 3deg)); } }
@keyframes boat-rock { 0%, 100% { transform: translateY(2px) rotate(var(--tilt, 0deg)); } 50% { transform: translateY(-5px) rotate(calc(var(--tilt, 0deg) - 4deg)); } }
@media (min-width: 1450px) { .intro { padding-block: 64px 48px; } }
@media (max-width: 1080px) {
  .wrap { width: calc(100% - 56px); }
  .nav { gap: 21px; font-size: 13px; }
  .intro { grid-template-columns: 1.65fr 1fr; gap: 30px; }
  h1 { font-size: clamp(42px, 5.15vw, 56px); }
  .intro-copy { font-size: 14px; }
  .guide-body { padding: 33px 4px 32px 30px; }
  .guide-art { padding-inline: 23px; }
  .guide h3 { font-size: 80px; }
  .upcoming h3 { font-size: 66px; }
  .guide-subtitle { font-size: 25px; }
  .guide-description { font-size: 15px; }
  .collage { inset-inline: 7px; }
  .cover-layer { width: 53%; left: 25%; top: 25%; }
  .photo-front { width: 49%; bottom: 12%; }
  .photo-back { width: 42%; top: 14%; }
  .sticker-window { top: 8%; }
  .sticker-boat { bottom: 1%; width: 50%; }
  .suzdal-art .cover-layer { width: 49%; }
  .suzdal-art .photo-front { bottom: 8%; }
  .suzdal-art .paper-note { bottom: 13%; }
  .sticker-gate { top: 9%; width: 38%; }
  .art-top, .art-bottom { gap: 8px; font-size: 9px; }
  .art-stamp { padding-inline: 5px; }
  .release-grid { gap: 11px; }
  .release-item { padding: 18px; }
  .release-item h3 { font-size: 22px; }
  .follow { gap: 36px; padding: 36px; }
  .footer > span:nth-child(2) { display: none; }
}
@media (max-width: 760px) {
  .wrap { width: calc(100% - 32px); }
  .header { min-height: 0; align-items: flex-start; flex-direction: column; gap: 14px; padding-block: 22px 13px; }
  .identity { font-size: 17px; gap: 11px; }
  .compass { width: 34px; height: 34px; }
  .nav { gap: 25px; font-size: 13px; width: 100%; }
  .nav a { padding-block: 5px; }
  .nav a:first-child { display: none; }
  .intro { display: block; padding-block: 34px 23px; }
  .intro .eyebrow { font-size: 9px; letter-spacing: .09em; gap: 8px; }
  h1 { font-size: clamp(36px, 8.4vw, 60px); margin-top: 18px; }
  .intro-aside { max-width: 470px; margin-top: 24px; }
  .intro-copy { font-size: 14px; line-height: 1.65; }
  .film-link { font-size: 12px; padding-top: 14px; }
  .section-label { padding-block: 17px; }
  .section-label h2 { font-size: 14px; }
  .section-label > span { font-size: 12px; }
  .guide { grid-template-columns: minmax(0, 1fr); border-radius: 25px; }
  .guide-body { padding: 26px 25px 0; }
  .issue { font-size: 10px; gap: 10px; }
  .status { font-size: 10px; }
  .guide h3 { margin-top: 25px; font-size: 76px; }
  .guide-subtitle { font-size: 26px; margin-top: 7px; }
  .guide-heading { margin-bottom: 24px; }
  .downloads { max-width: none; }
  .button { min-height: 65px; padding: 13px 16px; }
  .button strong { font-size: 15px; }
  .button small { font-size: 11px; }
  .download-note { max-width: none; }
  .guide-description { max-width: none; font-size: 15px; margin-top: 22px; }
  .guide-features { font-size: 12px; margin-top: 15px; }
  .follow-short { font-size: 12px; margin-top: 15px; }
  .guide-art { min-height: 420px; margin-top: 18px; padding: 19px 25px 22px; }
  .art-top { font-size: 9px; border-top: 1px solid #123f3c30; border-bottom: 0; padding-top: 12px; padding-bottom: 0; }
  .art-bottom { font-size: 10px; }
  .art-stamp { padding: 4px 7px; }
  .collage { top: 57px; bottom: 53px; left: max(8px, calc(50% - 210px)); right: max(8px, calc(50% - 210px)); }
  .cover-layer { top: 9%; width: 43%; left: 30%; }
  .photo-back { width: 36%; top: 3%; right: 3%; }
  .photo-front { width: 38%; left: 3%; bottom: 6%; }
  .photo-print { padding: 5px 5px 0; }
  .photo-print figcaption { font-size: 10px; padding: 6px 1px 7px; }
  .sticker-window { width: 30%; left: 0; top: 0; }
  .sticker-boat { width: 43%; right: 0; bottom: -16%; }
  .paper-note { font-size: 15px; right: 2%; bottom: 19%; }
  .upcoming { margin-top: 20px; }
  .upcoming h3 { font-size: clamp(52px, 13.6vw, 76px); margin-top: 27px; }
  .upcoming .guide-subtitle { font-size: 25px; }
  .guide-tags { margin-top: 23px; font-size: 11px; }
  .upcoming .guide-description { margin-top: 21px; }
  .release-date { margin-top: 22px; }
  .release-date time { font-size: 19px; }
  .announce { max-width: none; min-height: 58px; margin-top: 18px; font-size: 14px; }
  .suzdal-art .art-top { border-color: #efd4fc40; }
  .suzdal-art .photo-back { width: 39%; left: 3%; top: 4%; }
  .suzdal-art .photo-front { width: 42%; right: 2%; bottom: 0; }
  .suzdal-art .cover-layer { width: 40%; left: 26%; top: 15%; }
  .sticker-gate { width: 33%; right: -1%; top: -1%; }
  .suzdal-art .paper-note { font-size: 15px; bottom: 11%; left: 3%; }
  .release-plan { margin-top: 30px; }
  .release-plan .section-label { padding-block: 21px; }
  .release-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .release-item { min-height: 177px; padding: 18px; border-radius: 17px; }
  .release-item h3 { font-size: clamp(20px, 4.8vw, 28px); margin-top: 21px; }
  .release-item time { font-size: 11px; }
  .release-index { width: 27px; height: 27px; font-size: 11px; }
  .follow { margin-top: 28px; padding: 30px 25px; grid-template-columns: minmax(0, 1fr); gap: 26px; border-radius: 25px; }
  .follow h2 { font-size: clamp(30px, 7.5vw, 43px); margin-top: 18px; }
  .follow-copy > p:last-child { font-size: 14px; margin-top: 20px; }
  .follow-links a { min-height: 70px; font-size: 19px; }
  .follow-links a small { font-size: 10px; }
  .closing { margin-top: 30px; padding-block: 15px 30px; gap: 15px; flex-wrap: wrap; }
  .closing-mark { width: 41px; height: 41px; font-size: 19px; }
  .closing p { font-size: 18px; }
  .back-top { font-size: 12px; margin-left: 56px; }
  .footer { gap: 20px; font-size: 11px; padding-block: 22px; }
  .footer-socials { gap: 19px; font-size: 12px; }
  .motion-toggle { margin-left: auto; }
}
@media (max-width: 370px) {
  .wrap { width: calc(100% - 24px); }
  .guide-body { padding-inline: 20px; }
  .guide h3 { font-size: 66px; }
  .upcoming h3 { font-size: 49px; }
  .guide-subtitle, .upcoming .guide-subtitle { font-size: 22px; }
  .button strong { font-size: 14px; }
  .guide-art { min-height: 360px; padding-inline: 20px; }
  .release-item { padding: 15px; min-height: 172px; }
  .release-item h3 { font-size: 19px; }
  .release-item time { font-size: 10px; }
  .follow { padding-inline: 20px; }
  .follow h2 { font-size: 29px; }
  .closing p { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  [data-depth] { transform: none !important; }
  .reveal-ready { opacity: 1 !important; translate: none !important; }
}
html.motion-off { scroll-behavior: auto; }
.motion-off .reveal-ready { opacity: 1; translate: none; transition: none; }
.motion-off [data-depth] { transform: none; }

/* The first screen is a collection of real finds; ornaments come from the guides. */
.hero-intro { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-areas: 'copy finds'; align-items: center; gap: 42px; padding-block: 40px 22px; }
.hero-body { grid-area: copy; min-width: 0; }
.hero-body .intro-copy { max-width: 430px; margin-top: 24px; font-size: 16px; line-height: 1.65; }
.hero-body h1 { font-size: clamp(40px, 4.45vw, 64px); }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 25px; }
.hero-choose { min-height: 52px; padding: 13px 17px; background: var(--orange); color: #252622; font-size: 14px; font-weight: 600; border-radius: 12px; }
.hero-choose:hover { background: #ffbb8a; }
.hero-choose svg { width: 20px; height: 20px; }
.hero-actions .film-link { margin: 0; padding: 12px 0; font-size: 14px; gap: 9px; border-bottom: 0; }
.hero-actions .play-mark { width: 19px; height: 19px; }
.hero-findings { grid-area: finds; width: 100%; max-width: 535px; justify-self: end; min-width: 0; }
.hero-objects { position: relative; height: 295px; isolation: isolate; }
.hero-piece { position: absolute; z-index: 3; }
.hero-sticker { position: relative; display: block; width: 100%; height: 100%; min-width: 44px; min-height: 44px; border: 0; padding: 0; background: transparent; border-radius: 8px; transform: rotate(var(--tilt)); }
.hero-sticker img { position: absolute; display: block; max-width: none; height: auto; pointer-events: none; filter: drop-shadow(0 7px 7px #0005); transition: filter .25s ease; }
.hero-sticker[aria-pressed='true'] img { filter: drop-shadow(0 4px 8px #9ce5dc36); }
.hero-sticker:focus-visible { outline-color: var(--orange); }
.hero-window { width: 23%; aspect-ratio: 1 / 1.75; left: 5%; top: 24px; --tilt: -12deg; }
.hero-window img { width: 175%; left: -37.5%; top: 0; }
.hero-gate { width: 25%; aspect-ratio: 1 / 1.45; right: 2%; top: 20px; --tilt: 10deg; }
.hero-gate img { width: 145%; left: -23%; top: 0; }
.hero-boat { width: 51%; aspect-ratio: 3 / 1; left: 32%; top: 181px; --tilt: -5deg; }
.hero-boat img { width: 110%; left: -5%; top: -120%; }
.hero-handnote { position: absolute; z-index: 2; left: 34%; top: 73px; width: 36%; text-align: center; font: italic clamp(19px, 1.85vw, 26px)/1.2 var(--serif); color: var(--orange); transform: rotate(-6deg); pointer-events: none; }
.hero-ornament { position: absolute; z-index: 0; object-fit: contain; pointer-events: none; }
.hero-earth { width: 26%; height: 86%; right: 1%; top: -1%; transform: rotate(-22deg); opacity: .75; }
.hero-air { width: 62%; height: 59%; left: -1%; top: 22%; transform: rotate(-12deg); opacity: .45; }
.hero-water { width: 50%; height: 28px; left: 31%; bottom: 16px; opacity: .95; }
.hero-caption { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 5px 16px; padding: 12px 4px 0; border-top: 1px solid var(--line); min-height: 50px; font-size: 13px; line-height: 1.5; color: #c0cdca; }
.hero-place-link { color: #f8f4e8; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #738479; font-size: 13px; white-space: nowrap; }
.hero-place-link:hover { color: var(--orange); }
.series-ornament { display: flex; justify-content: center; align-items: center; gap: 23px; padding-block: 16px 10px; font: italic 14px/1.3 var(--serif); color: #adbab8; }
.series-ornament img { width: 78px; height: 20px; object-fit: contain; }
.motion-on .scene-visible .hero-sticker { animation: hero-find-sway 7s ease-in-out infinite; }
.motion-on .scene-visible .hero-gate .hero-sticker { animation-delay: -2.5s; animation-duration: 8s; }
.motion-on .scene-visible .hero-boat .hero-sticker { animation-delay: -1s; animation-duration: 5.5s; }
.motion-on .scene-visible .hero-sticker:hover, .motion-on .scene-visible .hero-sticker:focus-visible { animation-play-state: paused; }
@keyframes hero-find-sway { 0%, 100% { transform: translateY(0) rotate(var(--tilt)); } 50% { transform: translateY(-6px) rotate(calc(var(--tilt) + 3deg)); } }
@media (max-width: 1080px) {
  .hero-intro { gap: 28px; }
  .hero-body h1 { font-size: clamp(37px, 4.6vw, 51px); }
  .hero-body .intro-copy { font-size: 16px; margin-top: 20px; }
  .hero-actions { gap: 12px 20px; margin-top: 20px; }
  .hero-objects { height: 248px; }
  .hero-window { top: 22px; }
  .hero-gate { top: 24px; }
  .hero-handnote { top: 69px; font-size: 20px; }
  .hero-boat { top: 157px; }
  .hero-water { bottom: 16px; }
  .hero-caption { min-height: 66px; }
}
@media (max-width: 760px) {
  .header { gap: 12px; padding-block: 20px 12px; }
  .hero-intro { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: 'finds' 'copy'; gap: 9px; padding-block: 12px 8px; }
  .hero-findings { max-width: 440px; justify-self: center; }
  .hero-objects { height: 178px; }
  .hero-window { width: 18%; left: 6%; top: 13px; }
  .hero-gate { width: 20%; right: 4%; top: 12px; }
  .hero-boat { width: 43%; left: 34%; top: 108px; }
  .hero-handnote { left: 32%; top: 36px; width: 38%; font-size: 19px; }
  .hero-earth { width: 23%; height: 90%; right: 1%; top: -1%; }
  .hero-air { width: 61%; height: 76%; left: 1%; top: 2%; }
  .hero-water { width: 45%; height: 18px; left: 32%; bottom: 5px; }
  .hero-caption { min-height: 46px; padding: 7px 0 2px; border-top: 0; font-size: 12px; gap: 4px 12px; }
  .hero-place-link { font-size: 12px; }
  .hero-body .eyebrow { display: none; }
  .hero-body h1 { font-size: clamp(36px, 8.4vw, 60px); margin-top: 0; }
  .hero-body .intro-copy { font-size: 16px; line-height: 1.55; max-width: 460px; margin-top: 20px; }
  .hero-actions { gap: 14px 12px; margin-top: 21px; }
  .hero-choose { font-size: 14px; min-height: 49px; padding-inline: 14px; gap: 12px; }
  .hero-choose svg { width: 18px; height: 18px; }
  .hero-actions .film-link { font-size: 14px; gap: 7px; }
  .series-ornament { gap: 16px; padding-block: 20px 7px; font-size: 13px; }
  .series-ornament img { width: 55px; height: 17px; }
}
@media (max-width: 370px) {
  .hero-objects { height: 158px; }
  .hero-window { width: 19%; left: 5%; top: 12px; }
  .hero-gate { width: 21%; right: 3%; top: 10px; }
  .hero-boat { top: 98px; }
  .hero-handnote { font-size: 16px; top: 32px; }
  .hero-body h1 { font-size: 33px; }
  .hero-actions { gap: 7px 16px; }
  .hero-choose { font-size: 13px; }
  .hero-actions .film-link { font-size: 13px; }
  .hero-caption { min-height: 48px; }
  .series-ornament { gap: 10px; font-size: 12px; }
  .series-ornament img { width: 49px; }
}

/* Each upcoming guide has a photographic find above its name and date. */
.release-item { min-height: 250px; }
.release-card-top { position: relative; height: 108px; flex: none; }
.release-card-top .release-index { position: relative; z-index: 2; }
.release-sticker { position: absolute; width: 128px; height: 128px; right: -3px; top: -14px; pointer-events: none; z-index: 1; --tilt: 7deg; }
.release-sticker img { width: 100%; height: 100%; object-fit: contain; transform: rotate(var(--tilt)); filter: drop-shadow(2px 5px 4px #1a31312b); }
.release-item:nth-child(even) .release-sticker { --tilt: -7deg; }
.release-item:nth-child(3n) .release-sticker { --tilt: 3deg; }
.next-release .release-sticker { width: 136px; height: 136px; right: -8px; top: -15px; }
.release-item h3 { position: relative; z-index: 2; margin-top: 10px; }
.release-item time { position: relative; z-index: 2; }
.motion-on .release-item.scene-visible .release-sticker img { animation: sticker-float 7s ease-in-out infinite; }
.motion-on .release-item:nth-child(even).scene-visible .release-sticker img { animation-delay: -2s; animation-duration: 8s; }
.motion-on .release-item:hover .release-sticker img { animation-play-state: paused; }
.photo-credits { margin-top: 18px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.photo-credits summary { cursor: pointer; width: fit-content; padding-block: 6px; }
.photo-credits ul { margin: 10px 0 0; padding-left: 20px; }
.photo-credits li { margin-block: 8px; }
.photo-credits a { text-decoration: underline; text-underline-offset: 3px; }
.photo-credits a:hover { color: var(--orange); }
@media (max-width: 1080px) {
  .release-item { min-height: 238px; }
  .release-card-top { height: 102px; }
  .release-sticker { width: 118px; height: 118px; top: -9px; right: -6px; }
  .next-release .release-sticker { width: 125px; height: 125px; top: -10px; right: -10px; }
}
@media (max-width: 760px) {
  .release-item { min-height: 234px; }
  .release-card-top { height: 106px; }
  .release-sticker { width: min(128px, 88%); height: 119px; right: -8px; top: -6px; }
  .next-release .release-sticker { width: min(136px, 94%); height: 124px; right: -10px; top: -8px; }
  .release-item h3 { margin-top: 10px; }
  .release-item time { font-size: 12px; }
}
@media (max-width: 370px) {
  .release-item { min-height: 218px; }
  .release-card-top { height: 94px; }
  .release-sticker { height: 105px; right: -7px; top: -6px; }
  .next-release .release-sticker { height: 112px; right: -10px; top: -8px; }
  .release-item h3 { margin-top: 8px; }
  .release-item time { font-size: 11px; }
}
