:root{
  color-scheme:dark;
  --bg:#050309;
  --panel:rgba(14,7,24,0.9);
  --panel-card:rgba(18,9,30,0.92);
  --line:rgba(184,92,255,0.28);
  --line-strong:rgba(184,92,255,0.55);
  --purple:#bd5cff;
  --violet:#7b2cff;
  --cyan:#45eaff;
  --pink:#ff4fa9;
  --green:#62ffc5;
  --text:#fbf8ff;
  --muted:#a395b0;
  --danger:#ff6b9e;
}

*{box-sizing:border-box}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  background:#050309;
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
}

button,a,input,select,textarea{font:inherit}

/* Optimized background video stack - zero compositor jank */
.bg-media{
  position:fixed;
  inset:0;
  z-index:-2;
  overflow:hidden;
  background:#050309 url("assets/allthings140-background.webp") center/cover no-repeat;
  pointer-events:none;
}
.bg-media video,.bg-media canvas{
  width:100vw;
  height:100dvh;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  opacity:0.82;
}
.bg-media canvas{display:none}
.canvas-background-ready .bg-media canvas{display:block}
.canvas-background-ready .bg-media video{position:absolute;width:2px;height:2px;opacity:0;inset:0 auto auto 0}

.bg-overlay{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(3,1,8,0.88) 0%, rgba(3,1,8,0.62) 34%, rgba(3,1,8,0.18) 64%, rgba(3,1,8,0.3) 100%),
             linear-gradient(180deg, rgba(3,1,8,0.35) 0%, transparent 40%, rgba(3,1,8,0.88) 100%);
}

.reduced-motion .bg-media video,.reduced-motion .bg-media canvas{display:none}

.wrap{width:min(1320px,calc(100% - 38px));margin:auto}
.wrap-shell{width:min(1400px,100%);margin:auto}
.home-route-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:0 0 34px}
.home-route-grid a{min-height:118px;padding:20px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,rgba(22,10,37,.94),rgba(8,4,14,.9));color:#fff;text-decoration:none;display:flex;flex-direction:column;gap:5px;transition:.2s transform,.2s border-color}
.home-route-grid a:hover,.home-route-grid a:focus-visible{transform:translateY(-2px);border-color:var(--cyan);outline:none}
.home-route-grid small,.route-intro .kicker{color:var(--cyan);font-weight:900;letter-spacing:.14em}
.home-route-grid b{font-size:1.05rem;letter-spacing:.08em}
.home-route-grid span{color:var(--muted);font-size:.78rem;line-height:1.45}
.route-intro{padding:44px 0 0;display:flex;align-items:center;justify-content:space-between}
.route-intro a{color:#e1a5ff;text-decoration:none;font-weight:900;font-size:.72rem;letter-spacing:.1em}
body:not([data-route="/"]) main{min-height:calc(100dvh - 190px)}
body:not([data-route="/"]) main>.section{padding-top:34px}
body[data-route="/"] .hero{min-height:calc(100dvh - 238px);padding-top:34px;padding-bottom:28px}
@media(min-width:1101px){
  body[data-route="/"] .hero{min-height:650px;padding-top:32px;padding-bottom:24px}
  body[data-route="/"] .hero-copy{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(460px,540px);grid-template-rows:auto auto auto auto 1fr;column-gap:42px;row-gap:10px;align-items:start}
  body[data-route="/"] .hero-copy>.kicker{grid-column:1;grid-row:1;margin-bottom:4px}
  body[data-route="/"] .hero-copy>h1{grid-column:1;grid-row:2;font-size:clamp(4rem,5.7vw,5.8rem);margin-bottom:10px}
  body[data-route="/"] .hero-copy>.lead{grid-column:1;grid-row:3;margin-bottom:8px;max-width:610px}
  body[data-route="/"] .hero-copy>.hero-tags{grid-column:1;grid-row:4;margin-bottom:10px}
  body[data-route="/"] .hero-copy>.hero-actions{grid-column:1;grid-row:5;margin:0}
  body[data-route="/"] .hero-copy>.now-playing{grid-column:2;grid-row:1 / span 5;margin:0;align-self:center}
  body[data-route="/"] .hero-copy>.home-takeover-logo{grid-column:2;grid-row:1 / span 5}
}

/* Header & Navigation */
.topbar{
  height:84px;
  display:flex;
  align-items:center;
  border-bottom:1px solid var(--line);
  position:relative;
  background:rgba(9,4,16,0.85);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  z-index:100;
}
.topbar:after{
  content:"";
  position:absolute;
  bottom:-1px;
  left:0;
  width:180px;
  height:1px;
  background:linear-gradient(90deg,var(--cyan),var(--purple),transparent);
  box-shadow:0 0 12px var(--cyan);
}

.brand{display:flex;align-items:center;gap:14px;text-decoration:none;margin-right:auto}
.sigil{
  width:50px;
  height:50px;
  border:1px solid rgba(207,124,255,0.45);
  border-radius:12px;
  position:relative;
  display:grid;
  place-items:center;
  background:#08040d;
  overflow:hidden;
  box-shadow:0 0 20px rgba(159,56,228,0.25);
}
.sigil img{width:100%;height:100%;object-fit:cover;display:block}
.brand strong{display:block;font-size:.94rem;letter-spacing:.1em;color:#fff}
.brand small{display:block;color:#d68cff;letter-spacing:.34em;font-weight:900;margin-top:2px}

.status-chip{
  margin-left:24px;
  padding:8px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#100919;
  font-size:.68rem;
  letter-spacing:.12em;
  font-weight:900;
  color:#c5b6ce;
  display:inline-flex;
  align-items:center;
}
.status-chip i,.mode i{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#6c6173;
  margin-right:8px;
}
.status-chip[data-state="autodj"] i,.mode[data-state="autodj"] i{background:var(--green);box-shadow:0 0 10px var(--green)}
.status-chip[data-state="live"] i,.mode[data-state="live"] i{background:var(--pink);box-shadow:0 0 10px var(--pink)}
.status-chip[data-state="offline"] i,.mode[data-state="offline"] i{background:#6c6173}

/* Navigation Menu */
.nav-menu{position:relative;margin-left:auto;z-index:100}
.nav-menu .nav-toggle{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:8px 16px;
  border:1px solid rgba(169,70,230,0.55);
  border-radius:8px;
  background:rgba(16,7,27,0.85);
  color:#fff;
  cursor:pointer;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.16em;
  transition:border-color .2s,background .2s;
}
.nav-menu .nav-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:#cf75ff}
.nav-menu .nav-toggle:hover,.nav-menu .nav-toggle:focus-visible,.nav-menu.is-open .nav-toggle{
  border-color:#dc8cff;
  background:rgba(40,16,59,0.92);
  outline:none;
}
.nav-menu .nav{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  display:grid;
  grid-template-columns:1fr;
  width:min(320px,calc(100vw - 24px));
  max-height:calc(100dvh - 100px);
  overflow-y:auto;
  padding:8px;
  border:1px solid rgba(169,70,230,0.65);
  border-radius:12px;
  background:rgba(12,6,21,0.97);
  box-shadow:0 20px 60px rgba(0,0,0,0.85),0 0 30px rgba(133,34,195,0.3);
  z-index:1000;
}
.nav-menu .nav[hidden]{display:none!important}
.nav-menu .nav-entry{
  display:grid;
  grid-template-columns:26px 1fr;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:48px;
  padding:8px 14px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:#f7f2fb;
  text-align:left;
  text-decoration:none;
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.12em;
  cursor:pointer;
  transition:background .15s,border-color .15s,color .15s;
}
.nav-menu .nav-entry:hover,.nav-menu .nav-entry:focus-visible,.nav-menu .nav-entry.is-current{
  color:#fff;
  background:rgba(125,37,184,0.35);
  border-color:rgba(201,107,255,0.45);
  outline:none;
}
.nav-menu .nav-icon{display:grid;place-items:center;width:22px;height:22px;color:#c968ff}
.nav-menu .nav-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}

/* Hero & Main Player */
.hero{
  width:min(1680px, calc(100% - 48px));
  min-height:760px;
  padding:60px 0 90px;
  display:block;
  margin:0 auto;
}
.hero-copy{
  width:min(650px, 100%);
  margin:0;
  margin-right:auto;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#d99aff;
  font-size:.72rem;
  letter-spacing:.2em;
  font-weight:900;
  margin:0 0 16px;
}
.kicker:before{
  content:"";
  width:32px;
  height:1px;
  background:var(--cyan);
  box-shadow:0 0 8px var(--cyan);
}
h1{
  font-size:clamp(3.4rem,7vw,6.5rem);
  line-height:.85;
  letter-spacing:-.06em;
  margin:0 0 20px;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 4px 24px rgba(0,0,0,0.85);
}
h1 span{
  display:block;
  color:transparent;
  -webkit-text-stroke:1.5px #d78cff;
  filter:drop-shadow(0 0 12px rgba(165,57,231,0.5));
}
.lead{
  color:#d8cadf;
  line-height:1.65;
  font-size:.98rem;
  margin:0 0 20px;
  text-shadow:0 2px 12px rgba(0,0,0,0.8);
}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.hero-tags span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px;
  border:1px solid rgba(190,93,255,0.3);
  border-radius:6px;
  background:rgba(11,6,18,0.75);
  color:#f1e5ff;
  font-size:.72rem;
  letter-spacing:.08em;
  font-weight:800;
}
.hero-tags span:before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:linear-gradient(180deg,var(--cyan),var(--purple));
  box-shadow:0 0 8px var(--cyan);
}

.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid rgba(193,108,255,0.38);
  border-radius:8px;
  color:#fff;
  background:rgba(12,6,20,0.85);
  text-decoration:none;
  padding:12px 18px;
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.06em;
  cursor:pointer;
  transition:border-color .2s,background .2s,transform .15s;
}
.btn:hover{
  border-color:#e3a8ff;
  background:rgba(45,18,68,0.85);
  transform:translateY(-1px);
}
.btn.primary{
  border:0;
  background:linear-gradient(120deg,#9c2be0,#6020d0 60%,#1c60d8);
  box-shadow:0 0 28px rgba(156,43,224,0.38);
}
.btn.primary:hover{
  background:linear-gradient(120deg,#b03cf5,#7028e5 60%,#2870f0);
  box-shadow:0 0 34px rgba(176,60,245,0.5);
}
.btn:disabled{
  opacity:.7;
  cursor:wait;
}

/* Now Playing Card */
.now-playing{
  border:1px solid rgba(182,99,255,0.4);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(16,8,28,0.92),rgba(8,4,16,0.96));
  box-shadow:0 16px 45px rgba(0,0,0,0.6),0 0 28px rgba(140,50,230,0.15);
  padding:20px;
  margin-bottom:28px;
}
.now-playing-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.mode{
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.14em;
  padding:6px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#10081a;
  display:inline-flex;
  align-items:center;
}
.listeners{font-size:.72rem;color:var(--muted);letter-spacing:.08em}
.track-label{display:block;font-size:.66rem;color:#cb91f5;letter-spacing:.18em;font-weight:900;margin-bottom:4px}
.track-title{
  font-size:clamp(1.2rem,2.4vw,1.6rem);
  line-height:1.2;
  margin:0 0 4px;
  color:#fff;
  word-break:break-word;
}
.track-artist{margin:0 0 14px;color:#cab8d4;font-size:.9rem}

.timeline{
  height:4px;
  background:rgba(44,33,49,0.8);
  border-radius:2px;
  overflow:hidden;
  position:relative;
  margin-top:14px;
}
.timeline span{
  display:block;
  height:100%;
  width:0;
  background:linear-gradient(90deg,var(--cyan),var(--purple),var(--pink));
  box-shadow:0 0 10px var(--purple);
  transition:width .4s linear;
}
.time-row{
  display:flex;
  justify-content:space-between;
  color:#8e8198;
  font-size:.68rem;
  margin-top:6px;
}

.message{
  font-size:.72rem;
  margin:10px 0 0;
  color:#a395b0;
  min-height:16px;
}
.message.good{color:#78e9ba}
.message.bad{color:#ff8eae}

.track-reactions{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(184,92,255,0.18);
}
.track-reactions>span{font-size:.68rem;font-weight:900;color:#c0a9cf;letter-spacing:.12em;margin-right:4px}
.track-reactions button{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 12px;
  border:1px solid rgba(184,92,255,0.3);
  border-radius:6px;
  background:rgba(12,6,20,0.7);
  color:#fff;
  font-size:.75rem;
  cursor:pointer;
  transition:background .15s,border-color .15s,transform .15s;
}
.track-reactions button:hover{border-color:#e3a8ff;background:rgba(50,20,75,0.8);transform:translateY(-1px)}
.track-reactions button.selected{border-color:var(--cyan);background:rgba(20,70,90,0.6);box-shadow:0 0 12px rgba(69,234,255,0.3)}

.listener-controls{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(184,92,255,0.15);
  font-size:.7rem;
  font-weight:800;
  color:#c0a9cf;
  letter-spacing:.08em;
}
.listener-controls input[type="range"]{
  accent-color:var(--purple);
  width:90px;
  height:4px;
  cursor:pointer;
}
.listener-controls button,.listener-controls select{
  padding:5px 10px;
  border:1px solid rgba(184,92,255,0.35);
  border-radius:4px;
  background:rgba(12,6,20,0.8);
  color:#fff;
  font-size:.68rem;
  font-weight:800;
  cursor:pointer;
}

.next-up{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(184,92,255,0.18);
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:.74rem;
}
.next-up small{color:#9888a4;letter-spacing:.12em;font-weight:800}
.next-up b{color:#e8def0;text-align:right;font-weight:700}

.home-takeover-logo{
  display:grid;
  justify-items:center;
  gap:8px;
  margin:18px 0;
  padding:16px;
  border:1px solid rgba(182,92,255,0.55);
  border-radius:12px;
  background:rgba(14,6,25,0.92);
}
.home-takeover-logo[hidden]{display:none}
.home-takeover-logo img{max-height:120px;object-fit:contain}
.home-takeover-logo small{color:#d78dff;letter-spacing:.14em;font-weight:900;font-size:.68rem}
.home-takeover-logo b{font-size:1.1rem;color:#fff}

.subgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.subcard{
  border:1px solid rgba(182,108,255,0.25);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(14,7,24,0.85),rgba(7,3,14,0.9));
  padding:16px;
}
.subcard small{
  display:inline-block;
  padding:4px 8px;
  border:1px solid rgba(190,93,255,0.3);
  border-radius:4px;
  background:rgba(10,5,16,0.8);
  color:#dba5ff;
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.1em;
}
.subcard b{display:block;margin-top:8px;line-height:1.5;color:#d5c8dc;font-size:.88rem;font-weight:600}

/* Telemetry row */
.telemetry{
  border-block:1px solid var(--line);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:rgba(8,4,15,0.85);
}
.telemetry div{padding:22px 24px;border-right:1px solid var(--line)}
.telemetry div:last-child{border:0}
.telemetry b{display:block;font-size:1.2rem;color:#fff}
.telemetry span{color:#9a8b9f;font-size:.7rem;letter-spacing:.06em;font-weight:700}

/* General Section Layout */
.section{padding:75px 0}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:32px}
.section h2{font-size:clamp(2.4rem,5vw,4.5rem);line-height:.92;letter-spacing:-.05em;margin:0;text-transform:uppercase}
.section-head p{max-width:480px;color:#a899af;line-height:1.65;font-size:.92rem;margin:0}

/* Schedule & History Grid */
.schedule-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.schedule-card,.history-card,.request-card,.support-goal,.support-feed,.discord-card,.host,.about-card,.brand-card,.takeover-archive-card{
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(18,9,30,0.9),rgba(7,4,13,0.95));
  padding:24px;
  box-shadow:0 14px 40px rgba(0,0,0,0.45);
}
.schedule-card small,.history-card small,.request-card small,.support-goal small,.support-feed small,.discord-card small,.host small{
  color:#d68cff;
  letter-spacing:.14em;
  font-weight:900;
  font-size:.68rem;
  display:block;
  margin-bottom:12px;
}
.takeover-empty h3{font-size:1.4rem;margin:0 0 6px;color:#fff}
.takeover-empty p{color:#a99bad;line-height:1.5;margin:0 0 12px;font-size:.88rem}
.countdown{display:inline-block;color:var(--cyan);letter-spacing:.13em;font-size:.85rem;font-weight:900}

.history-card ol{list-style:none;padding:0;margin:0}
.history-card li{
  display:grid;
  grid-template-columns:28px 1fr auto;
  gap:10px;
  padding:10px 0;
  border-bottom:1px solid rgba(155,84,207,0.15);
  color:#ded4e4;
  font-size:.84rem;
  align-items:center;
}
.history-card li:last-child{border-bottom:0}
.history-card li b{color:#8b7b95;font-size:.76rem}
.history-card time{color:#8a7d92;font-size:.68rem}

.request-card form{display:grid;gap:10px;margin-top:12px}
.request-card input{
  width:100%;
  border:1px solid rgba(166,84,220,0.4);
  border-radius:6px;
  background:rgba(8,4,13,0.9);
  color:#fff;
  padding:10px 12px;
  font-size:.85rem;
  outline:none;
}
.request-card input:focus{border-color:var(--cyan)}
.request-card button{
  border:0;
  border-radius:6px;
  background:linear-gradient(120deg,#9c2be0,#6020d0);
  color:#fff;
  padding:11px 16px;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.08em;
  cursor:pointer;
}

/* Support Section & Modal */
.support-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
.support-goal strong{display:block;font-size:1.8rem;color:#fff;margin:12px 0 8px}
.support-progress{
  height:8px;
  background:rgba(40,20,55,0.7);
  border-radius:4px;
  overflow:hidden;
  margin-bottom:18px;
}
.support-progress i{
  display:block;
  height:100%;
  width:0;
  background:linear-gradient(90deg,var(--pink),var(--purple),var(--cyan));
  border-radius:4px;
  transition:width .4s ease;
}
.support-feed ol{list-style:none;padding:0;margin:0;max-height:220px;overflow-y:auto}
.support-feed li{padding:8px 0;border-bottom:1px solid rgba(155,84,207,0.15);font-size:.82rem;color:#d5c7dd}
.support-feed li b{color:#e3a8ff}

.support-dialog{
  border:1px solid rgba(206,125,255,0.55);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(16,7,28,0.98),rgba(6,3,12,0.98));
  color:#fff;
  padding:28px;
  max-width:540px;
  width:calc(100vw - 32px);
  box-shadow:0 24px 80px rgba(0,0,0,0.9),0 0 40px rgba(157,43,255,0.25);
}
.support-dialog::backdrop{background:rgba(2,1,6,0.85);backdrop-filter:blur(6px)}
.support-close{
  position:absolute;
  top:14px;
  right:14px;
  border:1px solid var(--line);
  border-radius:50%;
  width:32px;
  height:32px;
  background:rgba(20,10,35,0.8);
  color:#fff;
  font-size:1.2rem;
  cursor:pointer;
  display:grid;
  place-items:center;
}
.support-amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.support-amounts button{
  border:1px solid rgba(184,92,255,0.35);
  border-radius:8px;
  background:rgba(14,7,24,0.85);
  color:#fff;
  padding:10px 6px;
  cursor:pointer;
  text-align:center;
  transition:border-color .15s,background .15s;
}
.support-amounts button b{display:block;font-size:1.1rem;color:#e8a4ff}
.support-amounts button span{display:block;font-size:.58rem;color:var(--muted);margin-top:2px}
.support-amounts button[aria-pressed="true"],.support-amounts button:hover{
  border-color:#e3a8ff;
  background:rgba(70,25,100,0.85);
}

/* Submission Section */
.submit-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.submission-form{display:grid;gap:12px}
.submission-form label{display:grid;gap:5px;color:#c5b4cd;font-size:.7rem;font-weight:800;letter-spacing:.08em}
.submission-form input,.submission-form select,.submission-form textarea{
  width:100%;
  border:1px solid rgba(166,84,220,0.4);
  border-radius:6px;
  background:rgba(8,4,13,0.9);
  color:#fff;
  padding:10px 12px;
  font-size:.85rem;
  outline:none;
}
.submission-form input:focus,.submission-form select:focus,.submission-form textarea:focus{border-color:var(--cyan)}
.submission-extra{display:grid;gap:12px;padding:12px;border:1px solid rgba(166,84,220,0.25);border-radius:8px;background:rgba(12,6,20,0.6)}
.submission-extra[hidden]{display:none}

/* Hosts */
.hosts{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.host h3{font-size:1.6rem;margin:6px 0 8px;color:#fff}
.host p{color:#a99bad;line-height:1.55;margin:0;font-size:.88rem}

/* Transmission Archive */
.takeover-archive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px;margin-bottom:20px}
.takeover-archive-card{padding:22px;background:linear-gradient(145deg,rgba(26,10,40,.88),rgba(8,4,16,.96));border:1px solid rgba(187,74,255,.35);border-radius:10px;display:grid;gap:12px;box-shadow:0 12px 35px rgba(0,0,0,.4)}
.takeover-archive-card:hover{border-color:#d799ff}
.tac-header{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:center}
.tac-logo{width:52px;height:52px;object-fit:cover;border-radius:8px;border:1px solid rgba(187,74,255,.4)}
.tac-date{color:#78efff;font-size:.68rem;font-weight:800;letter-spacing:.12em}
.tac-header h3{margin:2px 0 0;font-size:1.2rem;color:#fff}
.tac-status{display:inline-block;font-size:.62rem;font-weight:900;letter-spacing:.12em;color:#69f5ba}
.tac-bio{margin:0;font-size:.85rem;color:#ccc0d8;line-height:1.45}
.tac-tracklist{background:rgba(0,0,0,.45);padding:10px 12px;border-radius:6px;border-left:2px solid #a975ff}
.tac-tracklist small{display:block;color:#a975ff;font-size:.65rem;font-weight:900;letter-spacing:.14em;margin-bottom:3px}
.tac-tracklist p{margin:0;font-size:.78rem;font-family:monospace;color:#e8ddf2}

/* Sponsors & Ecosystem Partners */
.sponsors-partners-container{display:grid;gap:32px}
.brand-group{display:grid;gap:14px}
.brand-group-title{color:#a975ff;font-size:.78rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.brand-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.brand-card{position:relative;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:8px;padding:20px;background:linear-gradient(145deg,rgba(22,9,34,.88),rgba(7,4,13,.95));border:1px solid rgba(169,117,255,.32);border-radius:8px;transition:border-color .25s,transform .2s}
.brand-card:hover{border-color:#00f0ff;transform:translateY(-2px)}
.brand-card.headline{border-color:rgba(0,240,255,.65);box-shadow:0 0 24px rgba(0,240,255,.15)}
.brand-tier{display:inline-block;font-size:.65rem;font-weight:900;letter-spacing:.14em;color:#00f0ff;margin-bottom:4px}
.brand-tier.partner-tier{color:#d799ff}
.brand-logo{width:48px;height:48px;object-fit:contain;border-radius:4px;margin-bottom:4px}
.brand-card h3{margin:0;font-size:1.1rem;color:#fff}
.brand-card p{margin:0;font-size:.84rem;color:#bba9c9;line-height:1.45}
.brand-link{display:inline-block;margin-top:10px;font-size:.74rem;font-weight:800;letter-spacing:.12em;color:#00f0ff;text-decoration:none;transition:color .2s}
.brand-link:hover{color:#fff;text-decoration:underline}
.sponsor-card{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center;padding:28px;border:1px solid rgba(187,74,255,.45);border-radius:10px;background:linear-gradient(145deg,rgba(20,9,30,.9),rgba(5,3,10,.95))}
.sponsor-card h2{font-size:clamp(2.2rem,4vw,3.5rem);margin:4px 0 10px;color:#fff}
.sponsor-card p{color:#c5b4cd;line-height:1.55;font-size:.88rem;margin:0 0 14px}
.payment-card .product-preview{width:100%;margin:12px 0 16px;border-radius:8px;overflow:hidden;border:1px solid rgba(187,92,255,0.35);background:#08040d}
.payment-card .product-thumb{display:block;width:100%;height:auto;object-fit:contain;border-radius:6px;transition:transform .2s ease}
.payment-card .product-thumb:hover{transform:scale(1.015)}
.payment-note{color:#cdb9d7;font-size:.84rem;line-height:1.5;margin:0 0 12px}

/* Discord Card */
.discord-card{
  display:grid;
  grid-template-columns:140px 1fr;
  gap:24px;
  align-items:center;
}
.discord-card img{width:100%;aspect-ratio:1;border-radius:14px;border:1px solid rgba(182,99,255,0.4)}
.discord-card h3{font-size:1.4rem;margin:4px 0 8px;color:#fff}
.discord-card p{color:#a99bad;line-height:1.55;margin:0 0 14px;font-size:.88rem}

/* Chat Drawer */
.chat-backdrop{position:fixed;inset:0;z-index:9000;background:rgba(2,1,6,0.8);backdrop-filter:blur(4px)}
.chat-backdrop[hidden]{display:none}
.chat-drawer{
  position:fixed;
  z-index:9001;
  inset:0 auto 0 0;
  width:min(520px,100%);
  padding:24px;
  background:rgba(10,5,18,0.98);
  border-right:1px solid rgba(189,92,255,0.5);
  box-shadow:30px 0 80px rgba(0,0,0,0.85);
  transform:translateX(-105%);
  transition:transform .25s ease;
  overflow-y:auto;
}
.chat-drawer.open{transform:translateX(0)}
.chat-close{
  border:1px solid var(--line);
  border-radius:8px;
  background:rgba(20,10,35,0.8);
  color:#fff;
  width:36px;
  height:36px;
  font-size:1.4rem;
  cursor:pointer;
  float:right;
}
.chat-messages{
  height:260px;
  margin:12px 0;
  padding:10px;
  overflow-y:auto;
  list-style:none;
  border:1px solid rgba(159,85,211,0.3);
  border-radius:8px;
  background:rgba(5,2,10,0.9);
}
.chat-message{display:grid;grid-template-columns:30px 1fr;gap:10px;padding:6px 0;border-bottom:1px solid rgba(155,84,207,0.15)}
.chat-message .avatar{width:28px;height:28px;border-radius:6px;display:grid;place-items:center;color:#fff;font-size:.7rem;font-weight:900;font-style:normal}
.avatar.purple{background:#8f32d3}
.avatar.cyan{background:#168c9d}
.avatar.pink{background:#bd316e}
.avatar.green{background:#18885f}
.chat-message b{font-size:.78rem;color:#d68cff}
.chat-message time{font-size:.65rem;color:#7c7084;margin-left:6px}
.chat-message p{margin:4px 0 0;font-size:.84rem;color:#ece2f0;line-height:1.4}
.chat-launcher{
  position:fixed;
  z-index:80;
  right:20px;
  bottom:20px;
  border:1px solid rgba(209,108,255,0.6);
  border-radius:999px;
  background:linear-gradient(120deg,#8f27d8,#5720ad);
  color:#fff;
  padding:12px 18px;
  font-weight:900;
  font-size:.78rem;
  letter-spacing:.08em;
  box-shadow:0 0 24px rgba(142,40,217,0.4);
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.chat-launcher:hover{filter:brightness(1.08)}

/* Mini Player */
.mini-player{
  position:fixed;
  z-index:70;
  left:20px;
  right:100px;
  bottom:16px;
  height:62px;
  max-width:680px;
  display:grid;
  grid-template-columns:44px 38px 1fr auto auto;
  gap:12px;
  align-items:center;
  padding:8px 14px;
  border:1px solid rgba(182,99,255,0.5);
  border-radius:12px;
  background:rgba(10,5,18,0.96);
  box-shadow:0 12px 40px rgba(0,0,0,0.8),0 0 20px rgba(126,37,187,0.25);
}
.mini-player[hidden]{display:none}
body.mini-visible{padding-bottom:calc(var(--persistent-player-height, 80px) + env(safe-area-inset-bottom) + 24px)}
.mini-player>button,.mini-player>.mini-room-link{
  height:38px;
  border:1px solid rgba(184,92,255,0.5);
  border-radius:8px;
  background:#6e25bc;
  color:#fff;
  font-weight:900;
  cursor:pointer;
  font-size:.85rem;
  text-decoration:none;
  display:grid;
  place-items:center;
  padding:0 10px;
  white-space:nowrap;
}
.mini-player img{width:38px;height:38px;border-radius:8px}
.mini-player div{min-width:0}
.mini-player small{display:block;color:#8f8298;font-size:.6rem;letter-spacing:.08em}
.mini-player div b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.78rem;color:#fff}
.mini-player span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.7rem;color:#beafc7}
.mini-listeners{font-size:.68rem;color:#8f8298;white-space:nowrap}

/* Footer */
footer{
  border-top:1px solid var(--line);
  padding:40px 0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:20px;
  color:#8a7d94;
  font-size:.76rem;
}
footer .brand{margin-right:0}
.footer-support,.footer-merch{
  color:#d99aff;
  font-weight:800;
  text-decoration:none;
  border:1px solid rgba(184,92,255,0.3);
  border-radius:6px;
  padding:7px 12px;
  background:rgba(12,6,20,0.7);
  cursor:pointer;
}
.footer-support:hover,.footer-merch:hover{border-color:#e3a8ff;color:#fff}
.foot-status{margin-left:auto;text-align:right}

/* Native Alert Banner */
.native-alert-layer{
  position:fixed;
  inset:0;
  z-index:20000;
  pointer-events:none;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  padding:calc(80px + env(safe-area-inset-top)) 16px 16px;
}
.native-alert{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:center;
  width:min(540px,calc(100vw - 32px));
  padding:14px 18px;
  border:1px solid #e79dff;
  border-radius:12px;
  background:rgba(14,6,24,0.96);
  box-shadow:0 18px 60px rgba(0,0,0,0.85),0 0 30px rgba(190,69,255,0.35);
  transform:translateY(-120%);
  opacity:0;
  transition:transform .35s ease,opacity .25s ease;
}
.native-alert.show{transform:translateY(0);opacity:1}
.native-alert[hidden]{display:none}
.native-alert img{width:54px;height:54px;object-fit:cover;border-radius:10px}
.native-alert small{color:var(--cyan);font-size:.62rem;font-weight:900;letter-spacing:.16em}
.native-alert strong{font-size:1.1rem;color:#fff}
.native-alert p{margin:0;color:#cabdd2;font-size:.82rem;line-height:1.4}

/* Live Takeover Header Banner */
.live-takeover{
  position:fixed;
  z-index:110;
  top:0;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:10px;
  align-items:center;
  padding:6px 16px;
  border-radius:0 0 8px 8px;
  background:linear-gradient(90deg,#d51d72,#8f22de);
  box-shadow:0 0 24px rgba(255,62,154,0.4);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.12em;
  color:#fff;
}
.live-takeover[hidden]{display:none}

/* Responsive Breakpoints */
@media(max-width:1100px){
  .hero{width:min(100% - 28px, 900px); min-height:auto; padding:48px 0 70px}
  .hero-copy{width:min(680px, 100%); margin:0 auto; text-align:left}
  .bg-overlay{background:linear-gradient(180deg, rgba(3,1,8,0.7) 0%, rgba(3,1,8,0.75) 50%, rgba(5,3,11,0.94) 100%)}
  .sponsor-card{grid-template-columns:1fr;gap:20px}
}

@media(max-width:900px){
  .schedule-grid,.support-grid,.submit-grid,.hosts{grid-template-columns:1fr}
  .telemetry{grid-template-columns:1fr 1fr}
  .telemetry div:nth-child(2){border-right:0}
  .section-head{display:block}
  .section-head p{margin-top:8px}
  .subgrid{grid-template-columns:1fr}
  .home-route-grid{grid-template-columns:1fr}
}

@media(max-width:680px){
  .topbar{height:68px}
  .topbar .sigil{width:40px;height:40px}
  .brand strong{font-size:.78rem}
  .brand small{font-size:.58rem}
  .hero{padding:30px 0 50px}
  .hero h1{font-size:16vw}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
  body[data-route="/"] .hero-actions .btn:nth-child(n+4){display:none}
  body[data-route="/"] .lead{font-size:.9rem;line-height:1.5}
  .now-playing{padding:16px}
  .track-reactions{flex-wrap:wrap}
  .discord-card{grid-template-columns:1fr;text-align:center}
  .discord-card img{width:90px;margin:0 auto}
  .mini-player{
    left:8px;
    right:8px;
    bottom:8px;
    grid-template-columns:40px 34px 1fr auto;
    height:56px;
    padding:6px 10px;
  }
  .mini-player .mini-listeners{display:none}
  .chat-launcher{right:12px;bottom:74px;padding:10px 14px;font-size:.72rem}
  body[data-route="/"] .chat-launcher{display:none}
  body:not([data-route="/"]) .chat-launcher{bottom:132px}
  footer{flex-direction:column;align-items:flex-start}
  .foot-status{margin-left:0;text-align:left}
  .home-route-grid{padding-bottom:24px}
  .home-route-grid a{min-height:96px;padding:16px}
  .route-intro{padding-top:26px;align-items:flex-start;gap:12px}
}

@media(max-width:480px){
  .topbar .status-chip{display:none}
}