:root{
  --moon:#f4f1ea; --moon2:#ebe6db; --ink:#232a3d; --ink2:#5b6378;
  --mist:#b9c6d9; --night:#1b2540; --night2:#2c3a5e; --gold:#d9c08a; --gold2:#b89a5b;
  --serif:"Songti SC","Noto Serif SC","Noto Serif CJK SC","Source Han Serif SC","STSong","SimSun",serif;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Noto Sans SC","Noto Sans CJK SC","Microsoft YaHei",sans-serif;
  --sb:env(safe-area-inset-bottom,0px); --st:env(safe-area-inset-top,0px);
  --ease:cubic-bezier(.22,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--night);line-height:1.7;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
body.locked{overflow:hidden}
img{max-width:100%;display:block}
button,input{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[hidden]{display:none!important}

/* ---------- type ---------- */
.eyebrow{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink2);font-family:var(--sans)}
.eyebrow--light{color:rgba(232,236,246,.62)}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:.08em}
h2{font-size:clamp(24px,6.4vw,36px);line-height:1.35;margin:.5em 0 .4em}
.chap{max-width:680px;margin:0 auto 32px;padding:0 24px}
.chap__lead{color:var(--ink2);font-size:15px;max-width:30em}
.tag{display:inline-block;font-style:normal;font-size:10px;letter-spacing:.12em;padding:1px 6px;border:1px solid currentColor;border-radius:3px;opacity:.7;vertical-align:2px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:48px;padding:0 26px;border-radius:999px;letter-spacing:.18em;font-size:15px;transition:transform .2s var(--ease),background .3s,box-shadow .3s;text-decoration:none;user-select:none}
.btn:active{transform:scale(.97)}
.btn--gold{background:linear-gradient(180deg,#e7d3a2,#cdb072);color:#2a2414;box-shadow:0 6px 24px -8px rgba(217,192,138,.7),inset 0 1px 0 rgba(255,255,255,.6)}
.btn--line{border:1px solid rgba(35,42,61,.35);color:var(--ink)}
.btn--light,.night .btn--line,.wcard .btn--line{border-color:rgba(232,236,246,.4);color:#eef1f8}
.btn--ghost{background:rgba(255,255,255,.08);color:#eef1f8;border:1px solid rgba(255,255,255,.18)}
.btn--sm{min-height:44px;padding:0 16px;font-size:13px;letter-spacing:.1em}
.iconbtn{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:26px;color:#fff;background:rgba(20,26,44,.45);border:1px solid rgba(255,255,255,.18)}

/* ---------- music ---------- */
.music{position:fixed;z-index:60;top:calc(12px + var(--st));right:12px;display:flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 8px;border-radius:999px;background:rgba(20,27,46,.5);border:1px solid rgba(255,255,255,.16);color:#eef1f8;font-size:12px;letter-spacing:.12em;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .6s}
.music.show{opacity:1;pointer-events:auto}
.music::before{content:"";position:absolute;inset:-4px}
.music__disc{width:24px;height:24px;border-radius:50%;background:radial-gradient(circle,var(--gold) 0 3px,#11182b 3.5px 6px,#2a3556 6.5px 7px,#11182b 7.5px);box-shadow:0 0 0 1px rgba(255,255,255,.2)}
.music.on .music__disc{animation:spin 4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- 01 sky ---------- */
.sky{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;color:#eef1f8;background:#24335a}
.sky__bg,.sky__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sky__bg img{transform:scale(1.08);transition:transform 2.4s var(--ease),filter 2.4s}
.sky.open .sky__bg img{transform:scale(1)}
.sky::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(20,28,52,.35),transparent 30%,transparent 70%,rgba(20,28,52,.45));}
.sky__stage{position:absolute;inset:0}
.sky__hero{position:absolute;left:50%;top:53%;width:min(40vw,24vh,240px);transform:translate(-50%,-50%);filter:drop-shadow(0 10px 30px rgba(10,16,34,.35));animation:breathe 5.5s ease-in-out infinite;transform-origin:50% 90%;z-index:1}
@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-51.2%) scale(1.02)}}
.sky__svg{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible}
.star{cursor:pointer;outline:none}
.star .hit{fill:transparent}
.star .halo{transition:opacity .6s}
.star .core{transition:fill .6s}
.star:focus-visible .ring{opacity:1}
.star .ring{fill:none;stroke:var(--gold);stroke-width:1;opacity:0}
.thread{fill:none;stroke:#e9eef8;stroke-width:.8;stroke-linecap:round}
.cline{stroke:var(--gold);stroke-width:1;stroke-linecap:round;opacity:.75}

.intro{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;padding:0 24px calc(56px + var(--sb));background:linear-gradient(180deg,transparent 40%,rgba(18,26,48,.55));transition:opacity 1s var(--ease)}
.intro .eyebrow{color:rgba(232,236,246,.7);margin-bottom:8px}
.intro__title{font-size:clamp(34px,10vw,56px);letter-spacing:.42em;margin-right:-.42em;line-height:1.2;text-shadow:0 2px 20px rgba(10,16,34,.4)}
.intro__sub{font-family:var(--serif);font-size:15px;letter-spacing:.12em;margin:14px 0 28px;color:rgba(240,243,250,.9)}
.intro__note{margin-top:18px;font-size:11px;letter-spacing:.2em;color:rgba(232,236,246,.55)}
.sky.open .intro{opacity:0;pointer-events:none}
.sky:not(.open) .sky__svg{opacity:0}
.sky__svg{transition:opacity 1.2s}

.skyui{position:absolute;z-index:4;inset:0;padding:calc(18px + var(--st)) 24px 0;text-align:left;pointer-events:none;animation:fadein 1.2s .6s both}
.skyui__count{font-family:var(--serif);font-size:15px;letter-spacing:.14em;margin-top:6px}
.skyui__count b{color:var(--gold);font-weight:500;font-size:20px}
.skyui__hint{position:absolute;left:50%;bottom:calc(78px + var(--sb));transform:translateX(-50%);font-size:13px;letter-spacing:.14em;padding:8px 16px;border-radius:999px;background:rgba(18,26,48,.5);border:1px solid rgba(233,215,166,.35);white-space:nowrap;transition:opacity .5s}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.scrollcue{position:absolute;z-index:4;left:50%;bottom:calc(18px + var(--sb));transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;color:rgba(238,241,248,.75);font-size:12px;letter-spacing:.2em;text-decoration:none;opacity:0;transition:opacity .8s;padding:6px 12px}
.sky.open .scrollcue{opacity:1}
.scrollcue i{width:1px;height:18px;background:linear-gradient(rgba(238,241,248,.8),transparent);animation:cue 2.4s ease-in-out infinite}
.scrollcue.done{color:var(--gold)}
@keyframes cue{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1)}}

/* ---------- surfaces ---------- */
.paper{position:relative;background:var(--moon);padding:88px 0 96px}
.paper::before,.night::before,.cake::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='.9'/></svg>");mix-blend-mode:multiply}
.night{position:relative;background:linear-gradient(180deg,#24335a,#1b2540 60%,#1f2a48);color:#eef1f8;padding:88px 0 96px}
.night .chap__lead{color:rgba(232,236,246,.72)}
.night::before{mix-blend-mode:screen;opacity:.05}

/* ---------- 03 albums ---------- */
.shelf{list-style:none;max-width:980px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:repeat(2,1fr);gap:40px 18px}
@media(min-width:760px){.shelf{grid-template-columns:repeat(3,1fr);gap:56px 40px}}
.rec{position:relative}
.rec button{display:block;width:100%;text-align:left}
.rec__sleeve{position:relative;aspect-ratio:1;margin-right:14%}
.rec__vinyl{position:absolute;top:4%;bottom:4%;right:-16%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#d9c08a 0 9%,#151a28 9.5% 11%,#22293d 11.5% 30%,#151a28 30.5% 31%,#22293d 31.5% 48%,#151a28 48.5% 49.5%,#1a2033 50%);box-shadow:0 6px 18px -6px rgba(20,24,40,.5);transition:transform .6s var(--ease)}
.rec__cover{position:relative;width:100%;height:100%;object-fit:cover;background:var(--moon2);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 14px 28px -14px rgba(27,37,64,.55),0 2px 6px rgba(27,37,64,.15)}
.rec:nth-child(3n+2) .rec__sleeve{rotate:-1.2deg}
.rec:nth-child(3n) .rec__sleeve{rotate:.9deg}
.rec button:hover .rec__vinyl,.rec button:focus-visible .rec__vinyl{transform:translateX(10%) rotate(30deg)}
.rec__t{font-family:var(--serif);font-size:15px;line-height:1.4;margin-top:14px;letter-spacing:.04em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rec__m{font-size:11px;letter-spacing:.2em;color:var(--ink2);margin-top:4px}
.imgfail{display:grid;place-items:center;background:repeating-linear-gradient(45deg,var(--moon2) 0 8px,#e4ded1 8px 16px);color:var(--ink2);font-size:12px;letter-spacing:.1em}

/* ---------- modals ---------- */
.modal{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:24px;animation:mIn .35s var(--ease)}
.modal.closing{animation:mOut .25s var(--ease) forwards}
@keyframes mIn{from{opacity:0}to{opacity:1}}
@keyframes mOut{to{opacity:0}}
.modal__veil{position:absolute;inset:0;background:rgba(12,17,32,.66);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.wcard{position:relative;width:min(100%,420px);padding:30px 26px 22px;border-radius:6px;color:#eef1f8;background:linear-gradient(170deg,rgba(44,58,94,.96),rgba(27,37,64,.97));border:1px solid rgba(233,215,166,.28);box-shadow:0 30px 60px -20px rgba(0,0,0,.6);touch-action:pan-y}
.wcard::before{content:"✦";position:absolute;top:-13px;left:50%;transform:translateX(-50%);color:var(--gold);font-size:18px;text-shadow:0 0 12px rgba(233,215,166,.8)}
.wcard__no{font-size:11px;letter-spacing:.32em;color:var(--gold);text-align:center}
.wcard__text{font-family:var(--serif);font-size:clamp(18px,5vw,21px);line-height:1.8;letter-spacing:.04em;margin:18px 0 16px;min-height:3.6em}
.wcard__from{font-size:13px;color:rgba(232,236,246,.7);text-align:right}
.wcard__nav{display:flex;justify-content:space-between;gap:8px;margin-top:24px}
.wcard__nav .btn{flex:1;padding:0 8px}
.wcard.swap .wcard__text,.wcard.swap .wcard__from{animation:fadein .35s var(--ease)}

.viewer{flex-direction:column;padding:0;background:#11172a;color:#eef1f8;justify-content:flex-start;overflow-y:auto}
.viewer__top{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;width:100%;padding:calc(10px + var(--st)) 12px 10px 20px;background:linear-gradient(#11172a,rgba(17,23,42,0))}
.viewer__pos{font-size:12px;letter-spacing:.24em;color:rgba(232,236,246,.7)}
.viewer__track{flex:none;width:100%;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;outline:none}
.viewer__track::-webkit-scrollbar{display:none}
.viewer__slide{flex:0 0 100%;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;padding:0 20px}
.viewer__slide img,.viewer__slide .ph{width:auto;max-width:min(100%,560px);max-height:62svh;max-height:62vh;object-fit:contain;box-shadow:0 20px 40px -20px rgba(0,0,0,.7);transition:opacity .25s}
.viewer__slide .ph{width:min(100%,420px);aspect-ratio:4/5;border:1px dashed rgba(232,236,246,.3);display:grid;place-items:center;text-align:center;color:rgba(232,236,246,.6);font-size:13px;letter-spacing:.1em;padding:20px}
.viewer__slide figcaption{font-size:12px;color:rgba(232,236,246,.6);margin-top:12px;letter-spacing:.08em}
.viewer__arrow{position:absolute;top:38%;z-index:3}
.viewer__arrow--l{left:10px}.viewer__arrow--r{right:10px}
.viewer__info{width:100%;max-width:560px;margin:0 auto;padding:22px 24px calc(40px + var(--sb))}
.viewer__info h3{font-size:22px;line-height:1.4}
.viewer__meta{font-size:12px;letter-spacing:.24em;color:var(--gold);margin:6px 0 12px}
.viewer__note{font-family:var(--serif);color:rgba(232,236,246,.85)}
.viewer__tracks{margin-top:14px;padding-left:1.6em;color:rgba(232,236,246,.75);font-size:14px;columns:2;column-gap:24px}
@media(max-width:420px){.viewer__tracks{columns:1}}

/* ---------- 04 game ---------- */
.arena{position:relative;width:min(calc(100% - 32px),460px);aspect-ratio:4/5;max-height:72svh;margin:0 auto;border-radius:4px;overflow:hidden;background:radial-gradient(ellipse at 50% 0%,#33467a,#1b2540 70%);border:1px solid rgba(233,215,166,.22);touch-action:pan-y;user-select:none;-webkit-user-select:none}
  .arena.playing{touch-action:none}
#gcv{position:absolute;inset:0;width:100%;height:100%;display:block}
.arena__veil{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:rgba(18,25,46,.35)}
.arena__tip{font-size:12px;color:rgba(232,236,246,.55);letter-spacing:.1em}
.arena__hud{position:absolute;top:12px;left:14px;right:14px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.dots{list-style:none;display:flex;gap:7px}
.dots li{width:9px;height:9px;border-radius:50%;border:1px solid rgba(233,215,166,.6);transition:background .3s,box-shadow .3s}
.dots li.on{background:var(--gold);box-shadow:0 0 8px rgba(233,215,166,.9)}
.arena__n{font-family:var(--serif);font-size:14px;letter-spacing:.1em}
.arena__n b{color:var(--gold);font-weight:500}
.arena__ctrl{position:absolute;bottom:10px;right:10px;display:flex;gap:8px}
.ticket{max-width:520px;margin:48px auto 0;padding:0 24px;text-align:center;animation:fadein .8s var(--ease)}
.ticket__h{font-size:22px;margin:6px 0 18px}
.ticket__form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ticket__form input{flex:1 1 180px;min-width:0;max-width:280px;height:48px;padding:0 18px;border-radius:999px;border:1px solid rgba(233,215,166,.4);background:rgba(255,255,255,.06);color:#fff;font-size:16px;outline:none}
.ticket__form input::placeholder{color:rgba(232,236,246,.5)}
.ticket__out{margin-top:24px}
.ticket__out img{width:min(100%,360px);margin:0 auto;border-radius:6px;box-shadow:0 20px 50px -20px rgba(0,0,0,.7)}
.ticket__out figcaption{font-size:12px;color:rgba(232,236,246,.55);margin:10px 0 14px;letter-spacing:.1em}

/* ---------- 05 letter ---------- */
.diary{max-width:980px;margin:0 auto;padding:0 20px;display:grid;gap:44px}
@media(min-width:860px){.diary{grid-template-columns:1.05fr 1fr;align-items:start}}
.diary__photos{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.ph-card{position:relative;background:#fff;padding:8px 8px 34px;box-shadow:0 12px 24px -14px rgba(27,37,64,.45),0 1px 3px rgba(27,37,64,.12)}
.ph-card img,.ph-card .ph{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--moon2)}
.ph-card .ph{display:grid;place-items:center;text-align:center;color:var(--ink2);font-size:12px;letter-spacing:.1em;border:1px dashed rgba(35,42,61,.25);padding:10px}
.ph-card figcaption{position:absolute;left:10px;right:10px;bottom:8px;font-family:var(--serif);font-size:12px;color:var(--ink2);letter-spacing:.06em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-card--main{grid-column:1/6;rotate:-1.5deg}
.ph-card--main img,.ph-card--main .ph{aspect-ratio:1}
.ph-card--main::before,.ph-card--main::after{content:"";position:absolute;width:70px;height:20px;background:rgba(217,192,138,.45);top:-8px}
.ph-card--main::before{left:-14px;transform:rotate(-30deg)}.ph-card--main::after{right:-14px;transform:rotate(28deg)}
.ph-card--s{grid-column:span 2}
.ph-card--s:nth-of-type(2){rotate:2deg;margin-top:-14px}
.ph-card--s:nth-of-type(3){rotate:-1deg;margin-top:6px}
.ph-card--s:nth-of-type(4){rotate:1.6deg;margin-top:-4px}
.ph-card--s figcaption{white-space:normal;line-height:1.4;font-size:11px}
.ph-card--s{padding-bottom:44px}
.ph-card .tag{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.8);color:var(--ink2)}
.note{position:relative;background:#fbf9f4;padding:34px 28px 30px;box-shadow:0 18px 40px -26px rgba(27,37,64,.5);background-image:repeating-linear-gradient(transparent 0 31px,rgba(116,136,170,.16) 31px 32px);background-position:0 18px}
.note h3{font-size:18px;line-height:1.5;margin-bottom:14px;letter-spacing:.06em}
.note p{font-family:var(--serif);font-size:16px;line-height:32px;color:#2d3447;margin-bottom:0;text-indent:2em}
.note .sig{text-align:right;text-indent:0;margin-top:14px;color:var(--ink2)}
.note .tag{position:absolute;top:12px;right:14px;color:var(--ink2)}
.tour{max-width:980px;margin:72px auto 0;padding:0 20px;display:grid;gap:28px}
@media(min-width:760px){.tour{grid-template-columns:240px 1fr;gap:48px;align-items:start}}
.tour__poster{max-width:220px}
.tour__poster img{box-shadow:0 14px 30px -18px rgba(27,37,64,.6)}
.tour__poster figcaption{font-size:11px;color:var(--ink2);margin-top:8px;letter-spacing:.1em}
.tour__h{font-size:18px;margin-bottom:10px}
.tour__list{list-style:none;border-top:1px solid rgba(35,42,61,.15)}
.tour__list li{display:grid;grid-template-columns:52px 44px 1fr;gap:8px;padding:11px 0;border-bottom:1px solid rgba(35,42,61,.1);font-size:14px;align-items:baseline}
.tour__list .d{font-family:var(--serif);color:var(--gold2);letter-spacing:.04em}
.tour__list .c{font-family:var(--serif)}
.tour__list .v{color:var(--ink2);font-size:13px}
.tour__list li.me{background:linear-gradient(90deg,rgba(217,192,138,.18),transparent)}
.tour__list li.me .v::after{content:"  · 我在这一站";color:var(--gold2)}
.tour__fine{font-size:11px;color:var(--ink2);margin-top:10px;letter-spacing:.1em}

/* ---------- cake ---------- */
.cake{position:relative;background:linear-gradient(180deg,#1f2a48,#161d33);color:#eef1f8;padding:88px 0 80px;text-align:center}
.cake::before{mix-blend-mode:screen;opacity:.05}
.cake .chap{text-align:left}
.cake .chap__lead{font-family:var(--serif);color:rgba(240,230,205,.86)}
.cake__photo{position:relative;width:min(calc(100% - 32px),720px);margin:0 auto;aspect-ratio:1408/768;overflow:hidden;border-radius:3px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8);background:#141b30}
.cake__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 1.4s var(--ease)}
.cake__off{opacity:0}
.cake.out .cake__off{opacity:1}
.cake.out .cake__on{opacity:0}
.cake__glow{position:absolute;left:50%;top:36%;width:34%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,206,130,.32),rgba(255,190,110,.1) 40%,transparent 70%);mix-blend-mode:screen;animation:flick 2.2s ease-in-out infinite;transition:opacity 1s}
.cake.out .cake__glow{opacity:0;animation:none}
@keyframes flick{0%,100%{opacity:.9;transform:translate(-50%,-50%) scale(1)}30%{opacity:.75;transform:translate(-50%,-51%) scale(.96)}60%{opacity:1;transform:translate(-50%,-49.5%) scale(1.03)}}
.cake__specks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cake__small{font-size:11px;letter-spacing:.14em;color:rgba(232,236,246,.45);margin:14px 0 26px}
.cake.out #blow{opacity:.4;pointer-events:none}

/* ---------- end ---------- */
.end{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 30%,#2c3a5e,#141a2e 70%);color:#f3efe4;text-align:center;overflow:hidden}
.end__sky{position:absolute;inset:0;width:100%;height:100%}
.end__inner{position:relative;padding:40px 24px calc(40px + var(--sb))}
.end__cake{display:block;width:44px;height:44px;margin:0 auto 34px;opacity:0;transition:opacity 1.2s;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44' fill='none' stroke='%23d9c08a' stroke-width='1.2' stroke-linecap='round'><path d='M10 26h24v10H10z'/><path d='M10 30c3 2 5 2 8 0s5-2 8 0 5 2 8 0'/><path d='M22 26v-7'/><path d='M22 15c-1.4 1.5-1.4 3 0 3.6 1.4-.6 1.4-2.1 0-3.6z' fill='%23d9c08a' fill-opacity='.35'/><path d='M6 37h32'/></svg>") center/contain no-repeat}
.end__line{font-family:var(--serif);font-size:clamp(22px,6.2vw,34px);letter-spacing:.18em;line-height:1.6;opacity:0;transform:translateY(10px);transition:opacity 1.6s var(--ease),transform 1.6s var(--ease)}
.end__line--b{color:var(--gold);margin-top:10px}
.end .show{opacity:1;transform:none}
#again{margin-top:48px;opacity:0;transition:opacity 1s}
#again.show{opacity:1}

.foot{background:#141a2e;color:rgba(232,236,246,.5);font-size:11px;letter-spacing:.1em;text-align:center;padding:28px 20px calc(28px + var(--sb));line-height:2}

/* reveal */
.rv{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}

.intro__by{margin:10px 0 0;font-family:var(--serif);font-size:15px;letter-spacing:.14em;color:#f3d79a;text-shadow:0 1px 10px rgba(10,16,34,.55)}
.life__h{margin:0 0 18px;font-family:var(--serif);font-weight:500;font-size:clamp(20px,5vw,26px);letter-spacing:.08em;color:var(--ink)}
.note__ph{color:var(--ink2);font-style:italic;border-left:2px dashed rgba(35,42,61,.25);padding-left:12px}
.sky:not(.open) .sky__hero{top:40%}
.sky__hero{transition:top 1.2s var(--ease)}