@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Silkscreen:wght@400;700&display=swap";@layer components;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-font-weight:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-blue-600:oklch(54.6% .245 262.881);--color-gray-600:oklch(44.6% .03 256.802);--spacing:.25rem;--font-weight-bold:700;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.static{position:static}.start{inset-inline-start:var(--spacing)}.hidden{display:none}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.text-blue-600{color:var(--color-blue-600)}.text-gray-600{color:var(--color-gray-600)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}}:root{color-scheme:dark;--night:#11102a;--night-soft:#1c1941;--cream:#fff3c7;--gold:#e8bd61;--rose:#dd7084;--mint:#7ec8ac;--ink:#29233f}*{box-sizing:border-box}html,body,#root{min-height:100%}html{background:var(--night)}body{background:var(--night);-webkit-font-smoothing:none;-webkit-tap-highlight-color:transparent;min-width:320px;margin:0;font-family:Silkscreen,cursive;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}.birthday-page{isolation:isolate;min-height:100svh;color:var(--cream);background:radial-gradient(circle at 76% 22%,#e8bd611a,#0000 22%),linear-gradient(#171536,#11102a 68%,#191433);position:relative;overflow:hidden}.birthday-page:before{z-index:20;pointer-events:none;content:"";opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");position:fixed;inset:0}.scanlines{z-index:19;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 3px,#07061229 3px 4px);position:fixed;inset:0}.stars{z-index:0;pointer-events:none;position:absolute;inset:0}.stars-near{background-image:radial-gradient(circle,#fff3c7 0 1px,#0000 1.5px),radial-gradient(circle,#e8bd61 0 1.5px,#0000 2px);background-position:18px 22px,80px 94px;background-size:118px 104px,173px 151px;animation:2.8s steps(2,end) infinite twinkle}.stars-far{opacity:.45;background-image:radial-gradient(circle,#fff3c7b3 0 1px,#0000 1px);background-position:45px 70px;background-size:72px 82px}.intro-screen{z-index:9;padding:max(24px,env(safe-area-inset-top)) 24px max(34px,env(safe-area-inset-bottom));text-align:center;flex-direction:column;justify-content:center;align-items:center;animation:1s steps(7,end) 5.2s forwards intro-exit;display:flex;position:absolute;inset:0}.arcade-label{color:var(--mint);letter-spacing:.08em;margin-bottom:34px;font-size:clamp(.58rem,2.5vw,.72rem);animation:.8s steps(5,end) both flicker-in}.intro-screen h1{letter-spacing:-.04em;text-wrap:balance;text-shadow:4px 4px #6c405e;margin:0;font-family:"Press Start 2P",cursive;font-size:clamp(1.45rem,7vw,3.8rem);font-weight:400;line-height:1.48}.intro-screen h1 span{opacity:0;animation:.7s steps(6,end) .7s forwards word-up;display:block;transform:translateY(14px)}.intro-screen h1 span:last-child{color:var(--gold);animation-delay:1.4s}.loading-track{background:#0a091bb3;border:2px solid #fff3c780;width:min(320px,72vw);height:14px;margin-top:44px;padding:3px}.loading-track span{background:repeating-linear-gradient(90deg,var(--rose) 0 12px,#f3a4aa 12px 16px);width:0;height:100%;animation:3.1s steps(12,end) 1.65s forwards loading;display:block}.intro-screen>p{color:#fff3c79e;opacity:0;max-width:440px;margin:16px 0 0;font-size:clamp(.58rem,2.8vw,.72rem);line-height:1.7;animation:.5s steps(4,end) 2.3s forwards word-up}.celebration{z-index:2;opacity:0;animation:1s steps(7,end) 4.9s forwards scene-in;position:absolute;inset:0}.moon{aspect-ratio:1;background:var(--cream);border:5px solid #d7a955;border-radius:50%;width:clamp(72px,19vw,146px);position:absolute;top:max(7svh,52px);right:8vw;box-shadow:8px 8px #533555cc}.moon:before,.moon:after,.moon span{content:"";background:#d7a95559;border-radius:50%;position:absolute}.moon:before{width:18%;height:18%;top:20%;left:25%}.moon:after{width:12%;height:12%;top:55%;right:18%}.moon span{width:8%;height:8%;top:44%;left:12%}.cloud{opacity:.65;background:#3a355d;width:96px;height:18px;animation:18s linear infinite cloud-drift;position:absolute}.cloud:before,.cloud:after{content:"";background:inherit;position:absolute;bottom:0}.cloud:before{width:32px;height:30px;left:16px}.cloud:after{width:40px;height:26px;right:14px}.cloud-one{top:22%;left:-120px}.cloud-two{animation-delay:-9s;top:35%;left:-180px;transform:scale(.7)}.message-card{border:3px solid var(--cream);opacity:0;background:#1c1941e6;width:min(40vw,430px);padding:22px 24px;animation:.7s steps(6,end) 6.2s forwards word-up;position:absolute;top:max(12svh,80px);left:clamp(24px,8vw,120px);transform:translateY(18px);box-shadow:7px 7px #6c405e}.message-card:after{border-right:3px solid var(--cream);border-bottom:3px solid var(--cream);content:"";background:#1c1941;width:24px;height:24px;position:absolute;bottom:-17px;left:38px;transform:rotate(45deg)}.message-kicker{color:var(--rose);letter-spacing:.12em;font-size:clamp(.55rem,1.5vw,.75rem)}.message-card p{margin:12px 0 0;font-size:clamp(.72rem,1.7vw,1rem);line-height:1.65}.friend-wrap{bottom:calc(max(36px,env(safe-area-inset-bottom)) + 18px);z-index:4;opacity:0;width:clamp(138px,26vw,250px);animation:1.2s steps(9,end) 5.5s forwards friend-arrives,1.6s steps(2,end) 6.8s infinite friend-bob;position:absolute;left:clamp(4vw,12vw,210px);transform:translateY(44px)}.pixel-friend{filter:drop-shadow(8px 8px #05040e59);width:100%;display:block}.pixel-shadow{background:#0605118c;width:75%;height:10px;position:absolute;bottom:0;left:14%;transform:skew(-28deg)}.rose-spark{background:var(--gold);opacity:0;width:7px;height:7px;animation:1.4s steps(4,end) 7s infinite sparkle;position:absolute;transform:rotate(45deg)}.rose-spark-one{top:26%;right:4%}.rose-spark-two{animation-delay:7.45s;top:38%;right:-3%;transform:scale(.7)rotate(45deg)}.rose-spark-three{animation-delay:7.9s;top:17%;right:15%;transform:scale(.55)rotate(45deg)}.final-message{z-index:8;text-align:center;opacity:0;width:min(49vw,620px);animation:1.15s steps(9,end) 8.4s forwards final-reveal;position:absolute;top:50%;right:clamp(4vw,10vw,150px);transform:translateY(-42%)scale(.8)}.crown{color:var(--gold);margin-bottom:12px;font-family:Georgia,serif;font-size:clamp(2rem,5vw,4rem);line-height:1;display:block}.final-eyebrow{color:var(--mint);letter-spacing:.12em;margin:0 0 18px;font-size:clamp(.55rem,1.4vw,.78rem)}.final-message h2{color:var(--cream);letter-spacing:-.05em;text-shadow:5px 5px #a34c68,10px 10px #29233fcc;margin:0;font-family:"Press Start 2P",cursive;font-size:clamp(2rem,6vw,5.6rem);font-weight:400;line-height:1.22}.wish{color:#fff3c7cc;max-width:520px;margin:28px auto 0;font-size:clamp(.7rem,1.5vw,.95rem);line-height:1.65}.pixel-hearts{justify-content:center;gap:20px;margin-top:24px;display:flex}.pixel-hearts i{background:var(--rose);width:16px;height:14px;animation:1.1s steps(2,end) infinite heart-beat;display:block;position:relative;transform:rotate(45deg)}.pixel-hearts i:before,.pixel-hearts i:after{content:"";background:inherit;width:16px;height:14px;position:absolute}.pixel-hearts i:before{left:-8px}.pixel-hearts i:after{top:-8px}.pixel-hearts i:nth-child(2){animation-delay:.2s}.pixel-hearts i:nth-child(3){animation-delay:.4s}.ground{height:max(42px,calc(env(safe-area-inset-bottom) + 26px));z-index:3;background:repeating-linear-gradient(90deg,#274c48 0 18px,#2d5750 18px 36px);border-top:6px solid #386f61;position:absolute;bottom:0;left:0;right:0}.grass{background:#4f9c75;width:8px;height:12px;position:absolute;top:-15px;box-shadow:8px 5px #4f9c75,-8px 5px #4f9c75}.grass-one{left:8%}.grass-two{left:46%}.grass-three{right:12%}.fireworks{z-index:5;pointer-events:none;position:absolute;inset:0}.sound-note{right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));z-index:25;color:#fff3c7b3;opacity:0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#11102ae0;border:2px solid #fff3c747;align-items:center;gap:10px;max-width:min(310px,100vw - 28px);padding:10px 12px;font-size:.58rem;line-height:1.35;animation:.5s steps(4,end) 8.4s forwards note-in;display:flex;position:fixed;transform:translateY(12px)}.sound-note.is-playing{color:var(--mint)}.sound-bars{align-items:end;gap:2px;height:14px;display:flex}.sound-bars i{background:currentColor;width:3px;height:5px;display:block}.is-playing .sound-bars i{animation:.65s steps(3,end) infinite alternate bars}.is-playing .sound-bars i:nth-child(2){animation-delay:.2s}.is-playing .sound-bars i:nth-child(3){animation-delay:.4s}@keyframes twinkle{50%{opacity:.45}}@keyframes flicker-in{0%,30%{opacity:0}40%,55%{opacity:1}65%{opacity:.3}to{opacity:1}}@keyframes word-up{to{opacity:1;transform:translateY(0)}}@keyframes loading{to{width:100%}}@keyframes intro-exit{to{opacity:0;visibility:hidden;transform:scale(1.04)}}@keyframes scene-in{to{opacity:1}}@keyframes friend-arrives{to{opacity:1;transform:translateY(0)}}@keyframes friend-bob{50%{transform:translateY(-5px)}}@keyframes sparkle{0%,to{opacity:0}40%,60%{opacity:1}80%{opacity:0;transform:scale(1.7)rotate(45deg)}}@keyframes final-reveal{to{opacity:1;transform:translateY(-50%)scale(1)}}@keyframes heart-beat{50%{transform:rotate(45deg)scale(1.2)}}@keyframes bars{to{height:14px}}@keyframes note-in{to{opacity:1;transform:translateY(0)}}@keyframes cloud-drift{to{transform:translate(calc(100vw + 300px))}}@media(max-width:700px){.message-card{width:calc(100vw - 128px);padding:15px 16px;top:max(9svh,64px);left:18px}.message-card p{margin-top:8px;font-size:.62rem}.friend-wrap{bottom:calc(max(38px,env(safe-area-inset-bottom)) + 18px);width:min(48vw,190px);left:-2px}.moon{top:max(6svh,48px);right:16px}.final-message{width:64vw;top:55%;right:14px}.final-message h2{text-shadow:3px 3px #a34c68,6px 6px #29233fcc;font-size:clamp(1.55rem,8.4vw,2.8rem);line-height:1.35}.wish{margin-top:18px;font-size:.6rem;line-height:1.55}.final-eyebrow{margin-bottom:12px;font-size:.48rem}.crown{margin-bottom:8px}.pixel-hearts{gap:16px;margin-top:18px;transform:scale(.75)}.sound-note{right:10px;bottom:max(8px,env(safe-area-inset-bottom));max-width:230px;padding:8px 10px;font-size:.49rem}}@media(max-width:390px)and (max-height:700px){.message-card{top:46px}.message-card p{display:none}.final-message{top:50%}.wish{display:none}.friend-wrap{width:42vw}}@media(prefers-reduced-motion:reduce){*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}.intro-screen{display:none}.celebration,.friend-wrap,.message-card,.final-message,.sound-note{opacity:1}.final-message{transform:translateY(-50%)scale(1)}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}
