@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:100%;-webkit-text-size-adjust:100%}body{min-height:100dvh;background:linear-gradient(135deg,#1a0a2e,#2d1b4e,#1a0a2e);color:#f0e6ff;font:400 1rem/1.6 Inter,system-ui,sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background-image:radial-gradient(2px 2px at 10% 15%,#fff8,transparent),radial-gradient(2px 2px at 25% 35%,#ffb6c188,transparent),radial-gradient(1px 1px at 40% 10%,#fff6,transparent),radial-gradient(2px 2px at 55% 25%,#e0b0ff88,transparent),radial-gradient(1px 1px at 70% 45%,#fff8,transparent),radial-gradient(3px 3px at 15% 60%,#ffd70088,transparent),radial-gradient(1px 1px at 85% 20%,#fff6,transparent),radial-gradient(2px 2px at 35% 75%,#ff69b488,transparent),radial-gradient(2px 2px at 60% 55%,#fff8,transparent),radial-gradient(1px 1px at 80% 70%,#ffb6c188,transparent),radial-gradient(2px 2px at 50% 85%,#e0b0ff88,transparent),radial-gradient(1px 1px at 20% 90%,#fff6,transparent),radial-gradient(3px 3px at 75% 5%,#ffd70088,transparent),radial-gradient(1px 1px at 90% 40%,#fff8,transparent),radial-gradient(2px 2px at 45% 95%,#ff69b488,transparent);background-size:200% 200%;animation:twinkle 4s ease-in-out infinite alternate}@keyframes twinkle{0%{opacity:.7}to{opacity:1}}@keyframes shimmer{0%{background-position:0% center}to{background-position:200% center}}@keyframes glow{0%,to{box-shadow:0 0 20px #ff69b466,0 0 40px #ff69b433}50%{box-shadow:0 0 30px #ff149388,0 0 60px #ff69b466}}#root{position:relative;z-index:1;isolation:isolate}main{width:min(100% - 2rem,72rem);margin-inline:auto;padding-block:max(1rem,env(safe-area-inset-top));padding-inline:max(.5rem,env(safe-area-inset-right));padding-bottom:max(2rem,env(safe-area-inset-bottom))}.app-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left));margin-bottom:clamp(.75rem,3vw,1.5rem)}.app-logo{font-size:clamp(1.2rem,4vw,1.5rem);font-weight:800;color:#ff69b4;text-decoration:none;text-shadow:0 0 10px #ff69b466}.audio-control{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:2px solid #ff69b444;border-radius:50%;background:#ff69b411;color:#ffb6c1;font-size:1.3rem;cursor:pointer;transition:all .2s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.audio-control:active{background:#ff69b433;transform:scale(.95)}.home-container{display:flex;flex-direction:column;align-items:center;gap:clamp(.75rem,3vw,1.5rem)}.surprise-photo{width:100%;max-width:20rem;margin-inline:auto}.surprise-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:clamp(1rem,3vw,1.5rem);box-shadow:0 0 30px #ff69b466,0 0 60px #ff149333;animation:glow 2s ease-in-out infinite;border:3px solid #ff69b466}.surprise-text{font-size:clamp(1.6rem,7vw,2.6rem);line-height:1.15;font-weight:800;text-align:center;max-width:16ch;word-break:break-word;margin:0;background:linear-gradient(90deg,#ff0080,#ff69b4,orange,#ff0080);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 2s linear infinite;filter:drop-shadow(0 0 8px #ff69b488);letter-spacing:-.02em}.autoplay-fallback{display:block;width:100%;min-height:48px;margin-bottom:12px;padding:12px 16px;border:2px dashed #ff69b466;border-radius:12px;background:linear-gradient(135deg,#ff69b411,#ff149311);color:#ffb6c1;font-size:1rem;font-weight:700;text-align:center;cursor:pointer;touch-action:manipulation;transition:all .15s;text-shadow:0 0 6px #ff69b444}.autoplay-fallback:active{background:#ff69b433;transform:scale(.98)}.card{background:linear-gradient(135deg,#2d1b4ecc,#1a0a2ecc,#2d1b4ecc);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #ff69b422;border-radius:clamp(12px,3vw,20px);padding:clamp(16px,5vw,32px);box-shadow:0 8px 32px #0003,inset 0 1px #fff1;width:100%}.hero{max-width:min(100%,44rem);margin-inline:auto}h1{font-size:clamp(1.3rem,5vw,1.8rem);margin-top:0;line-height:1.25;color:#ffb6c1}h2{font-size:clamp(1.1rem,4vw,1.4rem);margin-top:clamp(1rem,4vw,1.5rem);color:#e0b0ff}h3{font-size:clamp(1rem,3vw,1.15rem);margin-top:1rem;color:#ffb6c1}form{display:grid;gap:clamp(8px,2vw,12px);margin:clamp(16px,4vw,28px) 0}label{font-size:.95rem;font-weight:600;color:#d4b8ff}input{width:100%;min-height:48px;padding:12px 14px;border:2px solid #ff69b433;border-radius:10px;background:#1a0a2e99;color:#f0e6ff;font-size:1rem;font-family:inherit;transition:border-color .15s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}input::placeholder{color:#9b7ec4}input:focus{outline:none;border-color:#ff69b4;box-shadow:0 0 12px #ff69b444}.submit-btn{width:100%;min-height:48px;justify-self:stretch;border:0;border-radius:10px;background:linear-gradient(135deg,#ff69b4,#ff1493);color:#fff;padding:12px 18px;font:700 1rem Inter,system-ui;cursor:pointer;touch-action:manipulation;transition:all .15s;box-shadow:0 4px 16px #ff69b444;text-shadow:0 1px 2px #0003}.submit-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.submit-btn:not(:disabled):active{transform:scale(.97)}.error{color:#ff6b6b;font-size:.95rem;margin-top:8px}small{display:block;color:#9b7ec4;line-height:1.5;font-size:.85rem;margin-top:12px}.progress{height:12px;border-radius:9px;background:#1a0a2e;overflow:hidden;margin:12px 0;border:1px solid #ff69b422}.progress i{display:block;height:100%;background:linear-gradient(90deg,#ff69b4,#ff1493);transition:width .3s}.progress+p{margin-top:4px;font-size:.95rem;color:#d4b8ff}article{border-top:2px solid #ff69b422;margin-top:clamp(16px,4vw,25px);padding-top:clamp(16px,4vw,20px)}.row{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.row button{min-width:44px;min-height:44px;padding:8px 14px;border:0;border-radius:8px;background:linear-gradient(135deg,#ff69b4,#ff1493);color:#fff;font:700 .9rem Inter,system-ui;cursor:pointer;touch-action:manipulation}pre{white-space:pre-wrap;line-height:1.65;font:.9rem/1.65 Inter,system-ui;background:#1a0a2e99;border:1px solid #ff69b422;border-radius:8px;padding:12px;margin-top:8px;max-height:60vh;overflow-y:auto;color:#f0e6ff}article a{color:#ffb6c1;font-weight:600;text-decoration:none;margin-right:12px}article a:active{text-decoration:underline}a[href="/"]{display:inline-block;margin-top:16px;color:#ffb6c1;font-weight:600}@media (min-width:768px){.submit-btn{width:auto;justify-self:start}form{grid-template-columns:1fr auto;align-items:end}input{grid-column:1}.submit-btn{grid-column:2}.error,label,small{grid-column:1/-1}}@media (min-width:1024px){main{padding-block:max(2rem,env(safe-area-inset-top))}.app-header{padding:12px 0;margin-bottom:2rem}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}body:before{animation:none;opacity:.5}.surprise-photo img{animation:none;box-shadow:0 0 20px #ff69b444}}