:root{--paper: #f7f6f3;--white: #fbfbfa;--ink: #1c1c1c;--ink-soft: #3a3835;--muted: #8a8680;--line: #e3ddd4;--line-strong: #d4cec4;--gold: #b6a27a;--serif: "Cormorant Garamond", "Palatino Linotype", Palatino, serif;--sans: "Outfit", "Avenir Next", "Segoe UI", sans-serif;color-scheme:light}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--white);color:var(--ink);font-family:var(--sans);font-weight:400}button{font:inherit;color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}::selection{background:#e7e1d4}app-root{display:block;min-height:100vh;min-height:100dvh}.intro{position:fixed;inset:0;z-index:5;display:grid;place-items:center;background:var(--white)}.copy{position:relative;z-index:1;text-align:center;max-width:640px;padding:24px}.mark,.for,.story,.enter{animation:rise 1.4s ease both}.for{animation-delay:1.15s}.story{animation-delay:2.15s}.enter{animation-delay:3.25s}.mark{margin:0 0 18px;font-family:var(--sans);font-weight:300;font-size:clamp(4.2rem,13vw,8.5rem);letter-spacing:.12em;line-height:.9}.for{margin:0 0 22px;font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.8rem,3.4vw,2.7rem)}.story p{margin:0;font-family:var(--serif);font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.45;color:var(--ink-soft)}.enter{margin-top:36px;min-width:148px;min-height:48px;padding:0 28px;background:transparent;border:1px solid var(--ink);letter-spacing:.32em;text-transform:uppercase;font-size:.72rem;cursor:pointer}.enter:focus-visible,.enter:active{background:var(--ink);color:var(--white)}.enter:disabled{cursor:default}.split{position:absolute;inset:0;z-index:2;display:flex;opacity:0;pointer-events:none}.intro.opening .split{opacity:1}.intro.opening .copy{opacity:0;transition:opacity .35s ease}.half{flex:1;background:var(--white)}.half.left{box-shadow:inset -1px 0 #1c1c1c14}.half.right{box-shadow:inset 1px 0 #1c1c1c14}.intro.opening .half.left{animation:leave-left 1.45s cubic-bezier(.77,0,.18,1) .12s forwards}.intro.opening .half.right{animation:leave-right 1.45s cubic-bezier(.77,0,.18,1) .12s forwards}.world{height:100vh;height:100dvh;background-color:var(--paper);background-image:linear-gradient(to right,rgba(28,28,28,.04) 1px,transparent 1px),linear-gradient(to bottom,rgba(28,28,28,.04) 1px,transparent 1px);background-size:48px 48px}.corridor{height:100%;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:16px;padding:28px 16px 56px}.corridor app-door-slab{width:min(68vw,230px);height:min(46vh,320px);flex:0 0 auto}.viewport{position:relative;height:100%;overflow:hidden}.viewport:before{content:"";position:absolute;inset:22px;border:1px solid rgba(28,28,28,.06);pointer-events:none}.stage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--fit, 1));transform-origin:center center;background:#fffcf8b8;box-shadow:0 30px 70px #1c18120d}.stage.is-finale{pointer-events:none;animation:zoom-out 7.4s cubic-bezier(.45,.05,.2,1) forwards}app-door-slab{display:block}app-door-slab.abs{position:absolute}.door{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer}.door:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.face{position:absolute;inset:0 0 6px;background:#fffcf8;border:1px solid var(--line-strong);box-shadow:inset 0 0 0 7px #f7f4ee,inset 0 0 0 8px #e4dfd6,7px 14px 24px #1c18120d}.door:active .face{transform:translateY(1px)}.panel{position:absolute;inset:14px 12px 16px;border:1px solid rgba(28,28,28,.06)}.num{position:absolute;inset:0;display:grid;place-items:center;font-weight:300;font-size:.92rem;letter-spacing:.16em}.corridor .num{font-size:1.35rem;letter-spacing:.28em}.handle,.swing-handle{position:absolute;top:54%;right:16%;width:2px;height:16px;background:var(--ink)}.sill{position:absolute;right:0;bottom:0;left:0;height:6px;background:#e6e1d8}.door.visited .sill{background:var(--gold)}.overlay{position:fixed;inset:0;z-index:20;display:grid;overflow:auto;background:var(--white)}.room-body{width:100%;margin:auto;animation:room-in .9s ease .42s both}.overlay.closing .room-body{animation:room-out .35s ease forwards}.close{position:fixed;z-index:30;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));min-height:44px;padding:0 16px;background:#fffcf8;border:1px solid var(--ink);letter-spacing:.24em;text-transform:uppercase;font-size:.68rem;cursor:pointer}.close:focus-visible{outline:1px solid var(--ink);outline-offset:3px}.swing{position:fixed;z-index:24;top:50%;left:50%;width:min(280px,54vw);height:min(72vh,620px);background:var(--white);border:1px solid var(--line-strong);box-shadow:inset 0 0 0 10px #f7f4ee,inset 0 0 0 11px #e4dfd6;transform-origin:left center;pointer-events:none;animation:door-open 1.05s cubic-bezier(.7,.05,.25,1) forwards}.overlay.closing .swing{animation:door-close .62s ease forwards}.room-title{margin-bottom:22px}.plate{margin:0 0 10px;color:var(--muted);font-size:.72rem;letter-spacing:.28em}.title-words,.subhead,.finale-line,.finale-love,.tulip-note h2{font-family:var(--serif);font-weight:500}.title-words{margin:0;font-size:clamp(2.4rem,5vw,4.2rem);line-height:.95}.title-date,.title-numeric,.hero-num,.finale-num,.date-stamp,.merged,.date-a,.date-b{font-family:var(--sans);font-weight:300}.title-date{margin:0;font-size:clamp(2.1rem,6vw,4.2rem);letter-spacing:-.03em}.title-numeric,.hero-num,.finale-num{margin:0;font-size:clamp(5rem,16vw,9rem);line-height:.82;letter-spacing:-.045em}.gold-rule{display:block;width:72px;height:1px;margin:18px 0 4px;background:var(--gold)}.subhead{margin:14px 0 0;font-style:italic;font-size:clamp(1.8rem,3vw,2.6rem)}.prose p,.closing p{margin:0 0 .95em;font-family:var(--serif);font-size:clamp(1.2rem,2.1vw,1.65rem);font-weight:400;line-height:1.45;color:var(--ink-soft);white-space:pre-line}.aside,.status{margin:28px 0 0;color:var(--muted);font-size:.92rem;letter-spacing:.06em}.aside:before,.status:before{content:"";display:block;width:36px;height:1px;margin-bottom:12px;background:var(--line-strong)}.writing,.number-room,.studio,.architect,.peace,.future,.light-room,.last-tulip{width:min(760px,100% - 48px);margin:0 auto;padding:10vh 0 12vh}.writing.with-photo,.studio{width:min(1080px,100% - 48px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(240px,.9fr);gap:48px;align-items:center}.frames{display:grid;gap:16px;justify-items:center}app-image-frame{display:block;width:100%}.ratio-story{max-width:280px}.frame{position:relative;margin:0;overflow:hidden;background:#f3f0ea;border:1px solid var(--line)}.ratio-portrait .frame{aspect-ratio:3/4}.ratio-landscape .frame{aspect-ratio:3/2}.ratio-story .frame{aspect-ratio:9/16}.frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}.frame img.ready{opacity:1;transition:opacity .8s ease}.placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:100%;min-height:180px;padding:18px;text-align:center}.placeholder-label,.placeholder-path,.sheet-title,.annotations li,.space-name,.tulip-num{font-family:var(--sans)}.placeholder-label{color:var(--muted);font-size:.75rem;letter-spacing:.14em}.placeholder-path{color:#b0aaa2;font-size:.68rem}.garden{width:min(920px,100% - 40px);margin:0 auto;padding:5vh 0 6vh}.lawn{position:relative;width:min(100%,74vh);margin-inline:auto;aspect-ratio:1;background-color:#e6e4dc;background-position:center 42%;background-size:cover;box-shadow:0 22px 50px #1c18120f}.ring{position:absolute;top:55%;left:50%;width:92%;aspect-ratio:1;transform:translate(-50%,-50%)}.tulip-btn{position:absolute;left:calc(50% + cos(var(--a))*38%);top:calc(50% + sin(var(--a))*38%);width:13%;padding:0;border:0;background:transparent;transform:translate(-50%,-100%);transform-origin:center bottom;cursor:pointer;filter:drop-shadow(0 12px 10px rgba(40,48,32,.2))}.tulip-btn.selected{z-index:3;transform:translate(-50%,-100%) scale(1.06)}.tulip-btn:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.tulip-photo{position:relative;display:block;width:100%;aspect-ratio:3/4.4}.tulip-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;pointer-events:none}.tulip-photo .bloom{opacity:0;transform:scale(.94);transform-origin:center bottom;transition:opacity .9s ease,transform 1.05s ease}.tulip-btn.open .bloom{opacity:1;transform:scale(1)}.tulip-btn.open .bud{opacity:0;transition:opacity .7s ease}.clearing{position:absolute;top:50%;left:50%;width:42%;max-height:36%;padding:0 8px;overflow:auto;text-align:center;opacity:0;transform:translate(-50%,-50%);pointer-events:none}.clearing.show{padding:12px 12px 8px;background:#fbfbfab8;opacity:1;pointer-events:auto;transition:opacity .7s ease}.clearing h2{margin:0 0 8px;font-family:var(--serif);font-weight:500;font-size:clamp(1.15rem,2.1vw,1.85rem);line-height:1.05;text-shadow:0 0 16px rgba(247,246,243,.95)}.clearing-copy p{margin:0 0 .45em;font-family:var(--serif);font-size:clamp(.92rem,1.45vw,1.12rem);line-height:1.35;color:var(--ink);white-space:pre-line;text-shadow:0 0 10px rgba(247,246,243,.95),0 0 2px rgb(247,246,243)}app-tulip{display:block;width:74px;height:132px}.tulip-svg{display:block;width:100%;height:100%;overflow:visible}.stem,.leaf{fill:none;stroke:#8f8980;stroke-width:1.35;stroke-linecap:round}.leaf{fill:#f3efe6}.bud,.petal{fill:#fffefb;stroke:#b7b0a4;stroke-width:1.15}.petal.back{stroke:#e4ded4}.bloom{transform-box:fill-box;transform-origin:center;transform:scale(.16);opacity:0;transition:transform 1.15s ease,opacity .8s ease}app-tulip.open .bloom{transform:scale(1);opacity:1}.bud{transition:opacity .45s ease}app-tulip.open .bud{opacity:0}.glow{fill:#e4d3ae;opacity:0;transition:opacity 1.8s ease}app-tulip.lit .glow{opacity:.95}app-tulip.lit .petal,app-tulip.lit .bud{fill:#fffdf8;stroke:#e4d3ae}.overlay.kind-light,.overlay.kind-light .room-body{background:#141413;transition:background 5.2s ease}.overlay.kind-light:has(.light-room.lit),.overlay.kind-light:has(.light-room.lit) .room-body{background:var(--paper)}.light-room,.light-room .title-words,.light-room .plate,.light-room .prose p{color:#f4f0e8;transition:color 4.5s ease}.light-room.lit,.light-room.lit .title-words,.light-room.lit .plate,.light-room.lit .prose p{color:var(--ink)}.light-room .prose p{color:#e6e0d6}.light-room.lit .prose p{color:var(--ink-soft)}.light-copy{opacity:0;transition:opacity 1.8s ease 2.6s}.light-room.lit .light-copy{opacity:1}.light-room .frame{background:#1c1b19;border-color:#3a3834;transition:background 5s ease,border-color 5s ease}.light-room.lit .frame{background:#f3f0ea;border-color:var(--line)}.light-room .frame img.ready{filter:brightness(.2);transition:opacity .8s ease,filter 5.2s ease}.light-room.lit .frame img.ready{filter:brightness(1)}.hero-num{margin:8px 0 18px;opacity:0;transition:opacity 1s ease,font-size 1.2s ease}.hero-num.on{opacity:1}.hero-num.aside{font-size:clamp(3rem,8vw,4.6rem)}.merge{position:relative;height:4.2rem;margin:10px 0 8px;font-size:clamp(1.8rem,4vw,3rem);letter-spacing:.08em;opacity:0;transition:opacity .8s ease}.merge.show{opacity:1}.date-a,.date-b,.merged{position:absolute;top:0;left:0;transition:transform 1.5s ease,opacity 1.5s ease}.date-b{left:6.5rem}.merged{letter-spacing:.16em;opacity:0}.merge.go .date-a{transform:translate(2.4rem);opacity:0}.merge.go .date-b{transform:translate(-2.4rem);opacity:0}.merge.go .merged{opacity:1}.closing{opacity:0;transform:translateY(8px);transition:opacity 1.2s ease,transform 1.2s ease}.closing.on{opacity:1;transform:none}.closing p{margin:0;font-size:clamp(1.5rem,2.6vw,2.1rem);color:var(--ink)}.plan,.mini-plan{width:100%;height:auto}.draw{fill:none;stroke:#2a2a2a;stroke-width:1.15;stroke-dasharray:980;stroke-dashoffset:980;animation:draw 2.8s ease forwards}.d2{animation-delay:.3s}.d3,.d4{animation-delay:.7s}.d5,.d6,.arc{animation-delay:1.25s}.d7,.d8,.d9{stroke:#b7b1a6;animation-delay:1.7s}.model-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:16px}.model{display:flex;align-items:flex-end;gap:8px;height:86px}.block{display:block;background:#fff;border:1px solid #d8d2c8;box-shadow:8px 12px 18px #1c18120d;animation:rise 1.1s ease both}.b1{width:42px;height:32px;animation-delay:2.1s}.b2{width:56px;height:70px;animation-delay:2.35s}.b3{width:34px;height:46px;animation-delay:2.55s}.pencil{width:116px;height:16px}.pencil polygon,.pencil rect{fill:none;stroke:#2a2a2a;stroke-width:1}.pencil rect:last-child{fill:#1c1c1c;stroke:none}.sheet{margin:8px 0 28px;padding:26px 18px 18px;background-color:#fbfaf7;background-image:linear-gradient(to right,rgba(28,28,28,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(28,28,28,.045) 1px,transparent 1px);background-size:22px 22px;border:1px solid var(--line)}.sheet-title{margin:0 0 18px;text-align:center;font-size:.78rem;letter-spacing:.22em}.sheet-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,240px) minmax(0,1fr);gap:16px;align-items:center}.annotations{display:grid;gap:14px;margin:0;padding:0;list-style:none}.annotations li{font-size:.82rem;letter-spacing:.06em}.annotations.right{text-align:right}.status{margin-top:18px;text-align:center}.status:before{margin-right:auto;margin-left:auto}.quiet-room{position:relative;width:min(680px,100%);height:180px;margin:8px 0 32px;border:1px solid var(--line)}.window{position:absolute;top:18%;left:14%;width:22%;height:42%;background:#f7f6f3;border:1px solid #cfc8bc;animation:window-light 7s ease both}.floor{position:absolute;right:0;bottom:28%;left:0;height:1px;background:var(--line)}.prose.slow p{opacity:0;animation:slow-line 1.8s ease forwards}.spaces{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:8px 0 32px;padding:0;list-style:none}.spaces li{display:flex;flex-direction:column;justify-content:flex-end;min-height:148px;padding:14px;background-color:#fffcf8a6;background-image:linear-gradient(to right,rgba(28,28,28,.04) 1px,transparent 1px),linear-gradient(to bottom,rgba(28,28,28,.04) 1px,transparent 1px);background-size:18px 18px;border:1px solid var(--line-strong)}.void{flex:1}.space-name{font-size:.84rem;letter-spacing:.05em}.last-tulip{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;align-items:center;width:min(920px,100% - 48px)}.lone{display:flex;justify-content:center}.last-tulip app-tulip,.finale-flower app-tulip{width:112px;height:200px}.date-stamp{margin:28px 0 0;font-size:clamp(1.5rem,3vw,2.15rem);letter-spacing:.04em}.finale{position:relative;display:flex;align-items:center;justify-content:center;min-height:78vh;text-align:center}.finale-num{position:absolute;top:50%;left:50%;opacity:0;transform:translate(-50%,-50%);transition:opacity 1.2s ease}.finale-num.on{opacity:1}.finale-rest{display:flex;flex-direction:column;align-items:center;opacity:0;transition:opacity 1.4s ease}.finale-rest.on{opacity:1}.finale-line,.finale-love,.finale-sign{margin:0;opacity:0;transform:translateY(6px);transition:opacity 1.3s ease,transform 1.3s ease}.finale-line.on,.finale-love.on,.finale-sign.on{opacity:1;transform:none}.finale-line{margin-top:8px;font-size:clamp(1.8rem,4vw,2.8rem)}.finale-love{margin-top:12px;color:var(--ink-soft);font-style:italic;font-size:clamp(1.25rem,2.4vw,1.8rem)}.finale-sign{margin-top:26px;font-family:var(--serif);font-size:1.05rem;letter-spacing:.38em}.whiteout,app-dedication{position:fixed;inset:0;z-index:40;background:#fff}.whiteout{animation:fade-white 2.6s ease forwards}app-dedication{z-index:50;display:grid;place-items:center}.dedication-mark{margin:0;font-family:var(--serif);font-size:clamp(2rem,5vw,3.4rem);letter-spacing:.42em;animation:rise 2.2s ease both}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes leave-left{to{transform:translate(-101%)}}@keyframes leave-right{to{transform:translate(101%)}}@keyframes zoom-out{0%{transform:translate(-50%,-50%) scale(calc(var(--fit, 1) * 1.72))}to{transform:translate(-50%,-50%) scale(var(--fit, 1))}}@keyframes door-open{0%{opacity:1;transform:translate(-50%,-50%) perspective(1400px) rotateY(0)}68%{opacity:1}to{opacity:0;transform:translate(-88%,-50%) perspective(1400px) rotateY(-76deg)}}@keyframes door-close{0%{opacity:0;transform:translate(-88%,-50%) perspective(1400px) rotateY(-76deg)}30%{opacity:1}to{opacity:1;transform:translate(-50%,-50%) perspective(1400px) rotateY(0)}}@keyframes room-in{0%{opacity:0}to{opacity:1}}@keyframes room-out{to{opacity:0}}@keyframes draw{to{stroke-dashoffset:0}}@keyframes window-light{0%{background:#fbfbfa}to{background:#f3efe4}}@keyframes slow-line{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes fade-white{0%{opacity:0}to{opacity:1}}@media(max-width:800px){.writing.with-photo,.studio,.sheet-body,.last-tulip{grid-template-columns:1fr}.annotations.right{text-align:left}.writing,.number-room,.studio,.architect,.peace,.future,.light-room,.last-tulip{width:min(100% - 36px,760px);padding-top:12vh}}@media(max-width:560px){.garden{width:calc(100% - 20px);padding-top:10vh}.lawn{width:min(100%,68vh)}.ring{top:56%;width:96%}.tulip-btn{width:16%}.clearing{width:48%;max-height:34%}.spaces{grid-template-columns:1fr}.panel{inset:10px 8px 12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}}
