:root{--ink: #171912;--cream: #f0eadc;--paper: #e8dfcf;--gold: #c69b5c;--muted: #a5a08f;--line: rgba(240, 234, 220, .2);--serif: "Noto Serif SC", "Songti SC", serif;--sans: "Inter", "PingFang SC", sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--ink)}body{margin:0;overflow-x:hidden;color:var(--cream);background:var(--ink);font-family:var(--serif)}button,a{color:inherit}a{text-decoration:none}::selection{color:var(--ink);background:var(--gold)}.grain{position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.026;background-size:180px 180px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}.progress{position:fixed;z-index:110;top:0;left:0;width:100%;height:2px;background:#ffffff14}.progress span{display:block;width:0;height:100%;background:var(--gold);transition:width .12s linear}.topbar{position:fixed;z-index:90;top:0;left:0;width:100%;padding:28px 4vw;display:flex;align-items:center;justify-content:space-between;font-family:var(--sans);font-size:10px;letter-spacing:.24em;mix-blend-mode:difference}.brand span{color:var(--gold)}.chapter-indicator{display:flex;gap:12px;align-items:center;text-transform:uppercase}.chapter-indicator i{display:block;width:32px;height:1px;background:currentColor;opacity:.45}.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:#302a1e}.hero-image,.hero-shade{position:absolute;inset:0;width:100%;height:100%}.hero-image{object-fit:cover;animation:heroDrift 18s ease-out both}@keyframes heroDrift{0%{transform:scale(1.08)}to{transform:scale(1)}}.hero-shade{background:linear-gradient(90deg,#0c0e0ad1,#0c0e0a61 46%,#0c0e0a26 75%),linear-gradient(0deg,rgba(12,14,10,.78) 0%,transparent 55%)}.hero-copy{position:relative;z-index:2;width:min(780px,90vw);margin:0 0 10vh 8vw}.eyebrow,.section-label,.memory-kicker,.finale-kicker{font-family:var(--sans);font-size:10px;font-weight:500;letter-spacing:.28em;text-transform:uppercase}.eyebrow{margin:0 0 28px;color:#fff9}h1{max-width:760px;margin:0;font-size:clamp(54px,7.4vw,118px);font-weight:500;line-height:1.08;letter-spacing:-.055em}h1 em{color:var(--gold);font-weight:400;font-style:normal}.hero-lead{margin:32px 0;color:#ffffffb8;font-size:clamp(14px,1.3vw,18px);line-height:2;letter-spacing:.06em}.enter{width:170px;margin-top:22px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.5);display:flex;justify-content:space-between;font-family:var(--sans);font-size:11px;letter-spacing:.18em;transition:width .4s ease,color .4s ease}.enter:hover{width:205px;color:var(--gold)}.hero-caption{position:absolute;z-index:2;right:4vw;bottom:5vh;writing-mode:vertical-rl;font-size:10px;letter-spacing:.22em;color:#ffffff8c}.reveal{opacity:0;transform:translateY(26px);animation:revealUp 1.2s .35s cubic-bezier(.2,.7,.2,1) forwards}.delay-1{animation-delay:.55s}.delay-2{animation-delay:.8s}.delay-3{animation-delay:1.05s}@keyframes revealUp{to{opacity:1;transform:translateY(0)}}.prologue{min-height:100svh;padding:15vh 8vw 10vh;display:flex;flex-direction:column;justify-content:space-between;background:var(--paper);color:var(--ink)}.section-label{color:#7c745f}.prologue-grid{display:grid;grid-template-columns:1.4fr .65fr;gap:10vw;align-items:end;margin:10vh 0}.big-quote{margin:0;font-size:clamp(48px,6.5vw,100px);line-height:1.28;letter-spacing:-.05em}.big-quote em,.interlude h2 em{color:#9f743c;font-style:normal}.prose{font-size:15px;line-height:2.2;color:#4b4b42}.prose p{margin:0 0 24px}.prose strong{color:var(--ink);font-weight:600}.years{display:flex;align-items:center;gap:20px;color:#777365;font-size:12px}.years i{flex:1;height:1px;background:#17191233}.memory{position:relative;min-height:110svh;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);align-items:center;gap:7vw;padding:14vh 7vw;overflow:hidden}.memory-reverse{grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);background:#202218}.memory-reverse .memory-visual{order:2}.memory-reverse .memory-copy{order:1}.memory-visual{position:relative;height:72vh;min-height:520px;overflow:hidden;background:#292a23;box-shadow:0 35px 100px #00000054}.memory-visual:after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.11);pointer-events:none}.memory-visual img{width:100%;height:115%;object-fit:cover;transform:translateY(-7%)}.memory-visual img.failed{display:none}.chat-visual{background:#e8e8e8}.chat-visual img{height:100%;object-fit:contain;transform:none}.photo-placeholder{position:absolute;inset:0;padding:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 45%,rgba(198,155,92,.14),transparent 30%),linear-gradient(135deg,#303228,#1b1d17)}.photo-placeholder:before,.photo-placeholder:after{content:"";position:absolute;background:#ffffff1a}.photo-placeholder:before{width:1px;height:30%}.photo-placeholder:after{height:1px;width:23%}.photo-index{position:absolute;top:26px;left:28px;font-family:var(--sans);color:var(--gold);font-size:11px;letter-spacing:.2em}.photo-placeholder p{margin:0 0 8px;font-size:18px;letter-spacing:.1em}.photo-placeholder small{max-width:320px;color:var(--muted);font-size:11px;line-height:1.8;letter-spacing:.08em}.memory-copy{position:relative;z-index:2}.memory-kicker{display:block;margin-bottom:28px;color:var(--gold)}.memory h2{margin:0;font-size:clamp(42px,5vw,76px);line-height:1.32;font-weight:500;letter-spacing:-.045em}.memory-copy>p{max-width:520px;margin:32px 0 60px;font-size:15px;line-height:2.1;color:#aaa99f}.film-meta{padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;color:#797c70;font-family:var(--sans);font-size:9px;letter-spacing:.15em}.interlude{min-height:100svh;padding:14vh 8vw;display:flex;flex-direction:column;justify-content:center;color:var(--ink);background:#d3c2a6}.section-label.light{position:absolute;align-self:flex-start;margin-top:-68vh;color:#756753}.interlude-small{margin:0 0 35px;color:#6d6455;font-size:14px;letter-spacing:.15em}.interlude h2{max-width:1150px;margin:0;font-weight:500;font-size:clamp(44px,6.8vw,105px);line-height:1.32;letter-spacing:-.055em}.detail-list{margin:12vh 0 0 auto;width:min(650px,100%)}.detail{padding:22px 0;display:grid;grid-template-columns:70px 1fr;border-top:1px solid rgba(23,25,18,.22);font-size:14px;letter-spacing:.04em}.detail b{color:#916e3d;font-family:var(--sans);font-size:10px}.memory-wide{min-height:120svh;display:block;padding:14vh 7vw}.memory-wide .memory-visual{width:72%;height:82vh}.memory-wide .memory-copy{width:48%;margin:-28vh 0 0 auto;padding:70px;background:#171912f5;box-shadow:0 30px 80px #00000059}.empty-frame{display:grid;place-items:center;background:linear-gradient(135deg,#2b2d25,#171913)}.empty-frame:before{content:"";position:absolute;inset:34px;border:1px solid rgba(240,234,220,.18)}.empty-frame-inner{position:relative;z-index:1;max-width:78%;text-align:center}.empty-frame-inner span{color:var(--gold);font-family:var(--sans);font-size:9px;letter-spacing:.32em}.empty-frame-inner p{margin:28px 0;font-size:clamp(28px,4vw,60px);line-height:1.55;letter-spacing:-.035em;text-wrap:balance}.empty-frame-inner small{color:#7f8177;font-size:11px;letter-spacing:.12em}.letter{min-height:120svh;padding:14vh 7vw;background:#0f110e;background-image:radial-gradient(circle at 15% 20%,rgba(198,155,92,.08),transparent 30%)}.letter-paper{width:min(1050px,100%);margin:0 auto;padding:7vw 9vw;color:#28271f;background:#e5ddce;box-shadow:0 50px 130px #00000073;transform:rotate(-.35deg)}.letter-heading{display:flex;justify-content:space-between;padding-bottom:25px;border-bottom:1px solid rgba(23,25,18,.2);color:#7c725e;font-family:var(--sans);font-size:9px;letter-spacing:.18em}.letter-body{margin-top:7vh;font-size:clamp(17px,1.55vw,22px);line-height:2.25}.letter-body p{margin:0 0 30px}.letter-body em{color:#8c642e;font-style:normal;border-bottom:1px solid #b39873}.signature{margin-top:7vh!important;text-align:right;font-size:clamp(24px,2.5vw,36px);font-family:"STKaiti","KaiTi",var(--serif)}.finale{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden;background:#12140f}.finale-glow{position:absolute;width:80vw;height:80vw;border-radius:50%;background:radial-gradient(circle,rgba(198,155,92,.13),transparent 62%)}.finale-content{position:relative;z-index:2;transition:opacity .65s ease,transform .65s ease,visibility .65s}.finale.completed .finale-content{opacity:0;visibility:hidden;transform:translateY(-24px) scale(.98);pointer-events:none}.finale-kicker{color:var(--gold)}.finale h2{margin:25px 0 48px;font-size:clamp(46px,6.3vw,92px);font-weight:500;line-height:1.28;letter-spacing:-.05em}.hold-wrap{display:flex;flex-direction:column;align-items:center;gap:18px}.hold-wrap>p{color:#6f7267;font-family:var(--sans);font-size:10px;letter-spacing:.18em}.hold-button{position:relative;width:120px;height:120px;border:0;border-radius:50%;padding:0;cursor:pointer;color:var(--cream);background:transparent;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.hold-button svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}.ring-bg,.ring-progress{fill:none;stroke-width:1}.ring-bg{stroke:#fff3}.ring-progress{stroke:var(--gold);stroke-width:2;stroke-dasharray:339.3;stroke-dashoffset:339.3;transition:stroke-dashoffset .08s linear}.hold-button span{position:relative;font-family:var(--serif);font-size:14px;letter-spacing:.15em;line-height:1.7}.hold-button small{color:var(--muted);font-family:var(--sans);font-size:8px}.confession{position:absolute;z-index:4;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:scale(.96);transition:opacity 1.15s .32s,transform 1.15s .32s,visibility 1.15s .32s;background:radial-gradient(circle at 50% 45%,#493820,#242117 32%,#12140f 70%)}.confession.show{opacity:1;visibility:visible;transform:scale(1)}.confession-title{display:flex;align-items:baseline;justify-content:center;white-space:nowrap;margin:0 24px 32px}.confession-title p,.confession-title h2{margin:0;font-size:clamp(46px,10vw,156px);font-weight:500;line-height:1.12;letter-spacing:-.055em}.confession-title p{color:var(--gold)}.confession span{color:#aaa99e;letter-spacing:.12em}.confession button{margin-top:70px;padding:10px 0;border:0;border-bottom:1px solid #777;color:#aaa99e;background:transparent;cursor:pointer;font-family:var(--sans);font-size:10px;letter-spacing:.16em}.petal{position:absolute;z-index:5;top:-30px;width:8px;height:13px;border-radius:70% 0;background:#caa66d;opacity:.7;animation:fall var(--duration) linear forwards}@keyframes fall{to{transform:translate(var(--drift),110vh) rotate(620deg);opacity:0}}footer{padding:24px 4vw;display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.08);color:#686a60;background:#0d0f0c;font-family:var(--sans);font-size:8px;letter-spacing:.2em}.scroll-reveal{opacity:0;transform:translateY(38px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}.scroll-reveal.visible{opacity:1;transform:translateY(0)}@media(max-width:820px){.topbar{padding:22px 20px}.chapter-indicator i{width:18px}.hero-copy{margin:0 24px 11vh}.hero-shade{background:linear-gradient(0deg,#0c0e0ae6,#0c0e0a1a 80%)}.hero-caption{display:none}.prologue{padding:13vh 24px 8vh}.prologue-grid{grid-template-columns:1fr;gap:8vh}.memory,.memory-reverse{min-height:auto;grid-template-columns:1fr;gap:8vh;padding:13vh 24px}.memory-reverse .memory-visual{order:1}.memory-reverse .memory-copy{order:2}.memory-visual{height:64vh;min-height:430px}.interlude{padding:14vh 24px}.section-label.light{position:static;margin:0 0 14vh}.detail-list{margin-top:9vh}.detail{grid-template-columns:45px 1fr;line-height:1.8}.memory-wide{padding:12vh 0}.memory-wide .memory-visual{width:100%;height:70vh}.memory-wide .memory-copy{width:calc(100% - 32px);margin:-12vh 0 0 auto;padding:42px 28px}.letter{padding:10vh 16px}.letter-paper{padding:50px 28px;transform:none}.letter-heading span:last-child{display:none}.finale{padding:12vh 24px}footer{gap:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.scroll-reveal{opacity:1;transform:none}}
