/* All Star Dance Challenge
   Dark Playbill header, hero and footer. Light Scorecard content. */
:root{
  --d-bg:#150C1E; --d-bg2:#1E1229; --d-ink:#F4EEF9; --d-mute:#A08FB5;
  --d-gold:#E3B24A; --d-violet:#9B54FF; --d-blue:#5C74F0; --d-rule:#392A4C;
  --bg:#FBFAFC; --panel:#FFFFFF; --ink:#171320; --mute:#66607A;
  --rule:#E1DDE9; --violet:#5B21C7; --tint:#F2EDFB; --warn:#8A5A12; --warn-bg:#FDF6EA;
  --max:1010px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Newsreader",Georgia,"Times New Roman",serif; font-size:17px; line-height:1.6;
  font-weight:300; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--violet)}
a:hover{text-decoration:none}
:focus-visible{outline:2px solid var(--violet); outline-offset:2px}
.skip{position:absolute; left:-9999px}
.skip:focus{left:8px; top:8px; z-index:99; background:var(--d-gold); color:var(--d-bg); padding:9px 15px; border-radius:4px}
.wrap{max-width:var(--max); margin:0 auto; padding:0 24px}

/* ---------- header ---------- */
.site-head{
  background:var(--d-bg); border-bottom:1px solid var(--d-rule);
  display:flex; align-items:center; gap:18px; padding:12px 24px; flex-wrap:wrap;
}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--d-ink); margin-right:auto}
.brand img{width:44px; height:44px; flex:none}
.brand span{display:block; line-height:1.12}
.brand b{
  font-family:"Archivo",system-ui,sans-serif; font-variation-settings:"wdth" 115;
  font-weight:800; font-size:16px; letter-spacing:-.01em; display:block;
}
.brand small{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:9.5px; letter-spacing:.17em;
  text-transform:uppercase; color:var(--d-mute); display:block; margin-top:2px;
}
.menu-btn{
  display:none; font-family:"Archivo",sans-serif; font-size:12px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; background:transparent; color:var(--d-ink);
  border:1px solid var(--d-rule); border-radius:5px; padding:8px 14px; cursor:pointer;
}
.site-head nav{display:flex; gap:20px; flex-wrap:wrap}
.site-head nav a{
  font-family:"Archivo",system-ui,sans-serif; font-size:12px; font-weight:600;
  letter-spacing:.11em; text-transform:uppercase; color:var(--d-mute); text-decoration:none;
  padding:5px 0; border-bottom:1px solid transparent;
}
.site-head nav a:hover{color:var(--d-gold)}
.site-head nav a.on{color:var(--d-ink); border-bottom-color:var(--d-gold)}
@media(max-width:820px){
  .menu-btn{display:block}
  .site-head nav{display:none; width:100%; flex-direction:column; gap:0; padding-top:6px}
  .site-head nav.open{display:flex}
  .site-head nav a{padding:11px 2px; border-bottom:1px solid var(--d-rule)}
  .site-head nav a.on{border-bottom-color:var(--d-gold)}
}

/* ---------- hero ---------- */
.hero{background:var(--d-bg); color:var(--d-ink); position:relative; overflow:hidden; text-align:center}
.hero-glow{
  position:absolute; inset:-46% 8% auto 8%; height:440px; pointer-events:none;
  background:radial-gradient(ellipse at 50% 0%, rgba(155,84,255,.30), transparent 68%);
}
.hero-in{position:relative; max-width:var(--max); margin:0 auto; padding:0 24px}
.hero-tall .hero-in{padding-top:62px; padding-bottom:56px}
.hero-short .hero-in{padding-top:44px; padding-bottom:42px}
.hero-logo{width:112px; height:112px; margin:0 auto 24px}
.hero-eyebrow{
  font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.3em;
  text-transform:uppercase; color:var(--d-gold); margin:0 0 20px;
}
.hero-title{
  font-family:"Bodoni Moda",Georgia,serif; font-weight:400; font-size:clamp(40px,7.6vw,80px);
  line-height:.95; letter-spacing:-.012em; margin:0; text-wrap:balance;
}
.hero-title em{font-style:italic; color:var(--d-gold)}
.hero-date{
  font-family:"Bodoni Moda",Georgia,serif; font-weight:700; font-size:clamp(44px,9.4vw,100px);
  line-height:.94; margin:10px 0 0; letter-spacing:-.02em;
  background:linear-gradient(96deg,var(--d-violet),var(--d-blue));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-rule{width:58px; height:1px; background:var(--d-gold); opacity:.7; margin:28px auto 24px}
.hero-meta{
  display:flex; justify-content:center; flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--d-mute);
}
.hero-meta span{padding:2px 15px; border-right:1px solid var(--d-rule)}
.hero-meta span:last-child{border-right:0}
.hero-cta{display:flex; gap:11px; justify-content:center; flex-wrap:wrap; margin-top:32px}
.page-title{
  font-family:"Bodoni Moda",Georgia,serif; font-weight:400; font-size:clamp(34px,6vw,58px);
  line-height:1.0; margin:0 0 10px; letter-spacing:-.012em; text-wrap:balance;
}
.page-sub{font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--d-gold); margin:0}

/* ---------- buttons ---------- */
.btn{
  display:inline-block; font-family:"Archivo",sans-serif; font-size:12px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; padding:13px 25px; border-radius:3px;
  text-decoration:none; border:1px solid var(--d-gold); color:var(--d-gold); transition:background .18s,color .18s;
}
.btn:hover{background:var(--d-gold); color:var(--d-bg)}
.btn.gold{background:var(--d-gold); color:var(--d-bg)}
.btn.gold:hover{background:transparent; color:var(--d-gold)}
.btn.line{color:var(--d-ink); border-color:var(--d-rule)}
.btn.line:hover{background:var(--d-ink); color:var(--d-bg); border-color:var(--d-ink)}
.sec .btn{border-color:var(--violet); color:var(--violet)}
.sec .btn:hover{background:var(--violet); color:#fff}
.sec .btn.gold{background:var(--violet); color:#fff; border-color:var(--violet)}
.sec .btn.gold:hover{background:transparent; color:var(--violet)}
.btn.sm{font-size:11px; padding:10px 19px}

/* ---------- circuit band ---------- */
.circuit-band{background:var(--d-bg2); border-top:1px solid var(--d-rule); border-bottom:1px solid var(--d-rule); padding:19px 24px}
.circuit-in{
  max-width:var(--max); margin:0 auto; display:flex; justify-content:center; gap:12px 30px; flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.15em;
  text-transform:uppercase; color:var(--d-mute); text-align:center;
}

/* ---------- content ---------- */
main{padding-bottom:26px}
.sec{padding:38px 0; border-top:1px solid var(--rule)}
.sec:first-child{border-top:0}
.intro-sec{border-top:0; padding-top:40px; padding-bottom:8px}
.sec-h{
  font-family:"Archivo",system-ui,sans-serif; font-variation-settings:"wdth" 112; font-weight:800;
  font-size:21px; letter-spacing:-.012em; margin:0 0 5px;
}
.sub-h{
  font-family:"Archivo",sans-serif; font-weight:700; font-size:15px; letter-spacing:-.005em;
  margin:30px 0 10px;
}
.sec-note{color:var(--mute); font-size:15.5px; margin:0 0 20px; max-width:62ch}
.sec > .tw:first-of-type, .sec > ul:first-of-type, .sec > p:first-of-type{margin-top:18px}
.lede{font-size:19.5px; line-height:1.58; max-width:62ch; margin:0 0 14px}
.big{font-size:19px; margin:0 0 8px; line-height:1.42}
.mute{color:var(--mute)}
.after{margin:20px 0 0}

/* tables */
.tw{overflow-x:auto; -webkit-overflow-scrolling:touch}
table{width:100%; border-collapse:collapse; font-size:16px}
th{
  text-align:left; font-family:"IBM Plex Mono",monospace; font-size:9.5px; letter-spacing:.15em;
  text-transform:uppercase; color:var(--mute); font-weight:500; padding:0 14px 9px 0;
  border-bottom:1px solid var(--rule); white-space:nowrap;
}
th.num{text-align:right; padding-right:0}
td{padding:12px 14px 12px 0; border-bottom:1px solid var(--rule); vertical-align:top}
td:last-child{padding-right:0}
td.num{
  text-align:right; font-family:"IBM Plex Mono",monospace; font-variant-numeric:tabular-nums;
  font-weight:500; font-size:15px; white-space:nowrap;
}
tr:last-child td{border-bottom:0}
.facts th{display:none}
.facts td{border-bottom:1px solid var(--rule)}
dt{
  font-family:"IBM Plex Mono",monospace; font-size:9.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--mute); display:block; padding-top:3px;
}
.time{font-family:"IBM Plex Mono",monospace; font-size:14px; color:var(--violet); font-weight:500; white-space:nowrap}

/* lists */
ul.plain{margin:0; padding:0; list-style:none}
ul.plain li{padding:11px 0 11px 20px; border-bottom:1px solid var(--rule); position:relative}
ul.plain li:last-child{border-bottom:0}
ul.plain li::before{content:""; position:absolute; left:0; top:20px; width:8px; height:1.5px; background:var(--violet)}
ul.plain.sm li{font-size:15px; padding:5px 0 5px 20px; border-bottom:0}
ul.plain.sm li::before{top:14px; width:6px}
ol.steps{margin:0; padding-left:22px}
ol.steps li{padding:7px 0; line-height:1.55}
ul.chips{display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none}
ul.chips li{
  font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.09em; text-transform:uppercase;
  background:var(--tint); color:var(--violet); padding:8px 13px; border-radius:4px;
}

/* cards */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px}
.card{border:1px solid var(--rule); border-radius:9px; padding:22px; background:var(--panel)}
.card-when{
  font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--violet); margin:0 0 7px;
}
.card h3{font-family:"Bodoni Moda",Georgia,serif; font-weight:700; font-size:25px; margin:0 0 13px}
.card ul{margin:0; padding:0; list-style:none}
.card li{font-size:15px; line-height:1.48; padding:7px 0; border-bottom:1px solid var(--rule); color:var(--mute)}
.card li:last-child{border-bottom:0}

.vgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px}
.vcard{border:1px solid var(--rule); border-radius:9px; padding:20px; background:var(--panel)}
.vcard h3{font-family:"Archivo",sans-serif; font-weight:800; font-size:16.5px; margin:0 0 6px; letter-spacing:-.008em}
.vnote{font-size:14.5px; color:var(--mute); margin:0 0 9px; line-height:1.45}
.vlink{margin:10px 0 0; font-size:14.5px; word-break:break-word}

/* notices */
.notice{
  border:1px solid var(--rule); border-left:3px solid var(--violet); background:var(--panel);
  border-radius:0 7px 7px 0; padding:15px 18px; margin:18px 0 0;
}
.notice p{margin:0; font-size:15.5px; line-height:1.55}
.notice.warn{border-left-color:var(--warn); background:var(--warn-bg); color:var(--warn)}
.notice.warn a{color:var(--warn)}

.cta-sec{text-align:center; border-top:1px solid var(--rule)}
.cta-sec .sec-note{margin-left:auto; margin-right:auto}

/* ---------- footer ---------- */
.site-foot{background:var(--d-bg); color:var(--d-mute); margin-top:44px; border-top:1px solid var(--d-rule)}
.foot-in{
  max-width:var(--max); margin:0 auto; padding:44px 24px 34px;
  display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:34px;
}
@media(max-width:760px){.foot-in{grid-template-columns:1fr 1fr; gap:28px}}
@media(max-width:460px){.foot-in{grid-template-columns:1fr}}
.foot-brand img{width:52px; height:52px; margin-bottom:12px}
.foot-name{
  font-family:"Bodoni Moda",Georgia,serif; font-size:19px; color:var(--d-ink); margin:0 0 3px; line-height:1.2;
}
.foot-date{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.11em; color:var(--d-gold); margin:0}
.foot-col h4{
  font-family:"IBM Plex Mono",monospace; font-size:9.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--d-gold); font-weight:500; margin:0 0 11px;
}
.foot-col p{margin:0; font-size:14.5px; line-height:1.75}
.site-foot a{color:var(--d-mute); text-decoration:none}
.site-foot a:hover{color:var(--d-gold); text-decoration:underline}
.foot-legal{border-top:1px solid var(--d-rule); padding:17px 24px}
.foot-legal p{
  max-width:var(--max); margin:0 auto; font-size:12.5px; color:var(--d-mute);
  font-family:"Archivo",sans-serif;
}
@media(prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important; scroll-behavior:auto!important}}
@media print{.site-head,.hero-cta,.menu-btn,.site-foot{display:none}body{background:#fff}}