@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500&family=Montserrat:wght@400;500;600&display=swap");

:root {
  --ink: #020405;
  --ink-soft: #071014;
  --ivory: #e9ddd0;
  --muted: rgba(233, 221, 208, .52);
  --gold: #d49a52;
  --gold-bright: #f5af19;
  --ember: #f12711;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
html.stage-restore-instant { scroll-behavior:auto !important; }
body { margin: 0; overflow-x: hidden; background: var(--ink); color: var(--ivory); font-family: Montserrat, Arial, sans-serif; }
body.story-locked, body.map-open, body.archive-transitioning, body.archive-calendar-open { overflow: hidden; }
button, a { color: inherit; font: inherit; }
button { border: 0; }
a { text-decoration: none; }

.site-header {
  position: fixed; inset: 0 0 auto; z-index: 100; display: flex; align-items: center; justify-content: space-between;
  height: 112px; padding: 0 clamp(26px, 4vw, 70px); pointer-events: none;
}
.site-header::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(2,4,5,.88), transparent); }
.site-header a, .site-header button { pointer-events: auto; }
.monogram { position: relative; display:grid; place-items:center; width: 50px; height: 50px; border:1px solid transparent; border-left-color:rgba(212,154,82,.9); border-bottom-color:rgba(212,154,82,.68); border-radius: 50%; color: var(--ivory); font: 400 31px/1 "Cormorant Garamond", Georgia, serif; text-align: center; filter:drop-shadow(0 0 12px rgba(212,154,82,.12)); transition:filter .4s,color .4s; }
.monogram span{transform:translate(-1px,1px)}
.monogram sup{position:absolute;top:5px;right:5px;color:#e7b876;font:500 10px/1 Montserrat,Arial,sans-serif;letter-spacing:0;text-shadow:0 0 9px rgba(245,175,25,.55)}
.monogram i{position:absolute;inset:6px;border-top:1px solid rgba(233,221,208,.32);border-right:1px solid rgba(212,154,82,.3);border-radius:50%;transform:rotate(-18deg)}
.monogram::before{content:"";position:absolute;right:1px;top:10px;width:3px;height:3px;border-radius:50%;background:#f2d2a2;box-shadow:0 0 8px #f5af19}
.monogram::after { content: ""; position: absolute; top: -5px; right: 12px; width: 1px; height: 11px; background: linear-gradient(#fff3dc,rgba(255,243,220,.15)); }
.monogram:hover{color:#fff7eb;filter:drop-shadow(0 0 15px rgba(245,175,25,.35))}
.site-header nav { display: flex; align-items: center; gap: clamp(14px, 2.15vw, 38px); }
.site-header nav a, .site-header nav > button, .muted-link { padding: 0; background: transparent; color: #e2a75f; font-size: 9px; font-weight: 600; letter-spacing: .3em; cursor: pointer; transition: color .3s, text-shadow .3s; }
.site-header nav a:hover, .site-header nav > button:hover { color: #ffe0af; text-shadow: 0 0 16px rgba(241,187,115,.7); }
.muted-link { opacity: .72; cursor: default; }
.menu-button { width: 22px; padding: 2px !important; }
.menu-button i { display: block; width: 100%; height: 1px; margin: 5px 0; background: var(--gold); }

.story { position: relative; height: 1080vh; background: var(--ink); }
.story-stage { position: sticky; top: 0; width: 100%; height: 100vh; min-height: 560px; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 50% 48%, rgba(12,19,22,.72), transparent 46%), linear-gradient(180deg, #010203, #04090c 58%, #010203); }
.scene-canvas { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; }
.fine-grain { position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: .14; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.38'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.orbit { position: absolute; z-index: 3; left: 50%; top: 50%; width: min(72vw, 820px); aspect-ratio: 1; border: 1px solid rgba(212,154,82,.14); border-radius: 50%; opacity: 0; transform: translate(-50%,-50%) scale(.92); }
.orbit::before, .orbit::after { content: ""; position: absolute; inset: 9%; border: 1px solid rgba(212,154,82,.04); border-radius: 50%; }
.orbit::after { inset: -3%; border-style: dotted; }

.title-lockup { position: absolute; z-index: 5; left: 50%; top: 50%; width: min(960px, 90vw); text-align: center; opacity: 0; transform: translate(-50%,-48%); pointer-events: none; }
.eyebrow { margin: 0 0 22px; color: var(--gold); font-size: 8px; letter-spacing: .46em; }
.title-lockup h1 { margin: 0; color: #d8b291; font: 400 clamp(62px, 8vw, 116px)/.9 "Cormorant Garamond", Georgia, serif; letter-spacing: .02em; text-shadow: 0 0 38px rgba(212,154,82,.08); white-space: nowrap; }
.title-rule { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 28px auto 22px; }
.title-rule span { width: 78px; height: 1px; background: linear-gradient(90deg, transparent, rgba(212,154,82,.62)); }
.title-rule span:last-child { transform: scaleX(-1); }
.title-rule b { color: #d9b596; font-size: 9px; }
.subtitle { margin: 0; color: #d59a53; font-size: 9px; letter-spacing: .34em; }
.chapter-copy { position: absolute; z-index: 6; left: 50%; top: 46%; width: min(860px, 84vw); transform: translate(-50%,-50%); text-align: center; pointer-events: none; }
.chapter-copy p { position: absolute; inset: 0; margin: 0; opacity: 0; color: rgba(233,221,208,.84); font: 400 clamp(28px, 3.4vw, 50px)/1.35 "Cormorant Garamond", Georgia, serif; letter-spacing: .07em; transform: translateY(18px); text-shadow: 0 8px 30px rgba(0,0,0,.7); }

.earth-cta { position: absolute; z-index: 8; left: 50%; top: 50%; display: grid; justify-items: center; gap: 12px; width: min(430px, 74vw); padding: 125px 40px; opacity: 0; transform: translate(-50%,-50%) scale(.9); background: transparent; cursor: pointer; pointer-events: none; }
.earth-cta.is-ready { pointer-events: auto; }
.cta-kicker { color: rgba(233,221,208,.52); font-size: 8px; letter-spacing: .35em; }
.earth-cta strong { color: #ffd598; font-size: clamp(22px, 2.2vw, 34px); font-weight: 500; letter-spacing: .45em; text-indent: .45em; text-shadow: 0 0 24px rgba(245,175,25,.7); }
.cta-ring { position: absolute; left: 50%; top: 50%; width: 270px; aspect-ratio: 1; border: 1px solid rgba(245,175,25,.17); border-radius: 50%; transform: translate(-50%,-50%); transition: transform .8s, border-color .8s; }
.earth-cta:hover .cta-ring { transform: translate(-50%,-50%) scale(1.14); border-color: rgba(245,175,25,.48); }
.scroll-cue { position: absolute; z-index: 10; left: 50%; bottom: 5vh; display: grid; justify-items: center; gap: 16px; transform: translateX(-50%); }
.scroll-cue span { color: #e2a75f; font-size: 9px; font-weight: 600; letter-spacing: .32em; }
.scroll-cue i { width: 1px; height: 46px; background: linear-gradient(var(--gold), #fff); box-shadow: 0 6px 8px rgba(255,255,255,.25); animation: scrollPulse 1.8s ease-in-out infinite; transform-origin: top; }
.story-counter { position: absolute; right: 2.5vw; top: 50%; z-index: 6; display: grid; justify-items: center; gap: 8px; color: rgba(233,221,208,.34); font-size: 8px; letter-spacing: .2em; }
.story-counter i { width: 1px; height: 68px; background: rgba(233,221,208,.18); }
@keyframes scrollPulse { 0%,100%{transform:scaleY(.5);opacity:.45} 50%{transform:scaleY(1);opacity:1} }

.map-experience { position: fixed; inset: 0; z-index: 70; visibility: hidden; overflow: hidden; background: radial-gradient(circle at 50% 50%,#101417 0,#05090b 52%,#010203 100%); opacity: 0; pointer-events: none; }
.map-experience::before { content:""; position:absolute; inset:0; z-index:2; pointer-events:none; opacity:.42; background:radial-gradient(circle at 50% 50%,rgba(245,175,25,.12),transparent 32%),radial-gradient(circle at 30% 42%,rgba(221,231,234,.05),transparent 28%); transition:opacity 1.8s ease; }
.map-experience.is-ready::before { opacity:0; }
.map-experience.is-active { visibility: visible; opacity: 1; pointer-events: auto; }
.flattening-earth { position: absolute; z-index: 4; left: 50%; top: 50%; width: min(61vmin, 620px); aspect-ratio: 1; border: 1px solid rgba(245,175,25,.55); border-radius: 50%; transform: translate(-50%,-50%); background: radial-gradient(circle at 34% 28%, rgba(103,78,46,.68), rgba(9,14,16,.96) 58%, #010203 76%), repeating-radial-gradient(circle, rgba(245,175,25,.08) 0 1px, transparent 1px 18px); box-shadow: inset -40px -30px 80px rgba(0,0,0,.75), 0 0 70px rgba(245,175,25,.22); pointer-events: none; }
.map-experience.is-prepared.is-opening .flattening-earth { animation: flattenEarth 2.05s cubic-bezier(.55,0,.16,1) forwards; }
@keyframes flattenEarth { 0%{border-radius:50%;transform:translate(-50%,-50%) scale(1);opacity:1} 28%{border-radius:49%;transform:translate(-50%,-50%) scale(1.35,1.31);opacity:.96} 55%{border-radius:38%;transform:translate(-50%,-50%) scale(2.2,1.95);opacity:.68} 78%{border-radius:16%;transform:translate(-50%,-50%) scale(4,3.3);opacity:.24} 100%{border-radius:0;transform:translate(-50%,-50%) scale(7,5.8);opacity:0} }
.map-layer { position: absolute; inset: 0; z-index: 3; opacity: 0; transform:scale(1.075); clip-path:circle(15% at 50% 50%); background: #020405; will-change:opacity,transform,filter,clip-path; }
.map-experience.is-prepared.is-opening .map-layer, .map-experience.is-ready .map-layer { animation: mapReveal 1.9s .16s cubic-bezier(.22,.72,.18,1) forwards; }
@keyframes mapReveal { 0%{opacity:.04;transform:scale(1.075);clip-path:circle(15% at 50% 50%);filter:blur(14px) saturate(.45)} 42%{opacity:.72;clip-path:circle(46% at 50% 50%);filter:blur(5px) saturate(.75)} 100%{opacity:1;transform:scale(1);clip-path:circle(150% at 50% 50%);filter:none} }
.trip-map { position: absolute; inset: 0; background:radial-gradient(circle at 50% 48%,#0a1114 0,#04090b 54%,#010304 100%); }
.map-vignette { position: absolute; inset: 0; z-index: 400; pointer-events: none; box-shadow: inset 0 0 190px 45px rgba(0,0,0,.88); background: radial-gradient(circle at 50% 50%, transparent 38%, rgba(0,0,0,.45)); }

.map-free-panel {
  position: absolute; z-index: 650; left: 50%; top: 50%; width: min(650px,84vw); padding: 54px 54px 46px;
  overflow: hidden; transform: translate(-50%,-50%); border: 1px solid rgba(255,222,177,.2); border-radius: 42px;
  background: linear-gradient(135deg,rgba(241,39,17,.1),rgba(20,16,14,.34) 42%,rgba(245,175,25,.1));
  box-shadow: 0 32px 110px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.13), 0 0 70px rgba(245,175,25,.06);
  text-align: center; backdrop-filter: blur(26px) saturate(1.2); -webkit-backdrop-filter: blur(26px) saturate(1.2);
  animation: panelIn .7s cubic-bezier(.2,.8,.2,1) both;
}
.map-free-panel::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 18% 0%,rgba(255,225,187,.16),transparent 32%),linear-gradient(120deg,transparent 32%,rgba(255,255,255,.06) 50%,transparent 68%); }
.map-free-glint { position:absolute; left:50%; top:25px; width:58px; height:1px; transform:translateX(-50%); background:linear-gradient(90deg,transparent,#ffd9a5,transparent); box-shadow:0 0 18px rgba(245,175,25,.8); }
.map-free-panel[hidden], .continue-story[hidden] { display: none; }
.map-free-panel p { position:relative; margin:0 0 30px; color:#f0d2b5; font:400 clamp(32px,4vw,56px)/1.05 "Cormorant Garamond",Georgia,serif; text-shadow:0 8px 38px rgba(0,0,0,.38); }
.map-free-panel .map-free-copy-line { font:inherit!important;line-height:inherit;white-space:normal; }
html[data-ui-language="zh"] .map-free-panel .map-free-copy-line[data-ui-lang-zh] { display:inline-block;font-family:var(--font-zh-sans)!important;font-size:clamp(24px,2.8vw,40px)!important;font-weight:300!important;line-height:1.35;letter-spacing:.22em; }
.map-free-panel button, .continue-story { position:relative; min-height:44px; padding:12px 25px; border:1px solid rgba(245,175,25,.38); border-radius:999px; background:linear-gradient(135deg,rgba(241,39,17,.13),rgba(245,175,25,.11)); color:#ffd59b; box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 30px rgba(0,0,0,.22); cursor:pointer; font-size:9px; font-weight:600; letter-spacing:.28em; transition:transform .3s,background .3s,box-shadow .3s; }
.map-free-panel button:hover { transform:translateY(-2px); background:linear-gradient(135deg,rgba(241,39,17,.24),rgba(245,175,25,.2)); box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 13px 38px rgba(0,0,0,.3),0 0 24px rgba(245,175,25,.13); }
.continue-story:hover { transform:translateX(-50%) translateY(-2px); background:linear-gradient(135deg,rgba(241,39,17,.24),rgba(245,175,25,.2)); box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 13px 38px rgba(0,0,0,.3),0 0 24px rgba(245,175,25,.13); }
.continue-story { position: absolute; z-index: 650; left: 50%; bottom: 32px; transform: translateX(-50%); background: rgba(2,5,7,.8); backdrop-filter: blur(12px); }
@keyframes panelIn { from{opacity:0;transform:translate(-50%,-46%)} }
.map-experience.is-exiting { animation: mapExit .9s ease forwards; }
@keyframes mapExit { to{opacity:0;transform:scale(.94);filter:blur(18px)} }

.leaflet-container { background:radial-gradient(circle at 50% 48%,#0a1114 0,#04090b 54%,#010304 100%); font-family: Montserrat,Arial,sans-serif; }
.leaflet-control-zoom { margin-right:28px !important; margin-bottom:92px !important; overflow:hidden; border:1px solid rgba(245,175,25,.24) !important; border-radius:14px !important; box-shadow:0 12px 32px rgba(0,0,0,.35) !important; }
.leaflet-control-zoom a { width:38px !important; height:38px !important; line-height:38px !important; border-color:rgba(245,175,25,.12) !important; background:rgba(7,11,12,.78) !important; color:#f5af19 !important; backdrop-filter:blur(12px); }
.leaflet-control-attribution { display: none; }
.visited-area { fill:url(#visitedAreaGradient) !important; filter:drop-shadow(0 0 5px rgba(241,39,17,.28)); }
.trip-marker { background: transparent !important; border: 0 !important; }
.marker-light { position: relative; display: block; width: 24px; height: 24px; opacity: 1; transition: opacity .35s, transform .35s; }
.marker-light::before { content:""; position:absolute; inset:7px; border:1px solid rgba(255,240,214,.78); border-radius:50%; background:radial-gradient(circle at 38% 30%,#fff8df 0 16%,#f5af19 32%,#d86b24 63%,rgba(241,39,17,.1) 76%,transparent 78%); box-shadow:0 0 8px rgba(245,175,25,.76),0 0 20px rgba(241,39,17,.24); }
.marker-light::after { content:""; position:absolute; inset:3px; border:1px solid rgba(245,175,25,.28); border-radius:50%; box-shadow:inset 0 0 7px rgba(255,236,200,.1); animation:markerBreath 2.8s ease-in-out infinite; transition:transform .35s,border-color .35s,box-shadow .35s; }
.trip-marker:hover .marker-light::after, .trip-marker.is-active .marker-light::after { transform:scale(1.65); border-color:rgba(255,214,153,.78); box-shadow:0 0 15px rgba(245,175,25,.34),inset 0 0 8px rgba(255,240,212,.18); }
.trip-map.has-active-marker .trip-marker:not(.is-active) .marker-light { opacity: .2; transform: scale(.78); }
@keyframes markerBreath { 0%,100%{transform:scale(.7);opacity:.3} 50%{transform:scale(1.2);opacity:1} }
.trip-popup .leaflet-popup-content-wrapper { width:252px; padding:0; overflow:hidden; border:0; border-radius:25px; background:transparent; color:white; box-shadow:0 22px 54px rgba(0,0,0,.48),0 0 0 1px rgba(255,221,179,.16); }
.trip-popup .leaflet-popup-content { width: auto !important; margin: 0; }
.trip-popup .leaflet-popup-tip-container, .trip-popup .leaflet-popup-close-button { display: none; }
.popup-card { position:relative; display:flex; align-items:flex-end; box-sizing:border-box; width:252px; aspect-ratio:2/3; min-height:0; padding:0; overflow:hidden; border:0; border-radius:25px; background-color:#1a201f; color:#fff; text-align:left; font:inherit; }
.popup-image,.popup-image-fallback { position:absolute;inset:0;width:100%;height:100%; }
.popup-image { z-index:0;display:block;object-fit:cover;object-position:center 21%;background:#1a201f; }
.popup-image-fallback { z-index:-1;background:radial-gradient(circle at 50% 30%,rgba(245,175,25,.22),transparent 38%),linear-gradient(155deg,#26302f,#121817 58%,#302419); }
.popup-card::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 46%,rgba(39,31,24,.025) 60%,rgba(52,41,31,.1) 78%,rgba(46,36,27,.2) 100%); }
.popup-card.is-detail-card { cursor:pointer; }
.popup-card.is-detail-card:hover .popup-city,
.popup-card.is-detail-card:focus-visible .popup-city { color:#fff;text-shadow:0 0 14px rgba(245,175,25,.42),0 1px 8px rgba(0,0,0,.5); }
.popup-card.is-detail-card:focus-visible { outline:1px solid rgba(255,218,174,.52);outline-offset:3px; }
.popup-glass { position:relative; z-index:1; isolation:isolate; box-sizing:border-box; width:100%; min-height:166px; padding:61px 17px 17px; overflow:hidden; }
.popup-glass::before { content:"";position:absolute;z-index:-2;inset:-46px -28px -30px;background-image:var(--popup-image);background-size:252px 378px;background-position:center bottom;background-repeat:no-repeat;filter:blur(22px) saturate(1.16);transform:scale(1.16);opacity:.8;mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.12) 16%,rgba(0,0,0,.42) 42%,rgba(0,0,0,.86) 72%,#000 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.12) 16%,rgba(0,0,0,.42) 42%,rgba(0,0,0,.86) 72%,#000 100%); }
.popup-glass::after { content:"";position:absolute;z-index:-1;inset:0 0 -1px;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(252,246,235,.035) 14%,rgba(241,229,211,.105) 31%,rgba(184,157,123,.22) 51%,rgba(91,72,53,.4) 76%,rgba(40,32,25,.56) 100%);backdrop-filter:blur(13px) saturate(1.14);-webkit-backdrop-filter:blur(13px) saturate(1.14);box-shadow:inset 0 -1px 0 rgba(255,238,216,.08);mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.05) 12%,rgba(0,0,0,.18) 29%,rgba(0,0,0,.46) 52%,rgba(0,0,0,.82) 76%,#000 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.05) 12%,rgba(0,0,0,.18) 29%,rgba(0,0,0,.46) 52%,rgba(0,0,0,.82) 76%,#000 100%); }
.popup-country { display:flex; align-items:center; gap:8px; margin:0 0 7px; color:#fff; font-size:9px; font-weight:600; letter-spacing:.16em; text-shadow:0 1px 8px rgba(0,0,0,.42); }
.popup-country span { white-space:nowrap; }
.popup-country em { color:#fff4e6;font-size:9px;font-style:normal;font-weight:400;letter-spacing:.12em; }
.popup-country::before { content:""; width:7px; height:7px; border:1px solid #ffd59d; border-radius:50%; box-shadow:0 0 10px rgba(245,175,25,.7); }
.popup-place { display:flex;align-items:baseline;gap:10px; }
.popup-city { margin:0; color:#fff8ee; font:500 28px/.96 "Cormorant Garamond",Georgia,serif;letter-spacing:-.01em; }
.popup-city-cn { color:#fff5e8;font-size:11px;letter-spacing:.14em;white-space:nowrap;text-shadow:0 1px 8px rgba(0,0,0,.42); }
.popup-footer { margin-top:12px; }
.popup-summary { max-width:188px;margin:0;color:#fff8ee;font:400 8.5px/1.62 Montserrat,Arial,sans-serif;letter-spacing:.035em;text-shadow:0 1px 8px rgba(0,0,0,.5); }
.map-mode-guided .leaflet-control-zoom, .map-mode-guided .trip-marker { pointer-events: none; }

/* Archive scrolltelling -------------------------------------------------- */
.archive-story { position:relative;height:480vh;background:#010304; }
.archive-stage { position:sticky;top:0;height:100vh;min-height:560px;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 50% 48%,rgba(17,25,28,.78),transparent 43%),linear-gradient(180deg,#010304 0%,#050a0c 50%,#010304 100%); }
.archive-ambient { position:absolute;inset:-18%;z-index:0;pointer-events:none;background:radial-gradient(circle at 24% 56%,rgba(245,175,25,.075),transparent 27%),radial-gradient(circle at 78% 38%,rgba(220,232,235,.055),transparent 29%);filter:blur(22px);animation:archiveAmbient 12s ease-in-out infinite alternate; }
.archive-stage::after { content:"";position:absolute;inset:0;z-index:20;pointer-events:none;box-shadow:inset 0 0 150px 28px rgba(0,0,0,.82);background:linear-gradient(180deg,rgba(1,3,4,.34),transparent 25%,transparent 76%,rgba(1,3,4,.55)); }
.archive-orbit-line { position:absolute;z-index:1;left:50%;top:68%;width:min(82vw,1320px);height:min(70vh,680px);border:1px solid rgba(227,190,140,.12);border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.86);box-shadow:0 0 55px rgba(245,175,25,.025),inset 0 0 55px rgba(221,231,234,.018);will-change:opacity,transform;mask-image:linear-gradient(180deg,#000 0%,#000 66%,transparent 94%);-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 66%,transparent 94%);transition:opacity .65s ease,filter .65s ease; }
.archive-photo-orbit { position:absolute;z-index:4;left:50%;top:68%;width:0;height:0;transition:opacity .7s ease,filter .7s ease; }
.archive-photo { position:absolute;left:0;top:0;width:clamp(62px,6.6vw,108px);aspect-ratio:1;margin:0;overflow:hidden;border:1px solid rgba(255,231,199,.16);border-radius:clamp(13px,1.45vw,22px);background:#101719;box-shadow:0 18px 42px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.025) inset;opacity:0;transform:translate(-50%,-50%) scale(.7);scale:1;will-change:transform,opacity,scale;transition:scale .38s cubic-bezier(.2,.78,.2,1),box-shadow .35s ease,filter .35s ease; }
.archive-photo img { display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.035);transition:transform .5s cubic-bezier(.2,.72,.2,1),filter .4s ease; }
.archive-photo:hover { z-index:30 !important;scale:1.14;box-shadow:0 27px 64px rgba(0,0,0,.64),0 0 34px rgba(245,175,25,.18); }
.archive-photo:hover img { transform:scale(1.055);filter:saturate(1.08) brightness(1.06); }
.archive-lockup { position:absolute;z-index:8;left:50%;top:62%;display:grid;justify-items:center;gap:20px;width:min(460px,70vw);opacity:0;transform:translate(-50%,-44%) scale(.94);text-align:center;will-change:opacity,transform;transition:opacity .55s ease,filter .55s ease; }
.archive-overline { color:rgba(224,178,119,.72);font-size:8px;font-weight:600;letter-spacing:.42em;text-indent:.42em; }
.archive-lockup h2 { margin:0;color:#ead5bd;font:400 clamp(50px,7vw,108px)/.84 "Cormorant Garamond",Georgia,serif;letter-spacing:.04em;text-shadow:0 0 36px rgba(225,176,116,.12); }
.archive-button { position:relative;display:flex;align-items:center;gap:15px;margin-top:8px;padding:13px 23px;border:1px solid rgba(239,197,143,.3);border-radius:999px;background:rgba(24,23,20,.34);color:#f2c98f;backdrop-filter:blur(12px);font:600 8px/1 Montserrat,Arial,sans-serif;letter-spacing:.28em;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 34px rgba(0,0,0,.28);transition:background .35s,color .35s,border-color .35s,box-shadow .35s,transform .35s; }
.archive-button i { width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg); }
.archive-button:hover { color:#fff4e6;border-color:rgba(255,232,200,.58);background:rgba(214,171,113,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 14px 40px rgba(0,0,0,.34),0 0 26px rgba(245,175,25,.1);transform:translateY(-2px); }
.archive-scroll-cue { position:absolute;z-index:8;left:50%;bottom:30px;display:grid;justify-items:center;gap:12px;color:#dca55f;font-size:8px;font-weight:600;letter-spacing:.34em;transform:translateX(-50%); }
.archive-scroll-cue i { width:1px;height:38px;background:linear-gradient(#dca55f,rgba(255,255,255,.8),transparent);transform-origin:top;animation:scrollPulse 1.8s ease-in-out infinite; }
.archive-stage.is-calendar-preparing .archive-photo-orbit,
.archive-stage.is-calendar .archive-photo-orbit,
.archive-stage.is-calendar-closing .archive-photo-orbit { opacity:0;filter:blur(8px);pointer-events:none; }
.archive-stage.is-calendar-preparing .archive-orbit-line,
.archive-stage.is-calendar .archive-orbit-line,
.archive-stage.is-calendar-closing .archive-orbit-line { opacity:0 !important;filter:blur(8px); }
.archive-stage.is-calendar-preparing .archive-lockup,
.archive-stage.is-calendar .archive-lockup,
.archive-stage.is-calendar-closing .archive-lockup { opacity:0 !important;filter:blur(7px);pointer-events:none; }
.archive-stage.is-calendar-preparing .archive-scroll-cue,
.archive-stage.is-calendar .archive-scroll-cue { opacity:0 !important; }

.archive-calendar { position:fixed;inset:0;z-index:40;box-sizing:border-box;padding:112px clamp(24px,4vw,74px) 42px;overflow:auto;visibility:hidden;opacity:0;pointer-events:none;transform:scale(.975);filter:blur(8px);background:radial-gradient(circle at 50% 10%,rgba(231,189,134,.07),transparent 34%),linear-gradient(180deg,rgba(3,7,9,.985),rgba(4,9,11,.995));transition:opacity .75s ease,transform .85s cubic-bezier(.2,.7,.2,1),filter .75s ease;scrollbar-width:thin;scrollbar-color:rgba(224,172,104,.35) transparent; }
.archive-stage.is-calendar-preparing .archive-calendar { visibility:visible;opacity:.22;transform:scale(.99);filter:blur(3px); }
.archive-stage.is-calendar .archive-calendar { visibility:visible;opacity:1;pointer-events:auto;transform:scale(1);filter:none; }
.archive-stage.is-calendar-closing .archive-calendar { visibility:visible;opacity:0;pointer-events:none;transform:scale(.985);filter:blur(5px); }
.archive-calendar-continue { position:fixed;z-index:55;right:clamp(24px,3vw,52px);top:92px;display:flex;align-items:center;gap:12px;padding:11px 18px;border:1px solid rgba(239,211,178,.28);border-radius:999px;background:rgba(231,217,199,.09);color:#d9c3a7;visibility:hidden;opacity:0;pointer-events:none;backdrop-filter:blur(14px);font:600 7px/1 Montserrat,Arial,sans-serif;letter-spacing:.24em;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 28px rgba(0,0,0,.24);transition:opacity .3s,visibility .3s,background .3s,color .3s,border-color .3s,transform .3s; }
.archive-stage.is-calendar .archive-calendar-continue { visibility:visible;opacity:1;pointer-events:auto; }
.archive-calendar-continue i { width:7px;height:7px;border-left:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg); }
.archive-calendar-continue:hover { color:#fff;background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.52);transform:translateX(-2px); }
.archive-calendar-header { display:flex;align-items:end;justify-content:space-between;max-width:1500px;margin:0 auto 22px;padding:0 3px 15px;border-bottom:1px solid rgba(232,197,153,.16); }
.archive-calendar-header span { color:#cf9b5e;font-size:7px;font-weight:600;letter-spacing:.38em; }
.archive-calendar-header h2 { margin:5px 0 0;color:#e7d2b9;font:400 clamp(30px,3.3vw,52px)/1 "Cormorant Garamond",Georgia,serif;letter-spacing:.04em; }
.archive-calendar-header p { margin:0;color:rgba(226,214,198,.5);font-size:8px;letter-spacing:.18em;text-transform:uppercase; }
.archive-calendar-header strong { margin-right:5px;color:#e8b779;font:500 17px/1 "Cormorant Garamond",Georgia,serif; }
.archive-calendar-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;max-width:1500px;margin:0 auto; }
.calendar-month { min-width:0;padding:10px 11px 11px;border:1px solid rgba(220,188,148,.1);border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 14px 32px rgba(0,0,0,.13);backdrop-filter:blur(9px); }
.calendar-month > header { display:flex;align-items:baseline;gap:8px;margin-bottom:7px; }
.calendar-month > header span { color:rgba(222,166,96,.5);font:400 15px/1 "Cormorant Garamond",Georgia,serif; }
.calendar-month h3 { margin:0;color:#d9c6af;font-size:7px;font-weight:600;letter-spacing:.24em; }
.calendar-weekdays,.calendar-days { display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px; }
.calendar-weekdays { margin-bottom:3px;color:rgba(213,206,196,.26);font-size:6px;text-align:center; }
.calendar-day { position:relative;min-width:0;aspect-ratio:1;border:1px solid rgba(210,205,196,.055);border-radius:4px;background:rgba(255,255,255,.012);color:rgba(220,215,207,.27);font-size:5px;overflow:visible; }
.calendar-day > span { position:absolute;z-index:1;left:3px;top:2px;text-shadow:0 1px 3px rgba(0,0,0,.7); }
.calendar-day.is-empty { border-color:transparent;background:transparent; }
.calendar-day.has-memory { border-color:rgba(231,180,113,.22);background:rgba(218,159,88,.06); }
.calendar-memory-stack { position:absolute;inset:2px;z-index:2; }
.calendar-photo { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:1px solid rgba(255,235,208,.26);border-radius:4px;box-shadow:0 5px 12px rgba(0,0,0,.38);transform:rotate(-2deg);transform-origin:center;transition:transform .35s cubic-bezier(.2,.75,.2,1),filter .35s,box-shadow .35s; }
.calendar-photo:nth-child(even) { transform:translate(2px,-1px) rotate(3deg); }
.calendar-day.has-memory:hover { z-index:30; }
.calendar-day.has-memory:hover .calendar-photo { transform:scale(1.45) rotate(0);filter:saturate(1.08) brightness(1.06);box-shadow:0 12px 30px rgba(0,0,0,.58),0 0 18px rgba(245,175,25,.14); }
.calendar-day > b { position:absolute;z-index:5;right:2px;bottom:1px;color:#fff3e2;font-size:5px;font-weight:500;text-shadow:0 1px 4px #000; }
.calendar-continue { display:grid;justify-items:center;gap:8px;margin:18px auto 0;color:rgba(220,168,102,.58);font-size:6px;font-weight:600;letter-spacing:.32em; }
.calendar-continue i { width:1px;height:22px;background:linear-gradient(#d7a05c,transparent); }
.archive-fly-photo { position:fixed;z-index:1000;margin:0;object-fit:cover;border:1px solid rgba(255,232,201,.3);box-sizing:border-box;box-shadow:0 18px 42px rgba(0,0,0,.55),0 0 22px rgba(245,175,25,.1);pointer-events:none;will-change:transform,opacity,border-radius; }
.calendar-photo-viewer { position:fixed;z-index:70;width:200px;height:160px;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 22px 32px rgba(0,0,0,.58));perspective:800px;transition:width .38s cubic-bezier(.2,.75,.2,1),height .38s cubic-bezier(.2,.75,.2,1),left .38s cubic-bezier(.2,.75,.2,1),top .38s cubic-bezier(.2,.75,.2,1); }
.calendar-photo-viewer[hidden] { display:none; }
.calendar-photo-viewer img { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border:1px solid rgba(255,238,216,.38);border-radius:12px;background:transparent;box-shadow:0 12px 28px rgba(0,0,0,.42);transform-origin:50% 95%;transition:transform .42s cubic-bezier(.18,.78,.2,1),opacity .32s,filter .32s;user-select:none;-webkit-user-drag:none; }
.calendar-photo-viewer img.is-turning { transform:translate(72%,-8%) rotate(12deg) scale(.88) !important;opacity:0;filter:brightness(1.18); }
@keyframes archiveAmbient { from{transform:translate3d(-1.5%,1%,0) scale(.98);opacity:.72} to{transform:translate3d(1.5%,-1%,0) scale(1.04);opacity:1} }

/* Melodies record shop --------------------------------------------------- */
.calendar-photo-viewer { z-index:1000; }
.melodies-story { position:relative;height:360vh;background:#070706; }
.melodies-stage { --melody-progress:0;position:sticky;top:0;height:100vh;min-height:600px;overflow:hidden;isolation:isolate;background:linear-gradient(115deg,#0b0a08 0%,#17130e 48%,#080807 100%);opacity:calc(.72 + var(--melody-progress) * .28); }
.melodies-wall { position:absolute;inset:-8%;z-index:-2;background:radial-gradient(circle at 74% 70%,rgba(196,132,66,.16),transparent 30%),linear-gradient(90deg,transparent 49.8%,rgba(255,255,255,.022) 50%,transparent 50.2%),repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 1px,transparent 1px 108px),linear-gradient(180deg,#14110d,#080807);transform:scale(1.06) translateY(calc((.5 - var(--melody-progress)) * 2vh)); }
.melodies-wall::after { content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,3,4,.95),transparent 18%),radial-gradient(ellipse at 50% 100%,transparent 20%,rgba(0,0,0,.72) 82%);box-shadow:inset 0 0 170px #000; }
.melodies-heading { position:absolute;z-index:3;left:clamp(28px,5vw,88px);top:14vh;max-width:390px;transform:translateY(calc((1 - var(--melody-progress)) * 34px));opacity:calc(.15 + var(--melody-progress) * .85); }
.melodies-heading > span { color:#bf8c52;font-size:7px;font-weight:600;letter-spacing:.42em; }
.melodies-heading h2 { margin:10px 0 4px;color:#ead7bf;font:400 clamp(54px,7vw,112px)/.8 "Cormorant Garamond",Georgia,serif;letter-spacing:.015em; }
.melodies-heading p { margin:16px 0 0;color:rgba(233,222,207,.46);font:400 9px/1.6 Montserrat,Arial,sans-serif;letter-spacing:.08em; }
.record-wall { position:absolute;z-index:4;left:clamp(24px,4vw,72px);right:clamp(24px,4vw,72px);top:35vh;display:grid;grid-template-columns:repeat(6,minmax(90px,1fr));gap:clamp(12px,1.6vw,27px);align-items:start;perspective:900px; }
.record-wall::after { content:"";position:absolute;left:-2%;right:-2%;bottom:-20px;height:10px;border-radius:3px;background:linear-gradient(180deg,#795637,#2f2116);box-shadow:0 11px 22px rgba(0,0,0,.72),inset 0 1px rgba(255,255,255,.14); }
.record-card { position:relative;min-width:0;cursor:grab;outline:none;transform:translateY(calc((1 - var(--melody-progress)) * 52px)) rotateX(calc((1 - var(--melody-progress)) * -8deg));opacity:calc(.08 + var(--melody-progress) * .92);transition:transform .38s cubic-bezier(.2,.75,.2,1),opacity .3s,filter .3s; }
.record-card:nth-child(even) { transform:translateY(calc((1 - var(--melody-progress)) * 72px)) rotateX(calc((1 - var(--melody-progress)) * -8deg)); }
.record-card:hover,.record-card:focus-visible,.record-card.is-selected { transform:translateY(-13px) rotate(-1.2deg);z-index:7; }
.record-card.is-dragging { opacity:.3; }
.record-sleeve { position:relative;aspect-ratio:1;overflow:hidden;border-radius:4px;background-image:var(--record-cover),linear-gradient(135deg,color-mix(in srgb,var(--record-accent),#111 30%),#101010 72%);background-size:cover;background-position:center;box-shadow:0 20px 30px rgba(0,0,0,.54),inset 0 0 0 1px rgba(255,255,255,.09); }
.record-sleeve.is-placeholder::before { content:"";position:absolute;width:62%;aspect-ratio:1;border:1px solid rgba(255,255,255,.16);border-radius:50%;left:19%;top:19%;box-shadow:0 0 0 14px rgba(0,0,0,.1),0 0 0 29px rgba(255,255,255,.025); }
.record-sleeve span { position:absolute;z-index:2;left:11px;top:9px;color:rgba(255,255,255,.63);font:400 19px/1 "Cormorant Garamond",serif; }
.record-sleeve i { position:absolute;right:10px;bottom:10px;width:10px;height:10px;border-radius:50%;background:var(--record-accent);box-shadow:0 0 18px var(--record-accent); }
.record-caption { display:grid;gap:3px;padding-top:10px; }
.record-caption strong { color:#e9d9c6;font:500 10px/1.2 Montserrat,Arial,sans-serif;letter-spacing:.06em; }
.record-caption small { color:rgba(224,213,199,.38);font-size:7px;letter-spacing:.08em; }
.turntable { --player-accent:#d49a52;position:absolute;z-index:6;right:clamp(34px,7vw,126px);bottom:5vh;width:min(590px,48vw);height:230px;border:1px solid rgba(233,202,162,.13);border-radius:20px;background:linear-gradient(135deg,rgba(94,64,39,.74),rgba(30,22,17,.92));box-shadow:0 32px 70px rgba(0,0,0,.64),inset 0 1px rgba(255,255,255,.1);transition:border-color .35s,box-shadow .35s,transform .35s; }
.turntable.is-drop-ready { border-color:var(--player-accent);box-shadow:0 32px 70px rgba(0,0,0,.64),0 0 38px color-mix(in srgb,var(--player-accent),transparent 62%);transform:scale(1.015); }
.turntable-copy { position:absolute;left:24px;top:24px;display:grid;gap:7px;width:190px; }
.turntable-copy span { color:var(--player-accent);font-size:6px;font-weight:600;letter-spacing:.31em; }
.turntable-copy strong { color:#f0e2d0;font:400 25px/1.03 "Cormorant Garamond",Georgia,serif; }
.turntable-copy small { color:rgba(235,224,209,.42);font-size:7px;line-height:1.5;letter-spacing:.06em; }
.turntable-deck { position:absolute;right:18px;top:12px;width:330px;height:206px; }
.platter { position:absolute;left:25px;top:5px;width:198px;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#222 0 2px,#141414 3px 5px);box-shadow:0 14px 32px #000,inset 0 0 0 7px #292723; }
.melody-disc { position:absolute;inset:10px;border-radius:50%;background:repeating-radial-gradient(circle,#111 0 2px,#1a1918 3px 4px);opacity:.34;transition:opacity .45s; }
.record-card.is-selected ~ * .melody-disc,.turntable:has(.melody-play:not(:disabled)) .melody-disc { opacity:1; }
.melody-disc > i { position:absolute;left:38%;top:38%;width:24%;aspect-ratio:1;border-radius:50%;background:var(--player-accent);box-shadow:0 0 15px rgba(255,255,255,.1); }
.turntable.is-playing .melody-disc { animation:recordSpin 2.4s linear infinite; }
.tonearm { position:absolute;right:22px;top:22px;width:80px;height:150px;transform-origin:70% 15%;transform:rotate(-9deg);transition:transform .55s cubic-bezier(.2,.75,.2,1); }
.tonearm::before { content:"";position:absolute;right:8px;top:0;width:32px;aspect-ratio:1;border-radius:50%;background:linear-gradient(#a9957d,#4f463d);box-shadow:0 5px 12px #000; }
.tonearm i { position:absolute;right:23px;top:27px;width:5px;height:117px;border-radius:5px;background:linear-gradient(90deg,#776b5c,#d3c0a6,#675d51);transform:rotate(13deg);transform-origin:top; }
.turntable.is-playing .tonearm { transform:rotate(7deg); }
.melody-play { position:absolute;right:14px;bottom:9px;display:flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.06);color:#dfcdb7;font:600 6px/1 Montserrat,sans-serif;letter-spacing:.18em;cursor:pointer; }
.melody-play:disabled { opacity:.3;cursor:default; }
.melody-play i { width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid currentColor; }
.turntable.is-playing .melody-play i { width:5px;height:7px;border:0;border-left:2px solid currentColor;border-right:2px solid currentColor; }
.full-track-link { position:absolute;left:24px;bottom:24px;display:flex;align-items:center;gap:12px;padding:12px 17px;border:1px solid rgba(244,219,185,.28);border-radius:999px;background:rgba(255,255,255,.08);color:#f0ddc5;font-size:7px;font-weight:600;letter-spacing:.18em;text-decoration:none;backdrop-filter:blur(10px);animation:trackLinkIn .6s ease both; }
.full-track-link[hidden] { display:none; }
.full-track-link i { width:7px;height:7px;border-top:1px solid;border-right:1px solid;transform:rotate(45deg); }
.melodies-hint { position:absolute;left:clamp(28px,5vw,88px);bottom:8vh;display:flex;align-items:center;gap:10px;color:rgba(222,203,179,.36);font-size:6px;font-weight:600;letter-spacing:.28em; }
.melodies-hint i { width:24px;height:1px;background:#a87641; }
.record-flight { position:fixed;z-index:2000;pointer-events:none;background-size:cover;box-shadow:0 20px 50px #000; }
@keyframes recordSpin { to{transform:rotate(360deg)} }
@keyframes trackLinkIn { from{opacity:0;transform:translateY(8px);filter:blur(4px)} to{opacity:1;transform:none;filter:none} }

@media (max-width: 900px) {
  .record-wall { top:30vh;grid-template-columns:repeat(3,1fr);gap:10px 16px; }
  .record-card:nth-child(n+4) { display:none; }
  .record-wall::after { bottom:-13px; }
  .turntable { right:4vw;bottom:4vh;width:92vw;height:220px; }
  .melodies-heading { top:11vh; }
  .melodies-hint { display:none; }
}

@media (max-width: 560px) {
  .record-wall { top:27vh;left:20px;right:20px; }
  .record-caption { display:none; }
  .turntable { height:205px; }
  .turntable-copy { width:34%;left:16px;top:18px; }
  .turntable-deck { right:4px;transform:scale(.82);transform-origin:right center; }
  .full-track-link { left:16px;bottom:18px;max-width:31%;line-height:1.5; }
}

@media (max-width: 760px) {
  .site-header { height: 82px; padding: 0 20px; }
  .site-header nav { gap: 17px; }
  .site-header nav a, .site-header nav > button, .muted-link { font-size: 8px; letter-spacing: .18em; }
  .muted-link { display: none; }
  .monogram { width: 38px; height: 38px; font-size: 28px; line-height: 34px; }
  .story { height: 960vh; }
  .orbit { width: 86vw; }
  .title-lockup h1 { font-size: clamp(48px,15vw,70px); }
  .subtitle { font-size: 7px; letter-spacing: .18em; }
  .chapter-copy p { font-size: clamp(28px,9vw,42px); }
  .story-counter { display: none; }
  .map-free-panel { padding: 32px 22px; }
  .continue-story { bottom: 18px; white-space: nowrap; }
  .trip-popup .leaflet-popup-content-wrapper { width:220px; }
  .popup-card { width:220px;min-height:0; }
  .popup-glass { min-height:154px;padding:56px 14px 14px; }
  .popup-glass::before { background-size:220px 330px; }
  .archive-orbit-line { width:92vw;height:62vh; }
  .archive-orbit-line,.archive-photo-orbit { top:66%; }
  .archive-photo { width:clamp(50px,15vw,70px);border-radius:13px; }
  .archive-lockup { top:61%;gap:15px; }
  .archive-lockup h2 { font-size:clamp(45px,15vw,68px); }
  .archive-scroll-cue { bottom:18px; }
  .archive-calendar { padding:124px 15px 26px; }
  .archive-calendar-continue { top:84px;right:15px; }
  .archive-calendar-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }
  .archive-calendar-header { margin-bottom:14px; }
  .calendar-month { padding:8px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .scroll-cue i, .marker-light::after, .archive-ambient, .archive-scroll-cue i { animation: none; }
  .archive-photo img, .archive-button { transition:none; }
}

/* Melodies v2 — quiet record shop layout ------------------------------- */
.melodies-story { height:260vh; }
.melodies-stage { display:grid;grid-template-columns:minmax(220px,23vw) minmax(420px,1fr) minmax(340px,30vw);padding:92px 3vw 28px;box-sizing:border-box;gap:0;background:#0a0806; }
.melodies-wall { inset:0;background:linear-gradient(90deg,#0b0907 0 23%,#181109 23% 70%,#26180e 70% 100%);transform:none; }
.melodies-wall::after { background:radial-gradient(circle at 54% 12%,rgba(232,178,108,.12),transparent 30%),linear-gradient(180deg,rgba(0,0,0,.15),transparent 42%,rgba(0,0,0,.48));box-shadow:inset 0 0 100px rgba(0,0,0,.9); }
.melodies-heading { position:relative;left:auto;top:auto;z-index:5;align-self:stretch;padding:62px 38px 30px 8px;max-width:none;border-right:1px solid rgba(233,199,151,.07);transform:none;opacity:1; }
.melodies-heading h2 { margin:13px 0 8px;font-size:clamp(54px,5.2vw,92px); }
.melodies-heading > strong { color:#dfc9ae;font:400 13px/1.5 Montserrat,Arial,sans-serif;letter-spacing:.05em; }
.melodies-heading > strong[data-ui-en] { font-size:13px!important; }
.melodies-heading > p { max-width:240px;margin-top:48px;color:rgba(236,224,207,.58);font-size:9px;line-height:1.9; }
.melodies-heading dl { margin:54px 0 0; }
.melodies-heading dl > div { display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08); }
.melodies-heading dt { margin:0;color:#c9a678;font-size:7px;font-weight:600;letter-spacing:.15em; }
.melodies-heading dd { display:block;min-width:2ch;margin:0;color:#efd1a7;font:500 15px/1 "Cormorant Garamond",Georgia,serif;letter-spacing:.04em;text-align:right;text-shadow:0 0 12px rgba(216,155,74,.24); }
.melodies-heading > small { position:absolute;left:8px;bottom:24px;padding-left:36px;color:rgba(239,228,214,.62);font-size:6px;line-height:1.8;letter-spacing:.13em; }
.melodies-heading > small::before { content:"";position:absolute;left:0;top:2px;width:20px;height:15px;border:1px solid #d4b181;border-radius:12px 12px 4px 4px; }
.record-wall { position:relative;left:auto;right:auto;top:auto;z-index:6;align-self:center;display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:52px 18px;padding:38px 28px 50px;perspective:1000px; }
.record-wall::before,.record-wall::after { content:"";position:absolute;left:12px;right:12px;height:11px;border-radius:2px;background:linear-gradient(#8f6137,#382214);box-shadow:0 14px 25px rgba(0,0,0,.7),inset 0 1px rgba(255,255,255,.16); }
.record-wall::before { top:47.5%; }.record-wall::after { bottom:22px; }
.record-card,.record-card:nth-child(even) { opacity:1;transform:none;transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .35s; }
.record-card:nth-child(n+5) { display:none; }
.record-card:hover,.record-card:focus-visible,.record-card.is-selected { transform:translateY(-13px) scale(1.025); }
.record-sleeve { overflow:visible;z-index:2;border-radius:3px;background-image:var(--record-cover),linear-gradient(135deg,var(--record-accent),#111);box-shadow:0 18px 30px rgba(0,0,0,.55); }
.record-sleeve::after { content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,rgba(255,255,255,.12),transparent 22% 78%,rgba(0,0,0,.18));pointer-events:none; }
.record-sleeve > span { display:none; }
.sleeve-disc { position:absolute;z-index:-1;right:3%;top:5%;width:90%;aspect-ratio:1;padding:0;border:0;border-radius:50%;background:repeating-radial-gradient(circle,#151515 0 2px,#222 3px 4px);box-shadow:0 18px 30px rgba(0,0,0,.75);cursor:grab;opacity:0;transform:translateX(0) rotate(0);transition:opacity .35s,transform .62s cubic-bezier(.18,.82,.2,1); }
.sleeve-disc i { position:absolute;inset:39%;border-radius:50%;background:var(--record-accent);box-shadow:0 0 18px color-mix(in srgb,var(--record-accent),transparent 45%); }
.record-card.is-selected .sleeve-disc { z-index:1;opacity:1;transform:translateX(52%) rotate(22deg); }
.record-card.is-disc-dragging .sleeve-disc { opacity:.28; }
.record-caption { position:absolute;z-index:3;left:10px;right:10px;bottom:9px;padding:8px;background:linear-gradient(90deg,rgba(0,0,0,.56),transparent);pointer-events:none; }
.record-caption strong { color:#fff4e6;font-size:8px; }.record-caption small { color:rgba(255,245,231,.7);font-size:6px; }
.turntable { position:relative;right:auto;bottom:auto;z-index:5;align-self:stretch;width:auto;height:auto;border-radius:3px;padding-top:30%;background:linear-gradient(145deg,rgba(94,57,30,.9),rgba(38,24,15,.98));box-shadow:inset 0 0 0 10px rgba(37,22,13,.72),inset 0 0 60px rgba(0,0,0,.55),0 25px 50px rgba(0,0,0,.5); }
.turntable-drop-copy { position:absolute;z-index:4;left:50%;top:17%;display:grid;justify-items:center;gap:13px;color:rgba(245,233,217,.72);font-size:7px;line-height:1.7;letter-spacing:.16em;text-align:center;transform:translateX(-50%);transition:opacity .35s; }
.turntable-drop-copy i { width:1px;height:45px;background:linear-gradient(rgba(255,255,255,.7),transparent); }
.turntable.has-record .turntable-drop-copy { opacity:0; }
.turntable-copy { left:26px;right:26px;top:auto;bottom:24px;width:auto;grid-template-columns:1fr auto;align-items:end;padding-top:16px;border-top:1px solid rgba(255,255,255,.09); }
.turntable-copy span { grid-column:1/-1; }.turntable-copy strong { font-size:20px; }.turntable-copy small { text-align:right; }
.turntable-deck { left:50%;right:auto;top:32%;width:min(27vw,380px);height:min(27vw,380px);transform:translate(-50%,-18%); }
.platter { left:11%;top:5%;width:78%;box-shadow:0 18px 38px #000,inset 0 0 0 8px #2f2922; }
.melody-disc { inset:8px;opacity:0;transform:scale(.75);transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1); }
.turntable.has-record .melody-disc { opacity:1;transform:scale(1); }
.tonearm { display:block;right:0;top:2%;padding:0;border:0;background:transparent;cursor:pointer; }
.tonearm:disabled { opacity:.45;cursor:default; }
.tonearm:hover:not(:disabled) { filter:brightness(1.3); }
.turntable.is-playing .tonearm { transform:rotate(7deg); }
.full-track-link { left:50%;bottom:84px;z-index:12;transform:translateX(-50%);white-space:nowrap;background:#d5a461;color:#21170d;border-color:#f0c88e; }
.full-track-link:not([hidden]) { animation:trackLinkInV2 .6s ease both; }
@keyframes trackLinkInV2 { from{opacity:0;transform:translate(-50%,9px);filter:blur(5px)} to{opacity:1;transform:translate(-50%,0);filter:none} }

@media (max-width:1000px) {
  .melodies-stage { grid-template-columns:200px 1fr 34vw;padding-left:18px;padding-right:18px; }
  .record-wall { gap:42px 12px;padding-left:18px;padding-right:18px; }
  .melodies-heading { padding-right:20px; }
}

/* Shop lighting, corrected sleeve stacking and compact counters -------- */
.melodies-stage::before { content:"";position:absolute;z-index:40;inset:0;pointer-events:none;background:radial-gradient(ellipse at 55% 4%,rgba(36,24,14,.2),#020201 58%);opacity:.97; }
.melodies-stage::after { content:"";position:absolute;z-index:39;left:25%;right:29%;top:90px;height:4px;pointer-events:none;background:#30271d;box-shadow:0 0 0 transparent;opacity:.35; }
.melodies-stage.is-lights-on::before { animation:shopBlackoutLift 1.45s cubic-bezier(.2,.7,.2,1) forwards; }
.melodies-stage.is-lights-on::after { animation:shopLightStrip 1.45s ease forwards; }
.melodies-stage:not(.is-shop-open) .record-wall,.melodies-stage:not(.is-shop-open) .turntable,.melodies-stage:not(.is-shop-open) .melodies-heading { filter:brightness(.2) saturate(.35); }
.melodies-stage.is-shop-open .record-wall,.melodies-stage.is-shop-open .turntable,.melodies-stage.is-shop-open .melodies-heading { filter:none;transition:filter 1.1s ease; }
.record-sleeve > .sleeve-front { display:block;z-index:3; }
.record-card.is-selected .sleeve-disc { z-index:1; }
.record-caption { z-index:4; }
.melodies-heading dl { width:176px;min-width:176px; }
.melodies-heading dl > div { display:grid;grid-template-columns:136px 24px;justify-content:start;align-items:center;column-gap:8px;width:168px;padding:11px 0; }
.melodies-heading dd { min-width:0;text-align:left; }
@keyframes shopBlackoutLift {
  0%{opacity:.97} 14%{opacity:.56} 22%{opacity:.9} 33%{opacity:.42} 43%{opacity:.72} 62%{opacity:.18} 100%{opacity:0}
}
@keyframes shopLightStrip {
  0%{opacity:.3;box-shadow:0 0 0 transparent} 14%{opacity:1;box-shadow:0 3px 20px #f1c181,0 20px 80px rgba(235,169,87,.24)}
  22%{opacity:.35;box-shadow:none} 33%{opacity:1;box-shadow:0 3px 18px #f1c181,0 22px 90px rgba(235,169,87,.28)}
  43%{opacity:.52} 100%{opacity:1;background:#e9c99e;box-shadow:0 2px 14px #f4d8b1,0 30px 120px rgba(225,155,73,.25)}
}
@media (max-width:760px) {
  .melodies-stage { display:block;padding:84px 16px 18px;overflow:auto; }
  .melodies-heading { height:190px;padding:14px 8px;border:0; }.melodies-heading p,.melodies-heading small { display:none; }
  .melodies-heading dl { display:block;margin:12px 0 0;max-width:220px; }
  .record-wall { grid-template-columns:repeat(2,1fr);gap:28px 12px;padding:16px 12px 42px; }
  .turntable { min-height:520px;margin-top:18px; }.turntable-deck { top:32%;width:300px;height:300px; }
}

/* Physical record handling refinements --------------------------------- */
.record-wall { grid-template-columns:repeat(2,minmax(130px,165px));justify-content:center;align-content:center;gap:72px 54px;padding-left:34px;padding-right:34px; }
.record-card,.record-card:nth-child(even) { width:100%;max-width:165px;justify-self:center; }
.record-sleeve { isolation:isolate; }
.record-sleeve::after { display:none; }
.sleeve-front { position:absolute;z-index:2;inset:0;display:block;border-radius:3px;background-image:linear-gradient(120deg,rgba(255,255,255,.1),transparent 26% 74%,rgba(0,0,0,.18)),var(--record-cover);background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);pointer-events:none; }
.sleeve-disc { z-index:1;right:4%;top:6%;width:88%;opacity:0;transform:translateX(0) rotate(0);touch-action:none;user-select:none;-webkit-user-drag:none; }
.record-card.is-selected .sleeve-disc { z-index:1;opacity:1;transform:translateX(43%) rotate(18deg); }
.sleeve-disc::before,.melody-disc::before { content:"";position:absolute;inset:7%;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 4px,rgba(255,255,255,.025) 5px 6px);pointer-events:none; }
.sleeve-disc i { inset:34%;right:34%;bottom:34%;width:auto;height:auto;z-index:2;display:block;background-color:var(--record-accent);background-image:var(--label-cover);background-size:cover;background-position:center;border:2px solid rgba(229,210,184,.28);box-shadow:0 0 18px color-mix(in srgb,var(--record-accent),transparent 45%); }
.melody-disc > i { inset:34%;width:auto;aspect-ratio:auto;z-index:2;background-size:cover;background-position:center;border:2px solid rgba(229,210,184,.28); }
.sleeve-disc.is-hand-dragging { display:block;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:repeating-radial-gradient(circle,#111 0 2px,#242424 3px 4px);box-shadow:0 28px 55px rgba(0,0,0,.72),0 0 26px rgba(224,177,116,.12);pointer-events:none;cursor:grabbing; }
body.is-holding-record,body.is-holding-record * { cursor:grabbing !important; }
.turntable.is-drop-ready { border-color:rgba(245,188,112,.72);box-shadow:inset 0 0 0 10px rgba(60,36,20,.74),inset 0 0 70px rgba(246,174,80,.18),0 0 0 2px rgba(245,175,25,.22),0 25px 55px rgba(0,0,0,.58);transform:scale(1.008); }
.turntable.is-drop-ready .turntable-drop-copy { color:#fff2de;text-shadow:0 0 15px rgba(245,175,25,.65); }
.turntable.has-record .platter { box-shadow:0 18px 38px #000,inset 0 0 0 8px #2f2922,0 0 28px rgba(245,175,25,.1); }

@media (max-width:1000px) {
  .record-wall { grid-template-columns:repeat(2,minmax(115px,145px));gap:62px 28px;padding-left:18px;padding-right:18px; }
}

/* Lab — orbiting entrance collection ----------------------------------- */
.lab-story { position:relative;height:330vh;background:#020306; }
.lab-stage { --lab-progress:0;position:sticky;top:0;height:100vh;min-height:600px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 55%,#10172a 0%,#060812 42%,#010206 82%); }
.lab-stage::before { content:"";position:absolute;z-index:8;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(15,9,5,calc(1 - var(--lab-progress))) 0%,transparent 28%),radial-gradient(ellipse at center,transparent 43%,rgba(0,0,0,.66) 100%); }
.lab-stage::after { content:"";position:absolute;z-index:9;left:50%;top:50%;width:min(76vw,1180px);aspect-ratio:1;border:1px solid rgba(168,188,232,.055);border-radius:50%;pointer-events:none;transform:translate(-50%,-50%) scale(calc(.78 + var(--lab-progress)*.22));box-shadow:0 0 0 12vw rgba(114,137,195,.012),0 0 0 26vw rgba(114,137,195,.008); }
.lab-cosmos { position:absolute;z-index:1;inset:0;width:100%;height:100%; }
.lab-nebula { position:absolute;z-index:0;width:58vw;height:46vw;border-radius:50%;pointer-events:none;mix-blend-mode:screen;filter:blur(55px);opacity:0;transition:opacity 2s ease; }
.lab-stage.is-awake .lab-nebula { opacity:.55; }
.lab-nebula-one { left:-18%;top:18%;background:radial-gradient(ellipse,rgba(80,105,178,.22),rgba(131,80,147,.12) 38%,transparent 70%);animation:nebulaDriftOne 18s ease-in-out infinite alternate; }
.lab-nebula-two { right:-17%;bottom:-17%;background:radial-gradient(ellipse,rgba(199,116,148,.15),rgba(62,139,164,.11) 42%,transparent 70%);animation:nebulaDriftTwo 22s ease-in-out infinite alternate; }
.lab-heading { position:absolute;z-index:12;left:50%;top:50%;display:grid;justify-items:center;width:min(440px,50vw);text-align:center;opacity:calc(.08 + var(--lab-progress)*.92);transform:translate(-50%,-50%) scale(calc(.92 + var(--lab-progress)*.08));pointer-events:none; }
.lab-heading > span { color:rgba(194,164,215,.7);font-size:7px;font-weight:600;letter-spacing:.48em;text-indent:.48em; }
.lab-heading h2 { margin:8px 0 11px;color:#e7d9e7;font:400 clamp(72px,9vw,146px)/.82 "Cormorant Garamond",Georgia,serif;letter-spacing:.04em;text-shadow:0 0 42px rgba(173,136,204,.18); }
.lab-heading p { margin:0;color:rgba(217,222,237,.42);font-size:8px;line-height:1.8;letter-spacing:.13em; }
.lab-universe { position:absolute;z-index:11;inset:0;opacity:calc(.05 + var(--lab-progress)*.95);transform:scale(calc(.84 + var(--lab-progress)*.16));transition:opacity .4s; }
.lab-planet { --pointer-x:0px;--pointer-y:0px;position:absolute;left:var(--planet-x);top:var(--planet-y);display:block;width:110px;height:110px;color:#e8e9f2;text-decoration:none;transform:translate(calc(-50% + var(--pointer-x)),calc(-50% + var(--pointer-y)));animation:planetFloat 7s ease-in-out infinite alternate;animation-delay:calc(var(--planet-x) * -.08);outline:none; }
.lab-planet-small { width:76px;height:76px; }.lab-planet-large { width:146px;height:146px; }
.planet-body { position:absolute;z-index:2;inset:9%;overflow:hidden;border-radius:50%;background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.75) 0 2%,var(--planet-b) 4%,var(--planet-a) 31%,color-mix(in srgb,var(--planet-a),#0a0a16 58%) 68%,#05060b 100%);box-shadow:inset -18px -14px 32px rgba(0,0,0,.68),inset 7px 5px 12px rgba(255,255,255,.15),0 0 24px color-mix(in srgb,var(--planet-a),transparent 64%),0 15px 38px rgba(0,0,0,.5);transition:transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s,filter .65s; }
.planet-body::before { content:"";position:absolute;inset:-20%;border-radius:48%;background:repeating-radial-gradient(ellipse at 28% 30%,transparent 0 8%,rgba(255,255,255,.055) 9% 10%,transparent 12% 17%);transform:rotate(-24deg); }
.planet-body::after { content:"";position:absolute;left:-35%;right:-35%;top:42%;height:19%;border:1px solid rgba(240,225,255,.32);border-radius:50%;transform:rotate(-17deg);box-shadow:0 0 8px color-mix(in srgb,var(--planet-b),transparent 55%); }
.planet-body i { position:absolute;left:29%;top:23%;width:9%;aspect-ratio:1;border-radius:50%;background:rgba(8,9,19,.3);box-shadow:24px 31px 0 4px rgba(7,8,15,.18),-9px 42px 0 1px rgba(255,255,255,.08); }
.planet-orbit { position:absolute;z-index:1;inset:-15%;border:1px solid color-mix(in srgb,var(--planet-a),transparent 74%);border-radius:50%;transform:rotate(18deg) scaleY(.36);transition:inset .6s,opacity .6s; }
.planet-orbit::after { content:"";position:absolute;right:10%;top:7%;width:5px;height:5px;border-radius:50%;background:var(--planet-b);box-shadow:0 0 13px var(--planet-b); }
.planet-copy { position:absolute;z-index:4;left:50%;top:82%;display:grid;justify-items:center;width:220px;text-align:center;opacity:0;filter:blur(5px);transform:translate(-50%,12px);transition:opacity .45s,transform .55s,filter .45s;pointer-events:none; }
.planet-copy small { color:var(--planet-b);font-size:5px;font-weight:600;letter-spacing:.3em; }
.planet-copy strong { margin-top:4px;color:#f0e8ef;font:400 21px/1 "Cormorant Garamond",Georgia,serif;letter-spacing:.04em; }
.planet-copy em { max-width:180px;margin-top:7px;color:rgba(225,227,239,.5);font:400 6px/1.5 Montserrat,Arial,sans-serif;letter-spacing:.05em; }
.planet-copy b { margin-top:9px;padding:6px 10px;border:1px solid rgba(221,217,239,.16);border-radius:999px;color:rgba(228,226,240,.62);font-size:5px;letter-spacing:.2em; }
.lab-planet.is-pointer-active,.lab-planet:focus-visible { z-index:20;animation-play-state:paused; }
.lab-planet.is-pointer-active .planet-body,.lab-planet:focus-visible .planet-body { transform:scale(1.17) rotate(5deg);filter:brightness(1.12) saturate(1.08);box-shadow:inset -18px -14px 32px rgba(0,0,0,.58),inset 7px 5px 12px rgba(255,255,255,.2),0 0 45px color-mix(in srgb,var(--planet-a),transparent 45%),0 20px 45px rgba(0,0,0,.6); }
.lab-planet.is-pointer-active .planet-orbit,.lab-planet:focus-visible .planet-orbit { inset:-30%;opacity:.85; }
.lab-planet.is-pointer-active .planet-copy,.lab-planet:focus-visible .planet-copy { opacity:1;filter:none;transform:translate(-50%,0); }
.lab-planet.is-signalling .planet-orbit { animation:planetSignal .9s ease-out; }
.lab-coordinate { position:absolute;z-index:12;right:35px;bottom:28px;display:flex;align-items:center;gap:12px;color:rgba(181,194,223,.35);font-size:5px;font-weight:600;letter-spacing:.25em; }
.lab-coordinate i { width:56px;height:1px;background:linear-gradient(90deg,rgba(176,190,222,.45),transparent); }.lab-coordinate b { color:#c4a9cf;font:400 18px/1 Georgia,serif; }
@keyframes planetFloat { from{translate:0 -7px} to{translate:0 9px} }
@keyframes nebulaDriftOne { to{transform:translate(9%,5%) scale(1.08) rotate(5deg)} }
@keyframes nebulaDriftTwo { to{transform:translate(-8%,-4%) scale(1.12) rotate(-7deg)} }
@keyframes planetSignal { 0%{transform:rotate(18deg) scaleY(.36)} 60%{transform:rotate(198deg) scale(1.7,.6);opacity:0} 100%{opacity:.6} }

@media (max-width:760px) {
  .lab-heading { width:72vw; }.lab-heading h2 { font-size:82px; }
  .lab-planet { width:72px;height:72px; }.lab-planet-large { width:98px;height:98px; }.lab-planet-small { width:54px;height:54px; }
  .planet-copy { width:150px; }.planet-copy em { display:none; }
}

/* Lab v2 — constellations of light, not solid planets ------------------ */
.lab-stage { background:radial-gradient(ellipse at 54% 52%,#21150c 0%,#0f0a07 37%,#050403 76%,#010202 100%); }
.lab-heading { left:4vw;top:17vh;justify-items:start;width:330px;text-align:left;transform:translateY(calc((1 - var(--lab-progress))*24px)); }
.lab-heading > span { color:rgba(245,175,25,.78);text-indent:0; }
.lab-heading h2 { margin:8px 0 14px;color:#edcfaa;font-size:clamp(58px,6vw,96px);letter-spacing:.16em;text-transform:uppercase;text-shadow:0 0 42px rgba(245,175,25,.13); }
.lab-heading p { color:rgba(226,220,228,.48); }
.lab-universe { transform:scale(calc(.9 + var(--lab-progress)*.1)); }
.lab-planet { width:150px;height:116px;pointer-events:none;animation:none;transform:translate(-50%,-50%); }
.lab-planet-small { width:116px;height:92px; }.lab-planet-large { width:190px;height:140px; }
.lab-planet::before{content:"";position:absolute;z-index:0;inset:-18%;border-radius:50%;pointer-events:none}
.planet-body { inset:0;overflow:visible;border-radius:0;background:none;box-shadow:none;filter:none;animation:clusterFloat 7s ease-in-out infinite alternate;transition:transform .65s,filter .65s; }
.planet-body::before { content:"";position:absolute;left:-3%;right:-3%;top:49%;height:18%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,226,188,.16),rgba(144,181,228,.055) 44%,transparent 72%);filter:blur(7px);transform:none; }
.planet-body::after { content:"";position:absolute;left:5%;right:5%;top:54%;height:32%;border:0;border-top:1px solid color-mix(in srgb,var(--planet-b),transparent 55%);border-radius:50%;transform:scaleY(.35);box-shadow:0 -3px 13px color-mix(in srgb,var(--planet-a),transparent 55%);opacity:.7; }
.planet-body > i:not(.planet-mote) { display:none; }
.planet-body > .planet-mote { position:absolute;left:var(--mote-x);right:auto;top:var(--mote-y);bottom:auto;display:block;width:var(--mote-size);height:var(--mote-size);border-radius:50%;background:color-mix(in srgb,var(--planet-a),white 22%);box-shadow:0 0 calc(var(--mote-size)*3) var(--planet-a),0 0 calc(var(--mote-size)*6) color-mix(in srgb,var(--planet-b),transparent 45%);opacity:.38;transform:translate(-50%,-50%);animation:moteBreathe 3.2s ease-in-out infinite alternate;animation-delay:var(--mote-delay);transition:transform .65s cubic-bezier(.2,.8,.2,1),opacity .5s,filter .5s; }
.planet-mote:nth-child(3n) { background:#fff5df;opacity:.8; }.planet-mote:nth-child(5n) { background:var(--planet-b); }
.planet-orbit { inset:5% -12% 3%;border-color:color-mix(in srgb,var(--planet-b),transparent 67%);transform:rotate(-8deg) scaleY(.33);opacity:.48; }
.planet-orbit::before { content:"";position:absolute;left:17%;top:4%;width:4px;height:4px;border-radius:50%;background:#fff4df;box-shadow:0 0 10px 2px var(--planet-b); }
.planet-copy { top:94%;opacity:.78;filter:none;transform:translate(-50%,0);pointer-events:auto;cursor:pointer; }
.planet-copy small,.planet-copy em,.planet-copy b { opacity:0;transform:translateY(5px);transition:opacity .4s,transform .45s; }
.planet-copy strong { position:relative;z-index:8;display:inline-block;min-width:104px;padding:8px 14px;color:#eee4ec;font-size:22px;text-shadow:0 0 15px rgba(216,186,229,.25);pointer-events:auto;cursor:pointer; }
.lab-planet.is-pointer-active .planet-body,.lab-planet:focus-visible .planet-body { transform:scale(1.08);filter:brightness(1.2);box-shadow:none; }
.lab-planet.is-pointer-active .planet-mote,.lab-planet:focus-visible .planet-mote { opacity:1;transform:translate(calc(-50% + var(--mote-drift)),calc(-50% - 4px)) scale(1.18); }
.lab-planet.is-pointer-active .planet-copy small,.lab-planet.is-pointer-active .planet-copy em,.lab-planet.is-pointer-active .planet-copy b,
.lab-planet:focus-visible .planet-copy small,.lab-planet:focus-visible .planet-copy em,.lab-planet:focus-visible .planet-copy b { opacity:1;transform:none; }
.lab-planet.is-pointer-active{z-index:20}
.lab-planet.is-pointer-active .planet-body{animation-play-state:paused}
.lab-planet.is-pointer-active .planet-body{transform:scale(1.08);filter:brightness(1.2)}
.lab-planet.is-pointer-active .planet-mote{opacity:1;transform:translate(calc(-50% + var(--mote-drift)),calc(-50% - 4px)) scale(1.18)}
.lab-planet.is-pointer-active .planet-copy small,.lab-planet.is-pointer-active .planet-copy em,.lab-planet.is-pointer-active .planet-copy b{opacity:1;transform:none}
.lab-planet.is-pointer-active .planet-orbit{inset:-10% -26%;opacity:.9}
.lab-planet.is-pointer-active .planet-copy{opacity:1;filter:none;transform:translate(-50%,0)}
.lab-planet.is-pointer-active .planet-orbit,.lab-planet:focus-visible .planet-orbit { inset:-10% -26%;opacity:.9; }
.lab-planet{will-change:transform}.planet-body{will-change:translate,transform,filter}
.lab-nebula { filter:blur(72px);mix-blend-mode:screen; }
.lab-nebula-one { background:radial-gradient(ellipse,rgba(245,175,25,.2),rgba(177,78,26,.11) 38%,transparent 70%); }
.lab-nebula-two { background:radial-gradient(ellipse,rgba(241,39,17,.12),rgba(213,143,56,.1) 42%,transparent 70%); }
.lab-stage::after { border-color:rgba(233,174,102,.05);box-shadow:0 0 0 12vw rgba(216,135,55,.01),0 0 0 26vw rgba(216,135,55,.006); }
@keyframes moteBreathe { from{opacity:.28;filter:brightness(.82);margin-top:0} to{opacity:.92;filter:brightness(1.32);margin-top:-5px} }
@keyframes clusterFloat { from{translate:0 -7px} to{translate:0 9px} }

@media (max-width:760px) {
  .lab-heading { left:24px;top:13vh;width:260px; }.lab-heading h2 { font-size:55px; }
  .lab-planet { width:104px;height:82px; }.lab-planet-large { width:132px;height:98px; }.lab-planet-small { width:82px;height:66px; }
  .planet-copy strong { font-size:16px; }
}

/* Stage — locally scoped scroll-scrubbed film -------------------------- */
.video-stage-story {
  position:relative;
  z-index:1;
  height:700vh;
  min-height:4200px;
  background:#010101;
}
.video-stage {
  --stage-progress:0;
  --stage-intro:1;
  position:sticky;
  top:0;
  height:100vh;
  min-height:560px;
  overflow:hidden;
  isolation:isolate;
  background:#010101;
  contain:paint;
}
.video-stage-film {
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  background:#010101;
  opacity:0;
  pointer-events:none;
  user-select:none;
  transition:opacity .09s linear;
}
.video-stage-film.is-active { opacity:1; }
.video-stage-shade {
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.32),transparent 24%,transparent 70%,rgba(0,0,0,.52)),
    radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.36) 100%);
}
.video-stage-copy {
  position:absolute;
  z-index:3;
  left:clamp(24px,5vw,84px);
  top:50%;
  max-width:min(560px,72vw);
  color:#f0dfc9;
  pointer-events:none;
  opacity:var(--stage-intro);
  transform:translateY(calc(-50% + (1 - var(--stage-intro)) * -24px));
  filter:blur(calc((1 - var(--stage-intro)) * 6px));
}
.video-stage-copy > span {
  color:rgba(226,167,95,.78);
  font-size:7px;
  font-weight:600;
  letter-spacing:.42em;
}
.video-stage-copy h2 {
  margin:10px 0 8px;
  font:400 clamp(64px,9vw,142px)/.82 "Cormorant Garamond",Georgia,serif;
  letter-spacing:.02em;
  text-shadow:0 12px 42px rgba(0,0,0,.58);
}
.video-stage-copy p {
  margin:22px 0 0;
  color:rgba(242,225,204,.62);
  font-size:8px;
  font-weight:500;
  letter-spacing:.32em;
  text-transform:uppercase;
}
.video-stage-status {
  position:absolute;
  z-index:4;
  left:50%;
  top:50%;
  margin:0;
  color:rgba(242,222,198,.58);
  font-size:7px;
  font-weight:600;
  letter-spacing:.3em;
  transform:translate(-50%,-50%);
  transition:opacity .35s;
}
.video-stage.is-ready .video-stage-status {
  opacity:0;
  visibility:hidden;
}
.video-stage.has-error .video-stage-status {
  color:#edb17c;
}

/* Stage selected photographs / film strip ------------------------------ */
.stage-feature-rail {
  --rail-y:110;
  --rail-opacity:0;
  position:absolute;
  z-index:7;
  inset:12vh 0 5vh;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto auto;
  align-items:center;
  color:#f4eadf;
  opacity:var(--rail-opacity);
  transform:translate3d(0,calc(var(--rail-y) * 1vh),0);
  pointer-events:none;
  visibility:hidden;
  will-change:transform,opacity;
}
.stage-feature-rail.is-present { visibility:visible; }
.stage-feature-rail.is-interactive { pointer-events:auto; }
.stage-rail-overline {
  justify-self:center;
  margin:0;
  color:rgba(240,190,125,.72);
  font-size:7px;
  font-weight:600;
  letter-spacing:.46em;
}
.stage-rail-track {
  position:relative;
  width:100%;
  height:100%;
  min-height:310px;
  overflow:visible;
}
.stage-rail-card {
  --card-offset:0;
  position:absolute;
  left:50%;
  top:50%;
  display:block;
  width:clamp(118px,14vw,214px);
  aspect-ratio:3/4;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(242,221,196,.16);
  border-radius:3px;
  background:#100d0a;
  color:#f5e6d3;
  box-shadow:0 22px 62px rgba(0,0,0,.4);
  cursor:pointer;
  opacity:1;
  filter:brightness(.34) saturate(.38);
  transform:
    translate(-50%,-50%)
    translateX(calc(var(--card-offset) * clamp(142px,18vw,278px)))
    scale(.84);
  transition:transform .55s cubic-bezier(.2,.72,.2,1),opacity .45s,filter .45s,border-color .45s;
  will-change:transform,opacity,filter;
}
.stage-rail-card.is-concealed { opacity:0;visibility:hidden;pointer-events:none; }
.stage-rail-card::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.07),transparent 22%,transparent 70%,rgba(0,0,0,.42));
}
.stage-rail-card > img,.stage-rail-card > video {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.stage-rail-card > span:not(.stage-video-placeholder) {
  position:absolute;
  z-index:2;
  left:10px;
  bottom:9px;
  color:rgba(255,242,225,.7);
  font-size:7px;
  letter-spacing:.2em;
}
.stage-rail-card.is-active {
  z-index:8 !important;
  opacity:1;
  filter:brightness(1) saturate(1);
  border-color:rgba(255,230,196,.68);
  transform:translate(-50%,-50%) translateX(0) scale(1.16);
  box-shadow:0 28px 85px rgba(0,0,0,.62),0 0 36px rgba(226,166,93,.12);
}
.stage-rail-card:focus-visible { outline:1px solid #f0bd7d;outline-offset:7px; }
.stage-rail-more {
  display:grid;
  place-content:center;
  gap:18px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 40%,rgba(229,166,91,.16),transparent 46%),
    rgba(10,8,6,.92);
}
.stage-rail-more > span {
  position:static !important;
  font:400 clamp(29px,3.3vw,48px)/1 "Cormorant Garamond",Georgia,serif !important;
  letter-spacing:.08em !important;
}
.stage-rail-more i { color:#e0a965;font:400 20px/1 Arial,sans-serif; }
.stage-rail-caption {
  display:grid;
  justify-items:center;
  gap:7px;
  min-height:48px;
  text-align:center;
}
.stage-rail-caption small { color:rgba(232,185,126,.62);font-size:6px;letter-spacing:.34em; }
.stage-rail-caption strong { font:400 clamp(15px,1.65vw,23px)/1.12 "Cormorant Garamond","Noto Serif SC Variable",Georgia,serif;letter-spacing:.05em; }
.stage-rail-controls { display:flex;align-items:center;justify-content:center;gap:13px;margin-top:10px; }
.stage-rail-controls button {
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border:1px solid rgba(239,216,190,.2);
  border-radius:50%;
  background:rgba(8,7,6,.38);
  color:#f0d9bd;
  cursor:pointer;
  transition:border-color .25s,background .25s,transform .25s;
}
.stage-rail-controls button:hover { border-color:rgba(242,190,124,.7);background:rgba(210,147,73,.16);transform:scale(1.06); }
.stage-rail-controls button:disabled { opacity:.24;cursor:default;transform:none; }
.stage-rail-controls span { min-width:56px;color:rgba(239,218,192,.5);font-size:7px;letter-spacing:.22em;text-align:center; }
.stage-video-rail { inset:15vh 0 6vh; }
.stage-video-rail .stage-rail-track {
  align-self:center;
  height:min(58vh,470px);
  min-height:300px;
  overflow:hidden;
  background:
    linear-gradient(180deg,transparent 8%,rgba(4,3,2,.94) 8% 92%,transparent 92%);
}
.stage-video-rail .stage-rail-card {
  width:auto;
  height:clamp(230px,46vh,410px);
  aspect-ratio:var(--stage-media-ratio,16/9);
  border-width:1px 0 1px 1px;
  border-radius:0;
  opacity:1;
  filter:brightness(.3) saturate(.3);
  box-shadow:none;
  transform:
    translate(-50%,-50%)
    translateX(calc(var(--card-offset) * clamp(290px,36vw,540px)))
    scale(.94);
}
.stage-video-rail .stage-rail-card:last-of-type { border-right-width:1px; }
.stage-video-rail .stage-rail-card.is-active {
  filter:brightness(1) saturate(1);
  transform:translate(-50%,-50%) translateX(0) scale(.98);
  box-shadow:0 0 42px rgba(224,166,96,.16);
}
.stage-film-strip::before,.stage-film-strip::after {
  content:"";
  position:absolute;
  z-index:20;
  left:0;
  right:0;
  height:19px;
  pointer-events:none;
  opacity:.82;
  background:
    repeating-linear-gradient(90deg,transparent 0 8px,rgba(232,218,199,.76) 8px 16px,transparent 16px 25px),
    linear-gradient(90deg,#050403,#211810,#050403);
}
.stage-film-strip::before { top:8%; }
.stage-film-strip::after { bottom:8%; }
.stage-video-placeholder {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:rgba(238,210,176,.48);
  font-size:8px;
  line-height:1.8;
  letter-spacing:.28em;
  background:radial-gradient(circle at 50% 42%,rgba(180,126,66,.17),transparent 42%),#100e0c;
}

@media (max-width:760px) {
  .video-stage-story { height:540vh;min-height:3200px; }
  .video-stage-copy { left:22px;top:43%; }
  .video-stage-copy h2 { font-size:clamp(58px,22vw,88px); }
  .video-stage-copy p { font-size:6px;letter-spacing:.23em; }
  .stage-feature-rail { inset:14vh 0 7vh; }
  .stage-rail-track { min-height:260px;overflow:hidden; }
  .stage-rail-card { width:124px;transform:translate(-50%,-50%) translateX(calc(var(--card-offset) * 115px)) scale(.78); }
  .stage-rail-card.is-active { transform:translate(-50%,-50%) scale(1.08); }
  .stage-video-rail .stage-rail-card { width:205px; }
  .stage-video-rail .stage-rail-card {
    width:auto;
    height:clamp(205px,38vh,280px);
    transform:translate(-50%,-50%) translateX(calc(var(--card-offset) * 78vw)) scale(.92);
  }
  .stage-video-rail .stage-rail-card.is-active { transform:translate(-50%,-50%) scale(.97); }
  .stage-rail-caption strong { font-size:16px; }
}

@media (prefers-reduced-motion:reduce) {
  .video-stage-copy { filter:none; }
}

/* Finale — time stream into an endless particle sea -------------------- */
.finale-story { position:relative;height:680vh;background:#010202; }
.finale-stage { --finale-progress:0;--finale-text-one:0;--finale-text-two:0;position:sticky;top:0;height:100vh;min-height:600px;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 50% 50%,#171008 0%,#070504 34%,#010202 78%); }
.finale-stage::before { content:"";position:absolute;z-index:1;inset:-20%;pointer-events:none;background:radial-gradient(ellipse at 25% 58%,rgba(245,175,25,.07),transparent 29%),radial-gradient(ellipse at 76% 38%,rgba(211,224,236,.045),transparent 31%);filter:blur(28px);animation:finaleAmbient 13s ease-in-out infinite alternate; }
.finale-stage::after { content:"";position:absolute;z-index:20;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(2,3,3,.35),transparent 20%,transparent 77%,rgba(1,2,2,.48));box-shadow:inset 0 0 160px 32px rgba(0,0,0,.74); }
.finale-canvas { position:absolute;z-index:9;inset:0;width:100%;height:100%;pointer-events:none; }
.finale-time-stream { position:absolute;z-index:5;inset:0;pointer-events:none; }
.finale-memory { position:absolute;left:0;top:0;width:clamp(62px,7vw,118px);aspect-ratio:1;margin:0;overflow:hidden;border:1px solid rgba(255,231,199,.18);border-radius:13px;background:#111;box-shadow:0 12px 28px rgba(0,0,0,.5);contain:paint;visibility:hidden; }
.finale-memory-journey { aspect-ratio:4/3;border-radius:10px; }.finale-memory-melody { border-radius:3px; }
.finale-memory img { display:block;width:100%;height:100%;object-fit:cover; }
.finale-entry-token { position:absolute;left:0;top:0;padding:8px 12px;border:1px solid color-mix(in srgb,var(--token-color),transparent 64%);border-radius:999px;background:color-mix(in srgb,var(--token-color),transparent 91%);color:color-mix(in srgb,var(--token-color),white 32%);font:500 7px/1 Montserrat,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;box-shadow:0 0 22px color-mix(in srgb,var(--token-color),transparent 78%);white-space:nowrap;will-change:transform,opacity; }
.finale-core { position:absolute;z-index:8;left:50%;top:50%;width:78px;aspect-ratio:1;border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.2);background:radial-gradient(circle,#fff 0 3%,#ffd49d 8%,#f5af19 18%,rgba(241,39,17,.34) 43%,transparent 72%);filter:blur(.3px);box-shadow:0 0 35px #f5af19,0 0 110px rgba(241,39,17,.36); }
.finale-core i,.finale-core b { position:absolute;inset:-44%;border:1px solid rgba(246,193,123,.22);border-radius:50%;animation:finaleCoreOrbit 6s linear infinite; }.finale-core b { inset:-85%;border-color:rgba(224,229,234,.1);animation-direction:reverse;animation-duration:9s; }
.finale-copy { position:absolute;z-index:14;left:50%;top:50%;display:grid;justify-items:center;width:min(850px,84vw);text-align:center;transform:translate(-50%,-50%);pointer-events:none; }
.finale-copy h2 { margin:0;color:#ead8c0;font:400 clamp(52px,7.4vw,118px)/.9 "Cormorant Garamond",Georgia,serif;letter-spacing:.025em;opacity:var(--finale-text-one);filter:blur(calc((1 - var(--finale-text-one))*12px));transform:translateY(calc((1 - var(--finale-text-one))*18px));text-shadow:0 0 38px rgba(245,175,25,.12); }
.finale-copy p { margin:25px 0 0;color:rgba(232,189,132,.72);font-size:9px;font-weight:500;letter-spacing:.42em;text-indent:.42em;text-transform:uppercase;opacity:var(--finale-text-two);filter:blur(calc((1 - var(--finale-text-two))*8px));transform:translateY(calc((1 - var(--finale-text-two))*14px)); }
.finale-progress { position:absolute;z-index:14;left:36px;bottom:27px;display:flex;align-items:center;gap:13px;color:rgba(221,183,133,.28);font-size:5px;font-weight:600;letter-spacing:.27em;opacity:calc(1 - var(--finale-text-one)); }
.finale-progress i { width:70px;height:1px;background:linear-gradient(90deg,rgba(225,170,99,.35),transparent); }
@keyframes finaleAmbient { to{transform:translate(3%,-2%) scale(1.06);opacity:.75} }
@keyframes finaleCoreOrbit { to{transform:rotate(360deg)} }

@media (max-width:760px) {
  .finale-story { height:580vh; }.finale-memory { width:62px; }.finale-copy h2 { font-size:50px; }.finale-copy p { font-size:7px;letter-spacing:.27em; }.finale-progress { left:18px;bottom:18px; }
}

@media (prefers-reduced-motion:reduce) {
  .finale-stage::before,.finale-core i,.finale-core b { animation:none; }
}

/* Finale v2 — cinematic depth, quiet glow and cross-fade --------------- */
.finale-story { z-index:2;margin-top:-100vh;height:650vh;background:transparent; }
.finale-stage { --finale-entry:0;opacity:var(--finale-entry);background:radial-gradient(circle at 50% 50%,#110c07 0%,#050403 34%,#010202 75%); }
.finale-stage::before { inset:-10%;background:radial-gradient(ellipse at 50% 50%,rgba(245,175,25,.035),transparent 38%);filter:blur(35px);animation:none; }
.finale-stage::after { background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.42) 82%),linear-gradient(180deg,rgba(2,3,3,.12),transparent 28%,transparent 76%,rgba(1,2,2,.32));box-shadow:inset 0 0 120px 15px rgba(0,0,0,.55); }
.finale-memory { width:clamp(54px,6.2vw,102px);border-color:rgba(255,231,199,.12);box-shadow:0 12px 28px rgba(0,0,0,.48);transform-origin:center; }
.finale-memory img { opacity:0;transition:opacity .2s ease; }
.finale-memory.is-image-ready img { opacity:1; }
.finale-core { width:52px;background:radial-gradient(circle,#fffaf0 0 4%,rgba(255,224,181,.94) 7%,rgba(245,175,25,.31) 21%,rgba(245,175,25,.085) 43%,transparent 72%);filter:blur(.15px);box-shadow:0 0 24px rgba(255,229,194,.34),0 0 82px rgba(245,175,25,.14),0 0 170px rgba(241,39,17,.055); }
.finale-core i,.finale-core b { display:none; }
.finale-core { display:none; }
.finale-copy { width:min(920px,92vw);opacity:var(--finale-outro,1);filter:blur(calc((1 - var(--finale-outro,1))*8px)); }
.finale-copy h2 { white-space:nowrap;font-size:clamp(34px,4.5vw,72px);line-height:1;color:#ead9c4;letter-spacing:.045em;text-shadow:0 0 30px rgba(245,175,25,.1); }
.finale-copy p { margin-top:19px;font-size:7px;letter-spacing:.38em; }
.finale-sound { position:absolute;z-index:30;left:50%;bottom:38px;padding:10px 16px;border:1px solid rgba(239,202,154,.25);border-radius:999px;background:rgba(35,27,19,.4);color:rgba(240,210,172,.76);font:600 6px/1 Montserrat,Arial,sans-serif;letter-spacing:.24em;transform:translateX(-50%);backdrop-filter:blur(10px);cursor:pointer; }
.finale-sound[hidden] { display:none; }

@media (max-width:760px) {
  .finale-copy h2 { font-size:clamp(27px,8vw,42px);letter-spacing:.015em; }
  .finale-copy p { font-size:6px; }
}

/* Lab performance pass ------------------------------------------------- */
.lab-stage { contain:paint; }
.lab-stage::after { display:none; }
.lab-universe { transform:none; }
.lab-nebula { filter:blur(42px);mix-blend-mode:normal;transform:translateZ(0);will-change:transform,opacity; }
.planet-body > .planet-mote { right:auto;bottom:auto;box-shadow:0 0 calc(var(--mote-size)*4) color-mix(in srgb,var(--planet-a),transparent 28%);transform:translate3d(-50%,-50%,0);transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .4s;will-change:transform,opacity; }
.lab-stage:not(.is-awake) .lab-nebula,.lab-stage:not(.is-awake) .lab-planet,.lab-stage:not(.is-awake) .planet-mote { animation-play-state:paused; }
.archive-stage:not(.is-active) .archive-ambient,.archive-stage:not(.is-active) .archive-scroll-cue i{animation-play-state:paused}
@keyframes moteBreathe { from{opacity:.26} to{opacity:.86} }