*{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#312665;
  --purple:#6650ad;
  --dark:#20173f;
  --lav:#c9b9f2;
  --lav2:#ece8fb;
  --pink:#d84be4;
  --paper:#f8f6ff;
  --white:#fff;
  --line:rgba(49,38,101,.16)
}
html{scroll-behavior:smooth}
body{
  font-family:"DM Sans",sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 16px 16px,rgba(49,38,101,.2) 2px,transparent 2.6px) 0 0/56px 56px,
    linear-gradient(120deg,#5d4aa7,#925ac5)
}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
.shell{
  width:min(1220px,calc(100% - 40px));
  margin:32px auto;
  background:var(--paper);
  border:7px solid var(--ink);
  border-radius:42px;
  overflow:hidden;
  box-shadow:0 30px 90px rgba(29,19,72,.3)
}
header{
  min-height:82px;padding:0 30px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:var(--lav);
  border-bottom:6px solid var(--ink);
  position:sticky;top:0;z-index:100
}
.brand{display:flex;align-items:center;gap:12px;font:800 1rem "Baloo 2"}
.brand-logo{width:48px;height:48px;object-fit:contain}
nav{display:flex;align-items:center;gap:23px;font:700 .78rem "Baloo 2";letter-spacing:.09em;text-transform:uppercase}
nav a{position:relative}
nav a:not(.pill)::after{
  content:"";position:absolute;left:0;right:100%;bottom:-5px;height:2px;background:var(--pink);transition:.25s
}
nav a:not(.pill):hover::after,nav a[aria-current="page"]::after{right:0}
.pill{padding:9px 15px;background:white;border:2px solid var(--ink);border-radius:999px}
.menu{display:none}
.hero{min-height:760px;display:grid;grid-template-columns:1fr 74px;background:#cecbe0}
.hero-main{
  padding:76px 7% 66px;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 78% 18%,rgba(240,138,248,.35),transparent 23%),
    radial-gradient(circle at 15% 82%,rgba(123,88,200,.22),transparent 25%),
    linear-gradient(145deg,#d8d5e9,#c9c5df)
}
.hero-logo-wrap{display:flex;justify-content:center;align-items:center;position:relative;z-index:2}
.hero-logo{display:block;width:min(560px,82%);max-height:430px;height:auto;object-fit:contain}
.hero-copy{max-width:760px;margin:32px auto 0;text-align:center;position:relative;z-index:2}
.eyebrow{font:800 .78rem "Baloo 2";letter-spacing:.15em;text-transform:uppercase}
.hero-copy h1{font:800 clamp(2rem,4vw,3.7rem) "Baloo 2";line-height:1.02;letter-spacing:-.045em;margin:15px 0 18px}
.hero-copy h1 span{color:var(--pink)}
.hero-copy>p:last-of-type{max-width:680px;margin:auto;line-height:1.7}
.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{min-height:49px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:800;border:0;cursor:pointer}
.primary{background:var(--ink);color:white}
.ghost{border:2px solid var(--ink);background:rgba(255,255,255,.45)}
.light{background:white;color:var(--ink)}
aside{background:var(--purple);border-left:5px solid var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:white}
aside>span{writing-mode:vertical-rl;font-size:.6rem;letter-spacing:.2em;opacity:.7}
aside a{width:38px;height:38px;border:2px solid white;border-radius:50%;display:grid;place-items:center;font-size:.68rem;font-weight:800;transition:.2s}
aside a:hover{background:white;color:var(--purple);transform:translateY(-2px)}
.spark{position:absolute;font-size:2.5rem;color:white;text-shadow:2px 2px 0 var(--pink)}
.spark.a{left:8%;top:18%}.spark.b{right:10%;bottom:18%;color:var(--pink)}.spark.c{right:12%;top:20%}
.ticker{background:var(--ink);color:white;overflow:hidden;padding:16px 0}
.ticker>div{display:flex;width:max-content;animation:marquee 26s linear infinite}
.ticker span{white-space:nowrap;font:800 .86rem "Baloo 2";letter-spacing:.09em;padding-right:24px}
@keyframes marquee{to{transform:translateX(-50%)}}
.section{padding:105px 7%}
.heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:48px}
.heading h2,.events h2,.auditions h2,.about h2,.contact h2{font:800 clamp(4rem,7vw,7rem) "Baloo 2";letter-spacing:-.065em;line-height:.82}
.heading>p{max-width:440px;line-height:1.65}
.roster-preview{background:linear-gradient(180deg,#f8f6ff,#eee8ff)}
.preview-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.preview-member{
  min-height:315px;border:3px solid var(--ink);border-radius:28px;position:relative;overflow:hidden;
  display:flex;align-items:flex-end;padding:20px;box-shadow:7px 7px 0 rgba(49,38,101,.12);
  transition:transform .25s ease,box-shadow .25s ease
}
.preview-member:hover{transform:translateY(-8px);box-shadow:11px 14px 0 rgba(49,38,101,.13)}
.preview-member::before,.profile-placeholder::before{
  content:"";position:absolute;width:42%;aspect-ratio:1;border-radius:50%;left:29%;top:15%;
  background:rgba(40,30,70,.72)
}
.preview-member::after,.profile-placeholder::after{
  content:"";position:absolute;width:70%;height:60%;left:15%;bottom:-8%;
  border-radius:48% 48% 12% 12%;background:rgba(40,30,70,.72)
}
.preview-member span{position:absolute;z-index:2;top:14px;left:14px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:white;border:2px solid var(--ink);font-weight:800;font-size:.72rem}
.preview-member strong{position:relative;z-index:3;background:white;border:2px solid var(--ink);padding:8px 10px;border-radius:12px;font:800 .82rem "Baloo 2"}
.pm1{background:linear-gradient(145deg,#f9b5e4,#d46dde)}
.pm2{background:linear-gradient(145deg,#c8b9ff,#7e67ca)}
.pm3{background:linear-gradient(145deg,#b9e6ff,#6e9ed7)}
.pm4{background:linear-gradient(145deg,#ffb6bc,#c9576c)}
.pm5{background:linear-gradient(145deg,#c8f0c6,#72aa75)}
.center-action{text-align:center;margin-top:35px}
.news{background:white;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.news-list{border-top:3px solid var(--ink)}
.news-item{display:grid;grid-template-columns:110px 130px 1fr auto;gap:20px;align-items:center;padding:25px 8px;border-bottom:1px solid var(--line)}
.news-item em{font-style:normal;color:var(--pink);font-size:.72rem;font-weight:800}
.news-item strong{font-size:1.18rem}
.events{background:var(--lav2)}
.events-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:7%}
.bodycopy{line-height:1.75;margin-top:24px}
.event-stack{display:flex;flex-direction:column;gap:16px}
.event{border:3px solid var(--ink);background:white;border-radius:24px;padding:24px;display:grid;grid-template-columns:85px 1fr auto;gap:22px;align-items:center;box-shadow:7px 7px 0 rgba(49,38,101,.12)}
.date{text-align:center;border-right:1px solid var(--line)}
.date strong{display:block;font:800 2.8rem "Baloo 2";line-height:.9}
.event h3{font:800 1.35rem "Baloo 2"}
.event p{opacity:.6;font-size:.9rem}
.auditions{background:var(--purple);color:white}
.audition-card{min-height:520px;border:4px solid white;border-radius:34px;padding:60px;display:flex;align-items:center;justify-content:space-between;gap:50px;background:radial-gradient(circle at 85% 20%,rgba(240,138,248,.35),transparent 24%)}
.audition-card p:not(.eyebrow){max-width:560px;line-height:1.7;margin:25px 0;color:rgba(255,255,255,.78)}
.badge{width:210px;height:210px;border:4px solid #f08af8;border-radius:50%;display:grid;place-items:center;text-align:center;font:800 2rem/1 "Baloo 2";color:#f08af8;transform:rotate(8deg)}
.about{background:white}
.about-grid{display:grid;grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);gap:7%;align-items:center}
.about-logo-card{min-height:420px;padding:36px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(145deg,#d7c8ff,#eaa8f2);border:4px solid var(--ink);border-radius:36px;box-shadow:10px 10px 0 rgba(49,38,101,.12)}
.about-logo{display:block;width:min(100%,460px);height:auto;max-height:360px;object-fit:contain;margin:0 auto}
.contact{background:#f0edff}
.contact-card{border:4px solid var(--ink);border-radius:34px;padding:48px;background:white;display:grid;grid-template-columns:.8fr 1.2fr;gap:7%}
.contact-links{border-top:2px solid var(--ink)}
.contact-links a{display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}
footer{background:var(--dark);color:white;padding:58px 7% 28px}
.footer-top{display:flex;justify-content:space-between;gap:40px;padding-bottom:45px}
.footer-brand{display:flex;align-items:center;gap:16px;font:800 clamp(2rem,4vw,4.5rem) "Baloo 2"}
.footer-logo{width:90px;height:90px;object-fit:contain}
.footer-nav{display:grid;grid-template-columns:repeat(2,auto);gap:10px 34px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.16);padding-top:22px;display:flex;justify-content:space-between;opacity:.55;font-size:.76rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:none}

/* MEMBERS PAGE */
.members-hero{
  min-height:600px;padding:78px 7%;
  display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:50px;
  background:
    radial-gradient(circle at 80% 20%,rgba(216,75,228,.32),transparent 25%),
    linear-gradient(135deg,#e8e3fa,#c9b9f2);
  position:relative;overflow:hidden
}
.members-hero::after{
  content:"✦  MONSTA MELODIC  ✦  MONSTA MELODIC  ✦";
  position:absolute;bottom:26px;left:-20px;font:800 1rem "Baloo 2";letter-spacing:.18em;
  opacity:.18;white-space:nowrap
}
.members-hero h1{font:800 clamp(4rem,8vw,7.7rem)/.78 "Baloo 2";letter-spacing:-.075em;margin:20px 0 28px}
.members-hero h1 span{color:var(--pink)}
.members-hero-copy>p:last-child{max-width:590px;line-height:1.75;font-size:1.05rem}
.members-mark{
  width:min(330px,80vw);aspect-ratio:1;border-radius:50%;
  border:5px solid var(--ink);display:grid;place-items:center;
  font:800 clamp(5rem,10vw,9rem) "Baloo 2";
  background:rgba(255,255,255,.4);box-shadow:16px 16px 0 rgba(49,38,101,.12);
  transform:rotate(7deg)
}
.member-profiles{padding:85px 7%;display:flex;flex-direction:column;gap:34px;background:#faf8ff}
.profile-card{
  --member:#d84be4;
  display:grid;grid-template-columns:minmax(280px,.78fr) 1.22fr;
  min-height:470px;border:4px solid var(--ink);border-radius:34px;overflow:hidden;
  background:white;box-shadow:10px 10px 0 rgba(49,38,101,.11)
}
.profile-card:nth-child(even){grid-template-columns:1.22fr minmax(280px,.78fr)}
.profile-card:nth-child(even) .profile-photo-wrap{order:2}
.profile-card:nth-child(even) .profile-content{order:1}
.mc-pink{--member:#e464c9}.mc-purple{--member:#8269d9}.mc-blue{--member:#69a9df}.mc-red{--member:#db5b6d}.mc-green{--member:#7ebd7e}
.profile-photo-wrap{position:relative;overflow:hidden;background:linear-gradient(145deg,color-mix(in srgb,var(--member) 45%,white),var(--member))}
.profile-number{position:absolute;z-index:5;top:20px;left:20px;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:white;border:3px solid var(--ink);font:800 .9rem "Baloo 2"}
.profile-photo{width:100%;height:100%;object-fit:cover;position:relative;z-index:2;display:block}
.profile-placeholder{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:white;font:800 1rem "Baloo 2";letter-spacing:.14em}
.profile-placeholder span{position:relative;z-index:4}
.profile-content{padding:48px;display:flex;flex-direction:column;justify-content:center}
.profile-title{padding-bottom:28px;border-bottom:2px solid var(--ink)}
.profile-title h2{font:800 clamp(2.8rem,5vw,5.4rem)/.85 "Baloo 2";letter-spacing:-.06em;margin:10px 0 18px}
.member-color-chip{display:inline-flex;align-items:center;gap:8px;border:2px solid var(--ink);border-radius:999px;padding:7px 12px;font:800 .72rem "Baloo 2";letter-spacing:.12em;background:color-mix(in srgb,var(--member) 24%,white)}
.member-color-chip::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--member);border:1px solid var(--ink)}
.profile-facts{margin-top:12px}
.profile-facts div{display:grid;grid-template-columns:140px 1fr;gap:22px;padding:16px 0;border-bottom:1px solid var(--line)}
.profile-facts dt{font:800 .72rem "Baloo 2";text-transform:uppercase;letter-spacing:.12em;opacity:.62}
.profile-facts dd{font-weight:700}
.member-cta{padding:100px 7%;text-align:center;background:linear-gradient(135deg,#d8cff7,#f2c6ef)}
.member-cta h2{font:800 clamp(3.7rem,7vw,6.7rem)/.84 "Baloo 2";letter-spacing:-.06em;margin-top:16px}

/* DISCORD MODAL */
.discord-modal{
  position:fixed;inset:0;z-index:9999;
  display:grid;place-items:center;padding:20px;
  opacity:0;visibility:hidden;transition:.25s ease
}
.discord-modal.open{opacity:1;visibility:visible}
.discord-backdrop{position:absolute;inset:0;background:rgba(24,17,52,.74);backdrop-filter:blur(5px)}
.discord-card{
  position:relative;z-index:2;width:min(520px,100%);padding:52px 44px 38px;text-align:center;
  background:
    radial-gradient(circle at 85% 10%,rgba(216,75,228,.25),transparent 28%),
    #f7f3ff;
  border:5px solid var(--ink);border-radius:36px;box-shadow:16px 18px 0 rgba(20,14,50,.28)
}
.discord-card::before{
  content:"";position:absolute;inset:12px;border:1px dashed rgba(49,38,101,.22);border-radius:24px;pointer-events:none
}
.discord-icon{
  width:84px;height:84px;border:3px solid var(--ink);border-radius:50%;display:grid;place-items:center;
  margin:0 auto 22px;background:var(--lav);font:800 1.45rem "Baloo 2"
}
.discord-card h2{font:800 clamp(3rem,8vw,5rem)/.8 "Baloo 2";letter-spacing:-.06em;margin:12px 0 22px}
.discord-card>p:not(.eyebrow){line-height:1.65;max-width:390px;margin:0 auto 26px}
.discord-join{width:100%;position:relative;z-index:3}
.discord-later{margin-top:14px;background:none;border:0;text-decoration:underline;cursor:pointer;opacity:.65;position:relative;z-index:3}
.discord-close{position:absolute;z-index:4;right:17px;top:14px;width:40px;height:40px;border:0;background:transparent;font-size:2rem;cursor:pointer}

@media(max-width:1000px){
  .shell{width:calc(100% - 18px);margin:9px auto;border-width:4px;border-radius:28px}
  header{min-height:70px;border-bottom-width:4px}
  .menu{display:flex;flex-direction:column;gap:6px;padding:10px;z-index:120;background:none;border:0}
  .menu span{display:block;width:28px;height:3px;background:var(--ink);border-radius:99px}
  nav{position:fixed;inset:0;z-index:110;background:#d9d4ef;flex-direction:column;justify-content:center;font-size:1.15rem;transform:translateY(-100%);transition:.35s}
  nav.open{transform:none}
  .hero{grid-template-columns:1fr}
  aside{border-left:0;border-top:4px solid var(--ink);flex-direction:row;min-height:78px}
  aside>span{writing-mode:horizontal-tb}
  .preview-strip{grid-template-columns:repeat(3,1fr)}
  .events-grid,.about-grid,.contact-card{grid-template-columns:1fr}
  .event-stack{margin-top:26px}
  .members-hero{grid-template-columns:1fr;text-align:center}
  .members-hero-copy>p:last-child{margin-inline:auto}
  .members-mark{margin:auto;width:220px}
  .profile-card,.profile-card:nth-child(even){grid-template-columns:1fr}
  .profile-card:nth-child(even) .profile-photo-wrap,.profile-card:nth-child(even) .profile-content{order:initial}
  .profile-photo-wrap{min-height:500px}
}
@media(max-width:680px){
  .brand span{display:none}
  .hero-main{padding:64px 20px 54px}
  .hero-logo{width:min(480px,95%);max-height:330px}
  .section{padding:80px 20px}
  .heading{flex-direction:column;align-items:flex-start;gap:20px}
  .preview-strip{grid-template-columns:1fr 1fr}
  .preview-member{min-height:240px}
  .preview-member:last-child{grid-column:1/-1}
  .news-item{grid-template-columns:80px 1fr auto}
  .news-item em{display:none}
  .event{grid-template-columns:65px 1fr}
  .event>a{display:none}
  .audition-card{padding:36px 24px;flex-direction:column;align-items:flex-start}
  .badge{width:150px;height:150px;font-size:1.4rem}
  .about-logo-card{min-height:320px;padding:26px}
  .about-logo{width:min(100%,380px);max-height:280px}
  .contact-card{padding:30px 22px}
  .contact-links a{flex-direction:column;gap:5px}
  .footer-top{flex-direction:column}
  .footer-bottom{flex-direction:column;gap:8px}
  .members-hero{padding:70px 22px 88px}
  .members-mark{width:165px}
  .member-profiles{padding:54px 20px}
  .profile-photo-wrap{min-height:390px}
  .profile-content{padding:34px 24px}
  .profile-facts div{grid-template-columns:1fr;gap:5px}
  .member-cta{padding:82px 22px}
  .discord-card{padding:48px 24px 32px}
}


/* FIVE-MEMBER ON-PAGE IDOL ROSTER */
.members-showcase{
  background:
    linear-gradient(rgba(248,246,255,.96),rgba(248,246,255,.96)),
    repeating-linear-gradient(90deg,transparent 0 8px,rgba(49,38,101,.05) 8px 10px);
}
.idol-member-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:42px 26px;
  align-items:start;
}
.idol-member-card{
  grid-column:span 2;
  text-align:center;
}
.idol-member-card:nth-child(4){grid-column:2 / span 2}
.idol-member-card:nth-child(5){grid-column:4 / span 2}
.idol-photo{
  aspect-ratio:1 / 1;
  position:relative;
  overflow:hidden;
  border:4px solid var(--ink);
  border-radius:8px;
  box-shadow:8px 8px 0 rgba(49,38,101,.14);
}
.idol-photo::before{
  content:"";
  position:absolute;
  width:36%;
  aspect-ratio:1;
  border-radius:50%;
  left:32%;
  top:15%;
  background:rgba(40,30,70,.78);
}
.idol-photo::after{
  content:"";
  position:absolute;
  width:62%;
  height:63%;
  left:19%;
  bottom:-8%;
  border-radius:46% 46% 12% 12%;
  background:rgba(40,30,70,.78);
}
.idol-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  position:relative;
  z-index:3;
  display:block;
}
.member-pink{background:linear-gradient(145deg,#f5b5e8,#d56dde)}
.member-purple{background:linear-gradient(145deg,#cabaff,#8168cc)}
.member-blue{background:linear-gradient(145deg,#bee9ff,#6ea2dc)}
.member-red{background:linear-gradient(145deg,#ffc0c4,#ca5a6e)}
.member-green{background:linear-gradient(145deg,#cef3ca,#75ae79)}
.idol-number{
  position:absolute;
  z-index:5;
  top:12px;
  left:12px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  background:white;
  border:2px solid var(--ink);
  border-radius:50%;
  font:800 .75rem "Baloo 2";
}
.idol-info{padding:18px 5px 0}
.idol-info h3{
  font:800 clamp(1.45rem,2.2vw,2rem) "Baloo 2";
  letter-spacing:-.035em;
  margin-bottom:13px;
}
.idol-details{
  border-top:2px solid var(--ink);
  text-align:left;
}
.idol-details p{
  display:grid;
  grid-template-columns:105px 1fr;
  gap:10px;
  padding:9px 4px;
  border-bottom:1px solid var(--line);
  font-size:.82rem;
  line-height:1.4;
}
.idol-details b{
  font:800 .68rem "Baloo 2";
  text-transform:uppercase;
  letter-spacing:.07em;
  opacity:.68;
}
.idol-details span{font-weight:600}
.color-dot{
  display:inline-block;
  width:10px;height:10px;
  border-radius:50%;
  margin-right:5px;
  border:1px solid var(--ink);
}
.pink-dot{background:#e464c9}
.purple-dot{background:#8269d9}
.blue-dot{background:#69a9df}
.red-dot{background:#db5b6d}
.green-dot{background:#7ebd7e}

@media(max-width:900px){
  .idol-member-grid{grid-template-columns:repeat(2,1fr)}
  .idol-member-card,
  .idol-member-card:nth-child(4),
  .idol-member-card:nth-child(5){grid-column:auto}
  .idol-member-card:last-child{grid-column:1 / -1;width:calc(50% - 13px);justify-self:center}
}
@media(max-width:600px){
  .idol-member-grid{grid-template-columns:1fr;gap:42px}
  .idol-member-card:last-child{grid-column:auto;width:100%}
  .idol-details p{grid-template-columns:110px 1fr}
}


/* APPLICATIONS PAGE */
.applications-main{
  background:
    radial-gradient(circle at 18% 14%,rgba(216,75,228,.13),transparent 24%),
    linear-gradient(180deg,#fbfaff,#f3efff);
}
.applications-hero{
  min-height:510px;padding:72px 7%;
  display:grid;grid-template-columns:.72fr 1.28fr;gap:7%;align-items:center;
  background:
    radial-gradient(circle at 82% 22%,rgba(240,138,248,.34),transparent 27%),
    linear-gradient(145deg,#d7d0ee,#c7bce8);
  border-bottom:4px solid var(--ink);position:relative;overflow:hidden
}
.applications-hero::after{
  content:"KAIJU CREW ✦ KAIJU CREW ✦ KAIJU CREW ✦";
  position:absolute;left:-10px;bottom:20px;white-space:nowrap;
  font:800 .78rem "Baloo 2";letter-spacing:.18em;opacity:.17
}
.applications-logo{min-height:330px;display:grid;place-items:center}
.applications-logo img{
  width:min(100%,390px);max-height:330px;object-fit:contain;
  filter:drop-shadow(0 12px 0 rgba(49,38,101,.10))
}
.applications-intro h1{
  font:800 clamp(4rem,8vw,7rem)/.8 "Baloo 2";
  letter-spacing:-.07em;margin:14px 0 26px
}
.applications-intro h1 span{color:var(--pink)}
.applications-intro>p:last-child{max-width:620px;line-height:1.75;font-size:1.05rem}
.applications-section{padding:86px 7% 105px}
.applications-heading{text-align:center;margin-bottom:58px}
.applications-heading h2{
  font:800 clamp(3.8rem,7vw,6.6rem)/.85 "Baloo 2";
  letter-spacing:-.06em;margin:10px 0 18px
}
.applications-heading>p:last-child{opacity:.65}
.application-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:38px 44px;max-width:1080px;margin:0 auto
}
.kaiju-application{
  min-height:178px;position:relative;
  display:grid;grid-template-columns:88px 1fr;gap:18px;align-items:center;
  padding:24px 30px;
  background:linear-gradient(145deg,#d84f95,#c94786);
  color:#fff;border:4px solid var(--ink);border-radius:34px;
  box-shadow:9px 10px 0 rgba(49,38,101,.16);
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease
}
.kaiju-application:nth-child(2){background:linear-gradient(145deg,#a55cdf,#7e57c6)}
.kaiju-application:nth-child(3){background:linear-gradient(145deg,#785bc6,#5f50a8)}
.kaiju-application:nth-child(4){background:linear-gradient(145deg,#ec6fcb,#c94eae)}
.kaiju-application:hover{
  transform:translateY(-8px) rotate(-.5deg);
  box-shadow:13px 16px 0 rgba(49,38,101,.16);
  filter:saturate(1.08)
}
.horn{
  position:absolute;top:-28px;width:44px;height:52px;background:var(--ink);
  clip-path:polygon(50% 0,100% 100%,0 100%)
}
.horn::after{
  content:"";position:absolute;inset:7px 8px 2px;background:#fff;
  clip-path:polygon(50% 0,100% 100%,0 100%)
}
.horn-left{left:44px;transform:rotate(-13deg)}
.horn-right{right:44px;transform:rotate(13deg)}
.application-icon{
  width:72px;height:72px;display:grid;place-items:center;border:3px solid #fff;
  border-radius:50%;font:800 2rem "Baloo 2";background:rgba(255,255,255,.12)
}
.application-copy{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.application-copy small{
  font:800 .67rem "Baloo 2";letter-spacing:.13em;text-transform:uppercase;opacity:.8
}
.application-copy strong{
  font:800 clamp(1.5rem,2.4vw,2.2rem)/.98 "Baloo 2";letter-spacing:-.03em
}
.application-copy em{
  margin-top:4px;font-style:normal;font-size:.78rem;font-weight:800;opacity:.82
}
.applications-note{
  margin:70px auto 0;max-width:1080px;border:3px solid var(--ink);
  border-radius:28px;background:white;padding:28px 32px;
  display:flex;justify-content:space-between;align-items:center;gap:28px
}
.applications-note h3{font:800 1.5rem "Baloo 2";margin-top:5px}

@media(max-width:900px){
  .applications-hero{grid-template-columns:1fr;text-align:center}
  .applications-intro>p:last-child{margin:auto}
  .applications-logo{min-height:240px}
  .applications-logo img{max-height:240px}
  .application-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .applications-hero{padding:58px 22px 72px}
  .applications-section{padding:68px 20px 85px}
  .kaiju-application{grid-template-columns:66px 1fr;padding:22px 20px;min-height:155px}
  .application-icon{width:58px;height:58px;font-size:1.6rem}
  .horn{width:34px;height:42px;top:-22px}
  .horn-left{left:28px}.horn-right{right:28px}
  .applications-note{flex-direction:column;align-items:flex-start}
}

.audition-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}.audition-actions .ghost{color:#fff;border-color:#fff;background:rgba(255,255,255,.08)}.application-grid .kaiju-application:nth-child(5){background:linear-gradient(145deg,#7755b8,#5a448f)}.application-grid .kaiju-application:nth-child(6){background:linear-gradient(145deg,#df69ba,#b94a98)}
/* IDOL APPLICATIONS PAGE */
.idol-app-main{background:radial-gradient(circle at 15% 10%,rgba(216,75,228,.12),transparent 23%),linear-gradient(180deg,#faf8ff,#f3efff)}.idol-app-hero{min-height:610px;padding:76px 7%;display:grid;grid-template-columns:.75fr 1.25fr;gap:7%;align-items:center;background:radial-gradient(circle at 82% 20%,rgba(240,138,248,.28),transparent 26%),radial-gradient(circle at 10% 82%,rgba(102,80,173,.20),transparent 28%),linear-gradient(145deg,#ddd7f0,#c9b9f2);border-bottom:5px solid var(--ink);position:relative;overflow:hidden}.idol-app-hero::after{content:"MONSTA MELODIC ✦ IDOL AUDITIONS ✦ MONSTA MELODIC ✦";position:absolute;bottom:18px;left:-12px;white-space:nowrap;font:800 .75rem "Baloo 2";letter-spacing:.16em;opacity:.18}.idol-app-logo{display:grid;place-items:center}.idol-app-logo img{width:min(100%,430px);max-height:370px;object-fit:contain;filter:drop-shadow(0 14px 0 rgba(49,38,101,.10))}.idol-app-intro h1{font:800 clamp(3.6rem,7vw,6.8rem)/.84 "Baloo 2";letter-spacing:-.065em;margin:15px 0 24px}.idol-app-intro h1 span{color:var(--pink)}.idol-app-intro>p:last-of-type{max-width:650px;font-size:1.04rem;line-height:1.75}.idol-top-apply{margin-top:26px}.idol-info-section{padding:95px 7% 115px}.idol-info-heading{text-align:center;max-width:850px;margin:0 auto 52px}.idol-info-heading h2{font:800 clamp(3.6rem,7vw,6.4rem)/.86 "Baloo 2";letter-spacing:-.06em;margin:10px 0 16px}.idol-info-heading>p:last-child{opacity:.68}.idol-accordion-wrap{max-width:1080px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.idol-accordion{border:4px solid var(--ink);border-radius:30px;background:white;overflow:hidden;box-shadow:8px 9px 0 rgba(49,38,101,.10)}.idol-accordion summary{list-style:none;cursor:pointer;padding:28px 32px;display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(135deg,#d8cff5,#efc7eb);font:800 clamp(1.35rem,2.7vw,2.15rem) "Baloo 2"}.idol-accordion summary::-webkit-details-marker{display:none}.accordion-plus{width:42px;height:42px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;font:800 1.4rem "Baloo 2";transition:transform .25s ease;background:#fff}.idol-accordion[open] .accordion-plus{transform:rotate(45deg)}.idol-accordion-body{padding:34px;border-top:3px solid var(--ink)}.requirements-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.requirement-card{border:2px solid var(--ink);border-radius:22px;padding:24px;background:#fbfaff}.req-num{display:inline-grid;place-items:center;width:38px;height:38px;border:2px solid var(--ink);border-radius:50%;font:800 .72rem "Baloo 2";background:var(--lav);margin-bottom:15px}.requirement-card h3{font:800 1.35rem "Baloo 2";margin-bottom:8px}.requirement-card p{line-height:1.65;opacity:.8}.submission-intro{max-width:760px;line-height:1.7;margin-bottom:30px}.submission-guides{display:flex;flex-direction:column;gap:28px}.submission-guide{display:grid;grid-template-columns:.72fr 1.28fr;gap:32px;align-items:center;padding:26px;border:2px solid var(--ink);border-radius:24px;background:#fbfaff}.submission-guide:nth-child(even){grid-template-columns:1.28fr .72fr}.submission-guide:nth-child(even) .guide-copy{order:2}.submission-guide:nth-child(even) img{order:1}.submission-guide h3{font:800 2rem "Baloo 2";margin:7px 0 10px}.submission-guide p:not(.eyebrow){line-height:1.65;opacity:.8}.submission-guide img{width:100%;border:3px solid var(--ink);border-radius:18px;display:block;background:#fff}.idol-apply-panel{margin:72px auto 0;max-width:1080px;text-align:center;padding:58px 42px 66px;border:4px solid var(--ink);border-radius:36px;background:radial-gradient(circle at 80% 18%,rgba(216,75,228,.24),transparent 24%),linear-gradient(145deg,#d7cdf5,#efc4e8);box-shadow:10px 12px 0 rgba(49,38,101,.12);position:relative}.apply-monster-mark{width:74px;height:74px;display:grid;place-items:center;margin:0 auto 15px;border:3px solid var(--ink);border-radius:50%;background:#fff;font-size:1.7rem}.idol-apply-panel h2{font:800 clamp(3rem,6vw,5.6rem)/.86 "Baloo 2";letter-spacing:-.055em;margin:10px 0 18px}.idol-apply-panel>p:last-of-type{max-width:680px;margin:0 auto;line-height:1.7}.monster-apply-button{width:min(560px,92%);min-height:120px;margin:48px auto 0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:linear-gradient(145deg,#d84be4,#8c5bdd);color:#fff;border:4px solid var(--ink);border-radius:30px;box-shadow:9px 10px 0 rgba(49,38,101,.16);transition:transform .2s ease,box-shadow .2s ease}.monster-apply-button:hover{transform:translateY(-6px);box-shadow:13px 16px 0 rgba(49,38,101,.15)}.monster-apply-button strong{font:800 clamp(1.8rem,4vw,2.7rem) "Baloo 2"}.monster-apply-button>span:last-child{font-size:.8rem;font-weight:700;opacity:.85}.apply-horn{position:absolute;top:-35px;width:48px;height:58px;background:var(--ink);clip-path:polygon(50% 0,100% 100%,0 100%)}.apply-horn::after{content:"";position:absolute;inset:8px 8px 3px;background:#fff;clip-path:polygon(50% 0,100% 100%,0 100%)}.apply-horn.left{left:60px;transform:rotate(-13deg)}.apply-horn.right{right:60px;transform:rotate(13deg)}.apply-tail{position:absolute;right:-42px;bottom:-20px;width:88px;height:88px;border-right:12px solid var(--ink);border-bottom:12px solid var(--ink);border-radius:0 0 70px 0;transform:rotate(18deg)}.apply-tail::after{content:"";position:absolute;right:-17px;bottom:-17px;width:30px;height:30px;background:var(--ink);clip-path:polygon(50% 0,100% 100%,0 78%);transform:rotate(-15deg)}@media(max-width:900px){.idol-app-hero{grid-template-columns:1fr;text-align:center}.idol-app-intro>p:last-of-type{margin-inline:auto}.idol-app-logo img{max-height:270px}.requirements-grid{grid-template-columns:1fr}.submission-guide,.submission-guide:nth-child(even){grid-template-columns:1fr}.submission-guide:nth-child(even) .guide-copy,.submission-guide:nth-child(even) img{order:initial}}@media(max-width:600px){.audition-actions{flex-direction:column;align-items:stretch}.audition-actions .btn{width:100%}.idol-app-hero{padding:58px 22px 75px}.idol-info-section{padding:72px 20px 90px}.idol-accordion summary{padding:22px 20px}.idol-accordion-body{padding:22px 18px}.submission-guide{padding:18px}.idol-apply-panel{padding:45px 22px 58px}.monster-apply-button{width:100%}.apply-horn.left{left:28px}.apply-horn.right{right:28px}.apply-tail{right:-20px;transform:scale(.8) rotate(18deg)}}


/* =========================================================
   MONSTA MELODIC — OOMPH REDESIGN
   ========================================================= */
:root{
  --neon-pink:#ff48ef;
  --electric-purple:#9f2cff;
  --violet-deep:#2f2067;
  --acid-lav:#c4b6ff;
  --monster-black:#171126;
  --glass:rgba(255,255,255,.62);
}

body{
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-4;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 15%,rgba(255,72,239,.13),transparent 23%),
    radial-gradient(circle at 82% 76%,rgba(159,44,255,.16),transparent 27%);
}
.shell{
  position:relative;
  z-index:2;
  box-shadow:
    0 34px 100px rgba(29,19,72,.36),
    0 0 0 1px rgba(255,255,255,.24) inset;
}
header{
  background:rgba(201,185,242,.88);
  backdrop-filter:blur(18px) saturate(1.18);
  -webkit-backdrop-filter:blur(18px) saturate(1.18);
}
.brand-logo{
  filter:drop-shadow(0 5px 8px rgba(49,38,101,.18));
  transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.brand:hover .brand-logo{transform:rotate(-5deg) scale(1.08)}
nav a{transition:transform .2s ease,color .2s ease}
nav a:hover{transform:translateY(-2px);color:var(--pink)}

.hero-main,.applications-hero,.idol-app-hero{
  position:relative;
}
.hero-main::after,.applications-hero::before,.idol-app-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.18) 43%,transparent 48% 100%);
  transform:translateX(-100%);
  animation:heroSweep 8s ease-in-out infinite 2s;
}
@keyframes heroSweep{
  0%,58%,100%{transform:translateX(-115%)}
  72%{transform:translateX(115%)}
}
.hero-logo,.applications-logo img,.idol-app-logo img{
  animation:logoFloat 5.5s ease-in-out infinite;
  filter:drop-shadow(0 16px 18px rgba(49,38,101,.16));
}
@keyframes logoFloat{
  0%,100%{transform:translateY(0) rotate(-.5deg)}
  50%{transform:translateY(-10px) rotate(.6deg)}
}
.hero-copy h1 span,
.applications-intro h1 span,
.idol-app-intro h1 span{
  background:linear-gradient(90deg,var(--pink),#ff6bd8,var(--electric-purple),var(--pink));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
  animation:monsterGradient 6s linear infinite;
}
@keyframes monsterGradient{to{background-position:220% 0}}

.btn{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.btn::after{
  content:"";
  position:absolute;
  inset:-3px;
  z-index:-1;
  background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.5) 46%,transparent 60%);
  transform:translateX(-120%);
  transition:transform .5s ease;
}
.btn:hover::after{transform:translateX(120%)}
.btn:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(49,38,101,.16)}
.primary{
  box-shadow:0 8px 0 rgba(32,23,63,.18);
}
.primary:hover{box-shadow:0 11px 0 rgba(32,23,63,.14)}

.heading h2,.events h2,.auditions h2,.about h2,.contact h2,
.applications-heading h2,.idol-info-heading h2{
  text-shadow:0 5px 0 rgba(102,80,173,.08);
}
.section,.applications-section,.idol-info-section{
  position:relative;
}
.section::before,.applications-section::before,.idol-info-section::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;height:13px;
  opacity:.28;
  background:
    radial-gradient(circle at 10px -2px,var(--ink) 0 8px,transparent 9px) 0 0/28px 14px repeat-x;
  pointer-events:none;
}

/* monster eyes */
.monster-eyes{
  position:absolute;
  z-index:1;
  display:flex;
  gap:12px;
  pointer-events:none;
  opacity:.27;
  filter:drop-shadow(0 0 12px rgba(216,75,228,.25));
}
.monster-eyes span{
  width:38px;height:25px;
  border:3px solid var(--ink);
  border-radius:50% 50% 44% 44%;
  background:rgba(255,255,255,.66);
  display:grid;place-items:center;
  transform:rotate(-6deg);
  animation:monsterBlink 5.2s infinite;
}
.monster-eyes span:nth-child(2){transform:rotate(6deg);animation-delay:.08s}
.monster-eyes i{
  width:9px;height:13px;
  border-radius:50%;
  background:var(--pink);
  box-shadow:0 0 9px rgba(216,75,228,.65);
  animation:pupilLook 7s ease-in-out infinite;
}
.monster-eyes-1{right:7%;top:12%}
.monster-eyes-2{right:6%;bottom:13%}
.monster-eyes-3{left:8%;bottom:13%}
@keyframes monsterBlink{
  0%,44%,48%,100%{transform:scaleY(1)}
  46%{transform:scaleY(.08)}
}
@keyframes pupilLook{
  0%,100%{transform:translateX(-4px)}
  50%{transform:translateX(4px)}
}

/* Member cards */
.idol-member-card{
  --tilt-x:0deg;--tilt-y:0deg;
  transform:perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
  transition:transform .16s ease,filter .22s ease;
}
.idol-member-card:hover{filter:drop-shadow(0 16px 16px rgba(49,38,101,.13))}
.idol-photo{
  transition:transform .28s ease,box-shadow .28s ease;
}
.idol-member-card:hover .idol-photo{
  transform:translateY(-5px);
  box-shadow:10px 14px 0 rgba(49,38,101,.15);
}
.idol-photo::selection{background:transparent}

/* Application cards */
.kaiju-application,.requirement-card{
  --tilt-x:0deg;--tilt-y:0deg;
  transform:perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
}
.kaiju-application::after{
  content:"";
  position:absolute;
  left:15%;right:15%;bottom:-8px;height:14px;
  background:
    radial-gradient(circle at 10px 0,#fff 0 6px,transparent 7px) 0 0/24px 14px repeat-x;
  opacity:.18;
  pointer-events:none;
}
.horn,.apply-horn{filter:drop-shadow(0 5px 0 rgba(49,38,101,.08))}

/* Accordion polish */
.idol-accordion summary{
  position:relative;
  overflow:hidden;
}
.idol-accordion summary::before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.3) 47%,transparent 62%);
  transform:translateX(-120%);
  transition:transform .6s ease;
}
.idol-accordion summary:hover::before{transform:translateX(120%)}

/* ambient */
.monster-ambient{
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  overflow:hidden;
}
.goo-orb{
  position:absolute;
  border-radius:42% 58% 63% 37% / 52% 44% 56% 48%;
  filter:blur(1px);
  opacity:.22;
  animation:gooMorph 13s ease-in-out infinite alternate;
}
.goo-a{width:230px;height:230px;left:-75px;top:18%;background:#ff56df}
.goo-b{width:320px;height:320px;right:-110px;top:48%;background:#7e56d1;animation-delay:-4s}
.goo-c{width:180px;height:180px;left:17%;bottom:-90px;background:#b494ff;animation-delay:-7s}
@keyframes gooMorph{
  0%{transform:translate3d(0,0,0) rotate(0deg);border-radius:42% 58% 63% 37% / 52% 44% 56% 48%}
  100%{transform:translate3d(22px,-24px,0) rotate(17deg);border-radius:61% 39% 42% 58% / 37% 61% 39% 63%}
}
.ambient-spark{
  position:absolute;
  color:#fff;
  text-shadow:0 0 18px rgba(216,75,228,.6);
  opacity:.36;
  animation:sparkDrift 9s ease-in-out infinite;
}
.spark-1{left:4%;top:66%;font-size:1.7rem}
.spark-2{right:5%;top:23%;font-size:1.25rem;animation-delay:-3s}
.spark-3{right:15%;bottom:7%;font-size:1rem;animation-delay:-6s}
@keyframes sparkDrift{
  0%,100%{transform:translateY(0) rotate(0)}
  50%{transform:translateY(-18px) rotate(18deg)}
}

/* cursor aura */
.cursor-aura{
  position:fixed;
  left:-18px;top:-18px;
  width:36px;height:36px;
  z-index:10000;
  border-radius:50%;
  pointer-events:none;
  border:1px solid rgba(216,75,228,.38);
  box-shadow:0 0 22px rgba(216,75,228,.18);
  transition:width .18s ease,height .18s ease,margin .18s ease,background .18s ease;
  mix-blend-mode:multiply;
}
.cursor-aura.is-hot{
  width:54px;height:54px;
  margin:-9px 0 0 -9px;
  background:rgba(216,75,228,.08);
}

/* page transitions */
body{
  transition:opacity .26s ease,transform .26s ease;
}
body.page-leaving{
  opacity:0;
  transform:scale(.992);
}

/* LOADER */
body.is-loading{overflow:hidden}
.monsta-loader{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 50% 42%,rgba(159,44,255,.32),transparent 27%),
    linear-gradient(145deg,#151024,#281a58 52%,#3c236c);
  transition:opacity .7s ease,visibility .7s ease,transform .7s cubic-bezier(.7,0,.2,1);
}
.monsta-loader::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:
    repeating-conic-gradient(from 0deg,rgba(255,255,255,.035) 0 7deg,transparent 7deg 18deg);
  animation:loaderSpin 28s linear infinite;
}
@keyframes loaderSpin{to{transform:rotate(360deg)}}
.monsta-loader.loader-exit{
  opacity:0;
  visibility:hidden;
  transform:scale(1.04);
}
.loader-inner{
  width:min(520px,84vw);
  text-align:center;
  position:relative;
  z-index:2;
}
.loader-logo-shell{
  width:min(260px,55vw);
  aspect-ratio:1;
  margin:0 auto 18px;
  display:grid;
  place-items:center;
  position:relative;
}
.loader-logo-shell img{
  width:88%;
  position:relative;
  z-index:2;
  animation:loaderLogo 1.2s cubic-bezier(.2,.8,.2,1) both;
  filter:drop-shadow(0 18px 25px rgba(0,0,0,.24));
}
@keyframes loaderLogo{
  from{opacity:0;transform:scale(.72) rotate(-8deg)}
  to{opacity:1;transform:scale(1) rotate(0)}
}
.loader-ring{
  position:absolute;
  inset:8%;
  border:2px dashed rgba(255,255,255,.33);
  border-radius:50%;
  animation:loaderRing 8s linear infinite;
}
.ring-two{
  inset:0;
  border-style:solid;
  border-color:rgba(255,72,239,.24);
  animation-direction:reverse;
  animation-duration:11s;
}
@keyframes loaderRing{to{transform:rotate(360deg)}}
.loader-kicker{
  font:800 .72rem "Baloo 2";
  letter-spacing:.28em;
  color:#e2d7ff;
}
.loader-inner h2{
  font:800 clamp(1.35rem,4vw,2rem) "Baloo 2";
  letter-spacing:.03em;
  margin:8px 0 19px;
}
.loader-dots{
  display:inline-block;
  width:28px;
  overflow:hidden;
  vertical-align:bottom;
  animation:loaderDots 1.2s steps(4,end) infinite;
}
@keyframes loaderDots{0%{width:0}100%{width:28px}}
.loader-track{
  width:100%;
  height:7px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:999px;
  padding:1px;
  background:rgba(255,255,255,.05);
}
.loader-track span{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#ff4be9,#a838ff,#c7b8ff);
  transform-origin:left;
  animation:loaderProgress 1.35s cubic-bezier(.3,.8,.3,1) forwards;
  box-shadow:0 0 18px rgba(255,72,239,.5);
}
@keyframes loaderProgress{
  from{transform:scaleX(.03)}
  to{transform:scaleX(1)}
}
.loader-status{
  margin-top:12px;
  font:700 .62rem "Baloo 2";
  letter-spacing:.18em;
  opacity:.62;
}
.loader-creature{
  position:absolute;
  width:160px;height:110px;
  opacity:.15;
}
.loader-creature::before{
  content:"";
  position:absolute;
  inset:20px 0 0;
  background:#fff;
  border-radius:50% 50% 42% 42%;
}
.loader-creature::after{
  content:"";
  position:absolute;
  left:17px;right:17px;bottom:-20px;height:45px;
  background:
    radial-gradient(circle at 14px 0,#fff 0 14px,transparent 15px) 0 0/42px 45px repeat-x;
}
.loader-creature i{
  position:absolute;
  top:50px;
  z-index:2;
  width:18px;height:24px;
  background:#271950;
  border-radius:50%;
  animation:monsterBlink 4s infinite;
}
.loader-creature i:first-child{left:45px}
.loader-creature i:last-child{right:45px}
.loader-creature-left{left:-42px;bottom:5%;transform:rotate(8deg)}
.loader-creature-right{right:-38px;top:8%;transform:rotate(-12deg) scale(.8)}

@media(max-width:680px){
  .monster-eyes{opacity:.18;transform:scale(.78)}
  .cursor-aura{display:none}
  .loader-creature{opacity:.08}
}

/* Respect accessibility preferences */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
  .cursor-aura{display:none}
}


/* =========================================================
   MOBILE + NAVIGATION STABILITY FIX
   ========================================================= */
html,body{max-width:100%;overflow-x:hidden}
body.nav-open{overflow:hidden!important;touch-action:none}

@media(max-width:1000px){
  .shell{
    width:calc(100% - 12px)!important;
    margin:6px auto!important;
    border-width:3px!important;
    border-radius:22px!important;
  }
  header{
    min-height:68px!important;
    height:68px;
    padding:0 16px!important;
    position:sticky!important;
    top:0!important;
  }
  .brand-logo{width:42px!important;height:42px!important}
  .menu{
    display:flex!important;
    position:relative;
    z-index:10002!important;
    width:48px;height:48px;
    align-items:center;justify-content:center;
    padding:0!important;
  }
  .menu span{
    position:absolute;
    width:27px!important;height:3px!important;
    transition:transform .25s ease,top .25s ease;
  }
  .menu span:first-child{top:18px}
  .menu span:last-child{top:27px}
  .menu[aria-expanded="true"] span:first-child{top:23px;transform:rotate(45deg)}
  .menu[aria-expanded="true"] span:last-child{top:23px;transform:rotate(-45deg)}
  header nav{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    min-height:100vh!important;
    z-index:10001!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:16px!important;
    padding:88px 24px 42px!important;
    background:
      radial-gradient(circle at 50% 22%,rgba(216,75,228,.18),transparent 25%),
      linear-gradient(160deg,#e7e0fa 0%,#c9b9f2 100%)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    transform:translateY(-105%)!important;
    opacity:0;
    visibility:hidden;
    transition:transform .32s ease,opacity .24s ease,visibility .32s!important;
  }
  header nav.open{
    transform:translateY(0)!important;
    opacity:1!important;
    visibility:visible!important;
  }
  header nav a{
    display:block!important;
    width:min(330px,86vw)!important;
    padding:10px 14px!important;
    text-align:center!important;
    font:800 clamp(1.05rem,4.7vw,1.35rem) "Baloo 2"!important;
    line-height:1.1!important;
    letter-spacing:.12em!important;
    white-space:normal!important;
  }
  header nav .pill{
    margin-top:4px;
    padding:12px 18px!important;
  }
  .hero{min-height:auto!important}
  .hero-main{min-height:auto!important;padding-top:52px!important}
  .hero-logo{width:min(420px,88vw)!important;max-height:300px!important}
  .hero-copy h1{font-size:clamp(2rem,9vw,3.15rem)!important}
  .heading h2,.events h2,.auditions h2,.about h2,.contact h2,
  .applications-heading h2,.idol-info-heading h2{font-size:clamp(3rem,14vw,5rem)!important}
}

@media(max-width:680px){
  .section{padding:66px 18px!important}
  .hero-copy{margin-top:20px!important}
  .hero-copy>p:last-of-type{font-size:.98rem!important}
  .actions{gap:10px!important}
  .actions .btn{width:100%!important}
  aside{min-height:68px!important;gap:10px!important}
  aside a{width:36px!important;height:36px!important}
  .ticker span{font-size:.72rem!important}
  .idol-member-grid{gap:34px!important}
  .news-item{
    grid-template-columns:1fr auto!important;
    gap:8px 12px!important;
    padding:20px 4px!important;
  }
  .news-item>span{font-size:.78rem!important}
  .news-item strong{grid-column:1/2;font-size:1rem!important}
  .news-item b{grid-row:1/3;grid-column:2;align-self:center}
  .event{padding:18px!important;gap:14px!important}
  .audition-card{min-height:auto!important}
  .footer-brand{font-size:clamp(1.7rem,8vw,2.7rem)!important}
  .footer-logo{width:64px!important;height:64px!important}
  .discord-card{max-height:88dvh;overflow-y:auto}
}

/* When returning with browser Back/Forward, never leave the page transparent. */
body:not(.page-leaving){opacity:1!important;transform:none!important}


/* =========================================================
   TIMETREE CALENDAR PAGE
   ========================================================= */
.calendar-cta{
  margin-top:28px;
}

.calendar-main{
  background:
    radial-gradient(circle at 85% 12%,rgba(216,75,228,.14),transparent 22%),
    linear-gradient(180deg,#f8f6ff,#efebff);
}

.calendar-hero{
  min-height:560px;
  padding:72px 7%;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:7%;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-bottom:5px solid var(--ink);
  background:
    radial-gradient(circle at 78% 24%,rgba(240,138,248,.28),transparent 26%),
    linear-gradient(145deg,#ddd7f0,#c9b9f2);
}

.calendar-hero::after{
  content:"EVENTS ✦ LIVE ✦ STREAMS ✦ RELEASES ✦ MONSTA MELODIC ✦";
  position:absolute;
  left:-12px;
  bottom:18px;
  white-space:nowrap;
  font:800 .74rem "Baloo 2";
  letter-spacing:.18em;
  opacity:.17;
}

.calendar-hero-copy h1{
  font:800 clamp(4rem,8vw,7.3rem)/.8 "Baloo 2";
  letter-spacing:-.07em;
  margin:14px 0 26px;
}

.calendar-hero-copy h1 span{
  background:linear-gradient(90deg,var(--pink),#ff6bd8,#9f2cff,var(--pink));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:monsterGradient 6s linear infinite;
}

.calendar-hero-copy>p:last-of-type{
  max-width:610px;
  line-height:1.75;
}

.calendar-actions{
  justify-content:flex-start;
}

.calendar-hero-art{
  display:grid;
  place-items:center;
}

.calendar-orbit{
  width:min(360px,78vw);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  position:relative;
  border:3px dashed rgba(49,38,101,.28);
  border-radius:50%;
  animation:calendarOrbit 18s linear infinite;
}

.calendar-orbit::before,
.calendar-orbit::after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:2px solid rgba(216,75,228,.2);
}

.calendar-orbit::before{inset:10%}
.calendar-orbit::after{inset:-9%}

.calendar-orbit img{
  width:72%;
  animation:calendarCounterOrbit 18s linear infinite,logoFloat 5.5s ease-in-out infinite;
  filter:drop-shadow(0 14px 18px rgba(49,38,101,.18));
}

.orbit-star{
  position:absolute;
  font-size:2rem;
  color:#fff;
  text-shadow:2px 2px 0 var(--pink);
}
.star-a{top:1%;left:48%}
.star-b{right:0;bottom:20%;color:var(--pink)}
.star-c{left:3%;bottom:23%}

@keyframes calendarOrbit{to{transform:rotate(360deg)}}
@keyframes calendarCounterOrbit{to{transform:rotate(-360deg)}}

.calendar-section{
  padding:92px 7% 110px;
  position:relative;
}

.calendar-section-heading{
  max-width:820px;
  margin:0 auto 48px;
  text-align:center;
}

.calendar-section-heading h2{
  font:800 clamp(3.6rem,7vw,6.2rem)/.86 "Baloo 2";
  letter-spacing:-.06em;
  margin:10px 0 17px;
}

.calendar-section-heading>p:last-child{
  opacity:.68;
}

.calendar-frame-shell{
  max-width:1080px;
  margin:0 auto;
  padding:20px;
  position:relative;
  border:4px solid var(--ink);
  border-radius:38px;
  background:
    radial-gradient(circle at 90% 8%,rgba(216,75,228,.18),transparent 22%),
    linear-gradient(145deg,#d9cff7,#c2b3ed);
  box-shadow:12px 14px 0 rgba(49,38,101,.13);
}

.calendar-frame-shell iframe{
  display:block;
  width:100%;
  min-height:700px;
  aspect-ratio:680/720;
  border:0;
  border-radius:24px;
  background:#fff;
}

.calendar-horns span{
  position:absolute;
  z-index:3;
  top:-34px;
  width:50px;
  height:60px;
  background:var(--ink);
  clip-path:polygon(50% 0,100% 100%,0 100%);
}

.calendar-horns span::after{
  content:"";
  position:absolute;
  inset:8px 8px 3px;
  background:#fff;
  clip-path:polygon(50% 0,100% 100%,0 100%);
}

.calendar-horns span:first-child{
  left:72px;
  transform:rotate(-12deg);
}

.calendar-horns span:last-child{
  right:72px;
  transform:rotate(12deg);
}

.calendar-tail{
  position:absolute;
  z-index:-1;
  right:-48px;
  bottom:-22px;
  width:98px;
  height:98px;
  border-right:13px solid var(--ink);
  border-bottom:13px solid var(--ink);
  border-radius:0 0 78px 0;
  transform:rotate(18deg);
}

.calendar-tail::after{
  content:"";
  position:absolute;
  right:-18px;
  bottom:-18px;
  width:32px;
  height:32px;
  background:var(--ink);
  clip-path:polygon(50% 0,100% 100%,0 78%);
}

.calendar-mobile-note{
  max-width:740px;
  margin:30px auto 0;
  text-align:center;
  font-size:.86rem;
  opacity:.62;
}

@media(max-width:900px){
  .calendar-hero{
    grid-template-columns:1fr;
    text-align:center;
    padding-top:58px;
  }

  .calendar-hero-copy>p:last-of-type{
    margin-inline:auto;
  }

  .calendar-actions{
    justify-content:center;
  }

  .calendar-orbit{
    width:min(260px,68vw);
  }

  .calendar-frame-shell{
    padding:12px;
    border-radius:28px;
  }

  .calendar-frame-shell iframe{
    min-height:680px;
    border-radius:18px;
  }
}

@media(max-width:600px){
  .calendar-hero{
    padding:52px 20px 75px;
    min-height:auto;
  }

  .calendar-hero-copy h1{
    font-size:clamp(3.1rem,15vw,4.8rem);
  }

  .calendar-actions{
    flex-direction:column;
  }

  .calendar-actions .btn{
    width:100%;
  }

  .calendar-section{
    padding:72px 14px 88px;
  }

  .calendar-section-heading{
    padding-inline:8px;
  }

  .calendar-frame-shell{
    padding:8px;
    border-width:3px;
    border-radius:24px;
    box-shadow:7px 8px 0 rgba(49,38,101,.12);
  }

  .calendar-frame-shell iframe{
    min-height:620px;
    aspect-ratio:auto;
  }

  .calendar-horns span{
    width:35px;
    height:44px;
    top:-25px;
  }

  .calendar-horns span:first-child{left:30px}
  .calendar-horns span:last-child{right:30px}

  .calendar-tail{
    right:-17px;
    bottom:-11px;
    transform:scale(.65) rotate(18deg);
    transform-origin:bottom right;
  }
}


/* =========================================================
   TITLE CLIPPING + DEDICATED MEMBERS PAGE UPDATE
   ========================================================= */

/* Keep the big branded titles inside their cards/viewport.
   The small inline padding prevents rounded Baloo glyphs from being clipped
   against an overflow boundary. */
.hero-copy,
.applications-intro,
.idol-app-intro,
.calendar-hero-copy,
.members-page-hero-copy{
  min-width:0;
  max-width:100%;
}

.hero-copy h1,
.applications-intro h1,
.idol-app-intro h1,
.calendar-hero-copy h1,
.members-page-hero-copy h1{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  padding-inline:.10em;
  overflow:visible;
  overflow-wrap:normal;
  word-break:normal;
  text-wrap:balance;
}

.hero-copy h1{
  font-size:clamp(2rem,3.45vw,3.35rem);
  max-width:760px;
  margin-inline:auto;
}

@media(max-width:680px){
  .hero-copy h1{
    font-size:clamp(2rem,8.2vw,2.95rem)!important;
    padding-inline:.14em!important;
  }

  .applications-intro h1,
  .idol-app-intro h1,
  .calendar-hero-copy h1,
  .members-page-hero-copy h1{
    padding-inline:.12em;
  }
}

/* Homepage member teaser */
.members-home-teaser{
  min-height:560px;
  padding:78px 7%;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:7%;
  align-items:center;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 18%,rgba(216,75,228,.17),transparent 23%),
    radial-gradient(circle at 86% 80%,rgba(102,80,173,.18),transparent 25%),
    linear-gradient(145deg,#f8f5ff,#eee7ff);
  border-bottom:1px solid var(--line);
}

.members-home-teaser::after{
  content:"01 ✦ 02 ✦ 03 ✦ 04 ✦ 05 ✦ MONSTA MELODIC";
  position:absolute;
  left:-12px;
  bottom:20px;
  white-space:nowrap;
  font:800 .72rem "Baloo 2";
  letter-spacing:.18em;
  opacity:.13;
}

.members-teaser-copy h2{
  font:800 clamp(3.7rem,7vw,6.6rem)/.82 "Baloo 2";
  letter-spacing:-.065em;
  margin:12px 0 24px;
}

.members-teaser-copy h2 span{
  background:linear-gradient(90deg,var(--pink),#ff6bd8,#9f2cff,var(--pink));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:monsterGradient 6s linear infinite;
}

.members-teaser-copy>p:not(.eyebrow){
  max-width:580px;
  line-height:1.75;
  margin-bottom:28px;
}

.members-teaser-art{
  min-height:370px;
  display:grid;
  place-items:center;
}

.member-orbit-stack{
  width:min(390px,80vw);
  aspect-ratio:1;
  position:relative;
  display:grid;
  place-items:center;
  border:3px dashed rgba(49,38,101,.18);
  border-radius:50%;
}

.member-orbit-stack::before,
.member-orbit-stack::after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:2px solid rgba(216,75,228,.15);
}
.member-orbit-stack::before{inset:10%}
.member-orbit-stack::after{inset:-8%}

.member-orbit-stack img{
  width:56%;
  position:relative;
  z-index:4;
  filter:drop-shadow(0 15px 16px rgba(49,38,101,.16));
  animation:logoFloat 5.5s ease-in-out infinite;
}

.teaser-head{
  position:absolute;
  z-index:3;
  width:66px;
  height:66px;
  border-radius:50%;
  border:3px solid var(--ink);
  box-shadow:5px 6px 0 rgba(49,38,101,.12);
}
.teaser-head::after{
  content:"";
  position:absolute;
  width:108%;
  height:82%;
  left:-4%;
  bottom:-45%;
  border-radius:48% 48% 20% 20%;
  background:inherit;
  border:3px solid var(--ink);
  z-index:-1;
}
.head-1{left:2%;top:42%;background:#e2a1df}
.head-2{left:22%;top:2%;background:#bca9ec}
.head-3{right:22%;top:2%;background:#a8cceb}
.head-4{right:2%;top:42%;background:#e4a0a8}
.head-5{left:41%;bottom:0;background:#b8dfb4}

/* Members page hero */
.members-page-main{
  background:linear-gradient(180deg,#faf8ff,#f0ecff);
}

.members-page-hero{
  min-height:610px;
  padding:76px 7%;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:7%;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-bottom:5px solid var(--ink);
  background:
    radial-gradient(circle at 80% 20%,rgba(240,138,248,.30),transparent 26%),
    radial-gradient(circle at 14% 85%,rgba(102,80,173,.17),transparent 26%),
    linear-gradient(145deg,#ddd7f0,#c9b9f2);
}

.members-page-hero-copy h1{
  font:800 clamp(4rem,7.5vw,7rem)/.8 "Baloo 2";
  letter-spacing:-.07em;
  margin:14px 0 25px;
}

.members-page-hero-copy h1 span{
  background:linear-gradient(90deg,var(--pink),#ff68d8,#9f2cff,var(--pink));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:monsterGradient 6s linear infinite;
}

.members-page-hero-copy>p:not(.eyebrow){
  max-width:620px;
  line-height:1.75;
  margin-bottom:27px;
}

.members-page-logo{
  display:grid;
  place-items:center;
}

.members-logo-orbit{
  width:min(360px,75vw);
  aspect-ratio:1;
  position:relative;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:3px dashed rgba(49,38,101,.24);
  animation:calendarOrbit 20s linear infinite;
}

.members-logo-orbit img{
  width:70%;
  animation:calendarCounterOrbit 20s linear infinite,logoFloat 5.5s ease-in-out infinite;
  filter:drop-shadow(0 15px 20px rgba(49,38,101,.16));
}

.members-logo-orbit span{
  position:absolute;
  width:42px;height:42px;
  display:grid;place-items:center;
  border:2px solid var(--ink);
  border-radius:50%;
  background:#fff;
  font:800 .68rem "Baloo 2";
  box-shadow:4px 5px 0 rgba(49,38,101,.10);
}
.members-logo-orbit span:nth-of-type(1){top:-4%;left:44%}
.members-logo-orbit span:nth-of-type(2){right:2%;top:26%}
.members-logo-orbit span:nth-of-type(3){right:13%;bottom:7%}
.members-logo-orbit span:nth-of-type(4){left:13%;bottom:7%}
.members-logo-orbit span:nth-of-type(5){left:2%;top:26%}

.members-page-roster{
  padding-top:92px;
}

/* Make five-member desktop roster a little more editorial on its own page */
@media(min-width:901px){
  .members-page-roster .idol-member-grid{
    gap:54px 28px;
  }
}

@media(max-width:900px){
  .members-home-teaser,
  .members-page-hero{
    grid-template-columns:1fr;
    text-align:center;
  }

  .members-home-teaser{
    padding-top:66px;
  }

  .members-teaser-copy{
    order:1;
  }

  .members-teaser-art{
    order:2;
    min-height:300px;
  }

  .members-teaser-copy>p:not(.eyebrow),
  .members-page-hero-copy>p:not(.eyebrow){
    margin-inline:auto;
  }

  .members-page-logo{
    margin-top:10px;
  }
}

@media(max-width:600px){
  .members-home-teaser{
    padding:62px 20px 82px;
  }

  .members-teaser-copy h2{
    font-size:clamp(3.2rem,15vw,4.7rem);
  }

  .members-page-hero{
    min-height:auto;
    padding:58px 20px 78px;
  }

  .members-page-hero-copy h1{
    font-size:clamp(3.15rem,15vw,4.8rem);
  }

  .member-orbit-stack{
    width:min(300px,78vw);
  }

  .teaser-head{
    width:52px;
    height:52px;
  }

  .members-page-roster{
    padding-top:72px!important;
  }
}


/* =========================================================
   PUNCTUATION CLIPPING FIX + HOMEPAGE SPARKLE ROSTER
   ========================================================= */

/* Give oversized display text actual breathing room on both edges. */
.hero-copy,
.applications-intro,
.idol-app-intro,
.calendar-hero-copy,
.members-page-hero-copy,
.members-teaser-copy{
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  padding-inline:clamp(22px, 2.5vw, 42px);
  overflow:visible !important;
}

.hero-copy h1,
.applications-intro h1,
.idol-app-intro h1,
.calendar-hero-copy h1,
.members-page-hero-copy h1,
.members-teaser-copy h2{
  box-sizing:border-box;
  width:auto !important;
  max-width:100% !important;
  margin-inline:auto !important;
  padding-inline:.20em !important;
  overflow:visible !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  text-wrap:balance;
}

/* The previous very tight tracking could push the rounded final period outside
   its text box. This keeps the chunky style without cutting the punctuation. */
.hero-copy h1,
.applications-intro h1,
.idol-app-intro h1,
.calendar-hero-copy h1,
.members-page-hero-copy h1{
  letter-spacing:-.025em !important;
}

/* Keep the large typography dramatic while fitting safely in its card. */
.hero-copy h1{
  font-size:clamp(2rem, 3.05vw, 3.25rem) !important;
}

.applications-intro h1,
.idol-app-intro h1,
.calendar-hero-copy h1,
.members-page-hero-copy h1{
  font-size:clamp(3.15rem, 5.7vw, 5.85rem) !important;
}

/* Sparkle treatment around the logo. */
.sparkle-orbit{
  position:relative;
  border:2px dashed rgba(49,38,101,.15) !important;
  background:
    radial-gradient(circle at center,
      rgba(255,255,255,.78) 0%,
      rgba(246,226,255,.42) 38%,
      rgba(255,255,255,.08) 67%,
      transparent 72%) !important;
  box-shadow:
    0 0 0 22px rgba(216,75,228,.035),
    0 0 72px rgba(159,44,255,.10);
}

.sparkle-orbit::before,
.sparkle-orbit::after{
  border-color:rgba(216,75,228,.13) !important;
}

.sparkle-orbit img{
  position:absolute;
  left:50%;
  top:50%;
  width:61% !important;
  height:auto;
  transform:translate(-50%,-50%);
  z-index:5;
  filter:
    drop-shadow(0 14px 15px rgba(49,38,101,.16))
    drop-shadow(0 0 20px rgba(216,75,228,.12));
}

/* Hide old silhouettes even if the browser has partially cached markup/styles. */
.sparkle-orbit .teaser-head{
  display:none !important;
}

.roster-spark{
  position:absolute;
  z-index:4;
  line-height:1;
  color:#fff;
  font-family:Arial, sans-serif;
  text-shadow:
    2px 2px 0 #d84be4,
    -1px -1px 0 #6d43d8,
    0 0 18px rgba(216,75,228,.48);
  animation:rosterTwinkle 3.2s ease-in-out infinite;
  pointer-events:none;
}

.rs-1{left:11%; top:18%; font-size:clamp(25px,4vw,44px);}
.rs-2{left:43%; top:5%; font-size:clamp(18px,3vw,32px); animation-delay:.45s;}
.rs-3{right:12%; top:19%; font-size:clamp(18px,3.2vw,34px); animation-delay:.9s;}
.rs-4{right:5%; top:50%; font-size:clamp(25px,4vw,44px); animation-delay:1.35s;}
.rs-5{right:20%; bottom:10%; font-size:clamp(19px,3vw,34px); animation-delay:1.8s;}
.rs-6{left:18%; bottom:10%; font-size:clamp(25px,4vw,43px); animation-delay:2.25s;}
.rs-7{left:5%; top:51%; font-size:clamp(17px,3vw,31px); animation-delay:2.7s;}

.roster-dot{
  position:absolute;
  z-index:3;
  width:9px;
  aspect-ratio:1;
  border-radius:50%;
  background:#d84be4;
  box-shadow:0 0 13px rgba(216,75,228,.48);
  animation:rosterTwinkle 3.8s ease-in-out infinite reverse;
}
.rd-1{left:28%; top:11%;}
.rd-2{right:27%; bottom:13%; animation-delay:.8s;}
.rd-3{left:10%; bottom:32%; animation-delay:1.6s;}

@keyframes rosterTwinkle{
  0%,100%{transform:scale(.82) rotate(-8deg); opacity:.48;}
  50%{transform:scale(1.16) rotate(8deg); opacity:1;}
}

@media (max-width:700px){
  .hero-copy,
  .applications-intro,
  .idol-app-intro,
  .calendar-hero-copy,
  .members-page-hero-copy,
  .members-teaser-copy{
    padding-inline:18px;
  }

  .hero-copy h1,
  .applications-intro h1,
  .idol-app-intro h1,
  .calendar-hero-copy h1,
  .members-page-hero-copy h1,
  .members-teaser-copy h2{
    padding-inline:.16em !important;
    max-width:calc(100vw - 48px) !important;
  }

  .applications-intro h1,
  .idol-app-intro h1,
  .calendar-hero-copy h1,
  .members-page-hero-copy h1{
    font-size:clamp(2.7rem, 13vw, 4.35rem) !important;
  }

  .sparkle-orbit img{
    width:58% !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .roster-spark,
  .roster-dot{
    animation:none !important;
  }
}


/* =========================================================
   FINAL GLOBAL DISPLAY-TYPE PUNCTUATION FIX
   Applies to homepage, members.html, calendar.html,
   idol-applications.html, and volunteer applications.
   ========================================================= */

/*
  The gradient words use background-clip:text. On rounded Baloo 2 glyphs,
  browsers can clip the outer antialiasing of periods and terminal curves
  at the inline span's own paint box even when the H1 itself has overflow
  visible. Give the GRADIENT SPAN its own padded inline-block paint area.
*/
.hero-copy h1 span,
.members-teaser-copy h2 span,
.members-page-hero-copy h1 span,
.calendar-hero-copy h1 span,
.idol-app-intro h1 span,
.applications-intro h1 span{
  display:inline-block !important;
  box-sizing:content-box !important;
  padding-left:.08em !important;
  padding-right:.22em !important;
  padding-top:.04em !important;
  padding-bottom:.08em !important;
  margin-left:-.08em !important;
  margin-right:-.06em !important;
  overflow:visible !important;
  line-height:inherit !important;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}

/* Give every major display heading a safe paint gutter too. */
.hero-copy h1,
.members-teaser-copy h2,
.members-page-hero-copy h1,
.calendar-hero-copy h1,
.idol-app-intro h1,
.applications-intro h1{
  padding-left:.28em !important;
  padding-right:.34em !important;
  margin-left:-.10em !important;
  margin-right:-.10em !important;
  max-width:calc(100% + .20em) !important;
  overflow:visible !important;
  text-rendering:geometricPrecision;
}

/* Do not crop title paint at the immediate content-column level. */
.hero-copy,
.members-teaser-copy,
.members-page-hero-copy,
.calendar-hero-copy,
.idol-app-intro,
.applications-intro{
  overflow:visible !important;
}

/*
  The hero panels still hide decorative backgrounds horizontally, but give
  their text content a little extra inner gutter so the final punctuation
  never reaches the physical panel edge.
*/
.hero-main,
.members-page-hero,
.calendar-hero,
.idol-app-hero,
.applications-hero{
  padding-left:max(7%,32px);
  padding-right:max(7%,32px);
}

/* Calendar/member/idol display titles were closest to the edge on desktop. */
@media(min-width:901px){
  .members-page-hero-copy h1,
  .calendar-hero-copy h1,
  .idol-app-intro h1,
  .applications-intro h1{
    font-size:clamp(3.1rem,5.35vw,5.55rem) !important;
  }
}

/* Mobile: retain the same punctuation gutter without forcing overflow. */
@media(max-width:700px){
  .hero-copy h1,
  .members-teaser-copy h2,
  .members-page-hero-copy h1,
  .calendar-hero-copy h1,
  .idol-app-intro h1,
  .applications-intro h1{
    width:auto !important;
    max-width:calc(100vw - 36px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:.18em !important;
    padding-right:.26em !important;
  }

  .hero-copy h1 span,
  .members-teaser-copy h2 span,
  .members-page-hero-copy h1 span,
  .calendar-hero-copy h1 span,
  .idol-app-intro h1 span,
  .applications-intro h1 span{
    padding-right:.24em !important;
  }
}


/* =========================================================
   HOMEPAGE MEMBERS FEATURE — CENTERED
   Centers the full "Meet the Monsters" feature in its section
   without affecting members.html.
   ========================================================= */

.members-teaser{
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  grid-template-columns: minmax(420px, 1fr) minmax(520px, 1fr) !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(3rem, 6vw, 7rem) !important;
  padding-left: clamp(32px, 5vw, 80px) !important;
  padding-right: clamp(32px, 5vw, 80px) !important;
}

.members-teaser-art{
  justify-self: center !important;
  align-self: center !important;
}

.members-teaser-copy{
  justify-self: center !important;
  align-self: center !important;
  width: 100% !important;
  max-width: 680px !important;
}

@media (max-width: 900px){
  .members-teaser{
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
    text-align: center !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .members-teaser-art,
  .members-teaser-copy{
    justify-self: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .members-teaser-copy{
    max-width: 680px !important;
  }

  .members-teaser-copy .btn,
  .members-teaser-copy a{
    margin-left: auto;
    margin-right: auto;
  }
}


/* =========================================================
   HOMEPAGE ROSTER LOGO — TRUE CENTER FIX
   Keep the logo centered even while it floats.
   ========================================================= */
.sparkle-orbit img{
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  animation:rosterLogoFloatCentered 5.5s ease-in-out infinite !important;
  transform-origin:center center !important;
}

@keyframes rosterLogoFloatCentered{
  0%,100%{
    transform:translate(-50%,-50%) translateY(0) rotate(-1deg);
  }
  50%{
    transform:translate(-50%,-50%) translateY(-9px) rotate(1deg);
  }
}

@media (prefers-reduced-motion:reduce){
  .sparkle-orbit img{
    animation:none !important;
    transform:translate(-50%,-50%) !important;
  }
}