:root{--pearl:#fffaf5;--ink:#436b86;--glass:rgba(255,255,255,.33);--line:rgba(255,255,255,.66)}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0;background:#a8dfe8;color:var(--ink);font-family:"DM Sans",sans-serif}
body{overflow-x:hidden}
.app{position:relative;isolation:isolate;width:min(100%,520px);min-height:100dvh;margin:auto;overflow:hidden;background:#8ad8e5}
.entry-gate{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;min-height:100dvh;overflow:hidden;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));background:radial-gradient(circle at 50% 46%,#102e40 0,#071c2a 36%,#03111b 72%,#01080e 100%);color:#fff;text-align:center;opacity:1;visibility:visible}
.entry-start{display:grid;min-width:190px;min-height:56px;place-items:center;padding:17px 24px;border:0;background:transparent;color:rgba(255,255,255,.94);font:600 clamp(.86rem,4vw,1rem)/1.2 "DM Sans",sans-serif;letter-spacing:.08em;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:opacity .25s ease,transform .25s ease}
.entry-start:active{opacity:.68;transform:scale(.97)}.entry-start:focus-visible{outline:2px solid rgba(255,255,255,.9);outline-offset:6px;border-radius:8px}
body.awaiting-entry .app{opacity:0;transform:translateY(8px) scale(1.012);pointer-events:none}
body.awaiting-entry:not(.entry-started) .camera *{animation-play-state:paused!important}
body.entry-started .app{opacity:1;transform:translateY(0) scale(1);pointer-events:none;transition:opacity 3.4s .12s cubic-bezier(.22,.68,.22,1),transform 3.4s .12s cubic-bezier(.22,.68,.22,1)}
body.entry-ready .app{pointer-events:auto}
body.entry-started .entry-gate{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 2.25s cubic-bezier(.32,.02,.18,1),visibility 0s 2.25s}
.ocean-scene,.sea-life,.ambient-bubbles{position:absolute;inset:0;overflow:hidden}
.camera{position:absolute;inset:-4%;transform:none;transform-origin:50% 56%}
.background{position:absolute;inset:-1%;background:url("../assets/fundo.webp") center/cover no-repeat;filter:saturate(1.08) brightness(.94) contrast(1.03);transform:translate3d(var(--bg-x,0),var(--bg-y,0),0) scale(1.02)}
.light-rays{position:absolute;z-index:1;inset:-7% -18% 0;overflow:hidden;pointer-events:none;opacity:.82;background:radial-gradient(ellipse at 50% -4%,rgba(255,255,247,.92) 0,rgba(255,251,224,.48) 14%,rgba(235,252,255,.18) 35%,transparent 62%);mix-blend-mode:screen;transform-origin:50% 0;animation:sunUnderwaterPulse 8.6s cubic-bezier(.45,.05,.3,.98) infinite;mask-image:linear-gradient(to bottom,#000 0,#000 56%,rgba(0,0,0,.6) 76%,transparent 97%);-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 56%,rgba(0,0,0,.6) 76%,transparent 97%)}.light-rays::before{content:"";position:absolute;inset:-5% 4% 0;background:linear-gradient(101deg,transparent 29%,rgba(255,255,239,.04) 34%,rgba(255,255,239,.34) 42%,rgba(255,255,255,.09) 49%,transparent 56%),linear-gradient(82deg,transparent 36%,rgba(229,251,255,.24) 44%,rgba(255,252,228,.1) 51%,transparent 59%),linear-gradient(113deg,transparent 46%,rgba(255,249,216,.25) 54%,rgba(234,252,255,.06) 62%,transparent 69%);background-size:118% 100%;filter:blur(1.1px);transform-origin:50% 0;animation:sunBeamDance 10.8s ease-in-out infinite}.light-rays::after{content:"";position:absolute;left:4%;right:4%;top:0;height:58%;background:radial-gradient(ellipse at 18% 8%,rgba(255,255,255,.28) 0 1.5%,transparent 7%),radial-gradient(ellipse at 52% 4%,rgba(255,249,220,.3) 0 2%,transparent 8%),radial-gradient(ellipse at 82% 11%,rgba(235,253,255,.25) 0 1.5%,transparent 7%),repeating-radial-gradient(ellipse at 50% -4%,rgba(255,255,255,.18) 0 2px,transparent 5px 14px);background-size:42% 27%,48% 30%,39% 25%,108% 42%;background-repeat:repeat;mix-blend-mode:screen;filter:blur(.8px);opacity:.52;mask-image:linear-gradient(to bottom,#000,rgba(0,0,0,.72) 52%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000,rgba(0,0,0,.72) 52%,transparent 100%);animation:waterCaustics 6.4s ease-in-out infinite}
.water-particles{position:absolute;z-index:3;inset:0;overflow:hidden;pointer-events:none}.water-particle{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(236,252,255,.16) 58%,transparent 72%);box-shadow:0 0 10px 2px rgba(233,253,255,.48);mix-blend-mode:screen;opacity:0;animation:particleDrift var(--particle-dur) ease-in-out var(--particle-delay) infinite}
.ocean-mote{position:absolute;border-radius:50%;opacity:0;background:radial-gradient(circle at 40% 38%,rgba(255,255,255,.9),rgba(255,218,241,.26) 35%,rgba(201,246,255,.08) 61%,transparent 74%);filter:blur(.7px);mix-blend-mode:screen;animation:oceanMoteFloat var(--mote-dur) ease-in-out var(--mote-delay) infinite}
.ocean-light-streak{position:absolute;border-radius:999px;opacity:0;background:linear-gradient(90deg,transparent,rgba(244,255,255,.52) 45%,rgba(255,222,244,.3) 62%,transparent);filter:blur(1.4px);mix-blend-mode:screen;animation:oceanLightStreak var(--streak-dur) ease-in-out var(--streak-delay) infinite}
.ocean-background-twinkle{position:absolute;opacity:0;background:linear-gradient(135deg,#fff,#fff6c9 47%,#ffd8ef 72%,#e1fbff);clip-path:polygon(50% 0,59% 39%,100% 50%,59% 61%,50% 100%,41% 61%,0 50%,41% 39%);filter:drop-shadow(0 0 5px rgba(255,255,238,.8));mix-blend-mode:screen;animation:oceanBackgroundTwinkle var(--ocean-dur) ease-out var(--ocean-delay) forwards}
.ocean-caustic-flare{position:absolute;border-radius:999px;opacity:0;background:linear-gradient(90deg,transparent,rgba(239,255,255,.7) 42%,rgba(255,226,244,.46) 58%,transparent);filter:blur(2px);mix-blend-mode:screen;animation:oceanCausticFlare var(--flare-dur) ease-out var(--flare-delay) forwards}
.sea-life{overflow:visible;pointer-events:none}
.far{z-index:2;transform:translate3d(var(--far-x,0),var(--far-y,0),0)}
.middle{z-index:4;transform:translate3d(var(--mid-x,0),var(--mid-y,0),0)}
.foreground{z-index:6;transform:translate3d(var(--near-x,0),var(--near-y,0),0)}
.intro-sequence{position:absolute;z-index:18;inset:0;display:grid;place-items:center;overflow:hidden;padding:max(28px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));pointer-events:none}
.intro-line{position:absolute;width:min(84%,390px);margin:0;color:rgba(255,255,255,.96);font-size:clamp(1.04rem,5.2vw,1.42rem);font-weight:600;letter-spacing:.015em;line-height:1.42;text-align:center;text-wrap:balance;text-shadow:0 2px 14px rgba(14,77,104,.55),0 0 24px rgba(214,249,255,.36);opacity:0;transform:translateY(14px) scale(.985)}
.intro-line-names{color:#fff4fa;font-size:clamp(1.12rem,5.7vw,1.55rem);font-weight:700;text-shadow:0 2px 16px rgba(110,48,94,.38),0 0 26px rgba(255,218,241,.44)}
.plant-depth-layer{position:absolute;z-index:5;inset:-2%;overflow:hidden;pointer-events:none;transform:translate3d(var(--plant-x,0),var(--plant-y,0),0);will-change:transform}.plant-depth-layer::before{content:"";position:absolute;z-index:1;inset:0;background:radial-gradient(ellipse at 4% 42%,rgba(187,255,218,.22),transparent 22%),radial-gradient(ellipse at 96% 38%,rgba(255,184,237,.2),transparent 24%),radial-gradient(ellipse at 8% 78%,rgba(115,232,255,.2),transparent 26%),radial-gradient(ellipse at 93% 76%,rgba(217,179,255,.2),transparent 25%);mix-blend-mode:screen;animation:plantGlowBreath 5.8s ease-in-out infinite alternate}.plant-depth-layer::after{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(108deg,transparent 18%,rgba(255,255,232,.08) 30%,rgba(255,243,196,.56) 43%,rgba(229,247,255,.18) 51%,rgba(255,211,244,.48) 61%,transparent 76%);background-size:220% 100%;mix-blend-mode:screen;opacity:.72;mask:url("../assets/plantas.webp") center/cover no-repeat;-webkit-mask:url("../assets/plantas.webp") center/cover no-repeat;animation:plantSurfaceShimmer 5.6s ease-in-out infinite}.plant-depth-layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(1.08) brightness(1.04) drop-shadow(0 0 14px rgba(103,226,225,.12));transform-origin:50% 100%;animation:plantSway 7.5s ease-in-out infinite alternate}.plant-glint{position:absolute;z-index:3;width:6px;height:6px;border-radius:50%;background:#fffbe5;box-shadow:0 0 7px 2px rgba(255,250,190,.92),0 0 16px 5px rgba(145,241,225,.42);animation:plantTwinkle 2.9s ease-in-out infinite}.plant-glint::before,.plant-glint::after{content:"";position:absolute;left:50%;top:50%;border-radius:999px;background:rgba(255,255,242,.94);transform:translate(-50%,-50%)}.plant-glint::before{width:1px;height:13px}.plant-glint::after{width:13px;height:1px}.plant-glint:nth-of-type(3n){width:7px;height:7px;box-shadow:0 0 8px 3px rgba(255,249,200,.94),0 0 18px 6px rgba(196,178,255,.38)}.plant-glint:nth-of-type(4n){background:#ffe9fb;box-shadow:0 0 8px 3px rgba(255,221,246,.88),0 0 18px 6px rgba(143,235,255,.35)}.plant-glint:nth-of-type(1){left:10%;top:31%;animation-delay:-.8s}.plant-glint:nth-of-type(2){left:18%;top:56%;animation-delay:-2.1s}.plant-glint:nth-of-type(3){left:8%;top:72%;animation-delay:-1.4s}.plant-glint:nth-of-type(4){left:24%;top:82%;animation-delay:-2.7s}.plant-glint:nth-of-type(5){right:9%;top:28%;animation-delay:-1.8s}.plant-glint:nth-of-type(6){right:17%;top:53%;animation-delay:-.35s}.plant-glint:nth-of-type(7){right:8%;top:68%;animation-delay:-2.45s}.plant-glint:nth-of-type(8){right:23%;top:84%;animation-delay:-1.05s}.plant-glint:nth-of-type(9){left:5%;top:45%;animation-delay:-1.62s}.plant-glint:nth-of-type(10){left:28%;top:68%;animation-delay:-.52s}.plant-glint:nth-of-type(11){right:5%;top:43%;animation-delay:-2.18s}.plant-glint:nth-of-type(12){right:28%;top:74%;animation-delay:-1.22s}.plant-glint:nth-of-type(13){left:7%;top:14%;animation-delay:-.3s}.plant-glint:nth-of-type(14){left:21%;top:22%;animation-delay:-1.9s}.plant-glint:nth-of-type(15){left:13%;top:39%;animation-delay:-2.5s}.plant-glint:nth-of-type(16){left:31%;top:91%;animation-delay:-1.1s}.plant-glint:nth-of-type(17){right:7%;top:13%;animation-delay:-2.2s}.plant-glint:nth-of-type(18){right:21%;top:24%;animation-delay:-.65s}.plant-glint:nth-of-type(19){right:13%;top:59%;animation-delay:-1.48s}.plant-glint:nth-of-type(20){right:31%;top:92%;animation-delay:-2.75s}
.swim-path{position:absolute;left:0;opacity:0;will-change:transform,opacity}
.animal{display:block;width:100%;height:auto;object-fit:contain;user-select:none;transform-origin:50% 52%;will-change:transform}
.tappable{pointer-events:auto}
/* O wrapper percorre a rota; a imagem interna controla apenas flutuacao e direcao. */
.path-fish-1{top:calc(13% + env(safe-area-inset-top));width:clamp(55px,16vw,80px);animation:routeFishRight 36s 4.8s linear infinite both}
.fish-1{filter:drop-shadow(0 5px 6px rgba(80,142,171,.12));animation:swimBobA 5.2s ease-in-out infinite}
.path-fish-2{top:calc(25% + env(safe-area-inset-top));width:clamp(45px,13vw,70px);filter:blur(.45px);animation:routeFishLeft 36s 1s linear infinite both}
.fish-2{animation:swimBobB 6.4s ease-in-out infinite}
.path-far-a{top:calc(19% + env(safe-area-inset-top));width:clamp(28px,8.5vw,42px);filter:blur(.7px) saturate(.82);animation:routeFarRight 32s 0s linear infinite both}
.path-far-b{top:31%;width:clamp(24px,7.5vw,38px);filter:blur(.8px) saturate(.78);animation:routeFarLeft 34s 8s linear infinite both}
.path-far-c{top:41%;width:clamp(30px,9vw,44px);filter:blur(.65px) saturate(.84);animation:routeFarRightLow 38s 18s linear infinite both}
.path-prelude-a{top:10%;width:clamp(22px,6.8vw,34px);filter:blur(.9px) saturate(.72);animation:routePreludeLeft 27s 2s linear infinite both}
.path-prelude-b{top:37%;width:clamp(25px,7.8vw,39px);filter:blur(.8px) saturate(.76);animation:routePreludeRight 30s 6s linear infinite both}
.path-prelude-c{top:54%;width:clamp(22px,7vw,35px);filter:blur(1px) saturate(.7);animation:routePreludeRightLow 29s 13s linear infinite both}
.path-deep-a{top:14%;width:clamp(18px,5.8vw,29px);filter:blur(1.1px) saturate(.62);animation:routeDeepLeft 26s -7s linear infinite both}.path-deep-b{top:25%;width:clamp(20px,6.2vw,31px);filter:blur(1px) saturate(.66);animation:routeDeepRight 28s -14s linear infinite both}.path-deep-c{top:36%;width:clamp(17px,5.5vw,28px);filter:blur(1.2px) saturate(.6);animation:routeDeepRightLow 24s -4s linear infinite both}.path-deep-d{top:47%;width:clamp(19px,6vw,30px);filter:blur(1.1px) saturate(.64);animation:routeDeepLeftLow 30s -19s linear infinite both}
.path-deep-whale{top:25%;width:clamp(220px,58vw,310px);filter:blur(1.65px) saturate(.5) brightness(.92);animation:routeDeepWhaleLeft 68s -34s linear infinite both}.path-deep-school-a{top:34%;width:clamp(78px,21vw,112px);filter:blur(1.15px) saturate(.58);animation:routeDeepSchoolRight 52s -19s linear infinite both}.path-deep-school-b{top:49%;width:clamp(84px,23vw,120px);filter:blur(1.3px) saturate(.54);animation:routeDeepSchoolLeft 58s -41s linear infinite both}.deep-ocean-creature{opacity:.9;filter:drop-shadow(0 3px 8px rgba(65,150,177,.08))}.deep-whale{animation:deepWhaleFloat 12s ease-in-out infinite}.deep-school-a{animation:deepSchoolFloat 8.5s ease-in-out infinite}.deep-school-b{animation:deepSchoolFloatLeft 9.4s ease-in-out infinite}.app.revealed .opening-only-creature{opacity:0!important;visibility:hidden;transition:opacity .22s ease}
.path-new-fish-a{top:17%;width:clamp(34px,10vw,52px);filter:blur(.65px) saturate(.8);animation:routeBackgroundRight 31s -6s linear infinite both}.path-new-fish-b{top:43%;width:clamp(30px,9vw,47px);filter:blur(.8px) saturate(.72);animation:routeBackgroundLeft 34s -17s linear infinite both}.path-new-fish-c{top:56%;width:clamp(36px,11vw,56px);filter:blur(.6px) saturate(.82);animation:routeBackgroundRight 37s -27s linear infinite both}.path-seahorse-a{top:23%;width:clamp(22px,6.8vw,34px);filter:blur(.9px) saturate(.7);animation:routeBackgroundLeft 43s -9s linear infinite both}.path-seahorse-b{top:36%;width:clamp(20px,6.3vw,32px);filter:blur(1px) saturate(.68);animation:routeBackgroundRight 46s -25s linear infinite both}.path-seahorse-c{top:50%;width:clamp(23px,7vw,36px);filter:blur(.85px) saturate(.74);animation:routeBackgroundLeft 41s -34s linear infinite both}.background-creature{filter:drop-shadow(0 3px 5px rgba(55,135,166,.14))}.new-creature-right{animation:newCreatureBob 6.8s ease-in-out infinite}.new-creature-left{animation:newCreatureBobLeft 7.4s ease-in-out infinite}.seahorse-creature-right{animation:seahorseFloat 8.2s ease-in-out infinite}.seahorse-creature-left{animation:seahorseFloatLeft 8.8s ease-in-out infinite}
.path-opening-school-1{top:12%;width:clamp(30px,8.8vw,45px);filter:blur(.7px) saturate(.78);animation:routeSchoolRight 25s -5s linear infinite both}.path-opening-school-2{top:27%;width:clamp(27px,8vw,42px);filter:blur(.85px) saturate(.72);animation:routeSchoolLeft 28s -11s linear infinite both}.path-opening-school-3{top:34%;width:clamp(24px,7.4vw,38px);filter:blur(.9px) saturate(.7);animation:routeSchoolRight 27s -16s linear infinite both}.path-opening-school-4{top:47%;width:clamp(31px,9.2vw,47px);filter:blur(.72px) saturate(.76);animation:routeSchoolLeft 30s -21s linear infinite both}.path-opening-school-5{top:57%;width:clamp(26px,7.8vw,40px);filter:blur(.8px) saturate(.74);animation:routeSchoolRight 26s -8s linear infinite both}.path-opening-school-6{top:63%;width:clamp(23px,7vw,37px);filter:blur(.95px) saturate(.68);animation:routeSchoolLeft 29s -19s linear infinite both}.school-creature-right{animation:newCreatureBob 5.8s ease-in-out infinite}.school-creature-left{animation:newCreatureBobLeft 6.2s ease-in-out infinite}
.path-opening-school-7{top:8%;width:clamp(24px,7.2vw,37px);filter:blur(.95px) saturate(.7);animation:routeSchoolRight 24s -9s linear infinite both}.path-opening-school-8{top:19%;width:clamp(28px,8.2vw,43px);filter:blur(.8px) saturate(.74);animation:routeSchoolLeft 26s -18s linear infinite both}.path-opening-school-9{top:31%;width:clamp(20px,6.4vw,34px);filter:blur(1.1px) saturate(.66);animation:routeSchoolRight 22s -5s linear infinite both}.path-opening-school-10{top:40%;width:clamp(27px,8vw,42px);filter:blur(.85px) saturate(.72);animation:routeSchoolLeft 25s -13s linear infinite both}.path-opening-school-11{top:53%;width:clamp(23px,7vw,38px);filter:blur(1px) saturate(.68);animation:routeSchoolRight 28s -22s linear infinite both}.path-opening-school-12{top:67%;width:clamp(29px,8.5vw,44px);filter:blur(.78px) saturate(.75);animation:routeSchoolLeft 24s -7s linear infinite both}.path-opening-school-13{top:74%;width:clamp(21px,6.5vw,35px);filter:blur(1.08px) saturate(.65);animation:routeSchoolRight 27s -15s linear infinite both}.path-opening-school-14{top:59%;width:clamp(25px,7.5vw,40px);filter:blur(.9px) saturate(.7);animation:routeSchoolLeft 30s -25s linear infinite both}
.path-opening-seahorse-1{top:14%;width:clamp(18px,5.5vw,30px);filter:blur(1.1px) saturate(.65);animation:routeBackgroundLeft 38s -19s linear infinite both}.path-opening-seahorse-2{top:38%;width:clamp(20px,6vw,32px);filter:blur(.95px) saturate(.7);animation:routeBackgroundRight 42s -8s linear infinite both}.path-opening-seahorse-3{top:55%;width:clamp(18px,5.7vw,31px);filter:blur(1.15px) saturate(.62);animation:routeBackgroundLeft 37s -29s linear infinite both}.path-opening-seahorse-4{top:70%;width:clamp(21px,6.2vw,33px);filter:blur(.92px) saturate(.69);animation:routeBackgroundRight 44s -17s linear infinite both}
.far-fish-a{animation:swimBobB 7.4s ease-in-out infinite}.far-fish-b{animation:swimBobA 8.2s ease-in-out infinite}.far-fish-c{animation:swimBobC 7.8s ease-in-out infinite}.prelude-a{animation:swimBobA 8.4s ease-in-out infinite}.prelude-b{animation:swimBobC 7.2s ease-in-out infinite}.prelude-c{animation:swimBobB 8.8s ease-in-out infinite}.deep-a{animation:swimBobA 9.2s ease-in-out infinite}.deep-b{animation:swimBobC 8.6s ease-in-out infinite}.deep-c{animation:swimBobB 9.8s ease-in-out infinite}.deep-d{animation:swimBobA 10.4s ease-in-out infinite}
.app.revealed .prelude-fish{opacity:1;transition:opacity .2s ease}.app.invite-open .path-far-a{animation-delay:-9s}.app.invite-open .path-far-b{animation-delay:-14s}.app.invite-open .path-far-c{animation-delay:-20s}.app.invite-open .path-prelude-a{animation-delay:-8s}.app.invite-open .path-prelude-b{animation-delay:-12s}.app.invite-open .path-prelude-c{animation-delay:-16s}.app.invite-open .path-deep-a{animation-delay:-10s}.app.invite-open .path-deep-b{animation-delay:-16s}.app.invite-open .path-deep-c{animation-delay:-8s}.app.invite-open .path-deep-d{animation-delay:-18s}
.path-fish-3{top:34%;width:clamp(50px,15vw,75px);animation:routeFishThree 36s 27s linear infinite both}
.fish-3{filter:drop-shadow(0 5px 6px rgba(80,142,171,.1));animation:swimBobC 5.8s ease-in-out infinite}
.shell-stage{position:absolute;z-index:2;bottom:13%;left:17%;width:66%;padding:0;border:0;background:transparent;aspect-ratio:1.5;transform-origin:50% 80%;filter:drop-shadow(0 18px 18px rgba(24,104,151,.48)) drop-shadow(0 0 20px rgba(255,224,174,.62));cursor:pointer;pointer-events:auto;animation:shellBreathe 4.2s ease-in-out infinite}.shell-stage:focus-visible{outline:2px solid rgba(255,255,255,.96);outline-offset:7px;border-radius:50%}.shell-stage.revealing{cursor:default}.shell-stage.vanish{pointer-events:none;animation:shellVanish .48s cubic-bezier(.25,.8,.35,1) forwards}
body:not(.intro-complete) .shell-stage{visibility:hidden;opacity:0;pointer-events:none;animation:none;transform:translateY(18px)}
body.intro-complete .shell-stage{visibility:visible;opacity:1}
body.intro-complete .shell-stage:not(.revealing):not(.vanish){animation:shellArrival 2.5s cubic-bezier(.22,.62,.28,1) both,shellBreathe 4.2s 2.5s ease-in-out infinite}
body:not(.intro-ready) .shell-stage{pointer-events:none}
body.intro-ready .shell-stage{pointer-events:auto}
body:not(.intro-ready) .shell-hint{opacity:0}
body.intro-ready .shell-hint{opacity:1;transition:opacity 1.1s ease}
.shell-rig{position:absolute;z-index:3;inset:0;perspective:900px;transform:translateY(-3.08%) scale(1.277);transform-origin:50% 95%;transform-style:preserve-3d;pointer-events:none}
.shell{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.shell-base{z-index:2;opacity:0;filter:brightness(1.06) saturate(1.08)}
.shell-lid{z-index:3;opacity:0;transform-origin:50% 58%;backface-visibility:hidden;filter:brightness(1.06) saturate(1.08)}
.shell-morph-stack{position:absolute;z-index:4;inset:0;pointer-events:none}
.shell-morph-frame{opacity:0;transform-origin:50% 95%;filter:brightness(1.06) saturate(1.08)}
.shell-morph-frame:nth-child(1){transform:translateY(-.579%) scale(1.00538)}
.shell-morph-frame:nth-child(2){transform:translateY(-2.538%) scale(.99847)}
.shell-morph-frame:nth-child(3){transform:translateY(-1.418%) scale(1.09916)}
.shell-morph-frame:nth-child(4){transform:translateY(-1.601%) scale(1.21674)}
.shell-morph-frame:nth-child(5){transform:translateY(-2.518%) scale(1.15141)}
.shell-morph-frame:nth-child(6){transform:translateY(-.978%) scale(1.25407)}
.shell-closed{z-index:5;opacity:1;filter:brightness(1.08) saturate(1.12)}
.shell-stage.revealing .shell-base,.shell-stage.revealing .shell-lid,.shell-stage.revealing .shell-closed,.shell-stage.revealing .shell-morph-frame{will-change:opacity,transform}
.shell-stage.opened .shell-base,.shell-stage.opened .shell-lid{opacity:1;transform:none}
.shell-stage.opened .shell-morph-frame{opacity:0}
.shell-stage.opened .shell-closed{opacity:0}
.shell-aura{position:absolute;z-index:1;top:18%;left:26%;width:49%;aspect-ratio:1;border-radius:50%;opacity:.52;background:radial-gradient(circle,rgba(255,254,230,.92),rgba(255,222,170,.34) 38%,rgba(232,190,252,.14) 58%,transparent 73%);transform:scale(1.12);pointer-events:none}.shell-stage.revealing .shell-aura{animation:aura 1.45s ease-out forwards}
.shell-bubbles,.shell-sparkles{position:absolute;z-index:5;inset:0;pointer-events:none}
.shell-burst-layer{position:absolute;z-index:15;inset:0;overflow:visible;pointer-events:none}
.shell-hint{position:absolute;z-index:7;left:50%;bottom:100%;margin-bottom:2px;padding:8px 15px;border:1px solid rgba(255,255,255,.86);border-radius:999px;background:rgba(31,111,145,.62);box-shadow:0 6px 18px rgba(8,75,113,.25);color:white;font:700 .72rem "DM Sans";letter-spacing:.04em;transform:translateX(-50%);white-space:nowrap;animation:hintPulse 2.2s ease-in-out infinite}.shell-stage.revealing .shell-hint{opacity:0;transition:opacity .25s ease}
.bubble{position:absolute;border:1.5px solid rgba(255,255,255,.72);border-radius:50%;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.82),rgba(255,255,255,.08) 38%,transparent 56%);box-shadow:inset -2px -2px 4px rgba(92,192,222,.12);animation:ambientBubbleRise var(--dur) linear var(--delay) forwards}.shell-stream-bubble{animation:shellBubbleRise var(--dur) linear var(--delay) forwards}
.burst-bubble{z-index:8;border-color:rgba(255,255,255,.88);box-shadow:inset -2px -2px 4px rgba(92,192,222,.15),0 0 7px rgba(255,255,255,.18);animation:shellBubbleBurst var(--burst-dur) cubic-bezier(.18,.7,.32,1) var(--burst-delay) forwards}
.pearl-dust,.pearl-glint{position:absolute;pointer-events:none}
.pearl-dust{z-index:9;border-radius:50%;opacity:0;background:var(--dust-color,#fff9dc);box-shadow:0 0 8px 2px color-mix(in srgb,var(--dust-color,#fff9dc) 76%,transparent);animation:pearlDustBurst var(--magic-dur) cubic-bezier(.16,.72,.28,1) var(--magic-delay) forwards}
.pearl-glint{z-index:10;opacity:0;background:linear-gradient(135deg,#fff 5%,#fff8cb 48%,#ffd5ef 78%,#fff 96%);clip-path:polygon(50% 0,59% 39%,100% 50%,59% 61%,50% 100%,41% 61%,0 50%,41% 39%);filter:drop-shadow(0 0 5px rgba(255,246,208,.95));animation:pearlGlintBurst var(--magic-dur) cubic-bezier(.16,.72,.24,1) var(--magic-delay) forwards}
.sparkle{position:absolute;width:5px;aspect-ratio:1;border-radius:50%;background:#fffde5;box-shadow:0 0 9px 3px rgba(255,249,203,.82);animation:spark var(--dur) ease-in-out var(--delay) infinite}
.ambient-bubbles{z-index:8;pointer-events:none}.ambient-bubbles .bubble{opacity:.68}.ambient-bubbles .bubble:nth-child(4n){filter:blur(1.5px);transform:scale(1.45);opacity:.42}
.pearl-flash{position:absolute;z-index:10;inset:0;opacity:0;pointer-events:none;background:radial-gradient(circle at 50% 58%,rgba(255,255,255,.9),rgba(255,241,252,.38) 31%,rgba(232,252,255,0) 66%)}.pearl-flash.active{animation:flash 1.05s ease-out forwards}
.invite{position:absolute;z-index:20;inset:0;display:grid;align-items:end;padding:20px max(18px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));opacity:0;pointer-events:none;transform:translateY(22px)}
.invite.visible{pointer-events:auto;animation:inviteIn 1s .2s cubic-bezier(.22,.8,.25,1) forwards}.invite.fullscreen{align-items:stretch;padding:0}.invite.fullscreen .invite-card{display:flex;min-height:100%;align-items:center;justify-content:center;flex-direction:column;padding:clamp(34px,8vh,72px) max(22px,8vw);border:0;border-radius:0;background:linear-gradient(180deg,rgba(199,241,247,.72),rgba(235,250,252,.86) 48%,rgba(200,239,246,.79));box-shadow:none}.invite.fullscreen .intro,.invite.fullscreen .details,.invite.fullscreen .gift-suggestions,.invite.fullscreen .actions{width:min(100%,390px)}
.invite-card{width:100%;overflow:hidden;padding:25px 22px 18px;border:1px solid var(--line);border-radius:31px;background:linear-gradient(135deg,rgba(255,255,255,.70),rgba(247,245,255,.36));box-shadow:0 16px 34px rgba(41,125,150,.19),inset 0 1px 0 rgba(255,255,255,.88);backdrop-filter:blur(15px) saturate(1.08);-webkit-backdrop-filter:blur(15px) saturate(1.08);text-align:center}
.eyebrow{margin:0 0 3px;color:#6a92a6;font-size:.65rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
h1{margin:8px 0 13px;color:#a779a8;font-family:Parisienne,cursive;font-size:clamp(4rem,15vw,5.7rem);line-height:.74;text-shadow:0 2px 0 rgba(255,255,255,.8)}
.age{margin:0;color:#4f87a2;font-size:1.45rem;font-weight:700}.age span{font-size:.82rem;font-weight:600}
.intro{max-width:330px;margin:13px auto 17px;color:#4d7188;font-size:.79rem;line-height:1.5}
.details{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:0 0 17px}.details div{min-width:0;padding:0 4px;border-right:1px solid rgba(102,153,173,.25)}.details div:last-child{border:0}
dt{margin-bottom:3px;color:#7899aa;font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}dd{margin:0;color:#456f8b;font-size:.72rem;font-weight:600;line-height:1.2}
.gift-suggestions{display:grid;gap:3px;margin:0 0 14px;padding:10px 13px;border:1px solid rgba(255,255,255,.68);border-radius:16px;background:rgba(255,255,255,.3);color:#52778d;font-size:.68rem;line-height:1.35}.gift-suggestions p{margin:0 0 2px;color:#9d7799;font-size:.7rem;font-weight:700}.gift-suggestions span{display:block}.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.action{display:flex;min-height:69px;align-items:center;justify-content:center;flex-direction:column;gap:5px;border:1px solid rgba(255,255,255,.68);border-radius:17px;background:rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.58),0 5px 12px rgba(72,135,159,.09);color:#4d7892;font-size:.61rem;font-weight:700;line-height:1.15;text-decoration:none;transition:transform .18s ease,background .18s ease}
.action svg{width:17px;height:17px;stroke-width:1.7}.action:active{background:rgba(255,255,255,.58);transform:scale(.96)}
@keyframes plantSway{0%{transform:translate3d(-.35%,0,0) scale(1.014) rotate(-.15deg)}100%{transform:translate3d(.35%,-.15%,0) scale(1.018) rotate(.15deg)}}@keyframes plantGlowBreath{0%{opacity:.5;filter:blur(1px)}100%{opacity:1;filter:blur(3px)}}@keyframes plantSurfaceShimmer{0%{background-position:115% 0;opacity:.38}45%{opacity:.82}100%{background-position:-85% 0;opacity:.5}}@keyframes plantTwinkle{0%,100%{opacity:.18;transform:scale(.45) rotate(0)}42%{opacity:.95;transform:scale(1) rotate(45deg)}58%{opacity:.62;transform:scale(.72) rotate(70deg)}}
@keyframes sunUnderwaterPulse{0%{opacity:.58;filter:brightness(.92);transform:translate3d(-1.1%,0,0) rotate(-.35deg) scaleX(.985)}16%{opacity:.88;filter:brightness(1.08)}34%{opacity:.7;filter:brightness(.98);transform:translate3d(.25%,.3%,0) rotate(.12deg) scaleX(1.01)}52%{opacity:.96;filter:brightness(1.15)}69%{opacity:.67;filter:brightness(.95);transform:translate3d(1.15%,.45%,0) rotate(.4deg) scaleX(.99)}84%{opacity:.9;filter:brightness(1.1)}100%{opacity:.61;filter:brightness(.93);transform:translate3d(-1.1%,0,0) rotate(-.35deg) scaleX(.985)}}@keyframes sunBeamDance{0%{opacity:.52;transform:skewX(-1.2deg) scaleX(.96);background-position:8% 0}25%{opacity:.9;transform:skewX(.6deg) scaleX(1.025)}48%{opacity:.64;transform:skewX(-.35deg) scaleX(.99);background-position:52% 0}72%{opacity:1;transform:skewX(1deg) scaleX(1.035)}100%{opacity:.54;transform:skewX(-1.2deg) scaleX(.96);background-position:8% 0}}@keyframes waterCaustics{0%{opacity:.3;background-position:0 0,12% 2%,4% 0,0 0;transform:translate3d(-1.5%,0,0) scaleX(.97)}22%{opacity:.68}45%{opacity:.42;background-position:18% 4%,-8% 7%,15% 3%,4% 8%;transform:translate3d(.6%,.25%,0) scaleX(1.025)}67%{opacity:.74}82%{opacity:.48;background-position:-10% 8%,16% 0%,-8% 6%,-5% 12%;transform:translate3d(1.4%,.1%,0) scaleX(.99)}100%{opacity:.3;background-position:0 0,12% 2%,4% 0,0 0;transform:translate3d(-1.5%,0,0) scaleX(.97)}}
@keyframes routeFishRight{0%{opacity:0;transform:translate3d(-24vw,1vh,0)}6%{opacity:.92;transform:translate3d(12vw,-.4vh,0)}17%{opacity:.96;transform:translate3d(32vw,.7vh,0)}29%{opacity:.94;transform:translate3d(55vw,-.6vh,0)}38%{opacity:.9;transform:translate3d(72vw,.5vh,0)}44%{opacity:0;transform:translate3d(108vw,1.2vh,0)}100%{opacity:0;transform:translate3d(108vw,1.2vh,0)}}
@keyframes routeFishLeft{0%{opacity:0;transform:translate3d(108vw,-.6vh,0)}7%{opacity:.6;transform:translate3d(78vw,.3vh,0)}18%{opacity:.64;transform:translate3d(57vw,-.8vh,0)}31%{opacity:.61;transform:translate3d(31vw,.6vh,0)}39%{opacity:.56;transform:translate3d(12vw,-.2vh,0)}45%{opacity:0;transform:translate3d(-22vw,.7vh,0)}100%{opacity:0;transform:translate3d(-22vw,.7vh,0)}}
@keyframes routeFarRight{0%{opacity:0;transform:translate3d(-18vw,.3vh,0)}7%{opacity:.46;transform:translate3d(10vw,-.4vh,0)}20%{opacity:.52;transform:translate3d(34vw,.5vh,0)}34%{opacity:.48;transform:translate3d(61vw,-.6vh,0)}43%{opacity:.4;transform:translate3d(78vw,.2vh,0)}49%{opacity:0;transform:translate3d(108vw,.7vh,0)}100%{opacity:0;transform:translate3d(108vw,.7vh,0)}}
@keyframes routeFarLeft{0%{opacity:0;transform:translate3d(108vw,-.4vh,0)}8%{opacity:.4;transform:translate3d(80vw,.4vh,0)}22%{opacity:.48;transform:translate3d(56vw,-.5vh,0)}35%{opacity:.44;transform:translate3d(30vw,.6vh,0)}44%{opacity:.36;transform:translate3d(10vw,-.2vh,0)}50%{opacity:0;transform:translate3d(-18vw,.5vh,0)}100%{opacity:0;transform:translate3d(-18vw,.5vh,0)}}
@keyframes routeFarRightLow{0%{opacity:0;transform:translate3d(-20vw,-.3vh,0)}8%{opacity:.42;transform:translate3d(11vw,.4vh,0)}23%{opacity:.5;transform:translate3d(38vw,-.5vh,0)}37%{opacity:.45;transform:translate3d(64vw,.6vh,0)}45%{opacity:.36;transform:translate3d(79vw,-.2vh,0)}51%{opacity:0;transform:translate3d(108vw,.5vh,0)}100%{opacity:0;transform:translate3d(108vw,.5vh,0)}}
@keyframes routePreludeLeft{0%{opacity:0;transform:translate3d(108vw,.2vh,0)}8%{opacity:.32;transform:translate3d(80vw,-.3vh,0)}23%{opacity:.38;transform:translate3d(52vw,.4vh,0)}39%{opacity:.34;transform:translate3d(24vw,-.4vh,0)}48%{opacity:0;transform:translate3d(-18vw,.3vh,0)}100%{opacity:0;transform:translate3d(-18vw,.3vh,0)}}
@keyframes routePreludeRight{0%{opacity:0;transform:translate3d(-18vw,-.2vh,0)}8%{opacity:.38;transform:translate3d(10vw,.4vh,0)}22%{opacity:.44;transform:translate3d(38vw,-.4vh,0)}37%{opacity:.4;transform:translate3d(65vw,.4vh,0)}47%{opacity:0;transform:translate3d(108vw,-.3vh,0)}100%{opacity:0;transform:translate3d(108vw,-.3vh,0)}}
@keyframes routePreludeRightLow{0%{opacity:0;transform:translate3d(-18vw,.3vh,0)}9%{opacity:.3;transform:translate3d(11vw,-.3vh,0)}25%{opacity:.36;transform:translate3d(41vw,.4vh,0)}40%{opacity:.32;transform:translate3d(67vw,-.4vh,0)}49%{opacity:0;transform:translate3d(108vw,.2vh,0)}100%{opacity:0;transform:translate3d(108vw,.2vh,0)}}
@keyframes routeDeepLeft{0%{opacity:0;transform:translate3d(108vw,.2vh,0)}5%{opacity:.16;transform:translate3d(82vw,-.3vh,0)}22%{opacity:.23;transform:translate3d(56vw,.3vh,0)}48%{opacity:.26;transform:translate3d(26vw,-.4vh,0)}72%{opacity:.2;transform:translate3d(5vw,.3vh,0)}82%{opacity:0;transform:translate3d(-16vw,-.2vh,0)}100%{opacity:0;transform:translate3d(-16vw,-.2vh,0)}}
@keyframes routeDeepRight{0%{opacity:0;transform:translate3d(-16vw,-.3vh,0)}6%{opacity:.18;transform:translate3d(8vw,.3vh,0)}24%{opacity:.25;transform:translate3d(34vw,-.3vh,0)}50%{opacity:.28;transform:translate3d(61vw,.4vh,0)}74%{opacity:.21;transform:translate3d(80vw,-.3vh,0)}84%{opacity:0;transform:translate3d(108vw,.2vh,0)}100%{opacity:0;transform:translate3d(108vw,.2vh,0)}}
@keyframes routeDeepRightLow{0%{opacity:0;transform:translate3d(-16vw,.3vh,0)}5%{opacity:.14;transform:translate3d(8vw,-.2vh,0)}23%{opacity:.21;transform:translate3d(35vw,.3vh,0)}51%{opacity:.24;transform:translate3d(62vw,-.3vh,0)}75%{opacity:.18;transform:translate3d(80vw,.3vh,0)}85%{opacity:0;transform:translate3d(108vw,-.2vh,0)}100%{opacity:0;transform:translate3d(108vw,-.2vh,0)}}
@keyframes routeDeepLeftLow{0%{opacity:0;transform:translate3d(108vw,-.2vh,0)}7%{opacity:.15;transform:translate3d(80vw,.3vh,0)}25%{opacity:.22;transform:translate3d(54vw,-.3vh,0)}52%{opacity:.25;transform:translate3d(26vw,.3vh,0)}76%{opacity:.19;transform:translate3d(5vw,-.3vh,0)}86%{opacity:0;transform:translate3d(-16vw,.2vh,0)}100%{opacity:0;transform:translate3d(-16vw,.2vh,0)}}
@keyframes routeDeepWhaleLeft{0%{left:108%;opacity:0;transform:translateY(.2vh)}10%{opacity:.11}48%{left:22%;opacity:.21;transform:translateY(-.45vh)}88%{opacity:.13}100%{left:-68%;opacity:0;transform:translateY(.35vh)}}@keyframes routeDeepSchoolRight{0%{opacity:0;transform:translate3d(-28vw,-.2vh,0)}9%{opacity:.1}50%{opacity:.18;transform:translate3d(45vw,.4vh,0)}90%{opacity:.11}100%{opacity:0;transform:translate3d(108vw,-.3vh,0)}}@keyframes routeDeepSchoolLeft{0%{opacity:0;transform:translate3d(108vw,.25vh,0)}10%{opacity:.08}52%{opacity:.16;transform:translate3d(43vw,-.4vh,0)}90%{opacity:.1}100%{opacity:0;transform:translate3d(-28vw,.3vh,0)}}@keyframes deepWhaleFloat{0%,100%{transform:translateY(-2px) rotate(-.4deg)}50%{transform:translateY(3px) rotate(.5deg)}}@keyframes deepSchoolFloat{0%,100%{transform:translateY(-2px)}50%{transform:translateY(2px)}}@keyframes deepSchoolFloatLeft{0%,100%{transform:translateY(2px) scaleX(-1)}50%{transform:translateY(-2px) scaleX(-1)}}
@keyframes routeBackgroundRight{0%{opacity:0;transform:translate3d(-20vw,.2vh,0)}8%{opacity:.38}48%{opacity:.46;transform:translate3d(48vw,-.5vh,0)}90%{opacity:.34}100%{opacity:0;transform:translate3d(108vw,.4vh,0)}}@keyframes routeBackgroundLeft{0%{opacity:0;transform:translate3d(108vw,-.3vh,0)}8%{opacity:.34}50%{opacity:.43;transform:translate3d(46vw,.5vh,0)}90%{opacity:.3}100%{opacity:0;transform:translate3d(-20vw,-.2vh,0)}}@keyframes newCreatureBob{0%,100%{transform:translateY(-2px) rotate(-1deg)}50%{transform:translateY(3px) rotate(1.2deg)}}@keyframes newCreatureBobLeft{0%,100%{transform:translateY(2px) scaleX(-1) rotate(-1deg)}50%{transform:translateY(-3px) scaleX(-1) rotate(1.1deg)}}@keyframes seahorseFloat{0%,100%{transform:translateY(-3px) rotate(-1.5deg)}50%{transform:translateY(4px) rotate(1.5deg)}}@keyframes seahorseFloatLeft{0%,100%{transform:translateY(3px) scaleX(-1) rotate(-1.4deg)}50%{transform:translateY(-4px) scaleX(-1) rotate(1.4deg)}}
@keyframes routeSchoolRight{0%{opacity:0;transform:translate3d(-16vw,.2vh,0)}6%{opacity:.4}48%{opacity:.52;transform:translate3d(49vw,-.4vh,0)}94%{opacity:.38}100%{opacity:0;transform:translate3d(106vw,.3vh,0)}}@keyframes routeSchoolLeft{0%{opacity:0;transform:translate3d(106vw,-.2vh,0)}6%{opacity:.38}50%{opacity:.5;transform:translate3d(47vw,.4vh,0)}94%{opacity:.36}100%{opacity:0;transform:translate3d(-16vw,-.3vh,0)}}
@keyframes routeFishThree{0%{opacity:0;transform:translate3d(-24vw,0,0)}7%{opacity:.78;transform:translate3d(12vw,-.6vh,0)}20%{opacity:.84;transform:translate3d(35vw,.7vh,0)}32%{opacity:.8;transform:translate3d(58vw,-.7vh,0)}39%{opacity:.72;transform:translate3d(72vw,.4vh,0)}45%{opacity:0;transform:translate3d(108vw,.9vh,0)}100%{opacity:0;transform:translate3d(108vw,.9vh,0)}}
@keyframes swimBobA{0%,100%{transform:translate3d(0,-2px,0) rotate(-1deg)}50%{transform:translate3d(0,3px,0) rotate(1.5deg)}}@keyframes swimBobB{0%,100%{transform:translate3d(0,2px,0) rotate(1deg)}50%{transform:translate3d(0,-2px,0) rotate(-1.2deg)}}@keyframes swimBobC{0%,100%{transform:translate3d(0,-2px,0) rotate(-1.3deg)}50%{transform:translate3d(0,3px,0) rotate(1.1deg)}}
@keyframes shellFloat{50%{transform:translateY(-7px) rotate(1deg)}}@keyframes shellBreathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes shellHalo{0%,100%{opacity:.45;transform:scale(1.06)}50%{opacity:.82;transform:scale(1.18)}}@keyframes hintPulse{50%{transform:translateX(-50%) translateY(-3px);box-shadow:0 7px 16px rgba(29,105,137,.2)}}
@keyframes shellArrival{0%{opacity:0;transform:translateY(18px)}24%{opacity:.14;transform:translateY(15px)}72%{opacity:.78;transform:translateY(5px)}100%{opacity:1;transform:translateY(0)}}
@keyframes ambientBubbleRise{0%{opacity:0;transform:translate3d(0,18px,0) scale(.76)}12%{opacity:var(--alpha)}72%{opacity:var(--alpha);transform:translate3d(var(--drift-half),-57vh,0) scale(1)}100%{opacity:0;transform:translate3d(var(--drift),-122vh,0) scale(1.15)}}@keyframes shellBubbleRise{0%{opacity:0;transform:translate3d(0,10px,0) scale(.7)}14%{opacity:var(--alpha)}75%{opacity:var(--alpha);transform:translate3d(var(--drift-half),-110px,0) scale(1)}100%{opacity:0;transform:translate3d(var(--drift),-190px,0) scale(1.1)}}
@keyframes particleDrift{0%{opacity:0;transform:translate3d(0,10px,0) scale(.6)}18%{opacity:var(--particle-alpha)}55%{opacity:.34;transform:translate3d(var(--particle-drift),var(--particle-lift-half),0) scale(1)}100%{opacity:0;transform:translate3d(var(--particle-drift-half),var(--particle-lift-up),0) scale(.72)}}@keyframes shellVanish{0%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;filter:blur(1px)}}
@keyframes oceanMoteFloat{0%{opacity:0;transform:translate3d(0,18px,0) scale(.55)}18%{opacity:var(--mote-alpha)}52%{opacity:.32;transform:translate3d(var(--mote-x-mid),var(--mote-y-mid),0) scale(1.08)}100%{opacity:0;transform:translate3d(var(--mote-x),var(--mote-y),0) scale(.72)}}
@keyframes oceanLightStreak{0%{opacity:0;transform:translate3d(-30px,0,0) rotate(var(--streak-rot)) scaleX(.65)}22%{opacity:.32}58%{opacity:.2;transform:translate3d(var(--streak-x-mid),var(--streak-y-mid),0) rotate(var(--streak-rot)) scaleX(1.08)}100%{opacity:0;transform:translate3d(var(--streak-x),var(--streak-y),0) rotate(var(--streak-rot)) scaleX(.82)}}
@keyframes oceanBackgroundTwinkle{0%{opacity:0;transform:translate3d(0,12px,0) scale(.15) rotate(0)}22%{opacity:var(--ocean-alpha);transform:translate3d(0,0,0) scale(1.25) rotate(20deg)}62%{opacity:.42}100%{opacity:0;transform:translate3d(var(--ocean-x),var(--ocean-y),0) scale(.25) rotate(var(--ocean-rot))}}
@keyframes oceanCausticFlare{0%{opacity:0;transform:translate3d(-35px,8px,0) rotate(var(--flare-rot)) scaleX(.35)}26%{opacity:.48}64%{opacity:.3}100%{opacity:0;transform:translate3d(var(--flare-x),var(--flare-y),0) rotate(var(--flare-rot)) scaleX(1.15)}}
@keyframes shellBubbleBurst{0%{opacity:0;transform:translate3d(0,10px,0) scale(.45)}16%{opacity:var(--burst-alpha)}62%{opacity:.52;transform:translate3d(var(--burst-drift-half),var(--burst-lift-half),0) scale(1)}100%{opacity:0;transform:translate3d(var(--burst-drift),var(--burst-lift-up),0) scale(1.16)}}
@keyframes pearlDustBurst{0%{opacity:0;transform:translate3d(0,8px,0) scale(.15) rotate(0)}14%{opacity:var(--magic-alpha);transform:translate3d(0,0,0) scale(1.15) rotate(18deg)}68%{opacity:.56;transform:translate3d(var(--magic-x-mid),var(--magic-y-mid),0) scale(.9) rotate(var(--magic-rot))}100%{opacity:0;transform:translate3d(var(--magic-x),var(--magic-y),0) scale(.28) rotate(var(--magic-rot))}}
@keyframes pearlGlintBurst{0%{opacity:0;transform:translate3d(0,5px,0) scale(.1) rotate(0)}20%{opacity:1;transform:translate3d(0,0,0) scale(1.28) rotate(22deg)}66%{opacity:.82;transform:translate3d(var(--magic-x-mid),var(--magic-y-mid),0) scale(.82) rotate(var(--magic-rot))}100%{opacity:0;transform:translate3d(var(--magic-x),var(--magic-y),0) scale(.18) rotate(var(--magic-rot))}}
@keyframes spark{50%{opacity:1;transform:scale(1.9)}}@keyframes aura{0%{opacity:0;transform:scale(.25)}40%{opacity:1}100%{opacity:.55;transform:scale(2.2)}}@keyframes pearl{0%{opacity:0;transform:scale(.2)}45%{opacity:1;transform:scale(1.2)}100%{opacity:1;transform:scale(1)}}@keyframes openBack{to{opacity:.75;transform:translateY(-24%) rotate(-12deg) scale(1.02);clip-path:inset(0 0 42% 0)}}@keyframes openFront{to{transform:translateY(11%) rotate(4deg) scale(1.02);clip-path:inset(39% 0 0 0)}}@keyframes flash{0%{opacity:0}30%{opacity:.85}100%{opacity:0}}@keyframes inviteIn{to{opacity:1;transform:translateY(0)}}
@media (min-width:700px){body{background:linear-gradient(135deg,#d9f4f3,#c7dbf1)}.app{min-height:94dvh;margin:3dvh auto;border-radius:34px;box-shadow:0 22px 55px rgba(44,108,139,.23)}.invite-card{padding:29px 27px 22px}}
@media (prefers-reduced-transparency:reduce){.invite-card{background:rgba(250,252,255,.94);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.camera{transform:none}.swim-path{display:none}}
.gift-panel{display:none;position:absolute;z-index:30;inset:50% 18px auto;transform:translateY(-50%);padding:24px 18px;border:1px solid rgba(255,255,255,.85);border-radius:23px;background:rgba(236,250,252,.96);box-shadow:0 18px 45px rgba(35,105,135,.3);color:#52778d;font-size:.78rem;line-height:1.7}.gift-panel.visible{display:grid}.gift-panel p{margin:0;color:#9d7799;font-weight:700}.gift-close{position:absolute;top:7px;right:11px;border:0;background:none;color:#638da0;font-size:1.5rem}.event-details{grid-template-columns:repeat(2,1fr)}.event-details div{padding:10px;border:1px solid rgba(255,255,255,.55);border-radius:14px;background:rgba(255,255,255,.25)}h1 span{font-size:.58em}@media (max-width:520px){.invite.fullscreen .invite-card{padding:clamp(28px,6vh,48px) 18px}.eyebrow{margin-bottom:7px;font-size:.68rem;letter-spacing:.16em}.invite-card h1{width:100%;margin:0 0 12px;font-size:clamp(2rem,7vw,2.75rem);line-height:.95;white-space:nowrap;letter-spacing:-.04em}.invite-card h1 span{font-size:.5em;margin:0 .04em}.age{margin-bottom:5px}.intro{margin:10px auto 14px;font-size:.8rem}.event-details{margin-bottom:16px}.actions{gap:8px}.action{min-height:70px;font-size:.62rem}}.invite-card h1{white-space:nowrap;text-align:center;display:block;letter-spacing:-.035em}.invite-card h1 span{display:inline-block;margin:0 .08em;font-size:.56em}.eyebrow{text-align:center;font-weight:800}.intro{text-align:center}.invite-card h1{font-family:"DM Sans",sans-serif;font-size:clamp(2rem,8vw,3.2rem);font-weight:800;line-height:1;letter-spacing:-.06em;color:#9b6da6;text-shadow:0 2px 0 rgba(255,255,255,.75);white-space:nowrap;text-align:center}.invite-card h1 span{font-size:.55em;font-weight:700;margin:0 .08em;vertical-align:.08em}.invite-card{gap:clamp(4px,1vh,10px)}/* Premium underwater invitation composition */
.invite.fullscreen .invite-card{position:relative;justify-content:center;gap:0;padding:clamp(56px,9vh,82px) clamp(20px,6vw,34px) clamp(34px,6vh,58px);overflow:hidden;background:linear-gradient(180deg,rgba(197,240,247,.60),rgba(235,250,252,.78) 48%,rgba(201,239,246,.68))}
.invite.fullscreen .invite-card::before{content:"";position:absolute;inset:7% 7% 9%;pointer-events:none;background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.42),transparent 34%),radial-gradient(circle at 50% 76%,rgba(204,248,251,.24),transparent 38%);filter:blur(8px)}
.invite-card>*{position:relative;z-index:1}
.eyebrow{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 13px;color:rgba(65,128,151,.82);font-size:clamp(.6rem,1.8vw,.7rem);font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.eyebrow::before,.eyebrow::after{content:"";width:18px;height:1px;background:linear-gradient(90deg,transparent,rgba(108,173,190,.68))}.eyebrow::after{transform:scaleX(-1)}
.invite-card h1{max-width:100%;margin:0 0 15px;background:linear-gradient(115deg,#9c6da9 10%,#c27fb0 52%,#8c79b7 92%);-webkit-background-clip:text;background-clip:text;color:transparent;font-family:Parisienne,cursive;font-size:clamp(2.65rem,9.5vw,3.8rem);font-weight:400;line-height:1.02;letter-spacing:-.015em;text-align:center;text-shadow:0 4px 14px rgba(132,92,151,.12);white-space:nowrap}
.invite-card h1 span{display:inline-block;margin:0 .07em;color:#9a79aa;font-family:"DM Sans",sans-serif;font-size:.42em;font-weight:700;vertical-align:.18em}
.age{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:132px;min-height:54px;margin:0 auto 16px;padding:5px 17px 5px 6px;border:1px solid rgba(255,255,255,.88);border-radius:999px;background:linear-gradient(135deg,rgba(255,255,255,.7),rgba(236,225,249,.27));box-shadow:inset 0 1px 0 #fff,0 10px 28px rgba(61,133,158,.13),0 0 24px rgba(255,255,255,.16);color:#4c88a2}.age::before{content:"";position:absolute;z-index:-1;inset:2px;border-radius:inherit;background:radial-gradient(circle at 17% 15%,rgba(255,255,255,.86),transparent 34%),linear-gradient(105deg,transparent 42%,rgba(255,255,255,.3) 52%,transparent 62%);pointer-events:none}.age::after{content:"✦";position:absolute;top:7px;right:10px;color:#d59fc2;font-size:.5rem;text-shadow:0 0 8px rgba(213,159,194,.55)}.age-number{display:grid;width:42px;height:42px;place-items:center;border:1px solid rgba(255,255,255,.92);border-radius:50%;background:radial-gradient(circle at 32% 24%,#fff 0 14%,#eefcff 35%,#e7d8f2 72%,#c9edf2 100%);box-shadow:inset -3px -4px 8px rgba(137,105,168,.1),inset 3px 3px 8px rgba(255,255,255,.9),0 5px 12px rgba(70,134,156,.16);color:#467f9b;font-size:1.55rem;font-weight:800;line-height:1}.age-label{padding-right:4px;color:#557f96;font-size:.67rem;font-weight:800;letter-spacing:.1em;line-height:1;text-transform:uppercase}
.intro{max-width:320px;margin:0 auto 20px;color:#54788d;font-size:clamp(.79rem,2.4vw,.88rem);font-weight:500;line-height:1.65;text-align:center;text-wrap:balance}.intro::after{content:"•••";display:block;margin-top:8px;color:rgba(173,122,166,.55);font-size:.62rem;letter-spacing:.42em}
.event-details{width:min(100%,370px)!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 auto 14px}.event-details div{padding:13px 10px 12px;border:1px solid rgba(255,255,255,.78);border-radius:19px;background:linear-gradient(145deg,rgba(255,255,255,.48),rgba(232,249,251,.25));box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 22px rgba(62,130,153,.1);backdrop-filter:blur(10px) saturate(1.08);-webkit-backdrop-filter:blur(10px) saturate(1.08)}
.event-details div:first-child{border-right:1px solid rgba(255,255,255,.78)}dt{margin-bottom:5px;color:#7a9baa;font-size:.58rem;font-weight:800;letter-spacing:.15em}dd{color:#3f708a;font-size:.79rem;font-weight:800}
.actions{width:min(100%,370px)!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 auto}.action{min-width:0;min-height:78px;padding:10px 4px;border:1px solid rgba(255,255,255,.82);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.49),rgba(226,247,250,.25));box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 9px 22px rgba(58,124,148,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#4b7890;font-size:.61rem;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}.action svg{width:20px;height:20px;color:#588ba2}.action:nth-child(2){background:linear-gradient(145deg,rgba(255,255,255,.64),rgba(239,229,248,.34));box-shadow:inset 0 1px 0 #fff,0 10px 25px rgba(132,96,153,.13)}
@media (hover:hover){.action:hover{transform:translateY(-3px);background:rgba(255,255,255,.65);box-shadow:inset 0 1px 0 #fff,0 13px 26px rgba(58,124,148,.16)}}.action:active{transform:translateY(1px) scale(.97)}
.invite .eyebrow,.invite h1,.invite .age,.invite .intro,.invite .event-details,.invite .actions{opacity:0;transform:translateY(8px)}.invite.visible .eyebrow{animation:inviteElementIn .56s .18s both}.invite.visible h1{animation:inviteElementIn .64s .27s both}.invite.visible .age{animation:inviteElementIn .58s .36s both}.invite.visible .intro{animation:inviteElementIn .58s .45s both}.invite.visible .event-details{animation:inviteElementIn .58s .55s both}.invite.visible .actions{animation:inviteElementIn .58s .65s both}@keyframes inviteElementIn{to{opacity:1;transform:translateY(0)}}
@media (max-width:380px){.invite.fullscreen .invite-card{padding-inline:15px}.invite-card h1{font-size:clamp(2.35rem,9.2vw,2.75rem)}.event-details,.actions{gap:7px}.action{min-height:74px;font-size:.57rem}}

/* Open invitation — contemporary pearl editorial system */
.invite.fullscreen{isolation:isolate}
.invite.fullscreen .invite-card-modern{
  --invite-ink:#285f75;
  --invite-muted:#688c9c;
  --invite-accent:#de78aa;
  --invite-pink:#d8669e;
  --invite-pink-deep:#c9558c;
  --invite-pink-soft:#f9e4ee;
  --invite-line:rgba(255,255,255,.74);
  position:relative;
  isolation:isolate;
  justify-content:center;
  min-height:100%;
  padding:clamp(48px,7vh,68px) clamp(22px,6vw,34px) clamp(24px,4.5vh,42px);
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 16%,rgba(255,255,255,.72),transparent 27%),
    radial-gradient(circle at 7% 72%,rgba(170,231,237,.22),transparent 26%),
    radial-gradient(circle at 94% 63%,rgba(215,186,232,.18),transparent 25%),
    linear-gradient(180deg,rgba(199,241,247,.43),rgba(233,250,251,.76) 48%,rgba(196,236,243,.48));
  color:var(--invite-ink);
}
.invite.fullscreen .invite-card-modern::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:
    radial-gradient(circle at 14% 18%,rgba(255,255,255,.7) 0 2px,transparent 3px),
    radial-gradient(circle at 83% 28%,rgba(255,255,255,.5) 0 3px,transparent 4px),
    radial-gradient(circle at 22% 78%,rgba(255,255,255,.48) 0 2px,transparent 3px),
    radial-gradient(circle at 88% 83%,rgba(255,255,255,.58) 0 2px,transparent 3px);
  background-size:88px 104px,126px 139px,116px 132px,97px 119px;
  opacity:.42;
  filter:blur(.2px);
  animation:invitePearlDrift 10s ease-in-out infinite alternate;
}
.invite.fullscreen .invite-card-modern::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:9%;
  left:50%;
  width:min(82%,390px);
  aspect-ratio:1;
  border:1px solid rgba(255,255,255,.32);
  border-radius:50%;
  box-shadow:0 0 80px rgba(255,255,255,.25),inset 0 0 80px rgba(255,255,255,.14);
  transform:translateX(-50%);
  opacity:.7;
}
.invite-hero{width:min(100%,430px);margin:0 auto;text-align:center}
.occasion-mark{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 auto 18px;
  padding:6px 14px 6px 7px;
  border:1px solid rgba(255,255,255,.86);
  border-radius:999px;
  background:rgba(255,255,255,.38);
  box-shadow:inset 0 1px 0 #fff,0 10px 30px rgba(61,132,154,.11);
  backdrop-filter:blur(14px) saturate(1.12);
  -webkit-backdrop-filter:blur(14px) saturate(1.12);
}
.occasion-icon{
  display:grid;
  width:35px;
  height:35px;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,#fff,#e9d8ef);
  box-shadow:inset -3px -3px 7px rgba(132,103,164,.09),0 4px 12px rgba(65,130,151,.12);
  color:var(--invite-accent);
}
.occasion-icon img{display:block;width:31px;height:31px;object-fit:contain;filter:drop-shadow(0 2px 5px rgba(176,102,154,.2))}
.occasion-copy{display:grid;gap:1px;text-align:left;line-height:1.1}
.occasion-copy small{color:#7295a3;font-size:.5rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.occasion-copy strong{color:#46758a;font-size:.68rem;font-weight:800;letter-spacing:.03em}
.invite-card-modern .eyebrow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  margin:0 0 10px;
  color:#4d8295;
  font-size:clamp(.62rem,1.8vw,.72rem);
  font-weight:800;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.invite-card-modern .eyebrow::before,.invite-card-modern .eyebrow::after{
  content:"";
  width:25px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(72,137,156,.7));
}
.invite-card-modern .eyebrow::after{transform:scaleX(-1)}
.invite-card-modern h1{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(7px,2.4vw,13px);
  width:max-content;
  max-width:100%;
  margin:0 auto 14px;
  color:var(--invite-accent);
  background:none;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(2.05rem,8.8vw,3.45rem);
  font-weight:700;
  line-height:.96;
  letter-spacing:-.065em;
  text-shadow:0 2px 0 rgba(255,255,255,.65),0 9px 26px rgba(158,87,139,.12);
  white-space:nowrap;
}
.invite-card-modern h1 .girl-name{
  display:block;
  flex:0 0 auto;
  margin:0;
  color:inherit;
  font:inherit;
  font-size:1em;
  letter-spacing:inherit;
}
.invite-card-modern h1 .girl-name{text-align:center}
.invite-card-modern h1 .names-pearl{
  display:inline-grid;
  width:32px;
  height:32px;
  place-items:center;
  margin:0;
  border-radius:50%;
  align-self:center;
  filter:drop-shadow(0 4px 9px rgba(170,90,145,.2));
  animation:titlePearlGlow 3.2s ease-in-out infinite;
}
.invite-card-modern h1 .names-pearl img{display:block;width:100%;height:100%;object-fit:contain}
.invite-card-modern .intro{
  max-width:355px;
  margin:0 auto;
  color:#4f7486;
  font-size:clamp(.76rem,2.3vw,.86rem);
  font-weight:500;
  line-height:1.58;
  text-align:center;
  text-wrap:balance;
}
.invite-card-modern .intro::after{display:none}
.pearl-divider{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:12px;
  width:min(76%,310px);
  margin:17px auto 16px;
  color:var(--invite-accent);
}
.pearl-divider span{height:1px;background:linear-gradient(90deg,transparent,rgba(100,157,174,.52))}
.pearl-divider span:last-child{transform:scaleX(-1)}
.pearl-divider svg{width:15px;height:15px;filter:drop-shadow(0 0 6px rgba(255,255,255,.9));stroke-width:1.7}
.invite-card-modern .event-details{
  display:grid;
  grid-template-columns:1fr 1fr;
  width:min(100%,380px)!important;
  margin:0 auto 12px;
  gap:0;
  overflow:hidden;
  border:1px solid var(--invite-line);
  border-radius:22px;
  background:rgba(255,255,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 12px 34px rgba(50,126,151,.1);
  backdrop-filter:blur(14px) saturate(1.1);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
}
.invite-card-modern .event-detail{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:13px 14px;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  text-align:left;
}
.invite-card-modern .event-detail+ .event-detail{border-left:1px solid rgba(255,255,255,.72)}
.detail-icon{display:grid;width:31px;height:31px;flex:0 0 31px;place-items:center;border-radius:11px;background:rgba(255,255,255,.48);color:#578ca1}
.detail-icon svg{width:15px;height:15px;stroke-width:1.8}
.event-detail dt{margin:0 0 3px;color:#7b9ba8;font-size:.5rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.event-detail dd{margin:0;color:#356b82;font-size:.75rem;font-weight:800;line-height:1.1}
.invite-card-modern .actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:"primary primary" "location gifts";
  gap:9px;
  width:min(100%,380px)!important;
  margin:0 auto;
}
.invite-card-modern .action{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-width:0;
  min-height:58px;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.84);
  border-radius:19px;
  background:linear-gradient(145deg,rgba(255,255,255,.48),rgba(224,246,249,.25));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94),0 7px 20px rgba(52,125,149,.08);
  color:#3f7489;
  font-size:.65rem;
  font-weight:800;
  line-height:1.15;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:transform .28s cubic-bezier(.2,.75,.25,1),border-color .28s ease,background .28s ease,box-shadow .28s ease;
}
.invite-card-modern .action>svg{box-sizing:border-box;width:30px;height:30px;flex:0 0 auto;padding:6px;border:1px solid rgba(255,255,255,.66);border-radius:10px;background:rgba(255,255,255,.38);color:#568ca1;stroke-width:1.7;transition:transform .28s cubic-bezier(.2,.75,.25,1),background .28s ease}
.invite-card-modern .action span{display:grid;gap:2px;text-align:left}
.invite-card-modern .action span small{color:#86a2ad;font-size:.49rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.invite-card-modern .action-location{grid-area:location;flex-direction:row;justify-content:flex-start}
.invite-card-modern .action-gifts{grid-area:gifts;flex-direction:row;justify-content:flex-start}
.invite-card-modern .action-primary{
  grid-area:primary;
  min-height:56px;
  flex-direction:row;
  justify-content:center;
  gap:9px;
  border-color:rgba(255,255,255,.42);
  background:linear-gradient(115deg,#d569a0 0%,#df79aa 48%,#e78db8 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 11px 27px rgba(193,82,139,.22);
  color:#fff;
  font-size:.72rem;
  letter-spacing:.01em;
}
.invite-card-modern .action-primary::before{content:"";position:absolute;z-index:0;top:-45%;bottom:-45%;left:-32%;width:24%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transform:skewX(-18deg);animation:primaryButtonShine 5.8s 1.8s ease-in-out infinite}
.invite-card-modern .action-primary>*{position:relative;z-index:1}
.invite-card-modern .action-primary>svg{width:19px;height:19px;padding:0;border:0;border-radius:0;background:none;color:#fff}
.invite-card-modern .action-primary .action-arrow{margin-left:3px;transition:transform .28s cubic-bezier(.2,.75,.25,1)}
@media (hover:hover){
  .invite-card-modern .action:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.98);background:linear-gradient(145deg,rgba(255,255,255,.64),rgba(228,248,250,.36));box-shadow:inset 0 1px 0 #fff,0 11px 25px rgba(52,125,149,.13)}
  .invite-card-modern .action:hover>svg{transform:translateY(-1px) scale(1.04);background:rgba(255,255,255,.55)}
  .invite-card-modern .action-primary:hover{background:linear-gradient(115deg,#cc6097,#dc74a7 48%,#e485b3);box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 14px 30px rgba(193,82,139,.27)}
  .invite-card-modern .action-primary:hover>svg{background:none}
  .invite-card-modern .action-primary:hover .action-arrow{transform:translateX(3px)}
}
.invite-card-modern .action:active{transform:translateY(1px) scale(.985);transition-duration:.12s}
.invite-card-modern .action:focus-visible{outline:2px solid #4f879d;outline-offset:3px}
.invite-card-modern .gift-close:focus-visible{outline:2px solid var(--invite-pink);outline-offset:3px}
.invite .invite-card-modern .actions{opacity:1;transform:none}
.invite.visible .invite-card-modern .actions{animation:none}
.invite.visible .invite-card-modern .action-primary{animation:actionReveal .58s .62s cubic-bezier(.2,.78,.25,1) backwards}
.invite.visible .invite-card-modern .action-location{animation:actionReveal .54s .73s cubic-bezier(.2,.78,.25,1) backwards}
.invite.visible .invite-card-modern .action-gifts{animation:actionReveal .54s .80s cubic-bezier(.2,.78,.25,1) backwards}
@keyframes actionReveal{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes primaryButtonShine{0%,68%{left:-32%;opacity:0}73%{opacity:.2}84%{left:112%;opacity:.55}90%,100%{left:112%;opacity:0}}
.invite-note{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  max-width:330px;
  margin:12px auto 0;
  color:#638697;
  font-size:.58rem;
  font-weight:600;
  line-height:1.35;
  text-align:center;
}
.invite-note svg{width:14px;height:14px;flex:0 0 auto;color:var(--invite-pink);stroke-width:1.6}
.invite-card-modern .gift-panel{
  display:grid;
  position:absolute;
  z-index:35;
  inset:50% clamp(20px,7vw,42px) auto;
  gap:0;
  padding:26px 20px 20px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:24px;
  background:linear-gradient(155deg,rgba(250,254,255,.97),rgba(230,247,249,.96));
  box-shadow:0 26px 70px rgba(27,98,127,.3),inset 0 1px 0 #fff;
  color:#456f82;
  opacity:0;
  pointer-events:none;
  transform:translateY(-46%) scale(.96);
  transition:opacity .48s ease,transform .58s cubic-bezier(.16,.8,.22,1);
}
.invite-card-modern .gift-panel.visible{opacity:1;pointer-events:auto;transform:translateY(-50%) scale(1);box-shadow:0 0 0 100vmax rgba(35,111,135,.14),0 26px 70px rgba(27,98,127,.3),inset 0 1px 0 #fff}
.gift-panel-icon{display:grid;width:43px;height:43px;place-items:center;margin:0 auto 9px;border-radius:15px;background:linear-gradient(145deg,#fff,var(--invite-pink-soft));color:var(--invite-pink);box-shadow:0 8px 20px rgba(211,91,148,.13)}
.gift-panel-icon svg{width:20px;height:20px}
.invite-card-modern .gift-panel>small{color:#7895a2;font-size:.52rem;font-weight:800;letter-spacing:.15em;text-align:center;text-transform:uppercase}
.invite-card-modern .gift-panel>p{margin:3px 0 16px;color:var(--invite-pink-deep);font-size:1rem;font-weight:800;text-align:center}
.invite-card-modern .gift-panel ul{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.invite-card-modern .gift-panel li{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:11px;min-height:51px;padding:8px 12px 8px 9px;border:1px solid rgba(100,159,174,.14);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(233,248,250,.48));box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 6px 16px rgba(57,124,146,.06)}
.gift-item-icon{display:grid;width:36px;height:36px;place-items:center;border:1px solid rgba(255,255,255,.86);border-radius:12px;background:linear-gradient(145deg,#fff,var(--invite-pink-soft));box-shadow:0 5px 13px rgba(211,91,148,.09);color:var(--invite-pink)}
.gift-item-icon svg{width:17px;height:17px;stroke-width:1.7}
.gift-item-copy{display:grid;min-width:0;gap:3px;text-align:left}
.invite-card-modern .gift-panel li strong{color:#3f7185;font-size:.72rem;line-height:1.1}
.invite-card-modern .gift-panel li .gift-item-copy small{color:#718f9c;font-size:.58rem;font-weight:600;line-height:1.25}
.invite-card-modern .gift-panel.visible li{animation:giftItemReveal .46s cubic-bezier(.2,.78,.25,1) backwards}
.invite-card-modern .gift-panel.visible li:nth-child(1){animation-delay:.10s}
.invite-card-modern .gift-panel.visible li:nth-child(2){animation-delay:.16s}
.invite-card-modern .gift-panel.visible li:nth-child(3){animation-delay:.22s}
.invite-card-modern .gift-close{top:10px;right:12px;display:grid;width:31px;height:31px;place-items:center;border:1px solid rgba(81,135,151,.14);border-radius:50%;background:rgba(255,255,255,.76);color:#638895;font-size:1.1rem;line-height:1}
@keyframes giftItemReveal{from{opacity:0;transform:translateY(7px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.invite .occasion-mark,.invite .pearl-divider,.invite .invite-note{opacity:0;transform:translateY(8px)}
.invite.visible .occasion-mark{animation:inviteElementIn .56s .12s both}
.invite.visible .pearl-divider{animation:inviteElementIn .5s .46s both}
.invite.visible .invite-note{animation:inviteElementIn .5s .72s both}
@keyframes invitePearlDrift{to{background-position:12px -8px,-14px 10px,8px -12px,-10px 14px}}
@keyframes titlePearlGlow{0%,100%{transform:scale(.94);filter:drop-shadow(0 3px 7px rgba(170,90,145,.16))}50%{transform:scale(1.04);filter:drop-shadow(0 5px 12px rgba(170,90,145,.28))}}
@media (max-width:390px){
  .invite.fullscreen .invite-card-modern{padding-inline:15px}
  .invite-card-modern h1{font-size:clamp(1.82rem,8.4vw,2.25rem);gap:6px}
  .invite-card-modern h1 .names-pearl{width:27px;height:27px}
  .invite-card-modern .event-detail{gap:7px;padding:11px 9px}
  .detail-icon{width:28px;height:28px;flex-basis:28px}
  .invite-card-modern .action{padding-inline:9px}
}
@media (max-height:740px){
  .invite.fullscreen .invite-card-modern{padding-top:40px;padding-bottom:18px}
  .occasion-mark{margin-bottom:11px}
  .invite-card-modern h1{margin-bottom:10px}
  .pearl-divider{margin-block:12px}
  .invite-card-modern .event-details{margin-bottom:9px}
  .invite-note{margin-top:8px}
}
@media (prefers-reduced-transparency:reduce){
  .invite.fullscreen .invite-card-modern{background:#d9f3f6}
  .occasion-mark,.invite-card-modern .event-details,.invite-card-modern .action{backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* Action bubbles and RSVP confirmation */
.action-effects-layer{position:absolute;z-index:34;inset:0;overflow:hidden;pointer-events:none;transition:z-index 0s .2s}
.action-effects-layer.celebrating{z-index:37;transition-delay:0s}
.action-bubble{position:absolute;border:1.4px solid rgba(255,255,255,.94);border-radius:50%;background:radial-gradient(circle at 30% 24%,rgba(255,255,255,.98),rgba(226,247,255,.3) 42%,transparent 70%);box-shadow:inset -2px -2px 4px rgba(110,188,215,.16),0 0 12px rgba(255,255,255,.55);opacity:0;animation:actionBubbleBloom var(--action-duration) cubic-bezier(.18,.72,.3,1) var(--action-delay) forwards}
.action-effects-layer.celebrating .action-bubble:nth-child(3n){filter:drop-shadow(0 0 5px rgba(250,210,238,.72))}
.action-effects-layer.celebrating .action-bubble:nth-child(4n){border-color:rgba(255,224,245,.96);background:radial-gradient(circle at 30% 24%,#fff,rgba(247,210,238,.28) 44%,transparent 72%)}
.invite.visible .invite-card-modern .action.is-bubbling{animation:actionButtonPearlPulse .44s cubic-bezier(.2,.75,.25,1)}
@keyframes actionBubbleBloom{0%{opacity:0;transform:translate3d(0,8px,0) scale(.35)}18%{opacity:var(--action-alpha)}62%{opacity:var(--action-alpha);transform:translate3d(var(--action-drift-half),var(--action-lift-half),0) scale(1)}100%{opacity:0;transform:translate3d(var(--action-drift),var(--action-lift),0) scale(1.18)}}
@keyframes actionButtonPearlPulse{0%,100%{transform:translateY(0) scale(1)}46%{transform:translateY(1px) scale(.985);filter:brightness(1.04)}76%{transform:translateY(-1px) scale(1.01);box-shadow:0 0 0 4px rgba(255,255,255,.14),0 12px 27px rgba(134,81,125,.16)}}
.invite-card-modern .rsvp-panel{
  display:grid;
  position:absolute;
  z-index:35;
  inset:50% clamp(20px,7vw,42px) auto;
  gap:0;
  padding:26px 20px 20px;
  border:1px solid rgba(255,255,255,.9);
  border-radius:24px;
  background:linear-gradient(155deg,rgba(250,254,255,.98),rgba(232,247,250,.97));
  box-shadow:0 26px 70px rgba(27,98,127,.3),inset 0 1px 0 #fff;
  color:#456f82;
  opacity:0;
  pointer-events:none;
  transform:translateY(-45%) scale(.94);
  transition:opacity .48s ease,transform .58s cubic-bezier(.16,.8,.22,1);
}
.invite-card-modern .rsvp-panel.visible{opacity:1;pointer-events:auto;transform:translateY(-50%) scale(1);box-shadow:0 0 0 100vmax rgba(35,111,135,.17),0 26px 70px rgba(27,98,127,.3),inset 0 1px 0 #fff}
.rsvp-panel-icon{display:grid;width:46px;height:46px;place-items:center;margin:0 auto 9px;border-radius:16px;background:radial-gradient(circle at 30% 22%,#fff,var(--invite-pink-soft) 58%,#dff2f5);box-shadow:inset -2px -2px 7px rgba(216,102,158,.08),0 9px 22px rgba(211,91,148,.14);color:var(--invite-pink)}
.rsvp-panel-icon svg{width:21px;height:21px;stroke-width:1.7}
.invite-card-modern .rsvp-panel>small{color:#7895a2;font-size:.52rem;font-weight:800;letter-spacing:.15em;text-align:center;text-transform:uppercase}
.invite-card-modern .rsvp-panel>p{margin:3px 0 16px;color:var(--invite-pink-deep);font-size:1rem;font-weight:800;text-align:center}
.invite-card-modern .rsvp-close{position:absolute;top:10px;right:12px;display:grid;width:30px;height:30px;place-items:center;border:1px solid rgba(81,135,151,.12);border-radius:50%;background:rgba(255,255,255,.76);color:#638895;font-size:1.1rem;line-height:1;cursor:pointer}
.rsvp-form{display:grid;gap:12px}
.rsvp-fields{display:grid;gap:9px}
.rsvp-fields label{display:grid;gap:5px;color:#668894;font-size:.58rem;font-weight:800;letter-spacing:.04em;text-align:left}
.rsvp-input-wrap{display:flex;min-height:45px;align-items:center;gap:9px;padding:0 12px;border:1px solid rgba(101,158,174,.2);border-radius:14px;background:rgba(255,255,255,.62);box-shadow:inset 0 1px 0 #fff;transition:border-color .2s,box-shadow .2s,background .2s}
.rsvp-input-wrap:focus-within{border-color:rgba(216,102,158,.62);background:#fff;box-shadow:0 0 0 3px rgba(222,120,170,.13),inset 0 1px 0 #fff}
.rsvp-input-wrap svg{width:16px;height:16px;flex:0 0 auto;color:#7197a7;stroke-width:1.7}
.rsvp-input-wrap input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#365f73;font:600 .72rem "DM Sans",sans-serif}
.rsvp-input-wrap input::placeholder{color:#91a7b0;font-weight:500}
.rsvp-submit{display:flex;min-height:49px;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(255,255,255,.4);border-radius:16px;background:linear-gradient(115deg,var(--invite-pink-deep),var(--invite-pink) 48%,#e78ab6);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 10px 24px rgba(202,82,140,.22);color:#fff;font:800 .7rem "DM Sans",sans-serif;cursor:pointer;transition:transform .2s,filter .2s,box-shadow .2s}
@media (hover:hover){.rsvp-submit:hover{transform:translateY(-1px);filter:brightness(1.035);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 13px 27px rgba(202,82,140,.26)}}
.rsvp-submit svg{width:17px;height:17px;stroke-width:1.7}.rsvp-submit:active{transform:scale(.98)}.rsvp-submit:disabled{cursor:wait;filter:saturate(.7) brightness(1.08)}.rsvp-submit.submitting svg:last-child{animation:rsvpSparkSpin .8s linear infinite}
.rsvp-privacy{display:flex!important;align-items:center;justify-content:center;gap:5px!important;margin:0!important;color:#78939e!important;font-size:.51rem!important;font-weight:600!important;line-height:1.3;text-align:center}.rsvp-privacy svg{width:13px;height:13px;flex:0 0 auto;stroke-width:1.6}
.rsvp-success{display:none;place-items:center;gap:8px;padding:5px 0 2px;text-align:center}
.rsvp-panel.success{animation:rsvpPanelCelebrate .9s cubic-bezier(.16,.8,.22,1) both}
.rsvp-panel.success .rsvp-form{display:none}.rsvp-panel.success .rsvp-success{display:grid;animation:rsvpSuccessReveal .78s cubic-bezier(.16,.85,.24,1) both}.rsvp-panel.success>.rsvp-panel-icon,.rsvp-panel.success>small,.rsvp-panel.success>#rsvpPanelTitle{display:none}
.success-pearl{display:grid;width:78px;height:78px;place-items:center;border:1px solid rgba(255,255,255,.94);border-radius:50%;background:radial-gradient(circle at 30% 24%,#fff 0 10%,#fbe2ee 36%,#dff3f5 72%,#f3c8dc 100%);box-shadow:inset -7px -8px 14px rgba(211,91,148,.1),inset 6px 6px 12px rgba(255,255,255,.86),0 0 0 8px rgba(255,255,255,.3),0 14px 32px rgba(201,83,139,.18);color:var(--invite-pink);animation:successPearlCelebrate .95s cubic-bezier(.18,.88,.24,1.18) both,successPearlFloat 2.6s ease-in-out 1s infinite}
.success-pearl svg{width:29px;height:29px;stroke-width:2}
.rsvp-success strong{margin-top:5px;color:var(--invite-pink-deep);font-size:1.05rem}.rsvp-success p{max-width:245px;margin:0!important;color:#5f7f8d!important;font-size:.7rem!important;font-weight:600!important;line-height:1.5}.rsvp-success button{margin-top:4px;padding:9px 23px;border:1px solid rgba(86,141,157,.18);border-radius:999px;background:rgba(255,255,255,.72);color:#4e7889;font:800 .62rem "DM Sans";cursor:pointer}
.invite-card-modern .rsvp-close:focus-visible,.rsvp-submit:focus-visible,.rsvp-success button:focus-visible{outline:2px solid var(--invite-pink);outline-offset:3px}
@keyframes rsvpSparkSpin{to{transform:rotate(180deg)}}@keyframes rsvpPanelCelebrate{0%{filter:brightness(1)}38%{filter:brightness(1.08);box-shadow:0 0 0 100vmax rgba(35,111,135,.17),0 0 0 7px rgba(255,255,255,.28),0 26px 70px rgba(27,98,127,.3)}100%{filter:brightness(1)}}@keyframes rsvpSuccessReveal{0%{opacity:0;transform:translateY(12px) scale(.92)}55%{opacity:1;transform:translateY(-2px) scale(1.015)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes successPearlCelebrate{0%{opacity:0;transform:scale(.35) rotate(-14deg);filter:brightness(1.35)}58%{opacity:1;transform:scale(1.12) rotate(3deg);filter:brightness(1.12)}100%{opacity:1;transform:scale(1) rotate(0);filter:brightness(1)}}@keyframes successPearlFloat{0%,100%{transform:translateY(0);filter:brightness(1)}50%{transform:translateY(-5px);filter:brightness(1.08)}}
@media (max-width:390px){.invite-card-modern .rsvp-panel{inset-inline:14px;padding:23px 16px 17px}.rsvp-input-wrap{min-height:43px}.success-pearl{width:66px;height:66px}}
@media (prefers-reduced-motion:reduce){.action-bubble{display:none}.invite-card-modern .gift-panel,.invite-card-modern .rsvp-panel{transition-duration:.01ms}.success-pearl{animation:none}}

/* Concha 3D construída em CSS: sem quadros ou imagens na abertura. */
.shell-rig {
  overflow:visible;
  perspective:1100px;
  transform:translateY(-3%) scale(1.22);
}
.shell-rig .shell {
  display:block;
  overflow:visible;
  filter:drop-shadow(0 14px 13px rgba(54,94,145,.25)) drop-shadow(0 0 13px rgba(255,218,238,.5));
  transform-style:preserve-3d;
}
.shell-rig .shell-ribs,
.shell-rig .shell-ribs::before,
.shell-rig .shell-ribs::after {
  position:absolute;
  inset:0;
  display:block;
  content:"";
  border-radius:inherit;
  pointer-events:none;
}
.shell-rig .shell-ribs {
  background:
    repeating-conic-gradient(from 268deg at 50% 102%, rgba(105,75,178,.44) 0 2.1deg, transparent 2.4deg 11.4deg),
    repeating-conic-gradient(from 268deg at 50% 102%, rgba(255,255,255,.38) 4.7deg 5.4deg, transparent 5.8deg 11.4deg);
  mix-blend-mode:soft-light;
  opacity:.92;
}
.shell-rig .shell-ribs::before { inset:4% 7% 12%; border:1px solid rgba(255,255,255,.5); box-shadow:inset 0 0 18px rgba(255,238,252,.42); }
.shell-rig .shell-ribs::after { inset:8% 12% 14%; background:radial-gradient(ellipse at 32% 17%,rgba(255,255,255,.85),transparent 14%),radial-gradient(ellipse at 70% 27%,rgba(255,244,211,.55),transparent 17%),radial-gradient(ellipse at 50% 76%,rgba(118,91,219,.26),transparent 45%); opacity:.86; }
.shell-rig .shell-base {
  z-index:2;
  inset:auto 2% 0;
  width:96%;
  height:59%;
  opacity:0;
  border-radius:7% 7% 48% 48% / 18% 18% 63% 63%;
  clip-path:polygon(1% 8%,12% 1%,26% 4%,39% 0,50% 5%,61% 0,74% 4%,88% 1%,99% 8%,96% 53%,88% 75%,75% 92%,61% 99%,50% 94%,39% 99%,25% 92%,12% 75%,4% 53%);
  background:linear-gradient(180deg,#f6d5fd 0%,#c6bef8 25%,#a6dff2 46%,#d6a4ed 73%,#8466c7 100%);
  box-shadow:inset 0 6px 13px rgba(255,255,255,.7),inset 0 -17px 23px rgba(93,62,166,.42);
}
.shell-inner-glow { position:absolute;z-index:3;left:18%;right:18%;bottom:20%;height:42%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,240,.95),rgba(255,205,244,.6) 37%,rgba(106,215,244,.14) 67%,transparent 72%);filter:blur(3px); }
.shell-pearl { position:absolute;z-index:4;left:50%;bottom:28%;width:18%;aspect-ratio:1;border-radius:50%;transform:translateX(-50%) translateZ(20px);background:radial-gradient(circle at 33% 27%,#fff 0 9%,#fff4e3 10% 20%,#d5fbff 35%,#d7a4ee 67%,#7a59af 100%);box-shadow:0 0 0 4px rgba(255,219,183,.65),0 5px 8px rgba(71,42,123,.35),0 0 22px rgba(255,245,208,.8); }
.shell-rig .shell-lid {
  z-index:3;
  inset:0 2% auto;
  width:96%;
  height:71%;
  opacity:0;
  border-radius:50% 50% 10% 10% / 96% 96% 12% 12%;
  clip-path:polygon(1% 74%,4% 50%,12% 29%,25% 12%,39% 3%,50% 0,61% 3%,75% 12%,88% 29%,96% 50%,99% 74%,92% 83%,80% 87%,66% 90%,50% 94%,34% 90%,20% 87%,8% 83%);
  transform-origin:50% 94%;
  background:linear-gradient(165deg,#f8dbff 0%,#b7eafe 28%,#b0bdff 53%,#d6a8f0 77%,#885fc3 100%);
  box-shadow:inset 0 10px 18px rgba(255,255,255,.75),inset 0 -19px 24px rgba(84,58,160,.42),0 4px 8px rgba(66,40,128,.17);
  backface-visibility:hidden;
}
.shell-lid-shine { position:absolute;inset:8% 12% 18%;border-radius:50%;background:radial-gradient(ellipse at 34% 17%,rgba(255,255,255,.92),transparent 15%),radial-gradient(ellipse at 70% 33%,rgba(255,242,216,.7),transparent 19%),linear-gradient(112deg,transparent 42%,rgba(255,255,255,.22) 49%,transparent 58%);filter:blur(.3px); }
.shell-closed {
  z-index:5;
  inset:1% 0 0;
  width:100%;
  height:95%;
  border-radius:47% 47% 44% 44% / 58% 58% 43% 43%;
  clip-path:polygon(1% 66%,5% 44%,14% 24%,28% 9%,42% 2%,50% 0,58% 2%,72% 9%,86% 24%,95% 44%,99% 66%,95% 78%,85% 88%,71% 95%,59% 99%,50% 94%,41% 99%,29% 95%,15% 88%,5% 78%);
  background:linear-gradient(155deg,#ffe5fc 0%,#bcecff 23%,#bbbcff 44%,#e2aeea 69%,#8461bd 100%);
  box-shadow:inset 0 8px 17px rgba(255,255,255,.8),inset 0 -18px 28px rgba(103,61,165,.42);
}
.shell-closed .shell-ribs { background:repeating-conic-gradient(from 268deg at 50% 104%,rgba(92,64,163,.5) 0 2.6deg,transparent 3deg 11deg),repeating-conic-gradient(from 268deg at 50% 104%,rgba(255,255,255,.38) 4deg 5.1deg,transparent 5.6deg 11deg); }
.closed-shell-gloss { position:absolute;z-index:3;inset:7% 9% 14%;border-radius:inherit;background:radial-gradient(ellipse at 31% 18%,rgba(255,255,255,.9),transparent 14%),radial-gradient(ellipse at 70% 25%,rgba(255,244,211,.62),transparent 16%),radial-gradient(ellipse at 50% 63%,rgba(253,182,242,.26),transparent 38%); }
.closed-shell-pearl { position:absolute;z-index:4;left:50%;top:61%;width:18%;aspect-ratio:1;transform:translateX(-50%);border:3px solid rgba(255,223,173,.88);border-radius:50%;background:radial-gradient(circle at 32% 26%,#fff 0 10%,#fff0e4 12% 22%,#c5f6ff 36%,#d5a4ed 68%,#805cad 100%);box-shadow:0 4px 8px rgba(63,38,111,.4),0 0 18px rgba(255,239,194,.74); }
.shell-stage.opened .shell-base { opacity:1; }
.shell-stage.opened .shell-lid { opacity:1; transform:translateY(-24%) rotateX(-88deg) scaleY(.96); }
.shell-stage.opened .shell-closed { opacity:0; }
.shell-stage.revealing .shell-rig { filter:saturate(1.08); }
@media (prefers-reduced-motion:reduce) { .shell-rig .shell-lid { transform:none!important; } }

/* Cena WebGL da concha — o canvas contém malhas 3D, não imagens. */
.shell-webgl {
  position:absolute;
  z-index:4;
  inset:-14% -10% -11%;
  pointer-events:none;
  filter:drop-shadow(0 18px 18px rgba(24,104,151,.28)) drop-shadow(0 0 22px rgba(255,224,174,.48));
}
#shell3DCanvas { display:block;width:100%;height:100%; }
.shell-stage.opened .shell-webgl { filter:drop-shadow(0 22px 25px rgba(24,104,151,.24)) drop-shadow(0 0 30px rgba(255,238,179,.62)); }
@media (max-width:430px) {
  .shell-webgl { inset:-18% -14% -13%; }
}

/* Abertura por sequência de imagens: a concha original é preservada. */
.shell-webgl { display:none!important; }
.shell-image-sequence { position:absolute;z-index:4;inset:-10% -8% -9%;pointer-events:none;filter:drop-shadow(0 16px 18px rgba(24,104,151,.28)) drop-shadow(0 0 17px rgba(255,221,235,.4)); }
.shell-image { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:scale(.985);transition:opacity .16s ease,transform .18s ease; }
.shell-image.is-active { opacity:1;transform:scale(1); }
.shell-stage.revealing .shell-image-sequence { filter:drop-shadow(0 19px 22px rgba(24,104,151,.3)) drop-shadow(0 0 29px rgba(255,239,183,.74)); }
@media (max-width:430px) { .shell-image-sequence { inset:-13% -12% -12%; } }

/* Opção de carinho via Pix no painel de presentes. */
.invite-card-modern .gift-pix{display:grid;grid-template-columns:31px minmax(0,1fr);align-items:center;gap:8px;margin-top:10px;padding:9px 10px;border:1px dashed rgba(215,118,172,.35);border-radius:14px;background:linear-gradient(135deg,rgba(255,247,252,.78),rgba(239,251,253,.62));text-align:left}
.gift-pix-icon{display:grid;width:31px;height:31px;place-items:center;border-radius:10px;background:rgba(255,231,244,.75);color:var(--invite-pink)}
.gift-pix-icon svg{width:16px;height:16px;stroke-width:1.7}
.invite-card-modern .gift-pix p{grid-column:2;margin:0;color:#6b8997;font-size:.6rem;font-weight:600;line-height:1.28}
.gift-pix-key{grid-column:2;display:flex;align-items:baseline;gap:7px;color:#3f7185;white-space:nowrap}
.gift-pix-key small{color:#d169a6;font-size:.52rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.gift-pix-key strong{font-size:.76rem;letter-spacing:.035em}
.invite-card-modern .gift-panel.visible .gift-pix{animation:giftItemReveal .48s .29s cubic-bezier(.2,.78,.25,1) backwards}
@media(max-width:390px){.invite-card-modern .gift-pix{margin-top:8px;padding:8px}.invite-card-modern .gift-pix p{font-size:.57rem}.gift-pix-key strong{font-size:.72rem}}

/* Tipografia leve e lúdica, alinhada ao tema do fundo do mar. */
.intro-line{font-family:"Dancing Script",Parisienne,cursive;font-size:clamp(1.72rem,8.1vw,2.35rem);font-weight:600;letter-spacing:0;line-height:1.16}
.intro-line-names{font-family:"Dancing Script",Parisienne,cursive;font-size:clamp(1.92rem,9.1vw,2.7rem);font-weight:700;letter-spacing:0}
.invite-card-modern h1{font-family:"Dancing Script",Parisienne,cursive;font-size:clamp(2.5rem,11.2vw,4rem);font-weight:700;letter-spacing:-.035em;line-height:.9}
.invite-card-modern h1 .girl-name{letter-spacing:inherit}

/* Pix organizado como um pequeno cartão de carinho. */
.invite-card-modern .gift-pix{grid-template-columns:34px minmax(0,1fr);gap:4px 9px;margin-top:11px;padding:10px 12px;border:1px solid rgba(220,118,174,.26);border-radius:15px;background:linear-gradient(135deg,rgba(255,251,254,.94),rgba(232,250,252,.78));box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 7px 17px rgba(92,159,177,.07)}
.gift-pix-icon{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,#fff0f8,#f8d9ed);color:#dc69aa}
.invite-card-modern .gift-pix p{grid-column:2;align-self:center;color:#5f8291;font-size:.62rem;line-height:1.3}
.gift-pix-key{grid-column:1 / -1;justify-content:center;gap:8px;margin-top:3px;padding-top:7px;border-top:1px solid rgba(218,132,177,.16);line-height:1}
.gift-pix-key small{font-size:.53rem;color:#d45f9f}
.gift-pix-key strong{font-size:.85rem;color:#39758d;letter-spacing:.055em}
@media(max-width:390px){.invite-card-modern h1{font-size:clamp(2.22rem,10.5vw,3rem)}.intro-line{font-size:clamp(1.55rem,7.6vw,2.05rem)}.intro-line-names{font-size:clamp(1.72rem,8.35vw,2.28rem)}.invite-card-modern .gift-pix{padding:9px 10px}.gift-pix-key strong{font-size:.8rem}}

/* Botão independente para copiar a chave Pix. */
.gift-pix-key{display:none!important}
.invite-card-modern .gift-pix-copy{grid-column:1 / -1;display:flex;min-height:39px;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;padding:7px 10px 7px 12px;border:1px solid rgba(216,101,164,.34);border-radius:11px;background:#fff;color:#39758d;text-align:left;box-shadow:0 4px 10px rgba(86,157,176,.08);cursor:pointer;transition:transform .18s ease,background .18s ease,border-color .18s ease}
.gift-pix-copy span{display:flex;min-width:0;align-items:baseline;gap:8px}
.gift-pix-copy small{color:#d45f9f;font-size:.53rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.gift-pix-copy strong{font-size:.85rem;letter-spacing:.055em;white-space:nowrap}
.gift-pix-copy svg{width:17px;height:17px;flex:0 0 auto;color:#d65d9f;stroke-width:1.8}
.gift-pix-copy:active{transform:scale(.98);background:#fff7fc}
.gift-pix-copy.is-copied{border-color:#77bfae;background:#f1fffb;color:#347a70}
.gift-pix-copy.is-copied small,.gift-pix-copy.is-copied svg{color:#45a28e}


/* Campos extras da confirmação para alimentar o painel administrativo. */
.rsvp-field-full { grid-column:1 / -1; }
.rsvp-textarea-wrap { min-height:76px; align-items:flex-start; padding-top:.68rem; }
.rsvp-textarea-wrap textarea {
  width:100%;
  min-height:52px;
  resize:none;
  border:0;
  outline:0;
  background:transparent;
  color:#326179;
  font:600 .92rem/1.35 var(--font-body, 'DM Sans', sans-serif);
}
.rsvp-textarea-wrap textarea::placeholder { color:rgba(50,97,121,.55); }
.rsvp-input-wrap input[type="number"] { text-align:center; }
@media (max-width:420px) {
  .rsvp-field-full { grid-column:auto; }
}

/* Correção de estabilidade no celular: evita piscadas causadas por filtros, masks e blend-modes animados. */
@media (max-width:760px), (pointer:coarse) {
  .app,
  .ocean-scene,
  .camera,
  .background {
    transform:translateZ(0);
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .background {
    filter:none !important;
    animation:none !important;
    will-change:auto !important;
  }
  .light-rays,
  .light-rays::before,
  .light-rays::after {
    animation:none !important;
    filter:none !important;
    mix-blend-mode:normal !important;
    opacity:.38 !important;
    mask-image:none !important;
    -webkit-mask-image:none !important;
  }
  .plant-depth-layer::before,
  .plant-depth-layer::after,
  .plant-glint,
  .water-particle,
  .ocean-mote,
  .ocean-light-streak,
  .ocean-background-twinkle,
  .ocean-caustic-flare {
    display:none !important;
    animation:none !important;
  }
  .plant-depth-layer,
  .plant-depth-layer img {
    transform:none !important;
    animation:none !important;
    filter:none !important;
    will-change:auto !important;
  }
  .animal,
  .swim-path {
    will-change:auto !important;
  }
}

/* Melhoria de leitura dos botões e dados: textos maiores e centralizados, mantendo os ícones. */
.invite-card-modern .event-detail {
  justify-content:center !important;
  padding:12px 10px !important;
}
.invite-card-modern .event-detail > span:not(.detail-icon) {
  flex:1 1 auto;
  min-width:0;
  text-align:center;
}
.invite-card-modern .event-detail dt {
  font-size:.58rem !important;
  letter-spacing:.12em !important;
  line-height:1.1 !important;
  text-align:center !important;
}
.invite-card-modern .event-detail dd {
  margin-top:4px !important;
  font-size:.92rem !important;
  line-height:1.05 !important;
  text-align:center !important;
}
.invite-card-modern .action-location,
.invite-card-modern .action-gifts {
  justify-content:center !important;
  gap:9px !important;
  padding:11px 10px !important;
}
.invite-card-modern .action span {
  flex:1 1 auto;
  min-width:0;
  text-align:center !important;
  justify-items:center;
}
.invite-card-modern .action span small {
  font-size:.56rem !important;
  letter-spacing:.07em !important;
  line-height:1.05 !important;
  text-align:center !important;
}
.invite-card-modern .action-location span,
.invite-card-modern .action-gifts span {
  color:#356b82;
  font-size:.82rem !important;
  font-weight:800 !important;
  line-height:1.1 !important;
}
.invite-card-modern .action-primary span {
  flex:0 1 auto;
  font-size:.86rem !important;
  font-weight:900 !important;
  text-align:center !important;
}
@media (max-width:390px) {
  .invite-card-modern .event-detail { gap:7px !important;padding:11px 8px !important; }
  .invite-card-modern .event-detail dt { font-size:.52rem !important; }
  .invite-card-modern .event-detail dd { font-size:.84rem !important; }
  .invite-card-modern .action-location,
  .invite-card-modern .action-gifts { gap:7px !important;padding:10px 8px !important; }
  .invite-card-modern .action span small { font-size:.49rem !important; }
  .invite-card-modern .action-location span,
  .invite-card-modern .action-gifts span { font-size:.75rem !important; }
}
