@font-face{font-family:Dancing Script;src:url(/fonts/DancingScript.woff2)format("woff2");font-weight:400 700;font-style:normal;font-display:swap}:root{color-scheme:dark;--bg:#000;--fg:#fff;--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--fade:.45s;--pop:.65s;--bgfade:.7s;--vh:100vh;--edge:22px;--r:16px;--fx:50%;--fy:50%}@supports (height:100svh){:root{--vh:100svh}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);color:var(--fg);overscroll-behavior:none;-webkit-font-smoothing:antialiased;touch-action:manipulation;-webkit-user-select:none;user-select:none;height:100%;margin:0;padding:0;font-family:Dancing Script,Snell Roundhand,Apple Chancery,cursive;overflow:hidden}[hidden]{display:none!important}.gate{background:var(--bg);z-index:10;place-items:center;transition:opacity .45s;display:grid;position:fixed;inset:0}.gate.out{opacity:0;pointer-events:none}.gate form{align-items:center;gap:10px;display:flex}.gate input{font:inherit;letter-spacing:.04em;width:min(60vw,240px);height:52px;color:var(--fg);text-align:center;-webkit-appearance:none;appearance:none;background:#ffffff0f;border:1px solid #ffffff2e;border-radius:999px;outline:none;padding:0 18px;font-size:24px}.gate input::placeholder{color:#ffffff59}.gate input:focus{border-color:#ffffff80}.gate button{font:inherit;width:52px;height:52px;color:var(--bg);background:var(--fg);cursor:pointer;border:0;border-radius:999px;place-items:center;font-size:22px;line-height:1;display:grid}.gate.loading form{opacity:.35;pointer-events:none;transition:opacity .3s}.gate-load{left:50%;bottom:calc(18vh + env(safe-area-inset-bottom));opacity:0;background:#ffffff26;border-radius:2px;width:min(60vw,240px);height:3px;transition:opacity .3s;position:absolute;overflow:hidden;transform:translate(-50%)}.gate.loading .gate-load{opacity:1}.gate-load-fill{background:var(--fg);transform-origin:0;width:100%;height:100%;transition:transform .25s ease-out;transform:scaleX(0)}.gate.shake form{animation:.4s cubic-bezier(.36,.07,.19,.97) both shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.stage{background:var(--bg);position:fixed;inset:0}.slide{opacity:0;transition:opacity var(--fade) ease-in-out;will-change:opacity;place-items:center;display:grid;position:absolute;inset:0}.slide.active{opacity:1}.bgs{position:absolute;inset:0;overflow:hidden}.bg{filter:blur(34px)saturate(1.15)brightness(.55);opacity:0;transition:opacity var(--bgfade) cubic-bezier(.2, .7, .3, 1), filter .45s ease;will-change:opacity;background-position:50%;background-repeat:no-repeat;background-size:cover;position:absolute;inset:-12%;transform:translateZ(0)scale(1.08)}.bg.active{opacity:1}.slide .frame{border-radius:var(--r);will-change:transform;width:fit-content;height:fit-content;margin:0;transition:filter .45s;position:relative;box-shadow:0 24px 60px #00000073}.slide.active .frame{animation:pop var(--pop) ease-out both}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.035)}to{transform:scale(1)}}.slide .clip{border-radius:var(--r);width:fit-content;height:fit-content;clip-path:inset(0 round var(--r));position:relative;overflow:hidden;transform:translateZ(0)}.slide .clip:after{content:"";z-index:1;pointer-events:none;border-radius:var(--r);background:radial-gradient(ellipse 75% 70% at var(--fx) var(--fy), #0000 40%, #0000006b 100%);opacity:0;transition:opacity 1.6s;position:absolute;inset:0;box-shadow:inset 0 0 70px #00000047}.stage.is-playing .slide .clip:after{opacity:1;transition:opacity .6s}.slide .clip img{transform-origin:var(--fx) var(--fy);will-change:transform}.slide .frame img{border-radius:var(--r);max-width:80vw;max-height:calc(var(--vh) * .8);width:auto;height:auto;display:block}.slide .bar{z-index:2;pointer-events:none;opacity:0;height:3px;transition:opacity .2s var(--ease-out-expo);background:#00000059;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.slide .bar.counting{opacity:1}.slide .bar-fill{background:var(--fg);transform-origin:0;width:100%;height:100%;display:block}.vignette{pointer-events:none;z-index:1;opacity:0;background:radial-gradient(62% 55%,#0000 0% 38%,#00000057 72%,#000000b8 100%);transition:opacity 1.6s;position:absolute;inset:0}.stage.is-playing .vignette{opacity:1;transition:opacity .8s}.year,.love,.corner,.controls{z-index:2}.stage.is-love .slide .frame{filter:blur(18px)brightness(.45);transition:filter 1.4s}.stage.is-love .bg{filter:blur(40px)saturate(1.1)brightness(.35);transition:opacity var(--bgfade) cubic-bezier(.2,.7,.3,1), filter 1.4s ease}.love{pointer-events:none;opacity:0;place-items:center;transition:opacity .35s;display:grid;position:absolute;inset:0}.stage.is-love .love{opacity:1;transition:opacity 1.6s .3s}.love span{white-space:nowrap;color:var(--fg);text-shadow:0 4px 40px #0009;padding:0 .1em;font-family:inherit;font-weight:400;line-height:1.2;display:inline-block;transform:translateY(-4vh)}.glyph{font-family:-apple-system,system-ui,sans-serif;font-size:24px;line-height:1;display:inline-block}.glyph.mirror{transform:scaleX(-1)}.year{left:0;right:0;top:calc(var(--edge) + env(safe-area-inset-top));text-align:center;pointer-events:none;letter-spacing:.02em;color:var(--fg);text-shadow:0 2px 24px #000000b3;opacity:0;font-family:inherit;font-size:46px;font-weight:500;line-height:1;transition:opacity .2s,transform .2s;position:absolute;transform:translateY(-6px)}.stage.has-year .year{opacity:.5;transform:none}.stage:not(.is-gallery) .year{top:auto;bottom:calc(var(--edge) + env(safe-area-inset-bottom))}.stage.has-year .year.swap{opacity:0;transition-duration:.16s;transform:translateY(6px)}.corner{top:calc(var(--edge) + env(safe-area-inset-top));font:inherit;letter-spacing:.03em;height:44px;color:var(--fg);backdrop-filter:blur(16px)saturate(1.4);cursor:pointer;opacity:0;pointer-events:none;background:#14141480;border:1px solid #ffffff38;border-radius:999px;justify-content:center;align-items:center;gap:8px;font-size:20px;font-weight:500;transition:opacity .4s,transform .4s,background .2s;display:inline-flex;position:absolute;left:16px;transform:translateY(-12px)}.corner .glyph{font-size:18px}.corner:active{background:#ffffff2e}.back{width:44px;padding:0}.replay{padding:0 18px 0 14px}.stage.in-gallery .back,.stage.is-love.is-gallery:not(.in-gallery) .replay{opacity:1;pointer-events:auto;transform:none}.controls{left:0;right:0;bottom:calc(var(--edge) + env(safe-area-inset-bottom));opacity:0;pointer-events:none;flex-direction:column;align-items:center;gap:12px;transition:opacity .6s,transform .6s;display:flex;position:absolute;transform:translateY(12px)}.stage.is-gallery .controls{opacity:1;pointer-events:auto;transform:none}.counter{letter-spacing:.08em;font-variant-numeric:tabular-nums;color:#ffffffb3;text-shadow:0 1px 8px #0009;min-height:1em;font-size:20px}.row{justify-content:center;gap:12px;display:flex}.pill{font:inherit;letter-spacing:.03em;min-width:200px;height:60px;color:var(--fg);backdrop-filter:blur(16px)saturate(1.4);cursor:pointer;background:#1414148c;border:1px solid #ffffff40;border-radius:999px;justify-content:center;align-items:center;padding:0 32px;font-size:26px;font-weight:500;transition:transform .12s,background .2s,min-width .3s;display:inline-flex}.pill:active{background:#ffffff2e;transform:scale(.96)}.stage:not(.in-gallery) #prev{display:none}.stage.in-gallery .pill{width:min(38vw,160px);min-width:0;padding:0}@media (prefers-reduced-motion:reduce){.slide,.slide .frame,.bg,.love,.controls,.corner,.year,.vignette,.slide .clip:after{transition-duration:.01ms!important}.slide.active .frame{animation:none}}
