:root{--night:#10021f;--violet:#2b073e;--gold:#ffc84a;--saffron:#ff7b32;--rose:#db3f6b;--cream:#fff7df;--muted:#c8b7cf;--line:rgba(255,217,128,.18)}
*{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;min-width:280px;min-height:100%;background:var(--night);color:var(--cream);font-family:Hind,system-ui,sans-serif;overflow-x:hidden}button,input{font:inherit}button{touch-action:manipulation}.intro{position:fixed;inset:0;z-index:100;min-height:100vh;min-height:100dvh;background:#10021f;overflow:hidden;transition:opacity .8s ease,visibility .8s}.intro.done{opacity:0;visibility:hidden;pointer-events:none}.story{width:100%;height:100%;display:block}.intro-brand{position:absolute;top:28px;left:36px;font:600 12px/1 Hind;letter-spacing:.25em;color:rgba(255,245,209,.65)}.brand-diya{color:var(--gold);margin-right:10px}.skip{position:absolute;right:34px;top:26px;min-height:44px;padding:10px 17px;border:1px solid rgba(255,255,255,.2);border-radius:999px;color:#fff;background:rgba(13,3,28,.25);backdrop-filter:blur(12px);cursor:pointer}.skip:hover{border-color:var(--gold);color:var(--gold)}.story-progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.08)}.story-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--saffron),var(--gold),#fff3ad);box-shadow:0 0 18px var(--gold)}.playing .story-progress span{animation:progress 18s linear forwards}
.boat-scene{opacity:0}.playing .boat-scene{animation:sceneOne 7s ease both}.playing .boat{animation:boatMove 7s ease-in-out both}.character{transform-box:fill-box;transform-origin:center bottom}.playing .character{animation:characterFloat 2.3s ease-in-out infinite alternate}.playing .sita{animation-delay:-.6s}.playing .lakshman{animation-delay:-1.1s}.hanuman-flight{transform-box:fill-box;transform-origin:center}.playing .hanuman-flight{animation:hanumanGuide 6.2s .25s ease-in-out both}.hanuman-welcome{transform-box:fill-box;transform-origin:center bottom;opacity:0}.playing .hanuman-welcome{animation:hanumanBow 2s 7.2s cubic-bezier(.2,.9,.3,1) forwards}.stars circle{animation:twinkle 2.5s ease-in-out infinite alternate}.stars circle:nth-child(2n){animation-delay:-1s}.scene-caption,.final-sub{font:500 42px 'Tiro Devanagari Hindi',serif;fill:#fff5d3;filter:drop-shadow(0 3px 14px #16031e)}.caption-one{opacity:0}.playing .caption-one{animation:captionIn 5.4s .8s ease both}.welcome-scene{opacity:0}.playing .welcome-scene{animation:sceneTwo 7s 6s ease both}.diyas>g{opacity:0;transform-box:fill-box;transform-origin:center}.playing .diyas>g{animation:lightDiya 1s 7s ease forwards}.playing .diyas>g:nth-child(2){animation-delay:7.5s}.playing .diyas>g:nth-child(3){animation-delay:8s}.playing .diyas>g:nth-child(4){animation-delay:8.5s}.playing .diyas>g:nth-child(5){animation-delay:9s}.caption-two{opacity:0}.playing .caption-two{animation:captionIn 4s 7s ease both}.people{transform-origin:center}.playing .people{animation:welcome 2s 7s ease both}.fireworks-scene{opacity:0}.playing .fireworks-scene{animation:finalScene 7s 12s ease both}.burst{opacity:0;transform-box:fill-box;transform-origin:center;stroke-linecap:round}.playing .b1{animation:burst 1.4s 12.8s ease-out forwards}.playing .b2{animation:burst 1.4s 13.4s ease-out forwards}.playing .b3{animation:burst 1.4s 14s ease-out forwards}.final-title{font:italic 700 130px 'Tiro Devanagari Hindi',serif;fill:url(#gold);letter-spacing:5px;opacity:0;filter:drop-shadow(0 0 28px #ff9d36)}.final-year{font:700 112px Hind,sans-serif;fill:#fff7de;letter-spacing:32px;opacity:0}.final-sub{font-size:34px;opacity:0}.playing .final-title{animation:titleIn 1.2s 13.4s cubic-bezier(.2,.9,.2,1.2) forwards}.playing .final-year{animation:titleIn 1.2s 14.2s ease forwards}.playing .final-sub{animation:titleIn 1s 15s ease forwards}
@keyframes progress{to{width:100%}}@keyframes twinkle{to{opacity:.25;scale:.5}}@keyframes sceneOne{0%{opacity:0}8%,82%{opacity:1}100%{opacity:0}}@keyframes boatMove{0%{transform:translateX(-800px) translateY(30px)}75%{transform:translateX(140px) translateY(-15px)}100%{transform:translateX(190px)}}@keyframes characterFloat{to{translate:0 -7px;rotate:.8deg}}@keyframes hanumanGuide{0%{opacity:0;translate:-650px 150px;rotate:-12deg;scale:.7}18%{opacity:1}65%{translate:70px -45px;rotate:5deg;scale:1}100%{opacity:.9;translate:190px -15px;rotate:2deg;scale:.96}}@keyframes hanumanBow{0%{opacity:0;translate:0 80px;rotate:-8deg}70%{opacity:1;translate:0 0;rotate:2deg}100%{opacity:1;translate:0 0;rotate:0deg}}@keyframes captionIn{0%{opacity:0;translate:0 25px}20%,75%{opacity:1;translate:0 0}100%{opacity:0}}@keyframes sceneTwo{0%{opacity:0}12%,82%{opacity:1}100%{opacity:0}}@keyframes lightDiya{0%{opacity:0;scale:.3}100%{opacity:1;scale:1}}@keyframes welcome{0%{translate:0 80px;opacity:0}100%{translate:0 0;opacity:1}}@keyframes finalScene{0%{opacity:0}12%,100%{opacity:1}}@keyframes burst{0%{opacity:0;scale:.1;rotate:-20deg}35%{opacity:1}100%{opacity:.35;scale:1.25;rotate:12deg}}@keyframes titleIn{0%{opacity:0;translate:0 45px;scale:.88}100%{opacity:1;translate:0 0;scale:1}}
.creator{position:relative;min-height:100vh;opacity:0;visibility:hidden;background:radial-gradient(circle at 50% -10%,#4b114b 0,#180527 42%,#0e0219 80%);transition:opacity .8s}.creator.visible{opacity:1;visibility:visible}.ambient{position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none}.a1{width:480px;height:480px;background:rgba(255,110,47,.13);top:300px;left:-220px}.a2{width:580px;height:580px;background:rgba(132,54,193,.14);right:-260px;top:650px}.topbar{position:relative;z-index:2;max-width:1240px;margin:auto;padding:24px 30px;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;gap:12px;align-items:center;color:#fff;text-decoration:none;letter-spacing:.03em}.logo>span{display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffcc63;border-radius:50%;font:700 17px 'Tiro Devanagari Hindi';color:#ffcc63;box-shadow:0 0 24px rgba(255,193,68,.18)}.logo strong{font-size:17px}.ghost-btn{border:1px solid var(--line);background:rgba(255,255,255,.04);color:#f8e9d4;border-radius:999px;padding:10px 18px;cursor:pointer;transition:.25s}.ghost-btn:hover{border-color:#ffc859;background:rgba(255,200,89,.08)}.hero-copy{text-align:center;max-width:860px;margin:80px auto 60px;padding:0 24px}.eyebrow{color:#f2bc56;letter-spacing:.22em;font-size:12px;font-weight:700}.hero-copy h1{font:400 clamp(45px,6.2vw,82px)/1.08 'Tiro Devanagari Hindi',serif;margin:24px 0 18px}.hero-copy h1 em{color:#ffc85a;font-style:normal;text-shadow:0 0 45px rgba(255,166,59,.2)}.hero-copy p{max-width:650px;margin:auto;color:var(--muted);font-size:18px;line-height:1.75}.studio{position:relative;z-index:2;max-width:1180px;margin:auto;padding:0 24px 100px;display:grid;grid-template-columns:minmax(320px,.88fr) minmax(360px,1.12fr);gap:48px;align-items:start}.panel{background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));border:1px solid var(--line);box-shadow:0 30px 100px rgba(0,0,0,.3);border-radius:28px;padding:30px;backdrop-filter:blur(20px)}.panel-heading{display:flex;gap:16px;align-items:center;margin-bottom:28px}.panel-heading>span{font:700 12px Hind;color:#1b0824;background:var(--gold);width:38px;height:38px;border-radius:12px;display:grid;place-items:center}.panel-heading h2{font:600 23px 'Tiro Devanagari Hindi';margin:0}.panel-heading p{color:#a995af;margin:4px 0 0;font-size:13px}.upload{position:relative;min-height:118px;border:1px dashed rgba(255,204,98,.4);border-radius:19px;padding:20px;display:flex;align-items:center;gap:15px;background:rgba(255,190,73,.035);cursor:pointer;overflow:hidden;transition:.25s}.upload:hover,.upload.dragging{border-color:var(--gold);background:rgba(255,190,73,.08)}.upload-icon{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(255,194,71,.12);color:var(--gold);font-size:24px}.upload strong,.upload small{display:block}.upload strong{font-size:16px}.upload small{color:#9d8aa5;margin-top:5px;font-size:11px}.upload img{display:none;position:absolute;right:12px;width:92px;height:92px;object-fit:cover;border-radius:15px;border:2px solid var(--gold)}.upload.has-photo img{display:block}.upload.has-photo>span:nth-of-type(2){max-width:55%}.field{display:block;margin-top:22px}.field>span,.wish-row>span{display:block;color:#dccde0;font-size:13px;margin:0 0 8px}.field input{width:100%;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(4,0,10,.34);color:#fff;padding:14px 16px;outline:none;transition:.25s}.field input:focus{border-color:#f4bd54;box-shadow:0 0 0 4px rgba(244,189,84,.08)}.wish-row{display:flex;align-items:end;justify-content:space-between;margin-top:22px}.wish-row button{color:#f6c25d;background:transparent;border:0;cursor:pointer;font-size:12px}.controls blockquote{margin:0;padding:16px 17px;min-height:92px;border-left:2px solid var(--gold);background:rgba(255,255,255,.035);border-radius:0 14px 14px 0;color:#d6c6da;font-family:'Tiro Devanagari Hindi';line-height:1.65}.primary{width:100%;border:0;border-radius:15px;background:linear-gradient(105deg,#ff8f39,#ffc94f);color:#261029;font-weight:700;margin-top:24px;padding:15px 18px;display:flex;align-items:center;justify-content:center;gap:14px;cursor:pointer;box-shadow:0 14px 35px rgba(255,131,51,.2);transition:.25s}.primary:hover{transform:translateY(-2px);box-shadow:0 18px 45px rgba(255,131,51,.3)}.primary b{font-size:20px}.error{min-height:20px;color:#ff8399;font-size:12px;margin:10px 0 -8px}.preview-wrap{position:sticky;top:24px}.preview-label{display:flex;align-items:center;gap:12px;margin:0 0 12px;color:#bca9c4;font:600 10px Hind;letter-spacing:.2em}.preview-label i{height:1px;flex:1;background:linear-gradient(90deg,var(--line),transparent)}.greeting-card{position:relative;isolation:isolate;aspect-ratio:4/5;max-height:720px;margin:auto;overflow:hidden;border:1px solid rgba(255,215,120,.3);border-radius:30px;background:radial-gradient(circle at 50% 35%,#68243d 0,#2a0a39 48%,#10031d 100%);box-shadow:0 45px 110px rgba(0,0,0,.48),inset 0 0 90px rgba(255,152,48,.06)}.greeting-card:before{content:"";position:absolute;inset:10px;border:1px solid rgba(255,211,112,.2);border-radius:22px;pointer-events:none}.card-stars{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(#ffe49a 1px,transparent 1px),radial-gradient(#fff 1px,transparent 1px);background-size:70px 70px,110px 110px;background-position:0 0,35px 20px}.card-top{position:relative;z-index:2;display:flex;justify-content:space-between;padding:27px 30px;color:#f4c763;font-size:9px;letter-spacing:.18em}.card-top small{color:#cfb8d3}.portrait-frame{position:relative;z-index:2;width:min(42%,210px);aspect-ratio:1;margin:22px auto 18px;border-radius:50%;padding:7px;background:linear-gradient(135deg,#fff0a2,#ff8b37,#8c285a);box-shadow:0 18px 50px rgba(0,0,0,.35)}.portrait-frame img,.portrait-frame>div:not(.portrait-glow){width:100%;height:100%;border-radius:50%;object-fit:cover;background:#1e082c}.portrait-frame img{display:none}.portrait-frame.has-photo img{display:block}.portrait-frame.has-photo #portraitFallback{display:none}#portraitFallback{display:grid;place-items:center;color:#efbe62;font:400 58px 'Tiro Devanagari Hindi'}.portrait-glow{position:absolute;inset:-35%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(255,174,59,.22),transparent 65%)}.card-content{position:relative;z-index:2;text-align:center;padding:0 9%}.card-content>p{font:400 clamp(24px,3.3vw,42px) 'Tiro Devanagari Hindi';color:#f9c85f;margin:10px 0 3px}.card-content h2{font:400 clamp(30px,4.5vw,58px) 'Tiro Devanagari Hindi';margin:0;color:#fff6db}.divider{display:flex;align-items:center;justify-content:center;gap:10px;margin:11px auto;width:70%}.divider i{height:1px;flex:1;background:linear-gradient(90deg,transparent,#dcae55)}.divider i:last-child{background:linear-gradient(90deg,#dcae55,transparent)}.divider span{color:#ffc750}.card-content blockquote{min-height:66px;margin:0 auto;max-width:500px;color:#dccadf;font:400 clamp(13px,1.55vw,20px)/1.6 'Tiro Devanagari Hindi'}.card-diyas{position:absolute;z-index:2;bottom:48px;left:12%;right:12%;display:flex;align-items:center;gap:10px}.card-diyas span{font-size:25px;filter:drop-shadow(0 0 13px #ff9a32)}.card-diyas i{height:1px;flex:1;background:linear-gradient(90deg,transparent,#8f4d50,transparent)}.card-foot{position:absolute;z-index:2;bottom:21px;left:0;right:0;text-align:center;color:#a58ca9;letter-spacing:.18em;font-size:8px}.card-firework{position:absolute;width:130px;height:130px;opacity:.3;background:repeating-conic-gradient(from 0deg,#ffc951 0 2deg,transparent 2deg 18deg);border-radius:50%;mask:radial-gradient(circle,transparent 0 25%,#000 26% 64%,transparent 65%)}.f-one{left:-25px;top:95px}.f-two{right:-35px;top:175px;transform:scale(.72);filter:hue-rotate(300deg)}.actions{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:14px}.actions .primary{margin:0}.share{border-radius:15px}.shake{animation:shake .35s ease}@keyframes shake{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}footer{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.06);padding:25px;display:flex;align-items:center;justify-content:center;gap:18px;color:#88768e;font-size:12px}footer span{filter:drop-shadow(0 0 8px #ff8e2f)}
@media(max-width:840px){.hero-copy{margin:58px auto 45px}.studio{grid-template-columns:minmax(0,1fr);max-width:620px}.preview-wrap{position:relative;top:auto}.greeting-card{max-height:none}.topbar{padding:18px max(18px,env(safe-area-inset-right)) 18px max(18px,env(safe-area-inset-left))}.logo strong{font-size:14px}.topbar .ghost-btn{font-size:11px;padding:8px 12px}.scene-caption{font-size:52px}.intro-brand{left:max(18px,env(safe-area-inset-left));top:max(20px,env(safe-area-inset-top))}.skip{right:max(16px,env(safe-area-inset-right));top:max(15px,env(safe-area-inset-top))}.story{position:absolute;left:0;top:50%;width:100%;height:auto;min-width:0;transform:translateY(-50%)}.card-content blockquote{font-size:clamp(14px,3.2vw,19px)}}
@media(max-width:600px){.creator{overflow:hidden}.skip{z-index:5;width:112px;display:block;white-space:nowrap}.topbar{gap:12px}.logo{gap:8px}.logo>span{width:36px;height:36px}.logo strong{font-size:13px}.topbar .ghost-btn{min-height:44px}.hero-copy{margin:42px auto 36px;padding:0 18px}.eyebrow{font-size:10px;letter-spacing:.16em}.hero-copy h1{font-size:clamp(34px,10.5vw,47px);margin:18px 0 14px}.hero-copy p{font-size:15px;line-height:1.65}.studio{width:100%;padding:0 max(14px,env(safe-area-inset-left)) calc(70px + env(safe-area-inset-bottom));gap:34px}.panel{min-width:0;padding:21px;border-radius:22px}.panel-heading{gap:12px;margin-bottom:22px}.panel-heading h2{font-size:20px}.panel-heading p{font-size:12px}.upload{padding:15px;min-height:108px;gap:11px}.upload-icon{width:42px;height:42px;flex:0 0 auto}.upload strong{font-size:14px}.upload small{font-size:10px}.upload img{width:76px;height:76px}.upload.has-photo>span:nth-of-type(2){max-width:48%}.field input{min-height:48px;font-size:16px}.wish-row{gap:10px}.wish-row button{min-height:44px}.controls blockquote{font-size:14px}.primary,.ghost-btn{min-height:48px}.actions{grid-template-columns:1fr}.greeting-card{width:100%;aspect-ratio:4/5.35;border-radius:24px}.greeting-card:before{inset:7px;border-radius:18px}.card-top{padding:19px 20px}.portrait-frame{width:36%;margin:7px auto 10px;padding:5px}.card-content{padding:0 7%}.card-content>p{font-size:clamp(22px,7vw,29px);margin-top:5px}.card-content h2{font-size:clamp(28px,8.5vw,37px)}.divider{margin:7px auto}.card-content blockquote{min-height:58px;font-size:clamp(11px,3.3vw,14px);line-height:1.48}.card-diyas{bottom:34px}.card-foot{bottom:15px}.preview-label{margin-top:2px}footer{padding:22px max(14px,env(safe-area-inset-left)) calc(22px + env(safe-area-inset-bottom));text-align:center;flex-wrap:wrap}}
@media(max-width:360px){.logo strong{display:none}.hero-copy h1{font-size:34px}.panel{padding:17px}.upload.has-photo>span:nth-of-type(2){max-width:44%}.card-top{padding:17px}.card-content blockquote{font-size:11px}}
@media(max-width:600px) and (orientation:portrait){.story{width:auto;height:100%;max-width:none;left:50%;top:0;transform:translateX(-50%)}.playing .boat{animation-name:boatMoveMobile}.playing .hanuman-flight{animation-name:hanumanGuideMobile}.scene-caption{font-size:28px}.final-title{font-size:78px;letter-spacing:1px}.final-year{font-size:76px;letter-spacing:14px}.final-sub{font-size:24px}@keyframes boatMoveMobile{0%{transform:translateX(-360px) translateY(30px)}72%{transform:translateX(100px) translateY(-12px)}100%{transform:translateX(140px)}}@keyframes hanumanGuideMobile{0%{opacity:0;translate:-300px 100px;rotate:-10deg;scale:.75}18%{opacity:1}65%{translate:-30px -35px;rotate:4deg;scale:.96}100%{opacity:.92;translate:20px -8px;rotate:1deg;scale:.94}}}
@media(max-height:500px) and (orientation:landscape){.story{width:auto;height:100%;left:50%;top:0;transform:translateX(-50%)}.intro-brand{font-size:10px}.hero-copy{margin-top:30px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-delay:0ms!important;scroll-behavior:auto!important}.intro{display:none}.creator{opacity:1;visibility:visible}}
