#landscape{position:fixed;inset:0;overflow:hidden;z-index:-3;background:#142b3e}.scenery{position:absolute;inset:-2%;isolation:isolate;animation:scene-in .65s ease-out both}.layer{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 47%;pointer-events:none}.layer-far{animation:far-drift 45s ease-in-out infinite alternate}.layer-mid{animation:mid-drift 38s ease-in-out infinite alternate}.layer-near{animation:near-drift 42s ease-in-out infinite alternate}.scene-light,.scene-tint,.particles{position:absolute;inset:0;pointer-events:none}.scene-light{background:radial-gradient(ellipse at 59% 38%,#e7bb8319,transparent 55%);animation:light-breathe 13s infinite alternate}.scene-tint{background:linear-gradient(130deg,#d7a59f0c,transparent 55%,#8dafd609)}.variant-warm .scene-tint{background:linear-gradient(115deg,#e7bb8326,transparent 70%)}.variant-cool .scene-tint{background:linear-gradient(120deg,#8dafd618,transparent 70%)}.recollection .scene-tint{background:#d7a59f16}.art-object{position:absolute;right:12%;bottom:18%;width:62px;opacity:.8;transform:rotate(-8deg)}.edge-shade{pointer-events:none;position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,#10182777 0,transparent 30%,#10182718 43%,#101827ee 100%),radial-gradient(ellipse at center,transparent 34%,#10182766 100%)}.film-grain{position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.5' d='M0 0h140v140H0z'/%3E%3C/svg%3E")}
#topbar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:calc(18px + env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) 12px max(22px,env(safe-area-inset-left));z-index:3}.top-home{font:28px Georgia,serif;letter-spacing:.02em;width:48px;padding:0;text-align:left}.top-actions{display:flex;align-items:center;gap:8px}.icon-button{width:44px;height:44px;display:grid;place-items:center;border:1px solid #f4efe724;border-radius:50%;background:#10182725;backdrop-filter:blur(5px)}.icon-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.3}.icon-button[aria-pressed=true]{color:var(--amber);border-color:#e7bb8355}.top-label{letter-spacing:.16em;font-size:10px;color:#eee7ddbf;padding-right:12px}
#ui{min-height:100svh;min-height:100dvh;outline:none}.title-view{min-height:100svh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;text-align:center;padding:calc(118px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom))}.title-art{margin:auto 0 30px}.title-overline{font-size:9px;letter-spacing:.45em;color:#f4efe7b3}.title-logo{font:clamp(130px,18vw,220px)/1 Georgia,"Times New Roman",serif;letter-spacing:.06em;text-indent:.06em;font-weight:400;text-shadow:0 2px 50px #10182735;margin:8px 0 12px}.title-subtitle{font-family:var(--serif);font-size:clamp(16px,2vw,21px);letter-spacing:.16em;line-height:2}.title-en{font:11px Georgia,serif;letter-spacing:.25em;text-transform:uppercase;margin-top:16px;color:#f4efe7b3}.title-menu{width:min(275px,85vw);display:flex;flex-direction:column;gap:3px;margin:0 auto 22px}.title-foot{color:#bec8ccd0;font-size:10px;letter-spacing:.13em;line-height:2.2}.title-foot span{display:block}.title-view .title-menu{margin-top:auto}
.story-view{min-height:100svh;min-height:100dvh;display:flex;flex-direction:column;justify-content:space-between;padding:calc(103px + env(safe-area-inset-top)) max(26px,env(safe-area-inset-right)) calc(22px + env(safe-area-inset-bottom)) max(26px,env(safe-area-inset-left))}.chapter-header{max-width:1040px;width:100%;margin:0 auto;display:flex;justify-content:space-between;align-items:start;gap:15px}.chapter-caption{font:13px var(--serif);letter-spacing:.13em;margin-top:5px;line-height:1.8}.age-stamp{font:44px/.9 Georgia,serif;color:#e8dfcdbf;text-align:right}.age-stamp small{display:block;font:9px var(--sans);letter-spacing:.3em;margin-top:10px}.story-body{width:min(680px,100%);margin:clamp(80px,16vh,180px) auto 0;position:relative}.scene-kicker{font-size:10px;letter-spacing:.15em;color:var(--amber);padding-bottom:16px}.narrative{width:100%;text-align:left;padding:0;display:block;min-height:155px}.prose{font:clamp(17px,1.5vw,20px)/2.15 var(--serif);letter-spacing:.065em;white-space:pre-line;display:block;text-shadow:0 1px 10px #101827;overflow-wrap:anywhere}.next-hint{display:flex;gap:12px;align-items:center;justify-content:flex-end;font-size:10px;letter-spacing:.18em;color:#d0c7b9;margin-top:23px;min-height:28px}.next-arrow{width:25px;height:1px;background:var(--amber);position:relative}.next-arrow:after{content:'';position:absolute;right:0;top:-2px;width:5px;height:5px;border-right:1px solid var(--amber);border-top:1px solid var(--amber);transform:rotate(45deg)}.story-footer{display:flex;align-items:center;justify-content:space-between;margin-top:23px;border-top:1px solid #f4efe71c;padding-top:12px;gap:16px}.story-footer button{font-size:10px;letter-spacing:.12em;padding:0 4px}.chapter-progress{display:flex;gap:6px}.chapter-progress i{width:17px;height:2px;background:#f4efe727}.chapter-progress i.past{background:#e7bb8380}.chapter-progress i.current{background:var(--amber)}.page-number{font-size:9px;letter-spacing:.13em;color:var(--muted)}.choices-layout{max-height:65dvh;overflow:auto;padding:0 3px 2px;margin:0 -3px;scrollbar-width:thin;scrollbar-color:#8dafd640 transparent}.choices-intro{font:17px/1.9 var(--serif);letter-spacing:.06em;margin-bottom:17px}.choice-note{font-size:10px;color:var(--muted);line-height:1.8;letter-spacing:.05em;margin-top:10px}.choice-confirm{display:flex;gap:12px;align-items:center;margin-top:15px}.choice-confirm .primary{flex:1}.choice-confirm .text-button{flex-shrink:0}
.record-view{width:min(1060px,100%);margin:0 auto;padding:calc(128px + env(safe-area-inset-top)) 32px calc(48px + env(safe-area-inset-bottom));min-height:100dvh;background:linear-gradient(180deg,#10182755,#101827dd 35%)}.record-head{max-width:650px;margin:0 auto 45px;text-align:center}.record-head h1{font:clamp(27px,4vw,42px)/1.6 var(--serif);letter-spacing:.12em;margin:12px 0 23px}.record-head .reflection{font:16px/2.2 var(--serif);letter-spacing:.05em}.record-menu{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:28px auto 35px}.lives-columns{display:grid;grid-template-columns:1fr 1fr;gap:64px}.life-column{border-left:1px solid #e7bb8366;padding-left:26px;position:relative}.life-column.b{border-color:#8dafd680}.life-column h2{font:26px Georgia,serif;letter-spacing:.16em;color:var(--amber)}.life-column.b h2{color:var(--blue)}.life-summary{margin:16px 0 22px;font:14px/2 var(--serif);letter-spacing:.05em}.timeline-item{position:relative;padding:0 0 28px}.timeline-item:before{content:'';position:absolute;left:-30px;top:8px;width:7px;height:7px;background:var(--amber);border-radius:50%;box-shadow:0 0 12px #e7bb8366}.b .timeline-item:before{background:var(--blue);box-shadow:0 0 12px #8dafd666}.timeline-age{font:24px Georgia,serif;color:var(--amber);padding-right:10px}.b .timeline-age{color:var(--blue)}.timeline-item h3{font:16px/1.8 var(--serif);margin:7px 0}.timeline-location{color:var(--muted);font-size:10px;line-height:1.8}.record-section{margin-top:26px;padding-top:19px;border-top:1px solid var(--hair)}.record-section h3{font-size:11px;color:var(--amber);letter-spacing:.15em;margin-bottom:10px}.record-section p{font:14px/2 var(--serif)}.memory-list{font:13px/2.1 var(--serif);padding-left:18px;margin:0}.parallel-end{margin:46px auto 0;max-width:650px;text-align:center;font:17px/2.3 var(--serif);letter-spacing:.06em}.parallel-end:before{content:'';display:block;width:80px;height:1px;background:linear-gradient(90deg,var(--amber),var(--blue));margin:0 auto 25px}.single-life{max-width:630px;margin:auto}.compare-legend{display:flex;justify-content:center;gap:30px;margin:10px 0;color:var(--muted);font-size:11px}.compare-legend span:first-child{color:var(--amber)}.compare-legend span:last-child{color:var(--blue)}
@media(min-width:1000px){.story-view{padding-bottom:42px}.story-body{width:650px;margin-right:max(9vw,90px);margin-left:auto}.title-view{padding-top:110px}.title-art{margin-top:8vh}.title-menu{margin-bottom:30px}.title-foot{position:absolute;bottom:30px;left:35px;text-align:left}.edge-shade{background:linear-gradient(180deg,#10182766,transparent 35%,#101827db 100%),radial-gradient(ellipse at center,transparent,#10182788)}}
@media(max-width:600px){.title-view{padding-top:calc(105px + env(safe-area-inset-top))}.title-art{margin-bottom:35px}.title-logo{font-size:145px}.title-subtitle{font-size:15px;letter-spacing:.1em}.title-menu{width:246px}.title-foot{font-size:9px}.top-label{display:none}.record-view{padding-left:24px;padding-right:24px}.record-head{margin-bottom:32px}.record-head .reflection{font-size:15px}.lives-columns{display:block}.life-column{padding-left:23px;margin-bottom:45px}.life-column.b{margin-top:42px}.timeline-item:before{left:-27px}.compare-legend{display:none}.story-body{margin-top:25vh}.prose{font-size:17px;line-height:2.05}.scene-kicker{padding-bottom:12px}.story-footer{margin-top:17px}.choices-layout{max-height:65dvh}.choices-intro{font-size:15px}.title-en{margin-top:14px}}
@media(max-height:720px){.title-view{padding-top:83px;padding-bottom:14px}.title-logo{font-size:112px;margin:8px 0}.title-art{margin:0 0 25px}.title-subtitle{font-size:14px}.title-overline{font-size:8px}.title-en{font-size:9px;margin-top:8px}.title-menu{margin-bottom:12px;gap:0}.title-foot{font-size:8px}.title-foot span:last-child{display:none}.story-view{padding-top:90px;padding-bottom:15px}.story-body{margin-top:10vh}.prose{font-size:16px;line-height:1.95}.narrative{min-height:135px}.scene-kicker{font-size:9px;padding-bottom:10px}.next-hint{margin-top:12px}.story-footer{margin-top:10px;padding-top:8px}.age-stamp{font-size:36px}.choices-layout{max-height:64dvh}.choices-intro{font-size:14px;margin-bottom:10px}}

.choosing .story-body{margin-top:clamp(18px,6vh,65px)}.choosing .choices-layout{max-height:calc(100dvh - 240px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.scenery[data-scene="cafe"] .petals{inset:7% 15% 34%;overflow:hidden}

body[data-scene-tone="light"] .edge-shade{background:linear-gradient(180deg,#10182780,transparent 26%,#10182740 45%,#101827f5 100%),radial-gradient(ellipse at center,transparent 35%,#10182788)}
