@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&family=Manrope:wght@400;500;600;700&display=swap";:root{font-family:Manrope,-apple-system,sans-serif;color:#f5eee4;background:#172422;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #ffd8a3;outline-offset:3px}::selection{background:#b7644d;color:#fff}.topbar{position:fixed;z-index:30;top:0;left:0;right:0;height:58px;padding:0 clamp(18px,4vw,58px);display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#142322d9,#14232255);border-bottom:1px solid #ffffff21;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.brand{font:30px "Instrument Serif",Georgia,serif}.brand span{color:#d6967e;font:18px DM Mono,monospace}.top-right{display:flex;align-items:center;gap:25px}.top-note,.sound-toggle{font:10px DM Mono,monospace;letter-spacing:.08em}.top-note{color:#e2d8c9a8}.sound-toggle{background:#efe7d419;border:1px solid #eee2c46e;color:#f6efe4;padding:9px 10px;min-width:110px;text-align:left}.sound-toggle span{float:right;color:#eab98d}.opening{min-height:100svh;display:grid;grid-template-columns:55% 45%;background:#233432;position:relative;overflow:hidden}.opening:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 25% 45%,#66736b,#233432 66%);opacity:.65}.opening-photo{z-index:1;display:grid;place-items:center;padding:95px 5% 55px}.photo-card{background:#e8dfcb;padding:14px 14px 42px;transform:rotate(-4deg);box-shadow:19px 23px #0b191884;width:min(63%,450px);animation:photo-in .9s ease both}.photo-card img{display:block;width:100%;height:min(67svh,620px);object-fit:cover;object-position:center;filter:saturate(.92)}.photo-card span{display:block;margin:12px 2px 0;color:#3d4a43;font:10px DM Mono,monospace}.opening-copy{z-index:1;align-self:center;padding:100px 8% 70px 0}.opening-copy small,.final-content small{font:11px DM Mono,monospace;letter-spacing:.15em;color:#d6ad92}.opening h1,.frame h2,.final-frame h2{font-family:"Instrument Serif",Georgia,serif;font-weight:400;line-height:.89;letter-spacing:-.05em}.opening h1{font-size:clamp(90px,10vw,168px);margin:26px 0 30px}.opening h1 em{font-weight:400;color:#e8c4a9}.opening-copy p{font:italic clamp(24px,2.2vw,36px) "Instrument Serif",Georgia,serif;color:#f1ded0;line-height:1.1}.opening-next{display:inline-flex;align-items:center;gap:25px;margin-top:28px;border-bottom:1px solid #eccfb7;padding:8px 0;font:12px DM Mono,monospace}.opening-next span{font-size:21px}.frame{height:100svh;min-height:620px;position:relative;overflow:hidden;isolation:isolate;background:#1b282a;scroll-margin-top:0}.image-stack,.image-blur,.scene-image,.frame-scrim{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.image-stack{z-index:-2;overflow:hidden}.image-blur{background-size:cover;background-position:var(--position);filter:blur(30px) brightness(.48);transform:scale(1.08)}.scene-image{object-fit:cover;object-position:var(--position)}.scene-reveal{animation:frame-reveal .8s ease both}.frame-scrim{z-index:-1;background:linear-gradient(180deg,#0a161bb8 0%,#0c182940 24%,transparent 42%,transparent 54%,#0b161ead 100%);pointer-events:none}.frame-top{position:absolute;top:84px;left:clamp(22px,5vw,80px);right:clamp(22px,5vw,80px);display:flex;justify-content:space-between;gap:12px;color:#fff0db;font:11px DM Mono,monospace;letter-spacing:.12em;text-shadow:1px 1px 6px #101820}.frame-copy{position:absolute;top:118px;left:clamp(22px,5vw,80px);right:clamp(22px,5vw,80px);max-width:760px;text-shadow:0 3px 22px #061016ba}.frame h2{font-size:clamp(67px,9.4vw,147px);margin:0 0 14px}.frame-copy p{font:italic clamp(21px,2.5vw,35px) "Instrument Serif",Georgia,serif;line-height:1.1;max-width:580px;margin:0;color:#f4e8d8}.frame-actions{position:absolute;z-index:11;left:clamp(22px,5vw,80px);bottom:clamp(90px,11vh,140px);display:flex;flex-wrap:wrap;gap:10px;max-width:calc(100% - 44px)}.scene-button{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #eadbc8;background:#f1e6d4;color:#26352f;min-height:48px;padding:11px 16px;font:600 12px Manrope,sans-serif;box-shadow:5px 5px #111d1db5;transition:transform .22s,background .22s;cursor:pointer}.scene-button:hover:not(:disabled){transform:translateY(-3px);background:#fff3dc}.scene-button span{font-size:18px;line-height:1}.scene-button.secondary{background:#20302fc9;color:#fff4e6;border-color:#f2e7d69c}.scene-button:disabled{opacity:.5;cursor:default}.door-frame .frame-copy{max-width:520px}.lock-visuals{position:absolute;z-index:7;left:52%;top:27%;display:flex;flex-direction:column;gap:24px;pointer-events:none}.lock-visuals span{font:36px DM Mono,monospace;color:#f4daac99;text-shadow:0 0 13px #ffe6a7;transition:transform .3s,color .3s}.lock-visuals .locked{color:#ffb86b;transform:rotate(42deg) scale(1.1);animation:lock-pulse .45s ease}.bath-bubbles{position:absolute;z-index:3;left:54%;top:66%;font-size:38px;color:#f4ffff;letter-spacing:15px;animation:bubble-rise 1.8s ease-in-out infinite;text-shadow:0 0 10px white}.morning-frame .scene-image{object-position:52%}.steam-sprite{position:absolute;z-index:4;left:45%;top:56%;width:19%;height:34%;background:url(/art/steam-sprite.webp) no-repeat;background-size:400% 200%;animation:steam-frames 1.8s steps(1,end) infinite;pointer-events:none;filter:drop-shadow(0 0 3px #f6e4c6)}.machine-steam{position:absolute;z-index:3;left:51%;top:39%;font-size:35px;color:#fff8e7;animation:bubble-rise 1.6s infinite}.ride-frame.rolling .scene-image{animation:ride-pan .65s ease}.camera-flash{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;animation:flash .85s forwards;pointer-events:none}.home-frame .frame-copy{max-width:690px}.petals{position:absolute;right:13%;bottom:20%;font-size:45px;color:#ffa67e;letter-spacing:25px;text-shadow:0 0 13px #c8704c;animation:bubble-rise 3s infinite}.balcony-glow{position:absolute;left:60%;top:19%;height:50%;width:22%;border:2px solid #d5ae79b0;box-shadow:0 0 30px #efc17a66;pointer-events:none;animation:balcony-open .7s ease both}.mountain-frame .frame-copy{max-width:620px}.mountain-frame .frame-scrim{background:linear-gradient(180deg,#071021ab,#09192a12 45%,#070e1bc2)}.cigarette-smoke{position:absolute;z-index:6;left:44%;top:70%;height:80px;width:30px;pointer-events:none}.cigarette-smoke i{position:absolute;left:6px;bottom:0;width:4px;height:25px;border-radius:50%;border-left:2px solid #f9ebd1a9;filter:blur(1px);animation:smoke-up 2.8s ease-out infinite}.cigarette-smoke i:nth-child(2){animation-delay:.8s}.cigarette-smoke i:nth-child(3){animation-delay:1.6s}.word-frame{background:#9c5a4a}.word-grain{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 68% 25%,#d68f70,#9c5a4a 65%)}.word-layout{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:120px 10% 160px}.word-layout>small{position:absolute;top:21%;left:10%;font:italic 28px "Instrument Serif",Georgia,serif}.word-card{height:47%;min-height:280px;width:min(620px,80%);padding:30px 36px;background:#efe9d7;color:#264039;box-shadow:17px 20px #4d302a78;transform:rotate(-5deg);display:flex;flex-direction:column;justify-content:space-between;animation:card-in .5s ease both}.word-card span{font:10px DM Mono,monospace;letter-spacing:.08em;color:#8e6c5a}.word-card strong{font:italic clamp(47px,5vw,87px)/.93 "Instrument Serif",Georgia,serif}.word-card small{font:italic 23px "Instrument Serif",Georgia,serif;color:#915942}.peach{position:absolute;right:15%;bottom:28%;font-size:54px;border:0;background:none;transform:rotate(13deg);animation:peach-wiggle 3s infinite}.bite-note{position:absolute;right:10%;bottom:24%;font:italic 32px "Instrument Serif",Georgia,serif}.word-frame .frame-actions{bottom:9%}.final-frame{min-height:100svh;position:relative;background:#233534;display:grid;place-items:center;text-align:center;padding:95px 22px 110px;overflow:hidden}.final-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:url(/art/mountain-2-v3.webp) center/cover;filter:blur(28px) brightness(.42);transform:scale(1.08)}.final-content{position:relative;z-index:1;display:flex;align-items:center;flex-direction:column}.last-photo{background:#eadfca;padding:7px 7px 23px;width:clamp(170px,18vw,250px);transform:rotate(-5deg);box-shadow:10px 12px #071a1a9e;margin:25px 0}.last-photo img{width:100%;height:clamp(190px,21vw,255px);object-fit:cover;object-position:center}.last-photo span{display:block;margin-top:6px;color:#3b4d44;font:9px DM Mono,monospace}.final-frame h2{font-size:clamp(72px,8vw,120px);margin:15px 0}.final-frame h2 em{font-weight:400;color:#e7b899}.final-frame p{font:italic 27px "Instrument Serif",Georgia,serif;margin:0 0 28px}.progress{position:fixed;z-index:29;right:clamp(14px,2vw,28px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:7px}.progress a{width:29px;height:29px;border:1px solid #e7dac479;color:#e6dccaac;display:grid;place-items:center;background:#0a1c1db5;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);font:9px DM Mono,monospace}.progress a.active{background:#f0e4d1;color:#23362d;border-color:#f0e4d1}.modal{position:fixed;z-index:40;top:0;right:0;bottom:0;left:0;background:#0a1718e6;display:grid;place-items:center;padding:18px}.letter{position:relative;background:#f2e9d7;color:#25362e;max-width:630px;max-height:90svh;overflow:auto;padding:48px clamp(28px,5vw,62px);box-shadow:12px 12px #071312;font:17px/1.8 Georgia,serif;text-align:left}.letter small{font:10px DM Mono,monospace;color:#a65d46}.letter strong{font-weight:400;color:#a65d46}.close{position:absolute;right:15px;top:9px;background:none;border:0;color:#6c5d51;font-size:36px}@keyframes photo-in{0%{opacity:0;transform:translateY(35px) rotate(2deg)}to{opacity:1;transform:translateY(0) rotate(-4deg)}}@keyframes frame-reveal{0%{opacity:0}to{opacity:1}}@keyframes lock-pulse{50%{filter:drop-shadow(0 0 10px #ffd188)}}@keyframes bubble-rise{50%{transform:translateY(-12px);opacity:.65}}@keyframes ride-pan{50%{transform:scale(1.025) translate(-4px)}}@keyframes flash{0%{opacity:1}to{opacity:0}}@keyframes balcony-open{0%{opacity:0;transform:perspective(300px) rotateY(0)}to{opacity:1;transform:perspective(300px) rotateY(-22deg)}}@keyframes smoke-up{0%{opacity:0;transform:translateY(8px) translate(0) scale(.8)}35%{opacity:.7}to{opacity:0;transform:translateY(-65px) translate(12px) scale(1.5)}}@keyframes card-in{0%{opacity:0;transform:translateY(30px) rotate(-1deg)}to{opacity:1;transform:translateY(0) rotate(-5deg)}}@keyframes peach-wiggle{50%{transform:rotate(-8deg) translateY(-8px)}}@keyframes steam-frames{0%,12.49%{background-position:0 0}12.5%,24.99%{background-position:33.333% 0}25%,37.49%{background-position:66.666% 0}37.5%,49.99%{background-position:100% 0}50%,62.49%{background-position:0 100%}62.5%,74.99%{background-position:33.333% 100%}75%,87.49%{background-position:66.666% 100%}87.5%,to{background-position:100% 100%}}@media (max-width:850px){.topbar{height:52px;padding:0 15px}.brand{font-size:26px}.top-note{display:none}.frame{min-height:0}.frame-top{top:72px;left:20px;right:20px;font-size:9px}.frame-copy{top:112px;left:20px;right:20px}.frame h2{font-size:clamp(72px,17vw,118px)}.frame-copy p{font-size:clamp(23px,5.7vw,32px);max-width:350px}.frame-actions{left:18px;right:18px;bottom:68px;gap:7px}.scene-button{font-size:11px;min-height:44px;padding:10px 11px;gap:10px}.progress{right:0;left:0;top:auto;bottom:0;transform:none;flex-direction:row;justify-content:space-around;gap:0;padding:8px 8px max(8px,env(safe-area-inset-bottom));background:#152725dc;border-top:1px solid #eee2d033}.progress a{width:27px;height:27px;font-size:8px}.opening{grid-template-columns:1fr;grid-template-rows:auto auto}.opening-photo{padding:94px 7% 15px}.photo-card{width:min(72%,420px);padding:10px 10px 32px}.photo-card img{height:48svh;min-height:285px}.opening-copy{padding:20px 7% 100px}.opening h1{font-size:clamp(80px,20vw,135px);margin:13px 0}.opening-copy p{font-size:25px}.opening-next{margin-top:5px}.frame .scene-image{object-fit:cover}.home-frame .scene-image{transition:object-position .8s}.mountain-frame .scene-image{object-position:50%}.word-layout{padding:110px 8% 170px}.word-layout>small{top:21%;left:8%;font-size:22px}.word-card{width:80%;height:43%;min-height:255px;padding:20px}.word-card strong{font-size:clamp(43px,11vw,72px)}.word-card small{font-size:19px}.peach{right:8%;bottom:28%;font-size:40px}.word-frame .frame-actions{bottom:72px}.bath-bubbles{font-size:20px;letter-spacing:5px}.cigarette-smoke{left:46%;top:71%}.lock-visuals{left:55%;top:30%;gap:22px}.steam-sprite{left:41%;top:55%;width:31%;height:29%}}@media (max-width:430px){.opening-photo{padding-top:83px}.photo-card img{height:45svh}.opening h1{font-size:21vw}.frame h2{font-size:18vw}.frame-copy p{font-size:25px}.frame-top span:last-child{max-width:55%;text-align:right}.frame-actions .scene-button{max-width:100%}.bath-frame .scene-image{object-position:63%}.ride-frame .scene-image{object-position:40%}.home-frame .frame-copy{top:105px}.home-frame h2{font-size:16vw}.mountain-frame h2{font-size:18vw}.word-layout>small{top:22%}.word-card{width:84%}.final-frame{padding-bottom:100px}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.lock-visuals{left:34%;top:31%;gap:39px}.lock-visuals span{position:relative;display:block;width:32px;height:25px;border:2px solid #d8a86b;background:linear-gradient(135deg,#7a4e2a,#bb8450 52%,#674226);box-shadow:2px 3px #081312a0,0 0 9px #efbb7266;border-radius:2px}.lock-visuals span:before{content:"";position:absolute;width:8px;height:8px;left:10px;top:6px;border:2px solid #e3bd7b;border-radius:50%;background:#4d3826}.lock-visuals span:after{content:"";position:absolute;left:27px;top:6px;width:19px;height:7px;border:1px solid #e8b979;background:#9d6637;transform-origin:left center;transform:scaleX(.08);transition:transform .32s ease}.lock-visuals span.locked:after{transform:scaleX(1)}.lock-visuals span.locked{animation:lock-pulse .45s ease}@media (max-height:650px){.door-frame .lock-visuals{top:43%;gap:20px}}.lock-visuals span.locked{transform:none}@media (max-width:850px){.home-frame .scene-image{inset:auto auto auto 12px;top:60%;width:calc(100% - 24px);height:auto;aspect-ratio:1586 / 992;object-fit:contain;object-position:center;transform:translateY(-50%);box-shadow:0 0 0 1px #f4e3cb63,0 24px 65px #071211aa}.home-frame .image-blur{background-position:center;filter:blur(34px) brightness(.32)}.home-frame .frame-copy{top:104px}.home-frame h2{font-size:clamp(42px,11vw,62px);line-height:.92;margin-bottom:9px;max-width:370px}.home-frame .frame-copy p{font-size:21px;max-width:340px}}@media (max-width:430px) and (max-height:700px){.home-frame .frame-copy{top:86px}.home-frame h2{font-size:11vw;margin-bottom:7px}.home-frame .frame-copy p{font-size:19px}.home-frame .scene-image{top:60%}}.opening-note{max-width:530px;margin:27px 0 4px;padding:14px 18px 15px;border-left:2px solid #d8a58a;background:#10232177}.opening-note span{font:10px DM Mono,monospace;letter-spacing:.12em;color:#d9a88d;text-transform:uppercase}.opening-note p{font:17px/1.5 Manrope,-apple-system,sans-serif;font-style:normal;letter-spacing:0;color:#eee2d3;margin:7px 0 0}@media (max-width:850px){.opening-note{margin:20px 0 8px;padding:13px 16px}.opening-note p{font-size:15px;line-height:1.45}.opening-next{margin-top:17px}}.letter-gate{padding:35px 0 13px;text-align:center}.letter-gate h3{font:italic clamp(42px,7vw,66px)/.95 "Instrument Serif",Georgia,serif;font-weight:400;margin:0 0 14px}.letter-gate>p{font:italic 25px/1.2 "Instrument Serif",Georgia,serif;margin:0 0 30px}.letter-gate form{display:flex;flex-direction:column;align-items:center;gap:13px}.letter-gate label{font:10px DM Mono,monospace;letter-spacing:.14em;text-transform:uppercase;color:#786359}.letter-gate input{width:168px;height:60px;border:1px solid #8e7569;background:#fffaf0;color:#26362f;font:29px DM Mono,monospace;letter-spacing:.45em;text-align:center;padding:10px 0 10px 13px;border-radius:0}.letter-gate input:focus-visible{outline:2px solid #a45f47;outline-offset:3px}.letter-gate .scene-button{margin-top:5px}.letter-gate .letter-error{font:14px/1.4 Manrope,sans-serif;color:#a04436;margin:16px 0 0}
