:root{--blue:#00AFF0}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:#1b120d;color:#fff;
  display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;overflow:hidden;position:relative}
.bg{position:fixed;inset:-60px;width:calc(100% + 120px);height:calc(100% + 120px);object-fit:cover;filter:blur(40px) brightness(.7);z-index:0}
body.plain{background:linear-gradient(160deg,#0b5f80,#00AFF0)}
.card{position:relative;z-index:1;width:min(100%,420px);height:min(100dvh,720px);border-radius:28px;overflow:hidden;background:var(--blue);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.45)}
@media (max-width:440px){.card{border-radius:0;height:100dvh}}
.photo{flex:1 1 0;min-height:0;position:relative;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.fade{position:absolute;left:0;right:0;bottom:-1px;height:calc(45% + 1px);background:linear-gradient(to bottom,transparent,var(--blue) 92%)}
.nameblock{position:absolute;left:0;right:0;bottom:6px;text-align:center}
.name{margin:0;text-align:center;font-family:Cinzel,"Trajan Pro",Georgia,serif;font-variant:small-caps;font-weight:700;font-size:30px;letter-spacing:.02em}
.name svg{width:18px;height:18px;vertical-align:middle;margin-left:6px}
.panel{flex:0 0 auto;min-height:250px;padding:18px 24px 22px;display:flex;flex-direction:column;align-items:center;gap:12px}
.cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:17px 16px;border:0;border-radius:12px;background:#fff;color:var(--blue);font-weight:600;font-size:17px;line-height:1.2;font-family:inherit;cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent}
.cta svg{width:22px;height:22px;flex:none}
.cta .ico{width:24px;height:24px;object-fit:contain;flex:none;border-radius:4px}
.agb{margin-top:auto;font-size:13px;color:#fff;opacity:.9;text-decoration:none}
.gate .panel{flex:1;justify-content:center;text-align:center;gap:18px}
.gate h1{margin:0;font-size:26px}
.gate p{margin:0;opacity:.95}
.gate form{width:100%}
.gate .agb{margin-top:8px}
.card:not(.gate) .agb{margin-top:auto;padding-top:6px}
.tagline{margin:2px 18px 10px;font-size:14px;opacity:.92}
.cta{box-sizing:border-box}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
.anim-pulse{animation:pulse 1.8s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.anim-pulse{animation:none}}
.socials{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:-2px 0 2px}
.soc{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(255,255,255,.28);text-decoration:none;flex:none;overflow:hidden;-webkit-tap-highlight-color:transparent}
.soc svg{width:24px;height:24px}
.soc img{width:100%;height:100%;object-fit:cover;display:block}
.soc-instagram{background:linear-gradient(45deg,#f9ce34,#ee2a7b 55%,#6228d7)}
.soc-telegram{background:#29A9EB}
.soc-x,.soc-tiktok{background:#111}
.soc-youtube{background:#F00}
.soc-facebook{background:#1877F2}
.soc-mail{background:#6B7280}
.soc-custom{background:#fff}
/* Sternenhimmel (ein/aus im Dashboard) */
.card.stars::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.8;animation:twinkle 5s ease-in-out infinite alternate;
  background-image:radial-gradient(1.4px 1.4px at 8% 12%,#fff 55%,transparent 60%),radial-gradient(1px 1px at 22% 38%,#fff 55%,transparent 60%),
  radial-gradient(1.6px 1.6px at 36% 8%,#fff 55%,transparent 60%),radial-gradient(1px 1px at 48% 52%,#fff 55%,transparent 60%),
  radial-gradient(1.4px 1.4px at 61% 22%,#fff 55%,transparent 60%),radial-gradient(1px 1px at 74% 64%,#fff 55%,transparent 60%),
  radial-gradient(1.6px 1.6px at 86% 14%,#fff 55%,transparent 60%),radial-gradient(1px 1px at 93% 46%,#fff 55%,transparent 60%),
  radial-gradient(1.2px 1.2px at 14% 78%,#fff 55%,transparent 60%),radial-gradient(1.4px 1.4px at 41% 88%,#fff 55%,transparent 60%),
  radial-gradient(1px 1px at 68% 90%,#fff 55%,transparent 60%),radial-gradient(1.2px 1.2px at 90% 82%,#fff 55%,transparent 60%)}
@keyframes twinkle{from{opacity:.35}to{opacity:.9}}
@media (prefers-reduced-motion:reduce){.card.stars::after{animation:none}}
.soc-onlyfans{background:#00AFF0}
/* Thumbnail links neben dem Text */
.cta.has-thumb{justify-content:flex-start;padding:8px 16px 8px 8px;min-height:64px;position:relative}
.cta .thumb{width:48px;height:48px;object-fit:cover;border-radius:10px;flex:none}
.cta.has-thumb .lbl{flex:1;text-align:center;padding-right:40px}
/* Animationen (Hauptbutton und Zusatzbuttons) */
.cta{position:relative;overflow:hidden}
@keyframes bounce{0%,100%{transform:translateY(0)}20%{transform:translateY(-9px)}40%{transform:translateY(0)}55%{transform:translateY(-4px)}70%{transform:translateY(0)}}
@keyframes shake{0%,60%,100%{transform:translateX(0)}10%,30%,50%{transform:translateX(-6px)}20%,40%{transform:translateX(6px)}}
@keyframes wiggle{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(-2.5deg)}85%{transform:rotate(2.5deg)}95%{transform:rotate(-1.5deg)}}
@keyframes glow{0%,100%{box-shadow:0 0 6px var(--glow,#fff)}50%{box-shadow:0 0 22px 4px var(--glow,#fff)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes heartbeat{0%,100%{transform:scale(1)}14%{transform:scale(1.06)}28%{transform:scale(1)}42%{transform:scale(1.06)}70%{transform:scale(1)}}
@keyframes shine{0%{transform:translateX(-120%) skewX(-20deg)}60%,100%{transform:translateX(220%) skewX(-20deg)}}
.anim-bounce{animation:bounce 2.4s ease-in-out infinite}
.anim-shake{animation:shake 2.6s ease-in-out infinite}
.anim-wiggle{animation:wiggle 3s ease-in-out infinite}
.anim-glow{animation:glow 2s ease-in-out infinite}
.anim-float{animation:float 3s ease-in-out infinite}
.anim-heartbeat{animation:heartbeat 1.8s ease-in-out infinite}
.anim-shine::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:shine 3s ease-in-out infinite;pointer-events:none}
@media (prefers-reduced-motion:reduce){.anim-bounce,.anim-shake,.anim-wiggle,.anim-glow,.anim-float,.anim-heartbeat,.anim-pulse{animation:none}.anim-shine::after{animation:none;display:none}}
@keyframes jelly{0%,100%{transform:scale(1,1)}25%{transform:scale(.92,1.08)}50%{transform:scale(1.08,.92)}75%{transform:scale(.97,1.03)}}
@keyframes tada{0%,100%{transform:scale(1) rotate(0)}10%,20%{transform:scale(.96) rotate(-2deg)}30%,50%,70%{transform:scale(1.06) rotate(2deg)}40%,60%{transform:scale(1.06) rotate(-2deg)}80%{transform:scale(1) rotate(0)}}
@keyframes swing{0%,100%{transform:rotate(0)}20%{transform:rotate(4deg)}40%{transform:rotate(-3deg)}60%{transform:rotate(2deg)}80%{transform:rotate(-1deg)}}
@keyframes flash{0%,50%,100%{opacity:1}25%,75%{opacity:.4}}
@keyframes ring{0%{box-shadow:0 0 0 0 var(--glow,#fff)}70%,100%{box-shadow:0 0 0 14px transparent}}
.anim-jelly{animation:jelly 2.2s ease-in-out infinite}
.anim-tada{animation:tada 2.6s ease-in-out infinite}
.anim-swing{animation:swing 2.8s ease-in-out infinite;transform-origin:top center}
.anim-flash{animation:flash 1.6s ease-in-out infinite}
.anim-ring{animation:ring 1.8s ease-out infinite}
@media (prefers-reduced-motion:reduce){.anim-jelly,.anim-tada,.anim-swing,.anim-flash,.anim-ring{animation:none}}
.cta .emo-ico{font-size:1.25em;line-height:1;flex:none;padding:0}
.cta.has-thumb .emo-ico{padding-right:0}
.soc-snapchat{background:#FFFC00;color:#000}
/* Nahtstelle zwischen Foto und blauer Fläche: Fläche überlappt 1 px, damit keine helle Linie durchscheint */
.panel{position:relative;z-index:1;background:var(--blue);margin-top:-1px}