:root{
  --bg0:#070A12;
  --bg1:#0B1022;
  --card: rgba(18, 24, 48, .72);
  --card2: rgba(12, 16, 34, .78);
  --text:#EAF0FF;
  --muted: rgba(234,240,255,.72);
  --line: rgba(255,255,255,.10);
  --accent:#44E2FF;
  --accent2:#B35CFF;
  --pink:#FF4FD8;
  --danger:#ff6b6b;
  --ok:#7CFF9E;
  --shadow: 0 18px 60px rgba(0,0,0,.55);
  --glowC: 0 0 18px rgba(68,226,255,.45), 0 0 42px rgba(68,226,255,.22);
  --glowP: 0 0 18px rgba(179,92,255,.42), 0 0 42px rgba(179,92,255,.20);
  --radius: 18px;
  --radius2: 26px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;background: radial-gradient(1200px 700px at 15% 10%, rgba(68,226,255,.14), transparent 55%),radial-gradient(900px 600px at 85% 15%, rgba(179,92,255,.14), transparent 55%),radial-gradient(800px 700px at 55% 95%, rgba(255,79,216,.10), transparent 60%),linear-gradient(180deg, var(--bg0), var(--bg1)); color:var(--text); overflow-x:hidden}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1120px;margin:0 auto;padding:22px}
.topbar{position:sticky;top:0;z-index:50;display:flex;gap:14px;align-items:center;justify-content:space-between;margin:0 -22px 18px -22px;padding:14px 22px;backdrop-filter:blur(14px);background:linear-gradient(180deg, rgba(7,10,18,.82), rgba(7,10,18,.55));border-bottom:1px solid var(--line)}
.brand{display:flex;gap:12px;align-items:center}
.logo{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg, rgba(110,231,255,.25), rgba(167,139,250,.25));box-shadow:var(--shadow);display:grid;place-items:center;border:1px solid rgba(255,255,255,.08)}
.logo span{font-weight:800;letter-spacing:.5px}
h1,h2,h3{margin:0 0 10px 0}
h1{font-size:28px}
h2{font-size:18px;color:var(--muted);font-weight:600}
nav{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-end}
.nav a{padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);color:rgba(234,240,255,.92)}
.nav a:hover{text-decoration:none;border-color:rgba(68,226,255,.35);box-shadow:var(--glowC)}
.grid{display:grid;grid-template-columns: 1.1fr .9fr;gap:16px}
@media (max-width: 900px){ .grid{grid-template-columns:1fr} .wrap{padding:16px} }
.card{background:linear-gradient(180deg, var(--card), var(--card2));border:1px solid rgba(255,255,255,.10);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
.muted{color:var(--muted);font-size:14px;line-height:1.4}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width: 600px){ .kpis{grid-template-columns:1fr} }
.kpi{padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
.kpi .label{font-size:12px;color:var(--muted)}
.kpi .value{font-size:16px;font-weight:700;margin-top:6px}
.list{margin:0;padding:0;list-style:none}
.list li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.list li:last-child{border-bottom:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:11px 14px;border-radius:14px;font-weight:800;letter-spacing:.2px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:var(--text);cursor:pointer}
.btn:hover{background:rgba(255,255,255,.08)}
.btn.primary{border-color:rgba(68,226,255,.35);background:linear-gradient(135deg, rgba(68,226,255,.18), rgba(179,92,255,.18));box-shadow:var(--glowC)}
.btn.danger{border-color:rgba(255,107,107,.35);background:rgba(255,107,107,.08)}
input,select,textarea{width:100%;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.15);color:var(--text)}
textarea{min-height:140px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width: 700px){ .form-row{grid-template-columns:1fr} }
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;vertical-align:top}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:12px;color:var(--muted)}
.footer{margin-top:18px;color:var(--muted);font-size:12px}
.notice{padding:12px;border-radius:14px;border:1px solid rgba(110,231,255,.25);background:rgba(110,231,255,.07);color:var(--text)}
.error{padding:12px;border-radius:14px;border:1px solid rgba(255,107,107,.30);background:rgba(255,107,107,.07);color:var(--text)}
.hr{height:1px;background:rgba(255,255,255,.08);margin:12px 0}
.chat-box{height:clamp(420px, 60vh, 720px);overflow:auto;border-radius:14px;border:1px solid rgba(255,255,255,.08);padding:12px;background:rgba(0,0,0,.12)}
.chat-msg{padding:8px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.chat-msg:last-child{border-bottom:none}
.chat-meta{font-size:12px;color:var(--muted)}


/* ===== Neon Hero (Startseite) ===== */
.hero{padding: 12px 0 16px}
.hero-card{
  border-radius: var(--radius2);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: var(--shadow);
  overflow:hidden;
  position:relative;
}
.hero-card::after{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(700px 240px at 20% 20%, rgba(68,226,255,.25), transparent 60%),
              radial-gradient(600px 260px at 80% 30%, rgba(179,92,255,.20), transparent 60%);
  pointer-events:none;
  opacity:.85;
}
.hero-inner{position:relative;padding: clamp(18px, 3.2vw, 30px);display:grid;gap:14px}
.hero h1{margin:0;font-size: clamp(28px, 4.2vw, 46px);letter-spacing:.2px;text-shadow: 0 0 18px rgba(68,226,255,.18)}
.hero p{margin:0;color:var(--muted);font-size:15px;max-width:72ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* On-Air Badge */
.badge-live{
  display:inline-flex;gap:8px;align-items:center;
  padding:7px 10px;border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,79,216,.10);
}
.badge-live::before{
  content:"";width:9px;height:9px;border-radius:50%;
  background: var(--pink);
  box-shadow: 0 0 14px rgba(255,79,216,.55);
}

/* Grid tuning */
.grid{gap:16px}
@media (max-width: 900px){
  .topbar{flex-direction:column;align-items:flex-start;gap:10px}
  .nav{flex-wrap:wrap}
}



.news-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.news-grid.compact{ grid-template-columns: repeat(2, minmax(0,1fr)); }
@media (max-width: 980px){
  .news-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 620px){
  .news-grid, .news-grid.compact{ grid-template-columns: 1fr; }
}

.news-card{
  display:block;
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  box-shadow: var(--shadow);
  overflow:hidden;
  transform: translateY(0);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  text-decoration:none;
}
.news-card:hover{
  transform: translateY(-4px);
  border-color: rgba(68,226,255,.30);
  box-shadow: var(--shadow), var(--glowC);
}

.news-thumb{
  position:relative;
  aspect-ratio: 16/9;
  background: rgba(255,255,255,.03);
  overflow:hidden;
}
.news-thumb img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.02);
  transition: transform .22s ease, filter .22s ease;
  filter: saturate(1.05) contrast(1.05);
}
.news-card:hover .news-thumb img{ transform: scale(1.08); filter: saturate(1.15) contrast(1.08); }

.news-thumb::after{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(320px 160px at 18% 20%, rgba(68,226,255,.18), transparent 60%),
              radial-gradient(320px 160px at 82% 20%, rgba(179,92,255,.16), transparent 60%),
              linear-gradient(180deg, transparent 55%, rgba(7,10,18,.85) 100%);
  opacity:.95;
  pointer-events:none;
}

.news-body{ padding: 12px 12px 14px; }
.news-title{
  color: rgba(234,240,255,.96);
  font-weight: 900;
  letter-spacing:.2px;
  margin-bottom: 6px;
  line-height:1.2;
}
.news-meta{ color: var(--muted); font-size: 12px; }


/* ===== News: feste Bilder + Textfluss ===== */
.news-list{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.news-card{
  display:block;
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  box-shadow: var(--shadow);
  overflow:hidden;
  padding: 0;
  transform: translateY(0);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  text-decoration:none;
  position:relative;
}
.news-card::after{content:"";display:block;clear:both}

.news-card:hover{
  transform: translateY(-3px);
  border-color: rgba(68,226,255,.30);
  box-shadow: var(--shadow), var(--glowC);
}

/* feste Thumb-Größe */
.news-thumb{
  float:left;
  width: 220px;
  height: 140px;
  background: rgba(255,255,255,.03);
  overflow:hidden;
  position:relative;
}
.news-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.02);
  transition: transform .22s ease, filter .22s ease;
  filter: saturate(1.05) contrast(1.05);
}
.news-card:hover .news-thumb img{ transform: scale(1.07); filter: saturate(1.15) contrast(1.08); }

.news-thumb::after{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(260px 140px at 18% 20%, rgba(68,226,255,.18), transparent 60%),
              radial-gradient(260px 140px at 82% 20%, rgba(179,92,255,.16), transparent 60%),
              linear-gradient(180deg, transparent 55%, rgba(7,10,18,.75) 100%);
  opacity:.95;
  pointer-events:none;
}

.news-body{
  padding: 12px 14px 14px;
}
.news-title{
  color: rgba(234,240,255,.96);
  font-weight: 900;
  letter-spacing:.2px;
  margin-bottom: 6px;
  line-height:1.2;
  font-size: 16px;
}
.news-meta{ color: var(--muted); font-size: 12px; }

/* Einzelnews: Bild max 250x400, Text läuft rechts + darunter weiter */
.post-flow{ line-height:1.6; }
.post-image{
  float:left;
  width: 250px;
  max-width: 250px;
  max-height: 400px;
  height: auto;
  margin: 0 16px 10px 0;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: var(--shadow);
  display:block;
}

/* Mobile */
@media (max-width: 720px){
  .news-thumb{ width: 100%; height: 180px; float:none; }
  .post-image{ width: 100%; max-width: 100%; max-height: 420px; float:none; margin: 0 0 12px 0; }
}



/* ===== Social Share (News) ===== */
.news-share{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-top: 14px;
  padding: 12px;
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
}
.news-share .label{
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  margin-right: 2px;
}

.share-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 9px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: rgba(234,240,255,.95);
  font-weight: 800;
  font-size: 13px;
  cursor:pointer;
  text-decoration:none;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.share-btn:hover{
  transform: translateY(-2px);
  border-color: rgba(68,226,255,.30);
  box-shadow: var(--glowC);
  background: rgba(255,255,255,.08);
}
.share-btn.copy{ border-style: dashed; }

/* Share icons */
.share-btn{gap:8px}
.share-btn .ico{
  width:18px;height:18px;
  flex:0 0 auto;
  opacity:.95;
}
.share-btn span{line-height:1}


/* Auto-detected links + hashtags */
.autolink{
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px solid rgba(68,226,255,.25);
}
.autolink:hover{
  text-decoration:none;
  border-bottom-color: rgba(68,226,255,.55);
  box-shadow: 0 6px 24px rgba(68,226,255,.12);
}

.hashtag{
  display:inline-block;
  padding: 2px 8px;
  margin: 0 2px;
  border-radius: 999px;
  border: 1px solid rgba(179,92,255,.26);
  background: rgba(179,92,255,.10);
  color: rgba(234,240,255,.95);
  text-decoration:none;
  font-weight: 800;
  font-size: 12px;
}
.hashtag:hover{
  border-color: rgba(179,92,255,.45);
  box-shadow: var(--glowP);
}


.news-excerpt{
  margin-top: 8px;
  color: rgba(234,240,255,.78);
  font-size: 13px;
  line-height: 1.35;
}


/* ===== Song History (Index) ===== */
.song-history{
  list-style:none;
  padding:0;
  margin:12px 0 0;
  display:grid;
  gap:10px;
}
.song-history li{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
}
.song-main{
  font-size:14px;
}
.song-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.song-links a{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  text-decoration:none;
  color:var(--text);
  background:rgba(255,255,255,.05);
}
.song-links a:hover{
  border-color:rgba(68,226,255,.35);
  box-shadow:var(--glowC);
}

.song-links a{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.song-links .ico{
  width:18px;height:18px;
}


/* ===== Now Playing highlight ===== */
.now-playing{
  display:flex;
  gap:14px;
  align-items:center;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: linear-gradient(135deg, rgba(68,226,255,.10), rgba(179,92,255,.08));
  margin-top: 10px;
  margin-bottom: 12px;
}
.np-cover{
  width:96px;
  height:96px;
  border-radius:18px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.np-meta{flex:1; min-width:220px}
.np-badge{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,79,216,.10);
  font-weight:900;
  font-size:12px;
  margin-bottom:8px;
}
.np-badge .dot{
  width:8px;height:8px;border-radius:999px;
  background: var(--pink);
  box-shadow: 0 0 14px rgba(255,79,216,.55);
}
.np-title{font-size:15px; line-height:1.25}
.np-time{color: var(--muted); font-size:12px; margin-top:6px}

/* Mini service icons */
.song-links.mini{gap:10px}
.song-links.mini a.svc{
  width:34px;height:34px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
}
.song-links.mini a.svc .ico{width:18px;height:18px}

/* Time in list */
.song-time{
  margin-top:6px;
  color: var(--muted);
  font-size: 12px;
}

@media (max-width: 720px){
  .now-playing{flex-direction:column; align-items:flex-start}
  .np-cover{width:100%; height:220px}
}


/* Song rows with cover */
.song-row{
  display:flex;
  gap:12px;
  align-items:center;
}
.song-cover{
  width:56px;
  height:56px;
  border-radius:12px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  flex:0 0 auto;
}
@media (max-width: 720px){
  .song-cover{
    width:48px;
    height:48px;
  }
}


/* Footer links */
.footer a{ color: rgba(234,240,255,.85); text-decoration:none; border-bottom:1px solid rgba(255,255,255,.18); }
.footer a:hover{ border-bottom-color: rgba(68,226,255,.55); box-shadow: 0 10px 24px rgba(68,226,255,.10); }

/* Cookie / Privacy Hint */
.cookie-hint{
  position:fixed;
  bottom:12px;
  left:50%;
  transform:translateX(-50%);
  max-width:920px;
  width:calc(100% - 24px);
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(12,16,34,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 18px 60px rgba(0,0,0,.45);
  font-size:13px;
  z-index:9999;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
}
.cookie-hint a{ color:var(--accent); text-decoration:none; }
.cookie-hint button{
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  color:var(--text);
  cursor:pointer;
}

.hide-cookie-hint .cookie-hint{display:none;}


/* ===== Hero Slider ===== */
.hero-slider{ position:relative; }
.hero-track{ position:relative; }
.hero-slide{ display:none; }
.hero-slide.is-active{ display:block; }

.hero-nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:44px;height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(12,16,34,.55);
  backdrop-filter: blur(10px);
  color: rgba(234,240,255,.95);
  font-size:28px;
  line-height:0;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.hero-nav:hover{
  border-color: rgba(68,226,255,.30);
  box-shadow: var(--glowC);
  background: rgba(12,16,34,.70);
}
.hero-nav.prev{ left: 12px; }
.hero-nav.next{ right: 12px; }

.hero-dots{
  position:absolute;
  left:50%;
  transform: translateX(-50%);
  bottom: 12px;
  display:flex;
  gap:8px;
  padding: 8px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(12,16,34,.45);
  backdrop-filter: blur(10px);
}
.hero-dots .dot{
  width:10px;height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.18);
  cursor:pointer;
  padding:0;
}
.hero-dots .dot.is-active{
  background: rgba(68,226,255,.45);
  border-color: rgba(68,226,255,.55);
  box-shadow: var(--glowC);
}

@media (max-width: 720px){
  .hero-nav{ display:none; }
  .hero-dots{ bottom: 10px; }
}


/* ===== Auto Sendeplan (laut.fm) ===== */

/* ===== Chat Emoji Panel ===== */
.emoji-panel{
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.25);
  max-width:520px;
}
.emoji-panel button{
  background:transparent;
  border:0;
  font-size:20px;
  padding:6px 8px;
  cursor:pointer;
}
.emoji-panel button:hover{ filter:brightness(1.2); }
.schedule-controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin: 10px 0 14px;
}
.schedule-controls .btn.primary{
  border-color: rgba(68,226,255,.45);
  box-shadow: var(--glowC);
}

.day-block{ margin-top: 14px; }
.day-title{ margin: 14px 0 10px; }

.day-list{
  display:grid;
  gap:12px;
}

.show-card{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
}
.show-card:hover{
  border-color: rgba(68,226,255,.24);
  box-shadow: var(--glowC);
}
.show-cover{
  width:92px;
  height:92px;
  border-radius:16px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.12);
  flex: 0 0 auto;
}
.show-body{ flex:1; min-width: 220px; }
.show-time{
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 4px;
}
.show-title{
  font-weight: 900;
  font-size: 15px;
  line-height: 1.25;
}
.show-host{
  margin-top: 6px;
  font-size: 13px;
  opacity: .92;
}
.show-desc{
  margin-top: 6px;
  color: rgba(234,240,255,.78);
  font-size: 13px;
  line-height: 1.35;
}

@media (max-width: 720px){
  .show-card{ flex-direction:column; }
  .show-cover{ width:100%; height:200px; }
}

/* Chat v2: Avatare + Online-Liste + Moderation */
.chat-row{display:flex;gap:10px;align-items:flex-start}
.chat-avatar{width:34px;height:34px;border-radius:999px;overflow:hidden;flex:0 0 34px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;font-weight:700}
.chat-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.chat-main{flex:1}
.chat-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:6px}
.btn.xs{padding:6px 10px;font-size:12px;border-radius:999px}
.online-list{max-height:220px;overflow:auto;border-radius:14px;border:1px solid rgba(255,255,255,.08);padding:10px;background:rgba(0,0,0,.10)}
.online-item{display:flex;gap:10px;align-items:center;padding:6px 4px;border-radius:12px}
.online-item:hover{background:rgba(255,255,255,.05)}
.online-avatar{width:28px;height:28px;border-radius:999px;overflow:hidden;flex:0 0 28px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;font-weight:700}
.online-avatar img{width:100%;height:100%;object-fit:cover;display:block}

/* Sponsors (Index) */
.sponsorBox{
  margin-top:12px;
  padding:12px;
  border-radius:18px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
}
.sponsorBoxHead{
  font-weight:800;
  margin-bottom:10px;
  opacity:.92;
}
.sponsorSlider{ position:relative; overflow:hidden; }
.sponsorSlide{ display:none; text-decoration:none; color:inherit; }
.sponsorSlide.is-active{ display:block; }
.sponsorSlide img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
}
.sponsorText{
  margin-top:8px;
  font-size:.95rem;
  opacity:.9;
}
.sponsorFallback{
  width:100%;
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background: rgba(0,0,0,.25);
  font-weight:800;
  border:1px solid rgba(255,255,255,.10);
}
/* === Station of Music Header === */
.som-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: linear-gradient(135deg, #0f2027, #203a43, #2c5364);
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}

.som-header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 20px;
}

/* Logo */
.som-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  text-decoration: none;
}

.som-logo img {
  height: 42px;
  width: auto;
}

.som-logo-text strong {
  font-size: 16px;
  display: block;
  line-height: 1.1;
}

.som-logo-text small {
  font-size: 11px;
  opacity: 0.7;
}

/* Navigation */
.som-nav {
  display: flex;
  gap: 16px;
  margin-left: auto;
}

.som-nav a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  opacity: 0.85;
  transition: 0.2s;
}

.som-nav a:hover {
  opacity: 1;
}

/* Live Button */
.som-live-btn {
  background: #e10600;
  color: #fff;
  padding: 8px 14px;
  border-radius: 20px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 0 12px rgba(225,6,0,0.6);
  transition: 0.2s;
}

.som-live-btn:hover {
  transform: scale(1.05);
}

/* Mobile */
@media (max-width: 800px) {
  .som-nav {
    display: none;
  }

  .som-header-inner {
    justify-content: space-between;
  }
}

