@font-face{font-family:Manrope;src:url(/assets/bubblegum-reef-20260923T152116Z/fonts/manrope.ttf);font-weight:200 800;font-display:swap}
@font-face{font-family:Bricolage;src:url(/assets/bubblegum-reef-20260923T152116Z/fonts/bricolagegrotesque.ttf);font-weight:200 800;font-display:swap}
@font-face{font-family:Instrument;src:url(/assets/bubblegum-reef-20260923T152116Z/fonts/instrumentserif-italic.ttf);font-style:italic;font-display:swap}
@font-face{font-family:Lilita;src:url(/assets/bubblegum-reef-20260923T152116Z/fonts/lilitaone.ttf);font-display:swap}
@font-face{font-family:Barlow;src:url(/assets/bubblegum-reef-20260923T152116Z/fonts/barlowcondensed.ttf);font-weight:100 900;font-display:swap}
@font-face{font-family:Pinyon;src:url(/assets/bubblegum-reef-20260923T152116Z/fonts/pinyonscript.ttf);font-display:swap}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#211026}body{font-family:Manrope,sans-serif}
.splash{position:relative;isolation:isolate;width:100%;height:100svh;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:center}
.scene-header,.scene-footer{position:absolute;left:5.5%;right:5.5%;z-index:5;display:flex;justify-content:space-between;align-items:center;font-size:clamp(7px,.76vw,12px);font-weight:600;letter-spacing:.16em;gap:20px}
.scene-header{top:7%}.scene-footer{bottom:7%}.scene-footer>span:last-child{letter-spacing:.025em;font-size:clamp(8px,.9vw,13px)}.scene-footer b{font-size:1.6em;font-weight:400;margin-left:12px}
.name-wrap{position:relative;z-index:2}.wordmark{margin:0;font-weight:400}.wordmark>span{display:block;white-space:nowrap}.glint{position:absolute;z-index:3;animation:shimmer 6s ease-in-out infinite}
.afterglow{background:#140a1b;color:#f9a8d9}.afterglow .ambient{position:absolute;inset:-15%;background:radial-gradient(ellipse at 70% 35%,#99116c66,transparent 45%),radial-gradient(ellipse at 30% 80%,#f1529638,transparent 40%);animation:drift 18s ease-in-out infinite alternate}
.afterglow .halo{position:absolute;width:69vw;height:37vw;border:1px solid #ff73c86b;transform:rotate(-28deg);border-radius:50%;background:radial-gradient(ellipse at center,transparent 63%,#ff55ac0d 70%,transparent 73%);box-shadow:0 0 45px #ff459818,inset 0 0 35px #d442bc16}
.afterglow .wordmark{font-family:Manrope,sans-serif;font-size:min(14.7vw,24vh);font-weight:700;letter-spacing:-.085em;line-height:.91;color:#ff8ccc;filter:drop-shadow(0 0 27px #ff36a125)}
.afterglow .wordmark>span:first-child{padding-right:1.3em;background:linear-gradient(110deg,#ffd2e8 5%,#ff7bc4 75%);background-clip:text;-webkit-background-clip:text;color:transparent}
.afterglow .wordmark>span:last-child{margin-left:1.04em;position:relative;background:linear-gradient(110deg,#ff8dcd,#ff579e);background-clip:text;-webkit-background-clip:text;color:transparent}
.tiny-mark{font-family:Bricolage,sans-serif;font-size:clamp(19px,3vw,42px);font-weight:700;letter-spacing:-.15em;line-height:.7}.tiny-mark span{display:inline-block;transform:translateY(.15em);color:#ff60b0}
.afterglow .g1{top:28%;right:20%;font-size:3.1vw}.afterglow .g2{left:15%;bottom:25%;font-size:1.7vw;animation-delay:-2s}.afterglow .scene-footer{color:#c994b2}
.rose{background:#f4dfe6;color:#a42161}.rose .paper{position:absolute;inset:0;opacity:.4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.13' d='M0 0h160v160H0z'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.rose-wash{position:absolute;inset:-20%;background:radial-gradient(ellipse at 24% 78%,#fffaeea6,transparent 60%),radial-gradient(ellipse at 80% 10%,#f791bf8c,transparent 58%)}
.rose .name-wrap{transform:translate(-3vw,0)}.rose .wordmark{font-family:Instrument,Georgia,serif;font-style:italic;font-size:min(18.5vw,28vh);line-height:.74;letter-spacing:-.058em;text-shadow:0 2px 0 #fff6}
.rose .wordmark>span:first-child{padding-right:.65em}.rose .wordmark>span:last-child{margin-left:1.25em}.rose .hand-note{position:absolute;bottom:12%;left:5%;font-family:Instrument,Georgia,serif;font-style:italic;font-size:clamp(15px,2.8vw,42px);transform:rotate(-12deg)}
.rose-symbol{font-size:clamp(27px,4.2vw,56px);line-height:.7}.rose .scene-header>span:last-child{font-weight:500;font-size:clamp(6px,.7vw,11px)}
.rose-orbit{position:absolute;right:19%;top:24%;width:13vw;height:13vw;animation:rose-turn 50s linear infinite}
.rose-orbit i{position:absolute;inset:0;border-radius:50%;border:.8px solid #a4216170;transform:rotate(calc(var(--i)*30deg)) scaleX(.33)}.rose-orbit i:nth-child(1){--i:0}.rose-orbit i:nth-child(2){--i:1}.rose-orbit i:nth-child(3){--i:2}.rose-orbit i:nth-child(4){--i:3}.rose-orbit i:nth-child(5){--i:4}.rose-orbit i:nth-child(6){--i:5}
.candy{background:#f5a3cd;color:#7c204e}.candy .name-wrap{transform:rotate(-7deg)}.candy .wordmark{font-family:Lilita,Georgia,serif;font-size:min(15.8vw,25.7vh);letter-spacing:-.036em;line-height:.84;color:#fff1d5;-webkit-text-stroke:max(1px,.16vw) #aa2a6a;paint-order:stroke fill;text-shadow:.012em .018em #aa2a6a,.025em .033em #aa2a6a,.037em .048em #aa2a6a,.05em .064em #aa2a6a,.062em .080em #aa2a6a}
.candy .wordmark>span:last-child{margin-left:.37em}.candy .wordmark>span:first-child{padding-right:.37em}.candy-shape{position:absolute;border-radius:45%;width:52vw;height:52vw;background:#e963a6;transform:rotate(30deg)}.shape-a{left:-30%;bottom:-35%}.shape-b{right:-33%;top:-30%;background:#ffcee4;transform:rotate(-30deg)}
.sticker{position:absolute;z-index:3;display:flex;justify-content:center;align-items:center;animation:wobble 9s ease-in-out infinite}.sticker-star{top:23%;right:16%;font-size:12vw;line-height:.7;color:#ef5c24;text-shadow:3px 4px #fff2d5;transform:rotate(12deg)}.sticker-heart{bottom:25%;left:13%;width:9vw;height:9vw;max-width:160px;max-height:160px;background:#d7ea8b;color:#a12665;font-size:5vw;border-radius:50%;box-shadow:3px 4px 0 #852458;transform:rotate(-12deg);animation-delay:-4s}
.candy-hello{font-family:Lilita,serif;font-size:clamp(19px,3vw,42px);letter-spacing:-.03em;transform:rotate(-8deg)}.candy-dot{position:absolute;border-radius:50%;width:1vw;height:1vw;background:#a12665}.candy .d1{left:18%;top:32%}.candy .d2{right:22%;bottom:23%;width:.55vw;height:.55vw}.candy .scene-footer>span:first-child{border-bottom:1px solid currentColor;padding-bottom:4px}
.electric{background:#ff398b;color:#411c59}.electric .name-wrap{transform:rotate(-6deg) translateY(-.5vh)}.electric .wordmark{font-family:Barlow,Impact,sans-serif;font-stretch:condensed;font-weight:800;font-size:min(21.5vw,33vh);line-height:.74;letter-spacing:-.025em;position:relative}.electric .wordmark>span:first-child{padding-right:.44em}.electric .wordmark>span:last-child{margin-left:.42em;position:relative}
.electric .electric-spark{position:absolute;right:-.5em;bottom:.03em;font-size:.52em;color:#e4ff73;line-height:1;animation:rose-turn 30s linear infinite;text-shadow:none}.electric-disc{position:absolute;width:42vw;height:42vw;background:#ff75b133;border:1px solid #411c5924;border-radius:50%;left:-21vw;top:-4vw}.electric-stripes{position:absolute;right:-16%;bottom:-21%;width:55vw;height:32vw;transform:rotate(-24deg);background:repeating-linear-gradient(90deg,transparent 0 16px,#b8187826 16px 17px);border-radius:50%}
.electric-monogram{font-family:Barlow,sans-serif;font-weight:800;font-size:clamp(24px,4vw,55px);line-height:.7;letter-spacing:-.06em;font-style:italic}.electric-monogram>span{font-family:Manrope,sans-serif;font-size:.23em;vertical-align:top;margin-left:.3em}.electric-pill{display:flex;align-items:center;gap:3vw;border:1px solid #411c5980;border-radius:99px;padding:1em 1.5em;letter-spacing:.08em}.electric-pill span{font-size:1.5em;line-height:.5}.electric .scene-header>span:last-child{letter-spacing:.11em}
.velvet{background:#211026;color:#fbd2e7}.velvet-light{position:absolute;inset:-15%;background:radial-gradient(ellipse at 74% 45%,#7624527a,transparent 48%),radial-gradient(ellipse at 20% 90%,#47154780,transparent 60%)}
.velvet .name-wrap{transform:translate(-3vw,2vh) rotate(-5deg)}.velvet .wordmark{font-family:Pinyon,cursive;font-size:min(20vw,31vh);font-weight:400;line-height:.7;letter-spacing:-.03em;text-shadow:0 0 18px #ff90d022,0 0 50px #ff5aa233}.velvet .wordmark>span:first-child{padding-right:.5em}.velvet .wordmark>span:last-child{margin-left:1.18em}.velvet .scene-header{color:#d499bf}.velvet .scene-footer{color:#d6a8c7}.velvet .scene-footer>span:first-child{font-size:clamp(6px,.68vw,10px)}.velvet-star{font-size:clamp(27px,3.5vw,52px);line-height:.6}.velvet .g1{top:26%;right:24%;font-size:2vw}.velvet .g2{bottom:27%;left:17%;font-size:1vw;animation-delay:-3s}
.bloom{position:absolute;width:42vw;height:42vw;right:2vw;top:50%;transform:translateY(-50%);animation:bloom-turn 70s linear infinite;opacity:.65}.bloom i{position:absolute;width:38%;height:76%;left:31%;top:12%;border-radius:50%;transform:rotate(calc(var(--i)*22.5deg));border:1px solid #ff80bd4d;background:radial-gradient(ellipse,transparent 48%,#fba4e008 70%,#ff57960c 90%);box-shadow:inset 2px 0 14px #ff83a51a,2px 0 20px #ff579611}
.standalone-controls{position:fixed;z-index:10;left:50%;bottom:13px;transform:translateX(-50%);display:flex;gap:15px;border:1px solid #ffffff30;border-radius:99px;background:#201021d9;backdrop-filter:blur(12px);padding:10px 17px;white-space:nowrap}.standalone-controls a,.standalone-controls button{font:11px Manrope,sans-serif;color:#ffdcf0;text-decoration:none;border:0;background:none;padding:0;cursor:pointer}.standalone-controls button{border-left:1px solid #ffffff40;padding-left:15px}.standalone-controls a:hover,.standalone-controls button:hover{color:white}
.paused *,.paused *::before,.paused *::after{animation-play-state:paused!important}
@keyframes shimmer{0%,100%{opacity:.4;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}
@keyframes glow{0%,100%{box-shadow:0 0 12px #ff7bc4,0 0 35px #ff4798}50%{box-shadow:0 0 18px #ff9ac4,0 0 55px #ff4798}}
@keyframes drift{from{transform:translate(-2%,0) scale(.95)}to{transform:translate(3%,-3%) scale(1.1)}}
@keyframes rose-turn{to{transform:rotate(360deg)}}@keyframes bloom-turn{to{transform:translateY(-50%) rotate(360deg)}}
@keyframes wobble{0%,100%{rotate:-5deg;translate:0 0}50%{rotate:5deg;translate:0 -6px}}
@media(max-aspect-ratio:3/4){.scene-header,.scene-footer{left:7%;right:7%;font-size:8px}.scene-header{top:6%}.scene-footer{bottom:7%}.scene-header>span:last-child{max-width:54%;text-align:right;line-height:1.6}.scene-footer>span:first-child{max-width:44%;line-height:1.6}.scene-footer>span:last-child{font-size:10px}.afterglow .wordmark{font-size:19.3vw;line-height:1}.afterglow .wordmark>span:first-child{padding-right:.2em}.afterglow .wordmark>span:last-child{margin-left:.24em}.afterglow .halo{width:145vw;height:84vw;transform:rotate(-58deg)}.afterglow .g1{top:29%;right:17%;font-size:6vw}.afterglow .g2{left:20%;bottom:29%;font-size:4vw}.tiny-mark{font-size:33px}.rose .wordmark{font-size:25vw;line-height:.86}.rose .wordmark>span:first-child{padding-right:0}.rose .wordmark>span:last-child{margin-left:.45em}.rose .name-wrap{transform:translate(-2vw,-1vh)}.rose .hand-note{bottom:-35%;left:6%;font-size:25px}.rose-orbit{top:20%;right:18%;width:29vw;height:29vw}.rose-symbol{font-size:40px}.candy .wordmark{font-size:21vw;line-height:.9}.candy .wordmark>span:first-child{padding-right:.18em}.candy .wordmark>span:last-child{margin-left:.18em}.sticker-star{top:22%;right:14%;font-size:22vw}.sticker-heart{bottom:23%;left:14%;width:17vw;height:17vw;font-size:10vw}.candy-hello{font-size:30px}.shape-a{width:100vw;height:100vw;left:-65%;bottom:-5%}.shape-b{width:95vw;height:95vw;right:-70%;top:0%}.electric .wordmark{font-size:29vw;line-height:.87}.electric .wordmark>span:first-child{padding-right:.2em}.electric .wordmark>span:last-child{margin-left:.1em}.electric .electric-spark{right:-.1em;bottom:-.7em;font-size:.45em}.electric-monogram{font-size:42px}.electric-stripes{width:140vw;height:90vw;bottom:-5%;right:-70%}.electric-pill{padding:1em 1.2em;gap:3vw}.velvet .wordmark{font-size:29vw;line-height:.82}.velvet .wordmark>span:first-child{padding-right:0}.velvet .wordmark>span:last-child{margin-left:.35em}.velvet .name-wrap{transform:translate(-3vw,1vh) rotate(-7deg)}.bloom{width:110vw;height:110vw;right:-40vw;top:47%}.velvet .g1{right:22%;top:27%;font-size:5vw}.velvet .g2{left:19%;bottom:31%;font-size:3vw}.velvet-star{font-size:38px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
