*{box-sizing:border-box;margin:0;padding:0}:root{--bg-dark-1: #020417;--bg-dark-2: #0A0F2C;--stitch-blue: #00B4D8;--stitch-neon: #48CAE4;--stitch-purple: #7209B7;--stitch-indigo: #3F37C9;--stitch-dark-blue: #028090;--text-main: #FFFFFF;--text-muted: rgba(255, 255, 255, .78);--gold: #FFB703;--error: #FF4D6D;--success: #06D6A0;--glass-bg: rgba(255, 255, 255, .08);--glass-border: rgba(255, 255, 255, .18)}html,body{width:100%;min-height:100%;background-color:#120a38;margin:0;padding:0}body{font-family:Outfit,sans-serif;background:linear-gradient(135deg,var(--bg-dark-1) 0%,var(--bg-dark-2) 50%,#120A38 100%);background-attachment:fixed;color:var(--text-main);min-height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden;padding:60px 20px 40px}.ambient-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden;pointer-events:none}.glow{position:absolute;border-radius:50%;filter:blur(120px);opacity:.6;animation:floatGlow 12s ease-in-out infinite alternate}.glow-1{width:480px;height:480px;background:radial-gradient(circle,var(--stitch-blue) 0%,transparent 70%);top:-100px;left:-100px}.glow-2{width:550px;height:550px;background:radial-gradient(circle,var(--stitch-purple) 0%,transparent 70%);bottom:-150px;right:-150px;animation-delay:-5s}@keyframes floatGlow{0%{transform:translate(0) scale(1)}50%{transform:translate(50px,40px) scale(1.1)}to{transform:translate(-30px,60px) scale(.9)}}.app-container{width:100%;max-width:550px;position:relative;z-index:10;display:flex;flex-direction:column;align-items:center}.mascot-stage{position:relative;width:100%;height:175px;display:flex;justify-content:center;margin-bottom:-36px;pointer-events:none}.emotion-bubble{position:absolute;top:-65px;font-size:3rem;opacity:0;transform:translateY(10px) scale(.5);transition:all .4s cubic-bezier(.34,1.56,.64,1);z-index:35;text-shadow:0 6px 18px rgba(0,0,0,.7)}.emotion-bubble.show-happy{opacity:1;transform:translateY(0) scale(1.35);animation:happyBob .8s infinite alternate}.emotion-bubble.show-sad{opacity:1;transform:translateY(0) scale(1.25);animation:sadShake .4s infinite alternate}@keyframes happyBob{0%{transform:translateY(0) scale(1.35) rotate(-6deg)}to{transform:translateY(-16px) scale(1.35) rotate(6deg)}}@keyframes sadShake{0%{transform:translateY(0) scale(1.25) rotate(-3deg)}to{transform:translateY(0) scale(1.25) rotate(3deg)}}.mascot-head-container{position:absolute;bottom:-16px;width:245px;height:215px;z-index:20;transition:transform .3s cubic-bezier(.25,.8,.25,1),filter .4s ease;filter:drop-shadow(0 -5px 25px rgba(0,180,216,.8));transform-origin:center bottom}#tracking-stitch{width:100%;height:100%;object-fit:contain;transition:transform .4s cubic-bezier(.34,1.56,.64,1)}.mascot-head-container.is-happy{animation:jumpJoy .6s ease infinite alternate!important;filter:drop-shadow(0 0 38px rgba(255,183,3,.95))!important}@keyframes jumpJoy{0%{transform:translateY(-8px) scale(1.1) rotate(-4deg)}to{transform:translateY(-28px) scale(1.18) rotate(4deg)}}.mascot-head-container.is-sad{transform:translateY(32px) rotate(-12deg) scale(.9)!important;filter:drop-shadow(0 0 18px rgba(255,77,109,.7)) grayscale(.5)!important;transition:all .5s cubic-bezier(.17,.89,.32,1.49)}.glass-card{width:100%;background:var(--glass-bg);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px);border:1px solid var(--glass-border);border-radius:34px;padding:55px 40px 40px;box-shadow:0 30px 65px #00000080,0 0 50px #00b4d840;position:relative;z-index:10;transition:box-shadow .4s ease}.glass-card:hover{box-shadow:0 35px 75px #0009,0 0 60px #00b4d859}.step{display:none;opacity:0;transform:translateY(20px) scale(.97);transition:opacity .4s ease,transform .4s cubic-bezier(.2,.8,.2,1)}.step.active{display:block;opacity:1;transform:translateY(0) scale(1);animation:fadeInSlide .4s ease-out}@keyframes fadeInSlide{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}h1,h2{font-family:Space Grotesk,sans-serif;font-weight:700;line-height:1.25;margin-bottom:16px;letter-spacing:-.5px}h1{font-size:2.25rem}h2{font-size:1.85rem}.gradient-text{background:linear-gradient(135deg,var(--stitch-neon) 0%,#90E0EF 50%,#4895EF 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:inline-block;filter:drop-shadow(0 2px 8px rgba(72,202,228,.35))}.gradient-text-gold{background:linear-gradient(135deg,#FFEA00 0%,var(--gold) 50%,#FF8F00 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:inline-block;filter:drop-shadow(0 2px 10px rgba(255,183,3,.45))}.highlight{color:var(--stitch-neon);font-weight:700}.subtitle,.desc{font-size:1.08rem;color:var(--text-muted);line-height:1.6;margin-bottom:28px}.step-indicator{display:inline-block;font-size:.82rem;text-transform:uppercase;letter-spacing:2px;background:#00b4d82e;color:var(--stitch-neon);padding:6px 16px;border-radius:20px;margin-bottom:18px;font-weight:700;border:1px solid rgba(0,180,216,.35)}.badge{display:inline-block;background:linear-gradient(90deg,var(--stitch-indigo),var(--stitch-purple));color:#fff;padding:6px 18px;border-radius:24px;font-size:.88rem;font-weight:600;margin-bottom:20px;box-shadow:0 4px 15px #7209b773}.photo-hint-container{margin:25px 0;display:flex;justify-content:center}.photo-frame{position:relative;border-radius:24px;overflow:hidden;max-width:320px;border:2px solid rgba(255,255,255,.25);box-shadow:0 15px 35px #0000008c,0 0 25px #48cae459}.photo-frame img{width:100%;height:230px;object-fit:cover;display:block;transition:transform .5s ease}.photo-frame:hover img{transform:scale(1.06)}.photo-badge{position:absolute;bottom:12px;right:12px;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:6px 14px;border-radius:12px;font-size:.85rem;font-weight:600;color:var(--gold);border:1px solid rgba(255,183,3,.4)}.input-group{margin-bottom:28px}input[type=text],input[type=tel]{width:100%;padding:18px 22px;font-size:1.15rem;font-family:Outfit,sans-serif;color:var(--text-main);background:#0006;border:2px solid var(--glass-border);border-radius:18px;outline:none;transition:all .3s ease;box-shadow:inset 0 2px 5px #00000059}input::placeholder{color:#ffffff73}input:focus{border-color:var(--stitch-blue);background:#0000008c;box-shadow:0 0 25px #00b4d866,inset 0 2px 5px #0000004d;transform:translateY(-2px)}.error-msg{display:none;color:var(--error);font-size:.95rem;margin-top:10px;padding:12px 16px;background:#ff4d6d26;border-left:4px solid var(--error);border-radius:10px;animation:shake .4s ease-in-out;font-weight:600}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.btn{display:inline-flex;justify-content:center;align-items:center;width:100%;padding:18px 28px;font-size:1.18rem;font-weight:700;font-family:Outfit,sans-serif;border:none;border-radius:18px;cursor:pointer;transition:all .3s cubic-bezier(.25,.8,.25,1);position:relative;overflow:hidden;box-shadow:0 10px 25px #00000059;text-transform:none}.btn:active{transform:scale(.96)!important}.btn-primary{background:linear-gradient(135deg,var(--stitch-blue) 0%,var(--stitch-indigo) 100%);color:#fff;box-shadow:0 8px 25px #00b4d873}.btn-primary:hover{box-shadow:0 14px 35px #00b4d8a6;transform:translateY(-3px)}.btn-special{background:linear-gradient(135deg,#7209b7,#b5179e,#4361ee);color:#fff;box-shadow:0 8px 25px #b5179e73;background-size:200% 200%;animation:gradientPulse 3s infinite ease}.btn-special:hover{box-shadow:0 14px 38px #b5179eb3;transform:translateY(-3px)}@keyframes gradientPulse{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.btn-success{background:linear-gradient(135deg,#06d6a0,#03a9f4);color:#fff;box-shadow:0 8px 25px #06d6a073}.btn-success:hover{box-shadow:0 14px 35px #06d6a0a6;transform:translateY(-3px)}.celebration-badge{display:inline-block;background:linear-gradient(90deg,#ffb703,#ff007f);color:#fff;padding:8px 22px;border-radius:20px;font-weight:800;letter-spacing:1px;box-shadow:0 4px 15px #ffb70380;margin-bottom:15px;animation:pulseBadge 2s infinite}@keyframes pulseBadge{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.success-box{background:#06d6a026;border:1px solid rgba(6,214,160,.35);border-radius:20px;padding:22px;margin:25px 0;font-size:1.08rem;color:#e2fff6;line-height:1.6}.footer-note{font-size:.95rem;color:var(--text-muted);font-style:italic;margin-bottom:25px}@media (max-width: 650px){html,body{background-color:#120a38!important;min-height:100%!important;overflow-x:hidden!important}body{padding:35px 12px 45px!important;height:auto!important}.app-container{width:94%;max-width:480px;margin:10px auto}.mascot-stage{height:155px;margin-bottom:-32px}.mascot-head-container{width:210px!important;height:184px!important;bottom:-14px!important}.emotion-bubble{top:-55px;font-size:2.5rem}.glass-card{padding:45px 22px 30px!important;border-radius:28px!important}h1{font-size:1.75rem!important;line-height:1.22}h2{font-size:1.35rem!important}p{font-size:.98rem!important}.badge,.celebration-badge{font-size:.85rem!important;padding:7px 16px!important}.input-group input{padding:15px 18px!important;font-size:1.08rem!important;border-radius:15px!important}.btn{padding:16px 22px!important;font-size:1.12rem!important;border-radius:16px!important}.success-box{padding:18px!important;font-size:1rem!important}}@media (max-width: 380px){.mascot-head-container{width:185px!important;height:162px!important;bottom:-12px!important}h1{font-size:1.55rem!important}.btn{font-size:1.05rem!important;padding:14px 18px!important}}
