@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
.landing,.public-page{margin:0;background:#160f1d;color:#f7efff;font:15px 'DM Sans',sans-serif;min-height:100vh}.landing *,.public-page *{box-sizing:border-box}.landing a,.public-page a{color:inherit;text-decoration:none}.landing button,.public-page button{font:inherit;cursor:pointer;color:inherit}.landing{background:radial-gradient(ellipse at 75% 30%,#56306988,transparent 48%),radial-gradient(ellipse at 15% 10%,#53243788,transparent 45%),#0c0911}.landing-nav{max-width:1180px;margin:26px auto;display:flex;align-items:center;gap:30px;padding:18px 25px;border:1px solid #e6b7ff22;border-radius:60px;background:#100b17bb}.public-brand{font:700 24px 'Space Grotesk',sans-serif;letter-spacing:2px;margin-right:auto}.public-brand small{font:9px 'DM Sans';display:block;letter-spacing:5px;margin:4px 0 0 27px;color:#c4a9d3}.public-cta{background:linear-gradient(120deg,#b267ef,#d6529d);border:1px solid #e3a1ff66;border-radius:12px;padding:15px 22px;color:white;font-weight:700;white-space:nowrap}.public-cta:hover{box-shadow:0 0 28px #ba5ff866}.landing-hero{max-width:1180px;margin:100px auto 120px;display:grid;grid-template-columns:1.15fr 1fr;gap:100px;align-items:center;padding:0 25px}.public-kicker{color:#d5abe5;font-size:10px;letter-spacing:2px}.landing h1{font:700 clamp(42px,5.6vw,78px)/1.05 'Space Grotesk';letter-spacing:-3px;margin:25px 0}.landing h1 em{font-style:normal;background:linear-gradient(100deg,#c6a1ff,#f2a6ce);background-clip:text;color:transparent}.landing-hero>section>p{color:#c2afcb;line-height:1.9;font-size:17px;margin:28px 0}.landing form label{display:block;font-size:12px;color:#cfaddd;margin-bottom:10px}.claim-field{display:flex;gap:8px;align-items:center;padding:8px;border:1px solid #a16bbb55;border-radius:16px;background:#20142b88;flex-wrap:wrap}.claim-field span{font-size:10px;color:#a790b7}.claim-field input{background:transparent;border:0;color:white;min-width:100px;flex:1;width:120px;padding:10px;font:inherit}.hero-notes{display:flex;gap:18px;font-size:10px;color:#b2a3bd;margin-top:20px}.landing-features{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;max-width:1180px;margin:0 auto;padding:25px}.landing-features article{padding:28px;border:1px solid #9965b333;border-radius:20px;background:#291a353d}.landing-features span{font-size:10px;letter-spacing:2px;color:#d7a7ef}.landing-features p{line-height:1.8;color:#b6a1c3}.landing-footer{max-width:1180px;margin:60px auto 0;padding:35px 25px;border-top:1px solid #9979af33;display:flex;justify-content:space-between;font-size:12px;color:#b49ac4}
.stacked-profile{position:relative;border:1px solid #ba7fe677;border-radius:35px;background:#160f20ed;box-shadow:0 22px 85px #ad57dc22;isolation:isolate;max-width:620px;width:100%;color:#f9f2ff;text-align:left}.stacked-profile:before,.stacked-profile:after{content:'';position:absolute;inset:16px -10px -17px;border:1px solid #c186ed3b;border-radius:inherit;background:#68378033;transform:rotate(-3deg);z-index:-1;pointer-events:none}.stacked-profile:after{inset:30px -16px -30px;transform:rotate(-6deg);background:#8355b42b;z-index:-2}.profile-cover{height:145px;background:repeating-linear-gradient(0deg,#ffffff07 0 1px,transparent 1px 4px),linear-gradient(140deg,#ad5aef,#db459b 60%,#6c45ac);border-radius:34px 34px 0 0;mask-image:linear-gradient(#000 55%,transparent)}.public-card-body{position:relative;padding:0 32px 30px;margin-top:-55px}.public-avatar{width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,#ad5aef,#de469a);border:6px solid #160f20;display:grid;place-items:center;font-size:40px;margin-bottom:24px;overflow:hidden}.public-avatar img{width:100%;height:100%;object-fit:cover}.demo-creature{position:absolute;right:35px;top:35px;font-size:50px;color:#55dfff;filter:drop-shadow(0 0 15px #3489ff);animation:pet-bob 4s ease-in-out infinite}.public-card-body h2,.public-display{font:700 28px 'Space Grotesk',sans-serif;margin:10px 0;display:inline-block;max-width:100%;overflow-wrap:anywhere}.premium-label{font-size:11px;font-weight:400;color:#e0b5ff;border:1px solid #b57cdf66;background:#8f48be22;padding:5px 9px;border-radius:7px;display:inline-block;margin-left:9px;vertical-align:middle}.public-handle{color:#a78eb9;font-size:14px;margin-bottom:25px}.public-bio{line-height:1.8;color:#d0bddb;white-space:pre-wrap;overflow-wrap:anywhere}.public-link{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid #bb85dc33;background:linear-gradient(100deg,#723f8e33,#bf427b18);border-radius:13px;padding:16px 19px;margin:12px 0;transition:transform .2s,box-shadow .2s}.public-link:hover{transform:translateY(-3px);box-shadow:0 0 22px #ba65de33}.public-link span{color:#bc95d0}.public-meta{font-size:11px;color:#bba1cf;margin-top:25px;display:flex;gap:15px}.public-spectrum{height:45px;display:flex;align-items:center;gap:4px;flex:1}.public-spectrum i{display:block;width:8px;height:var(--h);border-radius:7px;background:linear-gradient(#e884be,#9737e6);transform-origin:center}.landing .public-spectrum i,.music-playing .public-spectrum i{animation:spectrum-pulse 1.1s calc(var(--n)*-.17s) ease-in-out infinite alternate}.public-background,.profile-bg-media,.public-shade{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}.public-background{background:radial-gradient(ellipse at 25% 20%,#45223f,transparent 65%),#130e1c}.background-rose{background:radial-gradient(ellipse at 75% 30%,#a3477c,transparent 60%),#210e27}.background-ocean{background:radial-gradient(ellipse at 30% 80%,#298ba1,transparent 60%),#0b1a39}.background-forest{background:radial-gradient(ellipse at 60% 20%,#39745d,transparent 60%),#0d241f}.background-sunset{background:linear-gradient(160deg,#301a44,#b45e71 55%,#e7aa75)}.background-stars{background:radial-gradient(#e9cfff 1px,transparent 2px) 0 0/37px 37px,radial-gradient(ellipse at 50% 50%,#543780,transparent 70%),#0e112b;animation:stars-drift 50s linear infinite}.public-shade{background:#08051045;backdrop-filter:blur(2px);z-index:-1;pointer-events:none}.public-stage{padding:65px 25px 100px;max-width:670px;margin:auto}.public-stage[hidden],.public-player[hidden]{display:none}.entry-gate{position:fixed;inset:0;display:grid;place-items:center;backdrop-filter:blur(12px);background:#0d081252}.entry-gate button{background:#281731b3;border:1px solid #e6bbff55;box-shadow:0 0 80px #a349c22b;border-radius:24px;padding:45px 60px;text-align:center;max-width:90vw;font-size:22px}.entry-gate span{display:block;font-size:42px;color:#d9a0ff;margin-bottom:15px}.entry-gate small{display:block;font-size:11px;color:#bda3cc;margin-top:17px}.public-watermark{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);font-size:10px;background:#150d20b8;border:1px solid #ddb2ff33;border-radius:30px;padding:10px 18px;color:#d7bedf}.public-player{display:flex;align-items:center;gap:14px;padding:12px 18px;margin:40px 0 10px;background:#1d122caa;border:1px solid #b180da44;border-radius:18px;flex-wrap:wrap}.public-player button,.video-toggle{background:#66407866;border:1px solid #cb8cf855;border-radius:50%;width:38px;height:38px}.public-player label{font-size:10px;color:#bca1ca}.public-player input{width:75px;display:block;accent-color:#ca8aef}.public-player #musicStatus{font-size:11px;width:100%}.video-toggle{position:fixed;right:25px;top:25px}.public-stage iframe{width:100%;height:100px;border:0;border-radius:12px}.public-badge-row{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.public-badge{width:65px;height:65px;position:relative;border:1px solid var(--badge-color);border-radius:13px;background:#21192d;filter:drop-shadow(0 0 9px color-mix(in srgb,var(--badge-color) 30%,transparent));animation:pet-bob 4s ease-in-out infinite}.public-badge>div{width:100%;height:100%;display:grid;place-items:center}.public-badge img,.public-badge svg{width:95%!important;height:95%!important;object-fit:contain}.badge-tooltip{display:none;position:absolute;bottom:110%;left:0;min-width:210px;max-width:280px;background:#1b1028;border:1px solid var(--badge-color);padding:12px;border-radius:10px;font-size:11px;line-height:1.7;z-index:4}.public-badge:hover .badge-tooltip,.public-badge:focus .badge-tooltip{display:block}.effect-neon{text-shadow:0 0 8px #d68cff,0 0 22px #b44fee}.effect-gradient{background:linear-gradient(100deg,#a2dfff,#e8b5ff,#ffb0cf,#a2dfff);background-size:220%;background-clip:text;color:transparent;animation:name-flow 4s linear infinite}.effect-glitch{animation:name-glitch 2.7s steps(1) infinite}.effect-typewriter{animation:name-reveal 4s steps(20) infinite;clip-path:inset(0 0 0 0)}.effect-wave{animation:name-wave 2.4s ease-in-out infinite}.effect-sparkle{color:#ffe5a3;text-shadow:0 0 16px #efbe50;animation:name-sparkle 2s ease-in-out infinite}.effect-font-cycle{animation:name-fonts 6s steps(1) infinite}.bio-typewriter{animation:name-reveal 7s steps(65) infinite}.profile-editor-preview .stacked-profile{max-width:450px;margin:auto}.profile-editor-preview .public-card-body{padding:0 22px 25px}.profile-editor-preview .public-display{font-size:24px}@keyframes name-flow{to{background-position:220%}}@keyframes name-glitch{0%,92%,100%{text-shadow:none;transform:translateX(0)}94%{text-shadow:-3px 0 #ff56be,3px 0 #5ffff1;transform:translateX(2px)}97%{transform:translateX(-2px)}}@keyframes name-reveal{0%{clip-path:inset(0 100% 0 0)}45%,90%{clip-path:inset(0 0 0 0)}}@keyframes name-wave{50%{transform:translateY(-5px) rotate(-2deg)}}@keyframes name-sparkle{50%{filter:brightness(1.5);text-shadow:0 0 26px #ffd676}}@keyframes name-fonts{0%,100%{font-family:'Space Grotesk',sans-serif}33%{font-family:Georgia,serif}66%{font-family:monospace}}@keyframes pet-bob{50%{transform:translateY(-5px)}}@keyframes spectrum-pulse{to{transform:scaleY(.35)}}@keyframes stars-drift{to{background-position:120px 240px,0 0}}@media(max-width:850px){.landing-hero{grid-template-columns:1fr;gap:75px;margin:65px auto}.landing-hero .stacked-profile{max-width:450px;margin:auto}.landing-nav{margin:15px;gap:15px}.landing-nav>a:nth-child(2){display:none}.landing-features{grid-template-columns:1fr}.landing h1{letter-spacing:-2px}.claim-field span{display:none}.public-brand{font-size:18px}.landing-nav .public-cta{padding:12px;font-size:11px}.hero-notes{flex-wrap:wrap}.public-card-body{padding:0 22px 25px}.public-stage{padding:45px 20px 100px}.public-card-body h1{font-size:25px}}@media(prefers-reduced-motion:reduce){.public-page *,.landing *,.profile-editor-preview *{animation:none!important;transition:none!important}}

.public-background.background-midnight,.profile-editor-preview.background-midnight,.background-choices .background-midnight{background-image:url("assets/backgrounds/midnight.svg");background-size:cover;background-position:center}
.public-background.background-rose,.profile-editor-preview.background-rose,.background-choices .background-rose{background-image:url("assets/backgrounds/rose.svg");background-size:cover;background-position:center}
.public-background.background-ocean,.profile-editor-preview.background-ocean,.background-choices .background-ocean{background-image:url("assets/backgrounds/ocean.svg");background-size:cover;background-position:center}
.public-background.background-forest,.profile-editor-preview.background-forest,.background-choices .background-forest{background-image:url("assets/backgrounds/forest.svg");background-size:cover;background-position:center}
.public-background.background-sunset,.profile-editor-preview.background-sunset,.background-choices .background-sunset{background-image:url("assets/backgrounds/sunset.svg");background-size:cover;background-position:center}
.public-background.background-stars,.profile-editor-preview.background-stars,.background-choices .background-stars{background-image:url("assets/backgrounds/stars.svg");background-size:cover;background-position:center}

.public-avatar{position:relative}.public-avatar img{position:absolute;inset:0}.public-avatar img[hidden]{display:none}

.background-choices button[aria-pressed=true]{outline:2px solid var(--lime,#dda6fa);outline-offset:2px}

/* Earned rank effects also follow the public profile. */
.rank-name{display:inline-block;position:relative;white-space:normal;overflow-wrap:anywhere}.rank-effect-1{color:#71f9ca;text-shadow:0 0 10px #52e9b58c;animation:rank-pulse 3s ease-in-out infinite}.rank-effect-2{color:#a9edff;font-family:Georgia,serif;letter-spacing:.6px;text-shadow:1px 1px #255b91,-1px -1px #efffff55;animation:rank-frost 5s ease-in-out infinite}.rank-effect-3{color:#d0acff;font-style:italic;text-shadow:0 0 15px #9c65ee;animation:rank-float 4s ease-in-out infinite}.rank-effect-4{color:#ff9cce;font-weight:700;text-shadow:2px 0 #a52f7666,-2px 0 #d960aa55;animation:rank-rose 3.5s ease-in-out infinite}.rank-effect-5{color:#ffc48b;font-family:Georgia,serif;letter-spacing:1px;text-shadow:0 0 16px #ff762d99;animation:rank-solar 3s ease-in-out infinite}.rank-effect-6{font-family:monospace;font-weight:700;background:linear-gradient(90deg,#8decff,#c99bff,#8decff);background-size:200% auto;color:transparent;background-clip:text;-webkit-background-clip:text;animation:rank-gradient 4s linear infinite}.rank-effect-7{color:#ff9972;font-family:Impact,'Arial Narrow',sans-serif;letter-spacing:1px;text-shadow:0 -2px 12px #ff551f;animation:rank-ember 2s ease-in-out infinite}.rank-effect-8{color:#e7ceff;font-family:Georgia,serif;letter-spacing:2px;text-shadow:0 0 8px #d37fff,0 0 24px #8e48eccc;animation:rank-astral 5s ease-in-out infinite}.rank-effect-9{color:#9afff5;font-family:monospace;font-weight:800;text-shadow:2px 0 #b66cff,-2px 0 #287fff;animation:rank-quantum 4s steps(1) infinite}.rank-effect-10{font-family:Georgia,serif;font-weight:800;letter-spacing:.5px;background:linear-gradient(110deg,#c89126 0%,#ffe78b 25%,#fffce0 45%,#f7c54f 58%,#ffecad 75%,#c89126 100%);background-size:220% 100%;color:transparent;background-clip:text;-webkit-background-clip:text;filter:drop-shadow(0 0 9px #fbc44e99);animation:rank-gradient 3s linear infinite}.rank-effect-10:after{content:'✦';position:absolute;right:-13px;top:-6px;font-size:10px;color:#ffe89b;-webkit-text-fill-color:#ffe89b;animation:rank-sparkle 1.8s ease-in-out infinite}@keyframes rank-gradient{to{background-position:220% center}}@keyframes rank-sparkle{0%,100%{opacity:.3;scale:.6}50%{opacity:1;scale:1.3}}

/* Background media fills the viewport while preserving its native aspect ratio. */
html:has(body.public-page){min-height:100%;overflow-x:hidden}
body.public-page{min-height:100svh;overflow-x:hidden}
body.public-page #publicProfile{min-height:100svh;isolation:isolate}
body.public-page #publicProfile>.profile-bg-media{position:fixed!important;inset:0!important;display:block!important;width:100vw!important;height:100vh!important;height:100dvh!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;object-fit:cover!important;object-position:center center!important;aspect-ratio:auto!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;transform:none!important;filter:none!important;pointer-events:none;z-index:-2!important}
body.public-page #publicProfile>:is(.public-background,.profile-custom-background,.public-shade){position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;max-width:none!important;max-height:none!important;margin:0!important;transform:none!important}
body.public-page #publicProfile>.public-shade{z-index:-1!important;pointer-events:none}
#studioPreview .preview-page-background{position:absolute!important;inset:0!important;overflow:hidden!important;transform:none!important}
#studioPreview .preview-page-background>.profile-bg-media{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;min-width:0!important;min-height:0!important;object-fit:cover!important;object-position:center!important;transform:none!important;filter:none!important;border-radius:0!important}
.welcome-tint {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(
    125deg,
    rgba(225, 40, 130, .55),
    rgba(100, 35, 180, .55),
    rgba(20, 110, 210, .55)
  );
  background-size: 300% 300%;
  animation: welcomeTint 18s ease infinite;
}

@keyframes welcomeTint {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .welcome-tint { animation: none; }
}

.landing .landing-features > article,
.landing .landing-hero > .stacked-profile {
  background: rgba(15, 10, 24, 0.95) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
  transition: transform 180ms ease-out,
              box-shadow 180ms ease-out !important;
}

@media (hover: hover) and (pointer: fine) {
  .landing .landing-features > article:hover,
  .landing .landing-hero > .stacked-profile:hover {
    transform: perspective(1000px)
               rotateX(2deg) rotateY(-3deg)
               translateY(-3px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing .landing-features > article,
  .landing .landing-hero > .stacked-profile {
    transform: none !important;
    transition: none !important;
  }
}