/* Saucey's Creator Club — App shared styles
   GARAGE NIGHTS (v22): brightened garage-wall charcoal, lowrider-painted
   wordmark, sparkling Strip skyline, candy pink -> purple neon.
   Palette discipline: pink #FF2E88 + purple #B026FF + charcoal + white ONLY. */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root{
  --bg:#170A2E;
  --panel:#2E1450;
  --panel-deep:#1E0B38;
  --panel-edge:#4A2A7A;
  --ink:#F6F3FA;
  --ink-soft:#FFFFFF;
  --muted:#FFFFFF;
  --pink:#FF2E88;
  --purple:#B026FF;
  --purple-soft:#C77DFF;
  --line:rgba(199,125,255,.28);
  --card:#2E1450;
}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(rgba(199,125,255,.08) 1px, transparent 1.7px) 0 0/15px 15px,
    radial-gradient(rgba(199,125,255,.05) 1px, transparent 1.7px) 7px 7px/15px 15px,
    repeating-linear-gradient(90deg, rgba(176,38,255,.06) 0 1px, transparent 1px 100px),
    linear-gradient(180deg,#2A1152 0%, #1E0B38 45%, #170A2E 100%);
  background-color:#170A2E;
  min-height:100vh; color:var(--ink); padding:22px 14px 90px; position:relative;
}
.wrap{ max-width:600px; margin:0 auto; position:relative; z-index:1; }
a{ color:var(--purple-soft); }

/* ——— Hero: garage wall + skyline backdrop ——— */
.hero{
  position:relative; text-align:center; overflow:hidden;
  border:1px solid #4A2A7A; border-radius:28px;
  padding:34px 22px 0; margin-bottom:0;
  background:
    radial-gradient(rgba(199,125,255,.08) 1px, transparent 1.7px) 0 0/15px 15px,
    radial-gradient(rgba(199,125,255,.05) 1px, transparent 1.7px) 7px 7px/15px 15px,
    repeating-linear-gradient(90deg, rgba(176,38,255,.06) 0 1px, transparent 1px 100px),
    linear-gradient(180deg,#2A1152 0%, #1E0B38 55%, #170A2E 100%);
  box-shadow:0 24px 60px rgba(0,0,0,.55);
}
.hero-sky{
  position:absolute; left:0; right:0; bottom:0; z-index:0; line-height:0;
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 34%);
          mask-image:linear-gradient(180deg, transparent 0%, #000 34%);
}
.hero-sky svg{ width:100%; height:auto; display:block; }
.hero-inner{ position:relative; z-index:2; padding-bottom:clamp(84px,24vw,148px); }
.kicker{
  text-align:center; font-family:"Oswald",sans-serif; font-weight:600; font-size:.72rem;
  letter-spacing:5px; color:var(--purple-soft); text-transform:uppercase; margin-bottom:2px;
  text-shadow:0 0 12px rgba(176,38,255,.55);
}

/* ——— Painted wordmark (hero) ——— */
.wordmark{ transform:rotate(-2deg); margin-top:2px; text-align:center; }
.wm-stack{ position:relative; display:inline-block; line-height:1; }
.wm-outline,.wm-fill{
  font-family:"Yellowtail",cursive; font-size:clamp(3.6rem,15vw,5.6rem); line-height:1.08; white-space:nowrap;
}
.wm-outline{
  position:absolute; left:3px; top:3px; z-index:0;
  color:transparent; -webkit-text-stroke:2px rgba(255,255,255,.92);
  text-shadow:5px 5px 0 rgba(20,4,28,.55);
}
.wm-fill{
  position:relative; z-index:1;
  background:linear-gradient(100deg,#FF2E88 5%, #D633FF 48%, #B026FF 95%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.85);
  filter:drop-shadow(0 0 10px rgba(255,46,136,.55)) drop-shadow(0 0 26px rgba(176,38,255,.35));
}
.flourish{ display:block; margin:-8px auto 0; width:340px; max-width:88%; }
.logo-sub{
  font-family:"Montserrat",sans-serif; font-weight:800; font-size:clamp(1rem,4.4vw,1.25rem);
  letter-spacing:.52em; text-indent:.52em; color:#FFFFFF; text-transform:uppercase; margin-top:10px; text-align:center;
  text-shadow:0 0 6px rgba(176,38,255,.9), 0 0 18px rgba(176,38,255,.65), 0 0 40px rgba(176,38,255,.4);
}
.chrome-line{
  font-family:"Oswald",sans-serif; margin-top:10px; font-size:.72rem; font-weight:600; text-align:center;
  letter-spacing:4px; text-transform:uppercase;
  background:linear-gradient(90deg,#FF2E88,#B026FF);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
}
.tagline{
  text-align:center; color:#FFFFFF; line-height:1.65; font-size:.99rem; font-weight:500;
  max-width:420px; margin:14px auto 0; letter-spacing:.02em;
  text-shadow:0 1px 8px rgba(10,6,16,.8);
}
.tagline b{ color:#fff; }

/* ——— Skyline animations ——— */
.beam{ transform-box:view-box; transform-origin:258px 74px; animation:sweep 7s ease-in-out infinite; }
.wheel{ transform-box:fill-box; transform-origin:center; animation:spin 48s linear infinite; }
.win{ animation:tw 2.6s ease-in-out infinite; }
.win.d1{ animation-duration:1.9s; } .win.d2{ animation-duration:3.1s; animation-delay:.6s; }
.win.d3{ animation-duration:2.4s; animation-delay:1.2s; } .win.d4{ animation-duration:3.8s; animation-delay:.3s; }
.win.d5{ animation-duration:2.1s; animation-delay:1.7s; }
.sign-glow{ animation:flicker 4.5s linear infinite; }
@keyframes tw{ 0%,100%{opacity:.12} 50%{opacity:1} }
@keyframes sweep{ 0%,100%{transform:rotate(-7deg)} 50%{transform:rotate(7deg)} }
@keyframes spin{ to{ transform:rotate(360deg) } }
@keyframes flicker{ 0%,6.5%,8%,100%{opacity:1} 7%{opacity:.35} 42%,43.5%{opacity:1} 42.7%{opacity:.5} }
@media (prefers-reduced-motion: reduce){
  .beam,.wheel,.win,.sign-glow{ animation:none !important; }
}

/* ——— Chrome bumper divider ——— */
.chrome-bar{
  height:3px; margin:0 6px; position:relative; z-index:2; border-radius:2px;
  background:linear-gradient(90deg,#FF2E88,#B026FF);
  box-shadow:0 1px 6px rgba(0,0,0,.5), 0 0 14px rgba(176,38,255,.18);
}

/* ——— Pinstripe divider ——— */
.pin{ margin:20px 4px; position:relative; height:8px; }
.pin::before,.pin::after{ content:""; position:absolute; left:0; right:0; height:1px; }
.pin::before{ top:1px; background:var(--purple); box-shadow:0 0 6px rgba(176,38,255,.5); }
.pin::after{ bottom:1px; background:rgba(199,125,255,.55); }
.pin i{
  position:absolute; left:50%; top:50%; width:7px; height:7px;
  transform:translate(-50%,-50%) rotate(45deg);
  background:var(--bg); border:1px solid var(--pink);
  box-shadow:0 0 8px rgba(255,46,136,.7);
}

/* ——— Faint skyline echo behind the page bottom ——— */
.page-echo{
  position:absolute; left:0; right:0; bottom:0; z-index:0; line-height:0;
  opacity:.16; pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 45%);
          mask-image:linear-gradient(180deg, transparent 0%, #000 45%);
}
.page-echo svg{ width:100%; height:120px; display:block; }

/* ——— Logo (subpages: apply / thanks / install) ——— */
.logo{ text-align:center; margin:6px 0 4px; }
.logo .script{
  font-family:"Yellowtail",cursive; font-size:3.2rem; line-height:1.1; display:block;
  background:linear-gradient(100deg,#FF2E88 5%, #D633FF 48%, #B026FF 95%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.85);
  filter:drop-shadow(0 0 8px rgba(255,46,136,.5)) drop-shadow(0 0 20px rgba(176,38,255,.3));
}
.logo .block{
  font-family:"Montserrat",sans-serif; font-weight:800; font-size:1.02rem; letter-spacing:.52em; text-indent:.52em;
  color:#fff; display:block; margin-top:4px; text-transform:uppercase;
  text-shadow:0 0 6px rgba(176,38,255,.9), 0 0 18px rgba(176,38,255,.6), 0 0 36px rgba(176,38,255,.35);
}

/* ——— Cards / buttons ——— */
.card{
  background:var(--panel); border:1px solid var(--panel-edge); border-radius:20px;
  padding:24px 20px; margin-bottom:24px; position:relative; z-index:1;
  box-shadow:0 16px 40px rgba(0,0,0,.45);
}
.card h2{
  font-family:"Oswald",sans-serif; font-weight:700; font-size:1.4rem; letter-spacing:2px;
  color:#fff; margin-bottom:10px; text-transform:uppercase;
}
.card h3{ font-family:"Oswald",sans-serif; color:#fff; letter-spacing:.5px; margin-bottom:6px; }
.card.dark{ background:#170A2E; border-color:#4A2A7A; }
.sub{ color:var(--ink-soft); font-size:.94rem; line-height:1.6; margin-bottom:12px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.sub b{ color:#fff; }
.btn{
  display:block; width:100%; text-align:center; text-decoration:none; cursor:pointer;
  border:2px solid var(--purple); border-radius:16px; padding:16px;
  font-family:"Oswald",sans-serif; font-size:1.12rem; font-weight:700;
  letter-spacing:3px; color:#FFFFFF; background:#000000; text-transform:uppercase;
  box-shadow:0 0 18px rgba(176,38,255,.28), inset 0 0 12px rgba(176,38,255,.10);
  transition:transform .12s;
}
.btn:active{ transform:scale(.98); }
/* THE one designed moment: black button, pink outline */
.btn.magenta{
  border:2px solid var(--pink); background:#000000; color:#FFFFFF;
  box-shadow:0 0 18px rgba(255,46,136,.30), inset 0 0 12px rgba(255,46,136,.12);
  font-size:1.12rem; letter-spacing:3px;
}
.btn.ghost{
  background:rgba(20,16,26,.85); color:#fff; border:2px solid rgba(199,125,255,.5);
  box-shadow:none; font-size:1rem; letter-spacing:2px;
}
.btn + .btn{ margin-top:12px; }
.apply-card{ padding:14px; margin-top:22px; }
.door{ text-align:center; }
.door .big{ font-size:1.6rem; }
.door p{ color:var(--ink-soft); line-height:1.55; margin:8px 0 16px; font-size:.96rem; }

/* Layered neon frame around the Apply card — the one action on the page */
.frame-gold{
  border:2px solid rgba(255,46,136,.6);
  outline:1px solid rgba(176,38,255,.35); outline-offset:5px;
}

/* ——— Forms ——— */
label.field{ display:block; margin-bottom:15px; }
label.field > span{ display:block; font-weight:700; font-size:.92rem; margin-bottom:6px; color:#fff; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
label.field > span small{ font-weight:400; color:#FFFFFF; }
.req{ color:#ff4da6; }
input[type=text],input[type=tel],input[type=email],input[type=number],input[type=date],input[type=url],select,textarea{
  width:100%; border:2px solid rgba(199,125,255,.3); border-radius:12px; padding:12px 14px;
  font-size:1rem; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); background:rgba(20,16,26,.9); outline:none; color-scheme:dark;
}
select option{ color:#14102e; }
input::placeholder,textarea::placeholder{ color:#C9B8E8; }
input:focus,select:focus,textarea:focus{ border-color:var(--pink); box-shadow:0 0 14px rgba(255,46,136,.3); }
textarea{ min-height:88px; resize:vertical; }
.hidden{ display:none; }

/* ——— Events / misc components (shared) ——— */
.event{ border:1px solid rgba(255,46,136,.3); border-radius:16px; padding:18px; margin-bottom:14px; background:rgba(20,16,26,.55); }
.event .date{
  display:inline-block; font-family:"Oswald",sans-serif; font-weight:700; letter-spacing:1px;
  color:#fff; background:linear-gradient(90deg,var(--pink),var(--purple)); border-radius:999px;
  padding:5px 14px; font-size:.85rem; margin-bottom:10px;
}
.event h3{ font-size:1.25rem; text-transform:uppercase; }
.event .meta{ color:var(--ink-soft); font-size:.92rem; line-height:1.55; margin-bottom:6px; }
.event .meta b{ color:#fff; }
.counter{
  display:inline-block; margin:8px 0 4px; padding:7px 14px; border-radius:999px;
  border:1px dashed rgba(255,46,136,.6); color:var(--pink); font-weight:700; font-size:.88rem;
}
.proof{ list-style:none; }
.proof li{ padding:10px 0 10px 32px; position:relative; border-bottom:1px solid rgba(199,125,255,.14); line-height:1.55; color:#ECE9FF; font-size:.98rem; }
.proof li:last-child{ border-bottom:none; }
.proof li::before{ content:"✦"; position:absolute; left:4px; top:10px; color:var(--pink); text-shadow:0 0 10px rgba(255,46,136,.8); }
.proof li b{ color:var(--pink); }
.post{ border-left:3px solid var(--pink); padding:4px 0 4px 14px; margin-bottom:16px; }
.post .when{ color:#FFFFFF; font-size:.8rem; letter-spacing:1px; text-transform:uppercase; margin-bottom:4px; }
.post p{ line-height:1.6; color:#ECE9FF; }
.terms{ list-style:none; counter-reset:t; }
.terms li{ padding:9px 0 9px 8px; border-bottom:1px solid rgba(199,125,255,.14); line-height:1.6; color:#ECE9FF; font-size:.97rem; }
.terms li:last-child{ border-bottom:none; }
.terms li b{ color:var(--pink); }
.steps{ list-style:none; counter-reset:s; }
.steps li{ padding:10px 0 10px 44px; position:relative; line-height:1.6; color:#ECE9FF; border-bottom:1px solid rgba(199,125,255,.14); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.steps li:last-child{ border-bottom:none; }
.steps li::before{
  counter-increment:s; content:counter(s); position:absolute; left:0; top:8px;
  width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg,var(--pink),var(--purple));
  color:#fff; font-family:"Oswald",sans-serif; font-weight:700; display:flex; align-items:center; justify-content:center;
}
.steps li b{ color:#fff; }
nav.bottom{
  position:fixed; left:0; right:0; bottom:0; z-index:20; display:flex; gap:2px;
  background:rgba(20,16,26,.96); border-top:1px solid var(--line); backdrop-filter:blur(8px);
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
}
nav.bottom a{
  flex:1; text-align:center; color:var(--ink-soft); text-decoration:none; font-size:.72rem;
  font-family:"Oswald",sans-serif; letter-spacing:1px; text-transform:uppercase; padding:8px 2px; border-radius:10px;
}
nav.bottom a.on{ color:#fff; background:linear-gradient(90deg,var(--pink),var(--purple)); font-weight:700; }
nav.bottom a span{ display:block; font-size:1.05rem; margin-bottom:2px; }

/* ——— Fact tiles: lifted charcoal, alternating pink/purple top rules ——— */
.tiles{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:28px; position:relative; z-index:1; align-items:start; }
.tile{
  background:var(--panel); border:1px solid var(--panel-edge); border-radius:16px; padding:22px 18px;
  box-shadow:0 12px 26px rgba(0,0,0,.4);
}
.tile .t-head{
  font-family:"Oswald",sans-serif; font-weight:700; font-size:.98rem; letter-spacing:1px; text-transform:uppercase;
  line-height:1.3; color:#FFFFFF; display:block; margin-bottom:6px;
}
.tile .t-sub{ font-size:.85rem; line-height:1.5; color:#FFFFFF; display:block; font-weight:500; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.tile.gold,.tile.pink,.tile.tp{ border-top:3px solid var(--pink); }
.tile.violet,.tile.indigo,.tile.tu{ border-top:3px solid var(--purple); }

.caps{ list-style:none; }
.caps li{
  display:flex; gap:12px; align-items:flex-start; padding:10px 12px; margin-bottom:8px;
  border-radius:12px; background:rgba(20,16,26,.55); border-left:4px solid var(--pink);
  line-height:1.5; color:#ECE9FF; font-size:.96rem;
}
.caps li:nth-child(3n+2){ border-left-color:var(--purple); }
.caps li:nth-child(3n){ border-left-color:var(--purple-soft); }
.caps li .c-emoji{ font-size:1.15rem; flex-shrink:0; line-height:1.4; }
.caps li b{ color:#fff; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{
  display:inline-block; padding:9px 14px; border-radius:999px; font-weight:600; font-size:.9rem; color:#fff;
  background:rgba(20,16,26,.6); border:1px solid rgba(199,125,255,.4);
}
.chip:nth-child(3n+1){ border-color:rgba(255,46,136,.55); }
.chip:nth-child(3n+2){ border-color:rgba(176,38,255,.55); }
.chip:nth-child(3n){ border-color:rgba(199,125,255,.5); }
.punch{ list-style:none; }
.punch li{
  padding:10px 0; border-bottom:1px solid rgba(199,125,255,.14); line-height:1.55; color:#ECE9FF; font-size:.98rem;
  display:flex; gap:12px; align-items:flex-start;
}
.punch li:last-child{ border-bottom:none; }
.punch li .p-emoji{ font-size:1.15rem; flex-shrink:0; line-height:1.4; }
.punch li b{ color:var(--pink); }
.topback{ display:inline-block; color:var(--ink-soft); text-decoration:none; font-size:.85rem; margin-bottom:14px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.fine{ text-align:center; color:rgba(214,208,235,.7); font-size:.78rem; margin-top:14px; line-height:1.5; position:relative; z-index:1; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.center{ text-align:center; }
.checkmark{ font-size:3rem; text-align:center; margin-bottom:8px; color:var(--pink); text-shadow:0 0 18px rgba(255,46,136,.6); }

/* ——— Plain bullets (landing lists) ——— */
.plain{ list-style:none; }
.plain li{
  position:relative; padding:9px 0 9px 22px;
  border-bottom:1px solid rgba(255,255,255,.1); line-height:1.5;
  color:var(--ink); font-size:.96rem; font-weight:500; letter-spacing:.02em;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.plain li:last-child{ border-bottom:none; }
.plain li::before{
  content:""; position:absolute; left:2px; top:16px;
  width:8px; height:8px; border-radius:50%; background:var(--pink);
  box-shadow:0 0 8px rgba(255,46,136,.85);
}
.diff-line{ line-height:1.6; color:#ECE9FF; font-size:1rem; margin-bottom:8px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.diff-line:last-child{ margin-bottom:0; }

/* ——— Q&A helper ——— */
.qa-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.qa-chip{
  padding:9px 14px; border-radius:999px; font-weight:600; font-size:.88rem; color:#fff; cursor:pointer;
  background:rgba(20,16,26,.6); border:1px solid rgba(199,125,255,.45); font-family:inherit;
}
.qa-chip:active{ transform:scale(.97); }
.qa-form{ display:flex; gap:8px; }
.qa-form input{ flex:1; }
.qa-form .qa-ask{ width:auto; padding:12px 22px; font-size:1rem; }
.qa-answer{
  margin-top:12px; padding:12px 14px; border-radius:12px; line-height:1.6; color:#ECE9FF; font-size:.95rem;
  background:rgba(20,16,26,.55); border-left:4px solid var(--pink); display:none;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.qa-answer.show{ display:block; }

/* ——— Upcoming Event plaque (neon edition) ——— */
.upcoming{
  border-radius:20px; padding:22px 20px; margin-bottom:16px; color:#fff; position:relative; z-index:1;
  background:linear-gradient(165deg,#2E2138,#1B1424);
  border:2px solid rgba(255,46,136,.55);
  box-shadow:0 12px 26px rgba(0,0,0,.45), 0 0 22px rgba(255,46,136,.18);
}
.upcoming .u-head{
  font-family:"Oswald",sans-serif; font-weight:700; font-size:1.05rem; letter-spacing:2px; color:var(--pink);
  text-transform:uppercase; line-height:1.25; display:block; margin-bottom:6px;
  text-shadow:0 0 12px rgba(255,46,136,.5);
}
.upcoming .u-sub{ font-size:.95rem; line-height:1.45; color:rgba(255,255,255,.94); display:block; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }

/* ——— Section tints: all charcoal now, distinguished by neon edge ——— */
.card.tint-indigo{ background:linear-gradient(165deg,#2E1450,#221A2E); border-color:rgba(176,38,255,.4); color:#fff; }
.card.tint-purple{ background:linear-gradient(165deg,#34125E,#1E0B38); border-color:rgba(176,38,255,.5); color:#fff; }
.card.tint-plum{ background:linear-gradient(165deg,#35144F,#1E0B38); border-color:rgba(255,46,136,.4); color:#fff; }
.card.tint-pink{ background:linear-gradient(165deg,#3D1233,#1E0B38); border-color:rgba(255,46,136,.55); color:#fff; }

/* Mission: painted-script signature, candy gradient */
.mission-text{ font-size:1.07rem; line-height:1.65; }
.mission-sign{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif; font-size:1.25rem; font-weight:700; margin-bottom:0;
  background:linear-gradient(100deg,#FF2E88,#B026FF);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  filter:drop-shadow(0 0 8px rgba(255,46,136,.35));
}

/* Past events: static name chips — plain labels, never buttons */
.chips-static{ display:flex; flex-wrap:wrap; gap:8px; }
.chip-name{
  display:inline-block; padding:10px 14px; border-radius:999px;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif; font-weight:600; font-size:.88rem; letter-spacing:.6px;
  color:#fff; background:rgba(20,16,26,.5); border:1px solid rgba(255,46,136,.45);
}
.chip-name:nth-child(3n+2){ border-color:rgba(176,38,255,.55); }
.chip-name:nth-child(3n){ border-color:rgba(199,125,255,.55); }

/* Corner "?" bot popup + tiny why-popups (added 2026-10-24) */
.qa-fab{position:fixed;right:16px;bottom:88px;width:auto;height:auto;border-radius:999px;padding:13px 20px;background:#FF2E88;color:#fff;font-size:16px;font-weight:800;border:2px solid #fff;box-shadow:0 0 18px rgba(255,46,136,.55);z-index:999;cursor:pointer;line-height:1;}
.qa-popup{position:fixed;right:16px;bottom:152px;width:min(330px,calc(100vw - 32px));max-height:70vh;overflow-y:auto;background:#1E0B38;border:1px solid rgba(255,46,136,.5);border-radius:16px;padding:14px;box-shadow:0 16px 32px rgba(0,0,0,.5);z-index:999;display:none;}
.qa-popup.open{display:block;}
.qa-popup-head{display:flex;justify-content:space-between;align-items:center;color:#fff;margin-bottom:10px;font-family:Oswald,sans-serif;letter-spacing:.06em;}
.qa-x{background:none;border:none;color:#C77DFF;font-size:22px;cursor:pointer;line-height:1;}
.qa-mini-form{display:flex;gap:8px;margin-bottom:10px;}
.qa-mini-input{flex:1;min-width:0;background:#EDE7F6;color:#1B1430;border:2px solid rgba(199,125,255,.5);border-radius:10px;padding:10px;font-size:16px;}
.qa-mini-btn{background:#0d0a12;color:#fff;border:2px solid #FF2E88;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer;}
.qa-mini-answer{display:none;color:#fff;font-size:.92rem;line-height:1.6;margin-bottom:10px;}
.qa-mini-answer.show{display:block;}
.qa-mini-chips{display:flex;flex-wrap:wrap;gap:6px;}
.qa-mini-chips button{background:transparent;color:#C77DFF;border:1px solid rgba(199,125,255,.5);border-radius:999px;padding:6px 10px;font-size:.82rem;cursor:pointer;}
.qa-ask-saucey{display:none;margin-top:10px;}
.qa-ask-saucey.show{display:block;}
.qa-ask-btn{background:#0d0a12;color:#fff;border:2px solid #FF2E88;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer;width:100%;}
.qa-queue-form label{display:block;color:#fff;font-size:.88rem;font-weight:700;margin-bottom:10px;}
.qa-queue-form input[type=text],.qa-queue-form textarea{width:100%;background:#EDE7F6;color:#1B1430;border:2px solid rgba(199,125,255,.5);border-radius:10px;padding:10px;font-size:16px;margin-top:6px;}
.qa-queue-form button[type=submit]{background:#0d0a12;color:#fff;border:2px solid #FF2E88;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer;width:100%;}
.qa-queue-done,.manage-done{color:#fff;font-size:.92rem;line-height:1.6;margin:10px 0 0;}
.why-link{background:none;border:none;color:#C77DFF;font-size:.82rem;text-decoration:underline;cursor:pointer;padding:2px 0;}
.why-pop{background:#1E0B38;border:1px solid rgba(255,46,136,.4);border-radius:12px;padding:10px 12px;color:#fff;font-size:.85rem;line-height:1.6;margin-top:8px;}

/* Sticky header: plain bar, NOT a tile. Shows once the page header scrolls away. */
#sticky-head{position:fixed;top:0;left:0;right:0;z-index:60;background:#170A2E;border-bottom:1px solid rgba(255,46,136,.55);box-shadow:0 8px 24px rgba(0,0,0,.5);transform:translateY(-101%);transition:transform .25s ease;padding:8px 12px 6px;text-align:center;}
#sticky-head.show{transform:translateY(0);}
#sticky-head .sh-word{font-family:"Yellowtail",cursive;font-size:1.9rem;line-height:1;background:linear-gradient(100deg,#FF2E88,#B026FF);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;display:block;}
#sticky-head .sh-club{font-family:"Montserrat",sans-serif;font-weight:800;font-size:.62rem;letter-spacing:.52em;text-indent:.52em;color:#fff;text-transform:uppercase;display:block;margin-top:1px;}
#sticky-head .sh-sky{display:block;width:100%;height:22px;margin-top:4px;}
input,select,textarea{font-size:16px;}

/* ——— Flip card + header nav + My Pass tickets (v8) ——— */
.flip-wrap{perspective:1200px;-webkit-perspective:1200px;margin:32px 0 44px;}
.flip-inner{position:relative;transition:transform .6s ease;-webkit-transition:-webkit-transform .6s ease;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;}
.flip-inner.flipped{transform:rotateY(180deg);-webkit-transform:rotateY(180deg);}
.flip-face{backface-visibility:hidden;-webkit-backface-visibility:hidden;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.flip-face .card{margin:0;}
.flip-back{position:absolute;inset:0;transform:rotateY(180deg);-webkit-transform:rotateY(180deg);}
.btn.magenta.glow-rsvp{box-shadow:0 0 18px rgba(255,46,136,.8),0 0 42px rgba(255,46,136,.45);animation:scc-glow 2.4s ease-in-out infinite;}
@keyframes scc-glow{0%,100%{box-shadow:0 0 18px rgba(255,46,136,.8),0 0 42px rgba(255,46,136,.45);}50%{box-shadow:0 0 28px rgba(255,46,136,1),0 0 64px rgba(176,38,255,.6);}}



#about,#events,#mypass,#questions{scroll-margin-top:150px;}
.flip-back-btn{background:none;border:0;color:#C77DFF;font-weight:700;font-size:.9rem;margin-top:16px;text-decoration:underline;cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
.ticket{background:#000;border:2px solid #FF2E88;border-radius:16px;padding:20px;text-align:center;box-shadow:0 0 24px rgba(255,46,136,.35);}
.ticket-kicker{font-family:"Oswald",sans-serif;letter-spacing:.22em;font-size:.85rem;color:#C77DFF;margin:0 0 8px;text-transform:uppercase;}
.ticket h3{font-family:"Oswald",sans-serif;color:#fff;font-size:1.4rem;letter-spacing:.04em;margin:0 0 6px;text-transform:uppercase;}
.ticket p{color:#fff;line-height:1.6;margin:0 0 4px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
.ticket-status{color:#7CFC9A!important;font-weight:700!important;margin:10px 0 14px!important;}
@media (prefers-reduced-motion:reduce){.flip-inner{transition:none;-webkit-transition:none;}.btn.magenta.glow-rsvp{animation:none;}}

body{padding-bottom:78px;}
.scc-bar{position:fixed;left:0;right:0;bottom:0;z-index:998;display:flex;background:#170A2E;border-top:2px solid #FF2E88;padding:8px 8px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(0,0,0,.45);}
.scc-bar a{flex:1;text-align:center;color:#fff;text-decoration:none;font-family:Oswald,sans-serif;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;padding:10px 2px;border-radius:10px;}
.scc-bar a:active{background:rgba(255,46,136,.25);}