:root{--ink:#22233a;--deep:#272344;--violet:#7658df;--violet2:#9b7bec;--cyan:#47cce7;--pink:#f25ca7;--green:#63d7a2;--orange:#ff815f;--yellow:#ffd45f;--cream:#fffaf0;--paper:#fffdf9;--muted:#6f6b7e;--line:rgba(69,53,115,.12);--shadow:0 28px 80px rgba(58,43,99,.16)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh;background:linear-gradient(180deg,#fff9ee 0,#f8f3ff 48%,#eefbff 100%)}button,input{font:inherit}.login-page{overflow-x:hidden;background:#221d3e}.hero-bg{position:fixed;inset:0;background:url('/assets/img/zirkus-header.png') center/cover no-repeat;filter:saturate(1.28) brightness(1.12);transform:scale(1.025)}.hero-shade{position:fixed;inset:0;background:linear-gradient(90deg,rgba(34,29,62,.78) 0%,rgba(34,29,62,.48) 43%,rgba(34,29,62,.12) 78%),linear-gradient(180deg,rgba(34,29,62,.06),rgba(34,29,62,.35))}.login-wrap{position:relative;z-index:3;min-height:100svh;display:flex;align-items:flex-end;padding:6vw}.glass-card{backdrop-filter:blur(20px);background:linear-gradient(145deg,rgba(255,253,249,.94),rgba(247,241,255,.9));border:1px solid rgba(255,255,255,.7);box-shadow:0 30px 100px rgba(13,12,35,.36);border-radius:32px}.login-card{width:min(760px,100%);padding:clamp(28px,4vw,54px);animation:rise .8s cubic-bezier(.2,.8,.2,1) both;position:relative;overflow:hidden}.login-card:before{content:"";position:absolute;inset:auto -80px -110px auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,212,95,.5),rgba(255,212,95,0) 70%)}.mini-stars{color:var(--pink);letter-spacing:.45em;font-size:1rem;margin-bottom:12px}.kicker{text-transform:uppercase;letter-spacing:.2em;font-size:.72rem;color:#7b5bd5;margin:0 0 14px;font-weight:800}.login-card h1,.portal-content h1{font-family:Georgia,"Times New Roman",serif;font-weight:700;line-height:.98;letter-spacing:-.035em;margin:0}.login-card h1{font-size:clamp(3rem,7vw,6rem);color:#292345}.lead{font-size:clamp(1.05rem,2vw,1.3rem);max-width:54ch;color:#676276;margin:22px 0 28px}.login-form label,.request-form label{display:block;font-size:.9rem;color:#4d4960;margin-bottom:8px;font-weight:700}.pw-row{display:flex;gap:10px}.pw-row input,.request-form input{width:100%;border:1px solid rgba(82,65,127,.16);background:#fff;color:#29263a;border-radius:16px;padding:15px 16px;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}.pw-row input:focus,.request-form input:focus{border-color:#9b7bec;box-shadow:0 0 0 4px rgba(155,123,236,.14)}button,.request-form button,.paypal-btn{border:0;border-radius:16px;padding:15px 20px;color:white;background:linear-gradient(135deg,#8b69e5,#6650ce);font-weight:800;cursor:pointer;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 12px 28px rgba(102,80,206,.24)}button:hover,.request-form button:hover,.paypal-btn:hover{transform:translateY(-2px);box-shadow:0 17px 34px rgba(102,80,206,.3)}.privacy-note,.small-note{color:#777183;font-size:.88rem;margin-top:18px}.alert{padding:12px 14px;border-radius:14px;margin-bottom:18px}.alert.error{background:#fff0f3;border:1px solid #ffc6d2;color:#a93952}.confetti{position:fixed;z-index:2;width:10px;height:10px;border-radius:3px;box-shadow:80px 30px var(--yellow),180px 90px var(--pink),320px 50px var(--cyan),480px 110px var(--green),620px 45px var(--orange);opacity:.8;animation:floaty 5s ease-in-out infinite}.confetti-a{left:4%;top:8%;transform:rotate(18deg)}.confetti-b{right:8%;top:16%;transform:rotate(-12deg);animation-delay:-2s}.portal-page{background:linear-gradient(180deg,#fff9ef 0,#faf5ff 50%,#effcff 100%)}.portal-hero{position:relative;min-height:55vh;display:flex;align-items:flex-end;overflow:hidden}.portal-hero-bg,.portal-overlay{position:absolute;inset:0}.portal-hero-bg{background:url('/assets/img/zirkus-header.png') center/cover no-repeat;filter:saturate(1.3) brightness(1.08)}.portal-overlay{background:linear-gradient(180deg,rgba(36,30,70,.03),rgba(36,30,70,.72) 95%),linear-gradient(90deg,rgba(36,30,70,.68),rgba(36,30,70,.04))}.portal-content{position:relative;z-index:2;width:min(1180px,calc(100% - 36px));margin:0 auto;padding:0 0 44px;color:white;text-shadow:0 3px 28px rgba(0,0,0,.25)}.portal-content .kicker{color:#ffe7ff}.portal-content h1{font-size:clamp(2.8rem,6vw,5.5rem);max-width:14ch}.portal-content p:last-child{max-width:62ch;color:rgba(255,255,255,.9);font-size:1.08rem}.content-shell{width:min(1180px,calc(100% - 36px));margin:0 auto;padding:30px 0 70px}.welcome-strip{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;background:linear-gradient(135deg,#fff6cf,#ffeaf6);border:1px solid rgba(242,92,167,.16);border-radius:22px;padding:17px 20px;margin:0 0 26px;box-shadow:0 12px 36px rgba(85,61,110,.09)}.welcome-strip span{font-size:1.45rem}.welcome-strip p{margin:0;color:#5a526a}.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px}.video-card{position:relative;overflow:hidden;background:linear-gradient(145deg,#fff,#fff9fd);border:1px solid rgba(94,75,144,.12);border-radius:28px;padding:30px;box-shadow:var(--shadow);animation:rise .7s ease both}.video-card:after{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:6px;background:linear-gradient(90deg,var(--pink),var(--orange),var(--yellow),var(--green),var(--cyan),var(--violet));}.video-card-glow{position:absolute;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(71,204,231,.14),transparent 68%);right:-80px;top:-80px}.badge{display:inline-block;padding:7px 10px;border-radius:999px;background:#e9fff4;border:1px solid #c4f3db;color:#23825b;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;font-weight:800}.card-icon{font-size:2rem;margin-top:20px}.video-card h2{font-family:Georgia,"Times New Roman",serif;font-size:2.2rem;margin:8px 0 8px;color:#332b52}.video-card p{color:#716b7f}.request-form{display:grid;gap:11px;margin-top:22px}.request-form button{margin-top:4px}.logout{display:inline-block;margin-top:22px;color:#756c8a;text-decoration:none}.modal-overlay{position:fixed;inset:0;background:rgba(36,30,70,.42);backdrop-filter:blur(9px);z-index:999;display:grid;place-items:center;padding:22px;animation:fade .25s ease}.support-modal{position:relative;width:min(650px,100%);background:linear-gradient(145deg,#fffdf7,#fff2fb);border:1px solid rgba(125,90,183,.16);border-radius:30px;padding:36px;box-shadow:0 40px 110px rgba(50,34,84,.28);animation:pop .35s cubic-bezier(.2,.9,.2,1);color:#332e45}.support-modal:before{content:"";position:absolute;left:0;top:0;width:100%;height:7px;border-radius:30px 30px 0 0;background:linear-gradient(90deg,var(--pink),var(--orange),var(--yellow),var(--green),var(--cyan),var(--violet))}.support-modal h2{font-family:Georgia,"Times New Roman",serif;font-size:2.5rem;margin:6px 0;color:#332b52}.support-modal p{color:#685f73}.support-copy{margin:22px 0}.heart{font-size:1.8rem;color:var(--pink);filter:drop-shadow(0 0 10px rgba(242,92,167,.2))}.modal-close{position:absolute;right:16px;top:14px;background:transparent;box-shadow:none;font-size:1.7rem;color:#81778c}.modal-actions{display:flex;gap:10px;flex-wrap:wrap}.ghost-btn{background:white;color:#665b78;border:1px solid rgba(74,60,111,.15);box-shadow:none}.paypal-note{font-size:.85rem;color:#8b8194!important}.toast{position:fixed;right:20px;bottom:20px;z-index:999;background:white;border:1px solid rgba(98,78,147,.15);color:#3f3654;padding:15px 18px;border-radius:16px;box-shadow:var(--shadow)}@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes pop{from{opacity:0;transform:scale(.96) translateY(12px)}to{opacity:1;transform:none}}@keyframes floaty{50%{transform:translateY(12px) rotate(12deg)}}@media(max-width:650px){.login-wrap{padding:18px}.login-card{padding:25px}.pw-row{flex-direction:column}.portal-hero{min-height:50vh}.portal-content{padding-bottom:28px}.welcome-strip{grid-template-columns:auto 1fr}.welcome-strip span:last-child{display:none}.support-modal{padding:27px}.modal-actions{flex-direction:column}.paypal-btn,.ghost-btn{width:100%;text-align:center}}


/* =========================================================
   Download-Bestätigung / Support-Overlay — v3
   Bewusst sehr präsent, damit die Bestätigung nach dem
   Absenden nicht wie ein Nebenhinweis wirkt.
   ========================================================= */

body.modal-open {
  overflow: hidden;
}

.modal-overlay-prominent {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 34px);
  overflow-y: auto;
  background:
    radial-gradient(circle at 18% 12%, rgba(242, 92, 167, .28), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(71, 204, 231, .25), transparent 32%),
    radial-gradient(circle at 50% 100%, rgba(255, 212, 95, .22), transparent 36%),
    rgba(27, 21, 54, .86);
  backdrop-filter: blur(16px) saturate(1.15);
  -webkit-backdrop-filter: blur(16px) saturate(1.15);
  animation: overlayEnter .32s ease both;
}

.modal-overlay-prominent.is-closing {
  animation: overlayLeave .26s ease both;
}

.support-modal-prominent {
  position: relative;
  width: min(760px, 100%);
  max-height: calc(100svh - 28px);
  overflow-y: auto;
  padding: clamp(30px, 5vw, 54px);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: clamp(26px, 4vw, 40px);
  color: #302847;
  text-align: center;
  background:
    radial-gradient(circle at 10% 0%, rgba(255, 212, 95, .30), transparent 26%),
    radial-gradient(circle at 100% 0%, rgba(242, 92, 167, .15), transparent 28%),
    linear-gradient(145deg, #fffefb 0%, #fff8fc 54%, #f5fbff 100%);
  box-shadow:
    0 60px 160px rgba(17, 11, 42, .52),
    0 18px 48px rgba(17, 11, 42, .22);
  outline: none;
  animation: modalHeroEnter .48s cubic-bezier(.16, .9, .22, 1.12) both;
}

.support-modal-prominent::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 9px;
  border-radius: inherit;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  background: linear-gradient(
    90deg,
    var(--pink),
    var(--orange),
    var(--yellow),
    var(--green),
    var(--cyan),
    var(--violet)
  );
}

.support-modal-prominent::after {
  content: "";
  position: absolute;
  inset: 14px;
  pointer-events: none;
  border: 1px solid rgba(118, 88, 223, .08);
  border-radius: calc(clamp(26px, 4vw, 40px) - 10px);
}

.support-modal-prominent .modal-close {
  position: absolute;
  z-index: 4;
  top: 16px;
  right: 18px;
  width: 44px;
  height: 44px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(67, 52, 100, .10);
  border-radius: 50%;
  color: #645b75;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 8px 22px rgba(43, 31, 70, .10);
  font-size: 1.65rem;
  line-height: 1;
}

.support-modal-prominent .modal-close:hover {
  transform: rotate(4deg) scale(1.05);
  color: #382f4f;
  background: #fff;
  box-shadow: 0 11px 28px rgba(43, 31, 70, .16);
}

.success-stage {
  position: relative;
  width: 112px;
  height: 112px;
  margin: 0 auto 18px;
}

.success-ring {
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: linear-gradient(135deg, #5bd5a2 0%, #3fc9c8 48%, #7658df 100%);
  box-shadow:
    0 20px 44px rgba(76, 197, 171, .30),
    inset 0 1px 0 rgba(255,255,255,.4);
  animation: successPulse 2.8s ease-in-out infinite;
}

.success-ring::before {
  content: "";
  position: absolute;
  inset: -9px;
  border: 2px solid rgba(99, 215, 162, .23);
  border-radius: 50%;
}

.success-ring svg {
  width: 58px;
  height: 58px;
}

.spark {
  position: absolute;
  z-index: 2;
  color: var(--yellow);
  filter: drop-shadow(0 5px 9px rgba(255, 184, 63, .26));
  animation: sparkle 1.9s ease-in-out infinite alternate;
}

.spark-a { left: -12px; top: 8px; font-size: 1.5rem; }
.spark-b { right: -14px; top: 28px; font-size: 1.15rem; animation-delay: -.7s; color: var(--pink); }
.spark-c { right: 2px; bottom: -4px; font-size: .9rem; animation-delay: -1.2s; color: var(--cyan); }

.modal-kicker {
  margin: 0 0 8px !important;
  color: #4b9b78 !important;
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.support-modal-prominent h2 {
  max-width: 14ch;
  margin: 0 auto 16px;
  color: #30274e;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.35rem, 5vw, 4.3rem);
  line-height: .98;
  letter-spacing: -.035em;
}

.support-modal-prominent .modal-lead {
  max-width: 54ch;
  margin: 0 auto;
  color: #665d72;
  font-size: clamp(1.05rem, 2vw, 1.22rem);
  line-height: 1.6;
}

.mail-hint {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  width: min(560px, 100%);
  margin: 24px auto 0;
  padding: 15px 17px;
  border: 1px solid rgba(73, 185, 150, .18);
  border-radius: 18px;
  text-align: left;
  background: linear-gradient(135deg, #effff8, #f4fffd);
}

.mail-hint-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 14px;
  color: white;
  background: linear-gradient(135deg, #5bd5a2, #42bdc6);
  box-shadow: 0 10px 24px rgba(66, 189, 198, .20);
  font-size: 1.2rem;
}

.mail-hint strong,
.mail-hint span {
  display: block;
}

.mail-hint strong {
  color: #365c50;
  font-size: .95rem;
}

.mail-hint div > span {
  margin-top: 2px;
  color: #6c7f78;
  font-size: .84rem;
}

.support-divider {
  position: relative;
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 30px 0 22px;
  color: #8b8195;
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.support-divider::before,
.support-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(92, 73, 139, .17));
}

.support-divider::after {
  background: linear-gradient(90deg, rgba(92, 73, 139, .17), transparent);
}

.support-copy {
  width: min(610px, 100%);
  margin: 0 auto 26px;
}

.support-copy p {
  margin: 0 0 10px;
  color: #62596e;
  line-height: 1.58;
}

.support-copy p:last-child {
  margin-bottom: 0;
  color: #483f56;
}

.support-modal-prominent .modal-actions {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr);
  gap: 12px;
  width: min(600px, 100%);
  margin: 0 auto;
}

.paypal-btn-large,
.ghost-btn-large {
  min-height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 18px;
  padding: 16px 20px;
  font-size: 1rem;
}

.paypal-btn-large {
  color: white;
  background: linear-gradient(135deg, #f15ca7 0%, #8b69e5 100%);
  box-shadow: 0 17px 34px rgba(139, 105, 229, .24);
}

.paypal-btn-large:hover {
  transform: translateY(-2px) scale(1.01);
  box-shadow: 0 22px 42px rgba(139, 105, 229, .33);
}

.ghost-btn-large {
  color: #645a74;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(86, 69, 126, .14);
  box-shadow: none;
}

.ghost-btn-large:hover {
  color: #40364f;
  background: white;
  border-color: rgba(86, 69, 126, .23);
  box-shadow: 0 10px 24px rgba(62, 49, 91, .09);
}

.support-modal-prominent .paypal-note {
  margin: 15px 0 0;
  color: #92889a !important;
  font-size: .8rem;
}

.toast-success {
  position: fixed;
  z-index: 5000;
  right: 22px;
  bottom: 22px;
  width: min(420px, calc(100vw - 44px));
  display: grid;
  gap: 2px;
  padding: 18px 20px;
  border: 1px solid rgba(79, 187, 151, .2);
  border-radius: 18px;
  color: #314b43;
  background: #f4fff9;
  box-shadow: 0 24px 60px rgba(28, 44, 39, .18);
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .3s ease, transform .3s ease;
}

.toast-success.is-visible {
  opacity: 1;
  transform: none;
}

.toast-success span {
  color: #6b7a75;
  font-size: .88rem;
}

@keyframes overlayEnter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes overlayLeave {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes modalHeroEnter {
  from {
    opacity: 0;
    transform: translateY(36px) scale(.92);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes successPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.045); }
}

@keyframes sparkle {
  from { transform: translateY(0) rotate(-8deg) scale(.9); opacity: .65; }
  to { transform: translateY(-5px) rotate(8deg) scale(1.12); opacity: 1; }
}

@media (max-width: 650px) {
  .modal-overlay-prominent {
    align-items: end;
    padding: 10px;
  }

  .support-modal-prominent {
    width: 100%;
    max-height: calc(100svh - 10px);
    padding: 34px 20px 24px;
    border-radius: 28px 28px 22px 22px;
  }

  .success-stage,
  .success-ring {
    width: 88px;
    height: 88px;
  }

  .success-ring svg {
    width: 46px;
    height: 46px;
  }

  .support-modal-prominent h2 {
    font-size: clamp(2rem, 11vw, 3rem);
  }

  .support-modal-prominent .modal-actions {
    grid-template-columns: 1fr;
  }

  .support-divider {
    margin-top: 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .modal-overlay-prominent,
  .support-modal-prominent,
  .success-ring,
  .spark {
    animation: none !important;
  }
}
