@import "https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&family=Indie+Flower&family=Pacifico&display=swap";
:root{--bg:#fff6fb;--surface:#fff;--soft-area:#ffe4f1;--section:#ffd1e8;--pink-main:#ff8fcb;--pink-soft:#ffb6da;--pink-baby:#ffd6ec;--peach:#ffc7a8;--lavender:#e6d9ff;--mint:#cff7e7;--yellow:#fff3c4;--sky:#d4efff;--text-primary:#6b4b57;--text-secondary:#a67c8c;--text-hint:#cfa8b6;--text-white:#fff;--shadow-soft:0 4px 20px #ff8fcb33;--shadow-card:0 8px 32px #ff8fcb26;--shadow-float:0 12px 40px #ff8fcb40;--shadow-inset:inset 0 2px 8px #ff8fcb26;--radius-sm:12px;--radius-md:20px;--radius-lg:28px;--radius-xl:40px;--radius-full:9999px;--font-ui:"Nunito",sans-serif;--font-hand:"Indie Flower",cursive;--font-display:"Pacifico",cursive}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-ui);background-color:var(--bg);color:var(--text-primary);min-height:100vh;position:relative;overflow-x:hidden}h1,h2,h3{color:var(--text-primary);font-weight:800}p{color:var(--text-secondary);line-height:1.6}.font-hand{font-family:var(--font-hand)}.font-display{font-family:var(--font-display)}.jelly-btn{background:linear-gradient(135deg,var(--pink-main),#ff6bb5);color:#fff;font-family:var(--font-ui);border-radius:var(--radius-full);cursor:pointer;box-shadow:0 6px 0 #e0609e,var(--shadow-soft);-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;gap:8px;padding:14px 28px;font-size:16px;font-weight:800;text-decoration:none;transition:all .15s cubic-bezier(.34,1.56,.64,1);display:inline-flex;position:relative}.jelly-btn:hover{box-shadow:0 8px 0 #e0609e,var(--shadow-float);transform:translateY(-2px)}.jelly-btn:active{box-shadow:0 2px 0 #e0609e,var(--shadow-soft);transform:translateY(4px)scale(.96)}.jelly-btn.secondary{color:var(--pink-main);box-shadow:0 6px 0 #ffddef,var(--shadow-soft);border:2px solid var(--pink-baby);background:linear-gradient(135deg,#fff,#fff0f8)}.jelly-btn.secondary:hover{background:linear-gradient(135deg,#fff8fc,#ffeef8)}.jelly-btn.lavender{background:linear-gradient(135deg,#c9b8ff,#b09fff);box-shadow:0 6px #9b87f5,0 4px 16px #b4a0ff66}.jelly-btn.mint{background:linear-gradient(135deg,#7eedc9,#5ee0b5);box-shadow:0 6px #3cc99a,0 4px 16px #64dcb466}.jelly-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.card{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);border:1.5px solid #ffb6da4d;padding:24px}.card-soft{border-radius:var(--radius-lg);box-shadow:var(--shadow-card);border:2px solid var(--pink-baby);background:linear-gradient(135deg,#fff9fd,#fffaff);padding:24px}.card-float{animation:4s ease-in-out infinite float}.kawaii-input{background:var(--soft-area);border:2px solid var(--pink-baby);border-radius:var(--radius-md);width:100%;font-family:var(--font-ui);color:var(--text-primary);outline:none;padding:14px 20px;font-size:15px;transition:all .2s}.kawaii-input:focus{border-color:var(--pink-main);background:#fff;box-shadow:0 0 0 4px #ff8fcb26}.kawaii-input::placeholder{color:var(--text-hint)}.kawaii-textarea{background:var(--soft-area);border:2px solid var(--pink-baby);border-radius:var(--radius-md);width:100%;font-family:var(--font-hand);color:var(--text-primary);resize:none;outline:none;min-height:140px;padding:16px 20px;font-size:17px;line-height:1.8;transition:all .2s}.kawaii-textarea:focus{border-color:var(--pink-main);background:#fff;box-shadow:0 0 0 4px #ff8fcb26}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes floatSlow{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-16px)rotate(5deg)}}@keyframes wobble{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}@keyframes heartbeat{0%,to{transform:scale(1)}15%{transform:scale(1.2)}30%{transform:scale(1)}45%{transform:scale(1.1)}60%{transform:scale(1)}}@keyframes pop{0%{opacity:0;transform:scale(0)}60%{opacity:1;transform:scale(1.2)}to{transform:scale(1)}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes sparkle{0%,to{opacity:0;transform:scale(0)rotate(0)}50%{opacity:1;transform:scale(1)rotate(180deg)}}@keyframes bouncein{0%{opacity:0;transform:scale(.3)translateY(40px)}50%{opacity:1;transform:scale(1.05)translateY(-10px)}70%{transform:scale(.9)translateY(4px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes petals{0%{opacity:1;transform:translateY(-20px)rotate(0)}to{opacity:0;transform:translateY(100vh)rotate(720deg)}}.animate-float{animation:3s ease-in-out infinite float}.animate-float-slow{animation:5s ease-in-out infinite floatSlow}.animate-wobble{animation:2s ease-in-out infinite wobble}.animate-heartbeat{animation:1.5s ease-in-out infinite heartbeat}.animate-pop{animation:.4s cubic-bezier(.34,1.56,.64,1) forwards pop}.animate-slidein{animation:.5s cubic-bezier(.34,1.56,.64,1) forwards slideUp}.animate-fadein{animation:.4s forwards fadeIn}.animate-bouncein{animation:.6s cubic-bezier(.34,1.56,.64,1) forwards bouncein}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--pink-baby)}::-webkit-scrollbar-thumb{background:var(--pink-soft);border-radius:10px}.mobile-container{max-width:430px;min-height:100vh;margin:0 auto;position:relative;overflow:hidden}.badge{background:var(--soft-area);border:1.5px solid var(--pink-baby);border-radius:var(--radius-full);color:var(--pink-main);align-items:center;gap:6px;padding:6px 14px;font-size:13px;font-weight:700;display:inline-flex}.gradient-text{background:linear-gradient(135deg,#ff8fcb,#c878ff,#ff8fcb) 0 0/200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;animation:3s linear infinite shimmer}.step-dot{background:var(--pink-baby);border-radius:50%;width:10px;height:10px;transition:all .3s}.step-dot.active{background:var(--pink-main);transform:scale(1.3);box-shadow:0 0 0 4px #ff8fcb33}.step-dot.done{background:var(--mint)}::selection{color:var(--text-primary);background:#ff8fcb40}
