:root {
  color-scheme: dark;
  --ink: #090609;
  --wine: #24141e;
  --cherry: #ff235c;
  --pink: #ff4b84;
  --white: #fff;
  --muted: #b7a9b0;
  --line: rgba(255, 255, 255, .09);
  font-family: "DM Sans", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

* { box-sizing: border-box; }
html { min-width: 320px; min-height: 100%; background: var(--ink); }
body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  color: var(--white);
  background:
    radial-gradient(ellipse 54% 34% at 50% 23%, rgba(94, 20, 46, .24), transparent 74%),
    radial-gradient(ellipse 45% 44% at 4% 92%, rgba(63, 18, 40, .15), transparent 70%),
    linear-gradient(155deg, #0b080b 0%, #090609 56%, #10090e 100%);
}
body::before {
  position: fixed;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
  z-index: 0;
}
button, a { font: inherit; }
a { color: inherit; }
.page-shell {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(100% - 40px, 440px);
  min-height: 100svh;
  margin-inline: auto;
  padding: max(46px, env(safe-area-inset-top)) 0 max(28px, env(safe-area-inset-bottom));
  flex-direction: column;
  justify-content: center;
}
.profile { display: flex; align-items: center; flex-direction: column; text-align: center; animation: rise-in .7s cubic-bezier(.2,.75,.25,1) both; }
.brand-mark { display: flex; align-items: center; flex-direction: column; margin: -7px 0 4px; filter: drop-shadow(0 10px 25px rgba(255,35,92,.1)); }
.cherry-art { display: block; width: 150px; height: 140px; overflow: visible; animation: bob 5.6s ease-in-out infinite; transform-origin: 50% 58%; }
.brand-word { margin-top: -9px; font: 800 40px/.95 Manrope, sans-serif; letter-spacing: -3px; color: #fff1f4; text-shadow: 0 0 28px rgba(255,75,132,.2); }
.brand-word span { display: inline-block; margin-left: 3px; color: #c6aeb7; font: 500 9px/1 "DM Sans", sans-serif; letter-spacing: 0; vertical-align: top; }
.profile-portrait { position: relative; width: 116px; height: 131px; margin: 13px 0 0; padding: 4px; overflow: hidden; border: 1px solid rgba(255,147,174,.54); border-radius: 48% 48% 43% 43%; background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,35,92,.22)); box-shadow: 0 12px 30px rgba(0,0,0,.32), 0 0 28px rgba(255,35,92,.17); }
.profile-portrait img { display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; object-position: center 43%; }
.profile-copy { margin-top: 20px; }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 13px; color: #f398ae; font-size: 9px; font-weight: 700; letter-spacing: 2px; }
.eyebrow-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--pink); box-shadow: 0 0 10px var(--pink); }
h1 { margin: 0; font: 700 clamp(31px, 8vw, 37px)/1.1 Manrope, sans-serif; letter-spacing: -1.8px; }
h1 span { color: var(--pink); }
.tagline { margin: 11px 0 0; color: #e9dce1; font: 500 15px/1.4 Manrope, sans-serif; }
.tagline span { display: inline-block; margin-left: 2px; font-size: 14px; }
.intro { max-width: 320px; margin: 8px auto 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.links { display: grid; gap: 13px; margin-top: 32px; animation: rise-in .8s .12s cubic-bezier(.2,.75,.25,1) both; }
.link-card {
  position: relative;
  display: flex;
  min-height: 76px;
  align-items: center;
  gap: 14px;
  overflow: hidden;
  padding: 15px 17px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 18px;
  background: linear-gradient(130deg, rgba(36,20,30,.94), rgba(19,13,18,.96));
  text-decoration: none;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
  -webkit-tap-highlight-color: transparent;
}
.link-card:hover { transform: translateY(-2px) scale(1.012); border-color: rgba(255,117,153,.4); box-shadow: 0 10px 30px rgba(0,0,0,.25), 0 0 22px rgba(255,75,132,.08); }
.link-card:active { transform: scale(.985); }
.link-card:focus-visible, button:focus-visible { outline: 2px solid #ff91ae; outline-offset: 4px; }
.link-icon { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; border-radius: 13px; }
.instagram-icon { border: 1px solid rgba(255,255,255,.1); background: linear-gradient(145deg, #30202b, #211722); }
.instagram-icon svg { width: 21px; fill: none; stroke: #ff9eb7; stroke-width: 1.7; }
.instagram-icon .icon-dot { fill: #ff9eb7; stroke: none; }
.cherry-icon { background: rgba(255,255,255,.13); font-size: 20px; }
.link-text { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; text-align: left; }
.link-text strong { font: 700 14px/1.2 Manrope, sans-serif; letter-spacing: -.15px; }
.link-text small { color: rgba(255,255,255,.68); font-size: 11.5px; line-height: 1.35; }
.arrow { position: relative; z-index: 1; margin-left: auto; color: #e1bac5; font-size: 19px; transition: transform .2s ease; }
.link-card:hover .arrow { transform: translate(2px,-2px); }
.vip { border: 1px solid rgba(255,108,143,.57); background: linear-gradient(115deg, #ff235c, #d80e4b 68%, #b10c40); box-shadow: 0 8px 28px rgba(255,35,92,.18), inset 0 1px rgba(255,255,255,.24); }
.vip::after { position: absolute; inset: 0; pointer-events: none; content: ""; opacity: .16; background: linear-gradient(115deg, transparent 20%, rgba(255,255,255,.5) 48%, transparent 72%); }
.vip:hover { border-color: rgba(255,207,219,.75); background: linear-gradient(115deg, #ff346b, #e91755 68%, #bd1248); box-shadow: 0 11px 33px rgba(255,35,92,.27), 0 0 25px rgba(255,75,132,.2), inset 0 1px rgba(255,255,255,.32); }
.vip .cherry-icon { background: rgba(111,4,38,.24); box-shadow: inset 0 1px rgba(255,255,255,.16); }
.vip .link-text small { color: rgba(255,255,255,.82); }
.vip .arrow { color: white; }
.vip-shine { position: absolute; inset: -40% auto -40% -32%; width: 25%; transform: rotate(20deg); background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent); animation: shine 5s 1.2s ease-in-out infinite; }
.page-footer { margin-top: 24px; text-align: center; animation: rise-in .9s .2s cubic-bezier(.2,.75,.25,1) both; }
.adult-note { display: flex; justify-content: center; align-items: center; gap: 7px; margin: 0; color: #a999a1; font-size: 10px; line-height: 1.5; }
.adult-note span { font-size: 12px; }
.footer-mark { margin: 20px 0 0; color: #75636d; font-size: 8px; font-weight: 600; letter-spacing: 1.55px; }
.footer-mark span { color: #d72d58; }
.footer-mark b { color: #b394a0; font-weight: 700; }
.ambient { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.ambient span { position: absolute; width: 250px; height: 250px; border-radius: 50%; background: rgba(197,21,70,.08); filter: blur(85px); animation: drift 16s ease-in-out infinite alternate; }
.ambient span:nth-child(1) { top: 8%; left: -170px; }
.ambient span:nth-child(2) { right: -170px; bottom: 4%; animation-delay: -7s; }
.ambient span:nth-child(3) { top: 56%; left: 65%; width: 120px; height: 120px; opacity: .45; animation-delay: -3s; }
.particles { position: fixed; inset: 0; pointer-events: none; overflow: hidden; z-index: 0; }
.particle { position: absolute; bottom: -12px; width: 3px; height: 3px; border-radius: 50%; background: #ff4b84; opacity: 0; box-shadow: 0 0 9px 2px rgba(255,35,92,.55); animation: float-up var(--duration) var(--delay) linear infinite; }

.age-gate { position: fixed; inset: 0; z-index: 5; display: grid; place-items: center; padding: 22px; background: rgba(7,5,7,.78); -webkit-backdrop-filter: blur(13px); backdrop-filter: blur(13px); }
.age-gate[hidden] { display: none; }
.age-card { width: min(100%, 390px); padding: 33px 26px 24px; border: 1px solid rgba(255,110,150,.2); border-radius: 24px; background: linear-gradient(145deg, rgba(42,23,34,.98), rgba(19,12,17,.99)); box-shadow: 0 24px 90px rgba(0,0,0,.56), 0 0 50px rgba(255,35,92,.09); text-align: center; animation: modal-in .42s cubic-bezier(.2,.8,.2,1) both; }
.age-symbol { display: grid; width: 54px; height: 54px; margin: 0 auto 20px; place-items: center; border: 1px solid rgba(255,75,132,.38); border-radius: 17px; background: rgba(255,35,92,.11); color: #fff; font: 800 21px Manrope, sans-serif; box-shadow: 0 0 24px rgba(255,35,92,.12); }
.age-symbol span { margin-left: 1px; color: #ff789c; font-size: 12px; }
.age-overline { margin: 0 0 9px; color: #e888a2; font-size: 9px; font-weight: 700; letter-spacing: 1.8px; }
.age-card h2 { margin: 0; font: 700 23px/1.25 Manrope, sans-serif; letter-spacing: -.6px; }
.age-card > p:not(.age-overline):not(.age-legal) { margin: 11px 0 22px; color: #b8a9b0; font-size: 12px; line-height: 1.65; }
.age-actions { display: grid; gap: 10px; }
.age-actions[hidden] { display: none; }
.age-actions button { min-height: 49px; border-radius: 13px; cursor: pointer; font-size: 12px; font-weight: 700; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.age-actions button:active { transform: scale(.98); }
.age-yes { display: flex; justify-content: center; align-items: center; gap: 9px; border: 1px solid rgba(255,180,198,.38); background: linear-gradient(115deg, #ff235c, #d9124c); color: white; box-shadow: 0 7px 22px rgba(255,35,92,.17); }
.age-yes:hover { background: linear-gradient(115deg, #ff3c70, #e91e58); }
.age-yes span { font-size: 17px; }
.age-no { border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.035); color: #c0b2b8; }
.age-no:hover { border-color: rgba(255,255,255,.23); background: rgba(255,255,255,.07); }
.age-legal { margin: 17px 0 0; color: #84747c; font-size: 9px; line-height: 1.55; }
.noscript-note { position: fixed; z-index: 9; right: 12px; bottom: 12px; left: 12px; padding: 12px; border-radius: 8px; background: #24141e; color: #fff; text-align: center; font-size: 12px; }

@keyframes rise-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes modal-in { from { opacity: 0; transform: translateY(9px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes bob { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-6px) rotate(1deg); } }
@keyframes shine { 0%,63% { left: -32%; opacity: 0; } 68% { opacity: .8; } 82%,100% { left: 120%; opacity: 0; } }
@keyframes drift { to { transform: translate(36px,-24px) scale(1.15); } }
@keyframes float-up { 0% { opacity: 0; transform: translateY(0) scale(.7); } 12% { opacity: var(--opacity); } 86% { opacity: calc(var(--opacity) * .65); } 100% { opacity: 0; transform: translateY(-105vh) translateX(var(--drift)) scale(1.2); } }

@media (max-height: 720px) and (min-width: 600px) { .page-shell { padding-top: 28px; padding-bottom: 24px; } .cherry-art { width: 126px; height: 117px; } .profile-portrait { width: 96px; height: 108px; margin-top: 8px; } .profile-copy { margin-top: 10px; } .links { margin-top: 20px; } .link-card { min-height: 68px; } .page-footer { margin-top: 17px; } }
@media (max-width: 380px) { .page-shell { width: min(100% - 32px, 440px); } .cherry-art { width: 138px; height: 129px; } .profile-portrait { width: 104px; height: 117px; margin-top: 9px; } .profile-copy { margin-top: 14px; } .links { margin-top: 23px; gap: 11px; } .link-card { min-height: 72px; gap: 12px; padding: 14px; } .link-icon { width: 39px; height: 39px; flex-basis: 39px; } .link-text strong { font-size: 13px; } .link-text small { font-size: 10.5px; } .age-card { padding: 29px 21px 22px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .particles { display: none; }
}
