:root{color:#3f302b;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff7ef;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Noto Sans,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0}button,a{font:inherit}#app{min-height:100vh}.countdown-scene{--night:oklch(16% .03 265);--night-soft:oklch(23% .04 270);--starlight:oklch(90% .04 88);background:radial-gradient(ellipse at 50% 120%, oklch(28% .06 285/.55), transparent 60%), radial-gradient(ellipse at 20% 0%, oklch(30% .05 300/.4), transparent 55%), linear-gradient(180deg, var(--night) 0%, var(--night-soft) 100%);min-height:100vh;position:relative;overflow:hidden}.countdown-content{z-index:1;text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:0 24px;display:flex;position:relative}.kicker{color:color-mix(in oklab, var(--starlight) 70%, transparent);letter-spacing:.45em;margin:0;font-size:14px;line-height:20px}.countdown-content h1{color:#ffffffe6;max-width:768px;margin:24px 0 0;font-size:clamp(30px,3.75vw,48px);font-weight:300;line-height:1.25}.countdown-content h1 span{color:#ffffff8f}.timer{flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:32px;margin-top:56px;display:flex}.unit{flex-direction:column;align-items:center;display:flex}.number-wrap{width:80px;height:72px;position:relative}.number-wrap i{background:color-mix(in oklab, var(--starlight) 10%, transparent);filter:blur(16px);border-radius:16px;animation:4s ease-in-out infinite glow-pulse;position:absolute;inset:-12px}.number-wrap span{color:#fff;font-variant-numeric:tabular-nums;min-width:80px;font-size:72px;font-weight:300;line-height:72px;display:block;position:relative}.unit small{color:#fff6;letter-spacing:.3em;margin-top:12px;font-size:14px;line-height:20px}.timer b{color:#fff3;padding-bottom:32px;font-size:48px;font-weight:400;line-height:48px}.timer.complete .number-wrap{animation:.85s cubic-bezier(.17,.89,.32,1.35) both zero-pop}.timer.complete b{animation:.5s ease-in-out infinite alternate colon-flash}.firework-layer{z-index:4;pointer-events:none;animation:5s ease-out both firework-layer-fade;position:fixed;inset:0;overflow:hidden}.firework-burst{left:var(--x);top:var(--y);filter:saturate(1.35);width:10px;height:10px;position:absolute;transform:translate(-50%,-50%)}.firework-burst:before,.firework-burst:after{content:"";filter:blur(8px);width:92px;height:18px;transform:rotate(var(--flare-angle,18deg)) scaleX(0);animation:firework-flare .9s ease-out var(--delay) both;background:linear-gradient(90deg,#0000,#ffe28b61,#0000);border-radius:999px;position:absolute;top:-8px;left:-44px}.firework-burst:after{--flare-angle:-42deg;width:62px;animation-delay:calc(var(--delay) + .11s);background:linear-gradient(90deg,#0000,#60e8ff47,#0000);transform:rotate(-42deg)scaleX(0)}.firework-burst span{width:var(--spark-size);height:var(--spark-size);background:var(--color);box-shadow:0 0 12px var(--color), 0 0 28px var(--color);transform:translate(-50%, -50%) rotate(var(--angle));animation:firework-spark 1.75s cubic-bezier(.12, .82, .24, 1) var(--delay) both;border-radius:3px 999px 999px;position:absolute;top:50%;left:50%}.firework-burst span:after{content:"";background:linear-gradient(90deg, transparent, var(--color));opacity:.72;border-radius:999px;width:18px;height:2px;position:absolute;top:50%;right:70%;transform:translateY(-50%)}.firework-glitter span{left:var(--left);top:var(--top);background:var(--color);width:5px;height:5px;box-shadow:0 0 14px var(--color);animation:glitter-fall 2.05s ease-out var(--delay) both;border-radius:999px;position:absolute}@keyframes firework-layer-fade{0%{opacity:0}12%{opacity:1}78%{opacity:1}to{opacity:0}}@keyframes firework-flare{0%{opacity:0;transform:rotate(var(--flare-angle,18deg)) scaleX(.12)}22%{opacity:.95}to{opacity:0;transform:rotate(var(--flare-angle,18deg)) scaleX(1.25) translateX(16px)}}@keyframes firework-spark{0%{opacity:0;transform:translate(-50%, -50%) rotate(var(--angle)) translateX(0) translateY(0) scale(.35)}16%{opacity:1}72%{opacity:1}to{opacity:0;transform:translate(-50%, -50%) rotate(var(--angle)) translateX(var(--distance)) translateY(var(--fall)) scale(.1)}}@keyframes glitter-fall{0%{opacity:0;transform:translateY(-20px)scale(.6)}28%{opacity:1}to{opacity:0;transform:translateY(130px)scale(.05)}}.wait-text{color:#fff6;max-width:448px;margin:56px 0 0;font-size:14px;line-height:20px}.dev-controls{z-index:2;flex-direction:column;align-items:flex-end;gap:12px;display:flex;position:absolute;bottom:24px;right:24px}.dev-toggle,.dev-actions button{color:#ffffffc2;cursor:pointer;background:#ffffff14;border:1px solid #ffffff29;border-radius:999px;transition:border-color .18s,background .18s,color .18s}.dev-toggle{padding:9px 16px;font-size:13px}.dev-toggle:hover,.dev-actions button:hover{color:#fff;background:#ffffff21;border-color:#ffe2a070}.dev-panel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#12132bc2;border:1px solid #ffffff24;border-radius:22px;width:min(320px,100vw - 48px);padding:16px;box-shadow:0 18px 50px #00000047}.dev-panel label{color:#ffffff8a;letter-spacing:.28em;text-transform:uppercase;margin-bottom:8px;font-size:12px;display:block}.dev-panel input{color:#fff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#ffffff14;border:1px solid #ffffff29;border-radius:14px;width:100%;padding:11px 12px}.dev-actions{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.dev-actions button{padding:8px 11px;font-size:12px}.stars{pointer-events:none;position:absolute;inset:0}.stars span{left:var(--left);top:var(--top);width:var(--size);height:var(--size);background:var(--starlight);opacity:var(--opacity);animation:4s ease-in-out infinite twinkle;animation-delay:var(--delay);border-radius:999px;position:absolute}.birthday-scene{background:linear-gradient(135deg,#fff8ef 0%,#fff1e8 48%,#ffe5e0 100%);min-height:100vh;position:relative;overflow:hidden}.birthday-content{z-index:1;text-align:center;width:min(100%,760px);margin:0 auto;padding:108px 24px 88px;position:relative}.birthday-kicker,.birthday-content h2{color:#ff9b91;letter-spacing:.45em;margin:0;font-size:14px;font-weight:400}.birthday-title{color:#3f302b;letter-spacing:-.04em;margin:28px 0 0;font-size:clamp(62px,8vw,96px);font-weight:300;line-height:1.15}.birthday-title span{background:linear-gradient(90deg,#f5ba47,#ff9f6e);color:#0000;letter-spacing:-.035em;text-shadow:0 12px 36px #f5a84838;-webkit-background-clip:text;background-clip:text;padding-right:.08em;font-weight:800;display:inline-block}.birthday-subtitle{color:#83726a;margin:28px 0 0;font-size:18px;line-height:1.65}.hero-image{object-fit:cover;border-radius:22px;width:min(508px,100%);height:320px;margin:42px auto 0;display:block;box-shadow:0 20px 45px #754e3b1f}.float-card.is-visible{animation:7s ease-in-out .9s infinite image-float}blockquote{color:#5a4740;max-width:760px;margin:122px auto 0;font-size:29px;font-style:italic;font-weight:300;line-height:1.7}blockquote p{margin:0}blockquote span{color:#ffd8a8;font-size:30px;font-style:normal;font-weight:400}.birthday-content h2{margin-top:124px}.wish-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:42px;display:grid}.wish-grid p{color:#6b5b54;text-align:left;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff75;border:1px solid #fffc;border-radius:18px;min-height:126px;margin:0;padding:24px;font-size:16px;line-height:1.7;box-shadow:0 12px 30px #9a67520f}.wish-card{transition:opacity .78s,transform .78s cubic-bezier(.2,.9,.2,1),box-shadow .24s,border-color .24s;transition-delay:var(--delay,0s)}.wish-card:hover{border-color:#ffb096bf;transform:translateY(-4px);box-shadow:0 18px 42px #9a67521f}.birthday-footer{margin-top:96px}.birthday-footer div{background:#f1d5c2;width:96px;height:1px;margin:0 auto 34px}.birthday-footer p{color:#4c3933;margin:0;font-size:25px;line-height:1.4}.birthday-footer a{color:#f1786e;background:#ffffff40;border:1px solid #ffc6bc;border-radius:999px;align-items:center;gap:8px;margin-top:36px;padding:12px 24px;font-size:14px;text-decoration:none;display:inline-flex}.music-button{z-index:5;color:#5f6970;cursor:pointer;width:44px;height:44px;box-shadow:none;background:#fffdf8b8;border:1px solid #f6d7b7;border-radius:999px;place-items:center;font-size:25px;line-height:1;display:grid;position:fixed;top:20px;right:20px}.music-button span{transform:translateY(-1px)}.music-button.muted:after{content:"";background:#e33d3d;border-radius:999px;width:31px;height:3px;position:absolute;transform:rotate(-42deg);box-shadow:0 0 0 1px #ffffffbf}.soft-dots{pointer-events:none;position:absolute;inset:0}.soft-dots span{left:var(--left);top:var(--top);width:var(--size);height:var(--size);opacity:.45;animation:8s ease-in-out infinite drift;animation-delay:var(--delay);background:#f8a0ae;border-radius:999px;position:absolute}.reveal{opacity:0;filter:blur(8px);transition:opacity .85s,transform .85s cubic-bezier(.2,.9,.2,1),filter .85s;transform:translateY(34px)scale(.985)}.reveal.is-visible{opacity:1;filter:blur();transform:translateY(0)scale(1)}.countdown-enter{opacity:0;animation:.9s cubic-bezier(.2,.9,.2,1) forwards soft-rise}.delay-1{animation-delay:.12s}.delay-2{animation-delay:.26s}.delay-3{animation-delay:.42s}@keyframes glow-pulse{0%,to{opacity:.3;transform:scale(.96)}50%{opacity:.75;transform:scale(1.08)}}@keyframes twinkle{0%,to{opacity:.2;transform:scale(.7)}50%{opacity:1;transform:scale(1.05)}}@keyframes drift{0%,to{transform:translate(0,0)}50%{transform:translate(8px,-12px)}}@keyframes zero-pop{0%{transform:scale(1)}45%{transform:scale(1.12)}to{transform:scale(1)}}@keyframes colon-flash{0%{opacity:.42}to{opacity:1;color:#f4d69a}}@keyframes image-float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-9px)rotate(-.6deg)}}@keyframes soft-rise{0%{opacity:0;filter:blur(8px);transform:translateY(22px)}to{opacity:1;filter:blur();transform:translateY(0)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}.reveal,.countdown-enter{opacity:1;filter:none;transform:none}}@media (width<=760px){.countdown-content{padding:0 16px}.kicker{letter-spacing:.3em;font-size:12px}.countdown-content h1{font-size:31px}.timer{gap:16px;margin-top:44px}.number-wrap,.number-wrap span{width:56px;min-width:56px}.number-wrap{height:48px}.number-wrap span{font-size:48px;line-height:48px}.timer b{padding-bottom:30px;font-size:30px;line-height:30px}.unit small{letter-spacing:.24em;font-size:12px}.birthday-title{font-size:58px}.desktop{display:none}.wish-grid{grid-template-columns:1fr}blockquote{margin-top:80px;font-size:24px}}@media (width<=520px){.timer{gap:11px}.timer b{display:none}.birthday-content{padding-top:86px}.hero-image{height:250px}}