:root{--night: #07060c;--cream: #f6ecdf;--muted: #c3b5c2;--gold: #e8cf8a;--rose: #c9727a;--pink: #f2b8c6;--red: #b0172a;--serif: "Cormorant Garamond", Georgia, serif;--body: "EB Garamond", Georgia, serif;--sans: "Inter", system-ui, sans-serif;--hand: "Caveat", "Segoe Print", cursive}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:var(--night);color:var(--cream);overflow:hidden;overscroll-behavior:none}body{font-family:var(--body);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;touch-action:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}[hidden]{display:none!important}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}#scene{position:fixed;inset:0;width:100%;height:100%;display:block}body.can-wipe #scene{cursor:grab}body.can-hold #scene{cursor:pointer}#grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.06;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}.label{font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}.screen{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}#early{background:radial-gradient(ellipse 80% 60% at 50% 70%,#1d1a35,#0c0a18 55%,#050409);gap:22px}.early-text{font-family:var(--serif);font-style:italic;font-size:clamp(26px,7vw,40px);line-height:1.3}#veil{position:fixed;inset:0;z-index:15;background:radial-gradient(ellipse 90% 70% at 50% 60%,#0b0a14,#050409 70%);pointer-events:none}#hello{z-index:20;background:transparent}.hello-h{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(48px,13vw,112px);line-height:1.02;text-shadow:0 0 40px rgba(255,190,140,.18)}.hello-h .ch{display:inline-block}.hello-h .wd{display:inline-block;white-space:nowrap}.hello-p{margin-top:22px;font-family:var(--serif);font-style:italic;font-size:clamp(21px,5.6vw,30px);color:var(--muted);max-width:22ch}.begin{margin-top:52px;padding:15px 28px;border-radius:999px;border:1px solid rgba(232,207,138,.45);background:#ffc8960f;font-family:var(--sans);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--cream);box-shadow:0 0 30px #ffaa6e1f,inset 0 0 14px #ffc89614}.begin:before{content:"";display:inline-block;width:6px;height:6px;margin-right:12px;border-radius:50%;background:#ffb06a;box-shadow:0 0 10px 2px #ffa05acc;vertical-align:2px;animation:flick 2.4s ease-in-out infinite}@keyframes flick{0%,to{opacity:1}40%{opacity:.7}60%{opacity:.95}}.hint{position:fixed;left:0;right:0;bottom:max(7vh,calc(env(safe-area-inset-bottom) + 28px));z-index:10;text-align:center;padding:0 24px;font-family:var(--serif);font-style:italic;font-size:clamp(20px,5.4vw,28px);color:var(--cream);opacity:0;pointer-events:none;text-shadow:0 1px 18px rgba(0,0,0,.65),0 0 2px rgba(0,0,0,.4)}.ring{position:fixed;left:0;top:0;z-index:9;width:112px;height:112px;margin:-56px 0 0 -56px;pointer-events:none;opacity:0;transform:translate(-200px,-200px)}.ring svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}.ring circle{fill:none;stroke-width:2.2}.ring .track{stroke:#fff0dc2e}.ring .fill{stroke:#ffe1b0;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(255,190,120,.9))}.cta{position:fixed;left:50%;bottom:max(15vh,calc(env(safe-area-inset-bottom) + 90px));z-index:12;transform:translate(-50%);padding:15px 30px;border-radius:999px;white-space:nowrap;font-family:var(--sans);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#2a1a12;background:linear-gradient(180deg,#fff3df,#f6d9b0);box-shadow:0 10px 40px #ffaa6459,0 0 0 1px #fff6 inset}.cta:after{content:"";position:absolute;inset:-6px;border-radius:inherit;border:1px solid rgba(255,230,190,.5);animation:halo 2.6s ease-out infinite}@keyframes halo{0%{opacity:.8;transform:scale(.96)}to{opacity:0;transform:scale(1.18)}}.title-wrap{position:fixed;inset:0;z-index:11;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:19vh;pointer-events:none;text-align:center}.title-wrap:before{content:"";position:absolute;left:50%;top:13vh;width:min(130vw,900px);height:clamp(260px,44vh,460px);transform:translate(-50%);z-index:-1;background:radial-gradient(ellipse 50% 50% at 50% 45%,#30120c6b,#30120c00 72%)}.title{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(50px,13.5vw,128px);line-height:1;letter-spacing:-.01em;color:#fffaf1;text-shadow:0 2px 30px rgba(90,30,30,.45),0 0 60px rgba(255,200,140,.35);max-width:9ch}.title .w{display:inline-block}.title .you{color:#fff6e0}.day-line{margin-top:24px;font-weight:500;font-family:var(--sans);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:#fff6e8eb;text-shadow:0 1px 12px rgba(60,20,20,.6)}.day-line em{font-family:var(--serif);font-size:19px;letter-spacing:.02em;text-transform:none}#final{position:fixed;inset:0;z-index:30;overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:radial-gradient(ellipse 100% 70% at 50% 20%,#ffd6aa52,#28161ab8 70%),#140c0e59;backdrop-filter:blur(14px) saturate(1.1);-webkit-backdrop-filter:blur(14px) saturate(1.1)}.final-in{min-height:100%;display:flex;flex-direction:column;align-items:center;padding:max(64px,calc(env(safe-area-inset-top) + 48px)) 20px 90px;text-align:center}#final .label{color:#fff0e2d9}.ready{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(28px,7.4vw,46px);line-height:1.12;margin:14px 0 30px;max-width:16ch;text-shadow:0 2px 20px rgba(60,20,20,.4)}.card{width:min(86vw,440px);border-radius:6px;overflow:hidden;box-shadow:0 30px 80px #1e0a0a80,0 0 0 1px #ffffff40;background:#f6efe3}.card img{display:block;width:100%;height:auto;-webkit-touch-callout:default;user-select:auto;-webkit-user-select:auto;pointer-events:auto}.keep{margin-top:26px;font-family:var(--serif);font-style:italic;font-size:22px;color:var(--cream)}.save{margin-top:16px;display:inline-block;padding:13px 26px;border-radius:999px;border:1px solid rgba(255,236,210,.5);color:var(--cream);text-decoration:none;font-family:var(--sans);font-size:11px;letter-spacing:.26em;text-transform:uppercase;background:#ffe6c814}.close{margin-top:90px;display:flex;flex-direction:column;align-items:center;gap:22px}.close .heart{width:26px;fill:var(--red);filter:drop-shadow(0 0 12px rgba(176,23,42,.6))}.tomorrow{font-family:var(--serif);font-style:italic;font-size:clamp(22px,6vw,32px);line-height:1.3;max-width:20ch}.next{font-family:var(--sans);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:#ffecdcb3}.sig{font-family:var(--hand);font-size:34px;color:#fff0e2e6;margin-top:8px}.row{list-style:none;display:grid;grid-template-columns:repeat(7,1fr);gap:6px;width:min(94vw,560px);margin-top:18px}.row li{display:flex;flex-direction:column;align-items:center;gap:10px}.bud{width:100%;max-width:58px;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,230,190,.25);background:#28141a59}.bud svg{width:64%}.row li.today .bud{border-color:#ffe2aae6;box-shadow:0 0 24px #ffc89673,inset 0 0 18px #ffd2aa33}.row li.future{opacity:.55}.row .n{font-family:var(--serif);font-size:15px;color:#ffecdccc}.row li.today .n{color:#ffe1a8}.row .s{font-family:var(--sans);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#ffecdca6;min-height:1.2em}body.flat{background:radial-gradient(ellipse at 50% 20%,#5a3a4a,#1a1018 70%)}.flat-notes{display:flex;flex-direction:column;align-items:center;gap:26px;margin-bottom:60px}.flat-note{font-family:var(--hand);font-size:30px;line-height:1.2}.music{position:fixed;top:max(16px,env(safe-area-inset-top));right:16px;z-index:60;display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:999px;border:1px solid rgba(232,207,138,.35);background:#0c091473;color:#f3e9dcd9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase}.music .bars{display:flex;align-items:flex-end;gap:2px;height:12px}.music .bars i{width:2px;height:100%;border-radius:1px;background:var(--gold);transform-origin:bottom;animation:eq 1s ease-in-out infinite}.music .bars i:nth-child(2){animation-delay:-.3s}.music .bars i:nth-child(3){animation-delay:-.6s}.music .bars i:nth-child(4){animation-delay:-.15s}.music.off .bars i{animation:none;transform:scaleY(.25);opacity:.6}@keyframes eq{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}@media(max-width:480px){.music .lbl{display:none}}
