/* =====================================================================
   css/rs/djs.css — DJ-Line-up (/djs.php), DJ-Profil (/dj-profil.php), Startseiten-Block
   „Residents“, DJ-Einträge im Programm (27.09.2026). Präfix .rdj- (nicht .rs-djs: das ist
   der „Für DJs“-Block der Startseite). Wird auf allen Seiten geladen → nur eigene Klassen.
   Radien 3/4/6 px, keine Kapseln, Magenta nur für LIVE, Cyan für „jetzt“.
   ===================================================================== */

/* ---------------- Markenfarben der Link-Knöpfe (nur das Symbol ist farbig) ---------------- */
.rdj-link { --b: var(--ru-paper); }
.rdj-link--soundcloud { --b: #ff5500; } .rdj-link--instagram { --b: #ff4f8b; } .rdj-link--facebook { --b: #4a8cff; }
.rdj-link--tiktok { --b: #25f4ee; } .rdj-link--youtube { --b: #ff3b30; } .rdj-link--mixcloud { --b: #8f7dff; }
.rdj-link--beatport { --b: #01ff95; } .rdj-link--bandcamp { --b: #3cc4e6; } .rdj-link--spotify { --b: #1ed760; }
.rdj-link--ra { --b: var(--ru-paper); } .rdj-link--twitch { --b: #a970ff; } .rdj-link--label { --b: var(--ru-cyan); } .rdj-link--website { --b: var(--ru-cyan); }

.rdj-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.rdj-link { display: inline-flex; align-items: center; gap: 9px; min-height: 40px; padding: 8px 13px 8px 10px; border: 1.5px solid var(--ru-line); border-radius: var(--ru-r-1);
  color: var(--ru-paper); text-decoration: none; font: 600 12px/1 var(--ru-f-mono); letter-spacing: .06em; text-transform: uppercase;
  background: rgba(13,10,31,.35); backdrop-filter: blur(6px); transition: border-color .2s, background .2s, color .2s; }
.rdj-link .rdj-ico { color: var(--b); flex: none; }
.rdj-link:hover, .rdj-link:focus-visible { border-color: var(--b); color: var(--ru-paper); background: color-mix(in srgb, var(--b) 16%, rgba(13,10,31,.5)); }
.rdj-link--gross { width: 100%; box-sizing: border-box; min-height: 52px; padding: 12px 14px; font-size: 13px; background: none; backdrop-filter: none; border-color: var(--ru-line-2); }
.rdj-link--gross > span { flex: 1; }
.rdj-link--gross > i { font-style: normal; opacity: .5; transition: transform .2s, opacity .2s; }
.rdj-link--gross:hover > i { opacity: 1; transform: translate(2px, -2px); }
.rdj-links--liste { flex-direction: column; gap: 6px; }
.rdj-links--liste li { width: 100%; }

/* ---------------- Profil: Kopf ---------------- */
.rdj-profil { --g: var(--ru-genre-dark); background: var(--ru-ink); color: var(--ru-paper); }
.rdj-hero { position: relative; isolation: isolate; overflow: hidden; min-height: min(92svh, 900px); display: flex; align-items: flex-end; }
.rdj-hero__bild { position: absolute; inset: 0; z-index: -3; background: var(--ru-ink-2); }
.rdj-hero__bild picture, .rdj-hero__bild img { display: block; width: 100%; height: 100%; }
.rdj-hero__bild img { object-fit: cover; object-position: 62% 30%; transform: scale(1.03); animation: rdj-ken 18s ease-out both; }
.rdj-hero__bild img.is-hoch { object-position: 60% 22%; }
@keyframes rdj-ken { from { transform: scale(1.09); } to { transform: scale(1.02); } }
.rdj-hero__tint { position: absolute; inset: 0; z-index: -2; background:
  linear-gradient(90deg, rgba(13,10,31,.95) 0%, rgba(13,10,31,.72) 34%, rgba(13,10,31,.15) 68%, color-mix(in srgb, var(--g) 22%, transparent) 100%),
  linear-gradient(0deg, var(--ru-ink) 0%, rgba(13,10,31,.55) 26%, rgba(13,10,31,0) 55%),
  linear-gradient(180deg, rgba(13,10,31,.7) 0%, rgba(13,10,31,0) 22%); }
.rdj-profil.is-live .rdj-hero__tint { background:
  linear-gradient(90deg, rgba(13,10,31,.95) 0%, rgba(13,10,31,.7) 34%, rgba(13,10,31,.12) 68%, color-mix(in srgb, var(--ru-magenta) 26%, transparent) 100%),
  linear-gradient(0deg, var(--ru-ink) 0%, rgba(13,10,31,.55) 26%, rgba(13,10,31,0) 55%),
  linear-gradient(180deg, rgba(13,10,31,.7) 0%, rgba(13,10,31,0) 22%); }
.rdj-hero__in { position: relative; width: 100%; box-sizing: border-box; padding-top: 140px; padding-bottom: 56px; display: grid; gap: 18px; }
.rdj-hero__proto { margin: 0; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; color: var(--ru-paper); }
.rdj-hero__proto .rs-colon { font-size: 7px; }
.rdj-hero__live[hidden] { display: none; }
.rdj-hero__name { --rdj-n: 8; margin: 0 0 0 -.04em; font: 900 min(200px, 13.2vw, calc((min(100vw, 1440px) - 2 * var(--ru-gutter)) / (var(--rdj-n) * .98)))/.84 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.055em;
  color: var(--ru-paper); max-width: 100%; overflow-wrap: anywhere; text-wrap: balance; text-shadow: 0 10px 60px rgba(13,10,31,.55); }
.rdj-hero__kurz { margin: 0; max-width: 58ch; font: 500 clamp(16px, 1.4vw, 20px)/1.55 var(--ru-f-text); color: var(--ru-paper); opacity: .92; text-wrap: pretty; }
.rdj-hero__termin { margin: 2px 0 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; }
.rdj-hero__termin .rs-dia { width: 8px; height: 8px; background: var(--ru-cyan); }
.rdj-hero__termin b { font-weight: 600; white-space: nowrap; }
.rdj-hero__in-zeit { color: var(--ru-cyan); }
.rdj-hero__in-zeit:empty { display: none; }
.rdj-hero__knoepfe { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; margin-top: 6px; }
.rdj-hero__knoepfe .rs-btn2 { display: inline-flex; align-items: center; gap: 8px; background: rgba(13,10,31,.35); backdrop-filter: blur(6px); }
.rdj-hero__knoepfe .rs-btn2:hover { background: var(--ru-paper); }
.rdj-hero__knoepfe .rs-btn2.is-ok { border-color: var(--ru-cyan); color: var(--ru-cyan); }
.rdj-links--kopf { margin-top: 6px; }
.rdj-play { display: inline-flex; align-items: center; gap: 12px; }
.rdj-play .rdj-play__p, .rdj-play .rdj-play__b { display: none; }
.rdj-play .rs-pause i { width: 6px; height: 18px; }
body[data-playing="true"]:not([data-player-mode="sc"]):not([data-player-mode="spotify"]):not([data-player-mode="preview"]) .rdj-play .rdj-play__i,
body[data-playing="true"]:not([data-player-mode="sc"]):not([data-player-mode="spotify"]):not([data-player-mode="preview"]) .rdj-play .rdj-play__a { display: none; }
body[data-playing="true"]:not([data-player-mode="sc"]):not([data-player-mode="spotify"]):not([data-player-mode="preview"]) .rdj-play .rdj-play__p { display: inline-flex; }
body[data-playing="true"]:not([data-player-mode="sc"]):not([data-player-mode="spotify"]):not([data-player-mode="preview"]) .rdj-play .rdj-play__b { display: inline; }
.rdj-profil.is-live .rdj-play { background: var(--ru-magenta); color: var(--ru-ink); }

/* ---------------- LIVE JETZT ---------------- */
.rdj-jetzt { position: relative; overflow: hidden; background: color-mix(in srgb, var(--ru-magenta) 16%, var(--ru-ink)); border-block: 1.5px solid var(--ru-magenta); color: var(--ru-magenta); }
.rdj-jetzt[hidden] { display: none; }
.rdj-jetzt__fq { position: absolute; inset: 18% 0; opacity: .28; pointer-events: none; }
.rdj-jetzt__in { position: relative; display: flex; align-items: center; gap: 24px; padding-top: 26px; padding-bottom: 26px; flex-wrap: wrap; }
.rdj-jetzt__txt { display: flex; align-items: center; gap: 16px; flex: 1 1 360px; min-width: 0; }
.rdj-jetzt__t { margin: 0; font: 800 clamp(20px, 2.2vw, 30px)/1.15 var(--ru-f-text); color: var(--ru-paper); }
.rdj-jetzt__t b { font: 900 1.1em/1 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.03em; }
.rdj-jetzt__btn { background: var(--ru-magenta); color: var(--ru-ink); display: inline-flex; align-items: center; gap: 12px; }
.rdj-jetzt__btn:hover { background: #ff5ce0; color: var(--ru-ink); }

/* ---------------- Abschnitte ---------------- */
.rdj-sek { padding: clamp(48px, 6vw, 88px) 0 0; }
.rdj-sek__kopf { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; margin-bottom: 24px; }
.rdj-sek__kopf .rs-lab2 { margin: 0 0 8px; }
.rdj-sek__h { margin: 0; font: 900 clamp(32px, 4.2vw, 60px)/.92 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.04em; }
.rdj-sek__knoepfe { display: flex; flex-wrap: wrap; gap: 10px; }
.rdj-leer { font: 500 15px/1.6 var(--ru-f-mono); opacity: .75; margin: 0; }

/* ---------------- Termine ---------------- */
.rdj-termine__raster { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 20px; align-items: stretch; }
.rdj-uhr { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding: 26px; min-height: 260px; box-sizing: border-box;
  border-radius: var(--ru-r-2); background: linear-gradient(160deg, color-mix(in srgb, var(--g) 40%, var(--ru-ink-2)) 0%, var(--ru-ink-2) 62%); border: 1px solid var(--ru-line-2); }
.rdj-uhr::before { content: ''; position: absolute; right: -40px; top: -40px; width: 220px; height: 220px; background: var(--g); opacity: .18; transform: rotate(45deg); }
.rdj-uhr__z { font: 900 clamp(40px, 5vw, 76px)/1 var(--ru-f-disp); letter-spacing: -.03em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rdj-uhr__z small { font-size: .42em; margin-left: .08em; opacity: .7; }
.rdj-uhr__z .c1 { color: var(--ru-cyan); } .rdj-uhr__z .c2 { color: var(--ru-magenta); }
.rdj-uhr__m { font-size: 15px; }
.rdj-uhr__slot { margin-top: 4px; }
.rdj-profil.is-live .rdj-uhr { background: linear-gradient(160deg, color-mix(in srgb, var(--ru-magenta) 40%, var(--ru-ink-2)) 0%, var(--ru-ink-2) 62%); }
.rdj-termine__liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ru-line); }
.rdj-termin { display: grid; grid-template-columns: 76px 90px 1fr auto; align-items: baseline; gap: 12px; padding: 16px 4px; border-bottom: 1px solid var(--ru-line-2); }
.rdj-termin__tag { font: 900 26px/1 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.03em; }
.rdj-termin__datum { font: 700 16px/1 var(--ru-f-text); opacity: .85; }
.rdj-termin__zeit { font-size: 15px; }
.rdj-termin__rel { text-align: right; }
.rdj-termin.is-erster .rdj-termin__tag { color: var(--ru-cyan); }
.rdj-termin.is-jetzt { background: color-mix(in srgb, var(--ru-cyan) 10%, transparent); }
.rdj-termin.is-jetzt .rdj-termin__tag, .rdj-termin.is-jetzt .rdj-termin__rel { color: var(--ru-cyan); opacity: 1; }
.rdj-termin.is-vorbei { opacity: .4; }
.rdj-termine__hinweis { margin: 14px 0 0; }

/* ---------------- Über ---------------- */
.rdj-ueber__raster { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.rdj-bio { display: grid; gap: 16px; margin-top: 14px; max-width: 64ch; font: 500 clamp(17px, 1.35vw, 19px)/1.75 var(--ru-f-text); color: var(--ru-paper); }
.rdj-bio p { margin: 0; }
.rdj-bio__erst { font: 700 clamp(20px, 1.9vw, 26px)/1.45 var(--ru-f-text); letter-spacing: -.01em; }
.rdj-ueber__seite { display: grid; gap: 10px; border-left: 1px solid var(--ru-line); padding-left: clamp(20px, 3vw, 40px); }
.rdj-ueber__lab { margin-top: 14px; }
.rdj-fakten { margin: 0; display: grid; gap: 0; }
.rdj-fakten > div { display: grid; gap: 6px; padding: 12px 0; border-bottom: 1px solid var(--ru-line-2); }
.rdj-fakten dt { font: 600 10px/1 var(--ru-f-mono); letter-spacing: .1em; text-transform: uppercase; opacity: .6; }
.rdj-fakten dd { margin: 0; font: 700 16px/1.35 var(--ru-f-text); }
.rdj-genres { display: flex; flex-wrap: wrap; gap: 6px; }
.rdj-genre { --k: var(--ru-genre-dark); font: 600 11px/1 var(--ru-f-mono); letter-spacing: .06em; text-transform: uppercase; padding: 7px 9px 7px 10px; border-radius: 3px;
  border: 1px solid var(--ru-line); box-shadow: inset 3px 0 0 var(--k); }

/* ---------------- Sets & Tracks / SoundCloud 2-Klick ---------------- */
.rdj-sets__raster { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.rdj-sets__raster.is-allein { grid-template-columns: minmax(0, 1fr); }
.rdj-sc { position: relative; border-radius: var(--ru-r-2); overflow: hidden; background: var(--ru-ink-2); border: 1px solid var(--ru-line-2); }
.rdj-sc__vorschau { position: relative; isolation: isolate; min-height: 340px; display: flex; align-items: flex-end; }
.rdj-sc__bild { position: absolute; inset: -20px; width: calc(100% + 40px); height: calc(100% + 40px); object-fit: cover; filter: blur(14px) saturate(1.2) brightness(.55); z-index: -2; }
.rdj-sc__tint { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(13,10,31,.95) 0%, rgba(13,10,31,.4) 70%), linear-gradient(110deg, rgba(255,85,0,.28), transparent 55%); }
.rdj-sc__in { padding: 28px; display: grid; gap: 10px; max-width: 640px; }
.rdj-sc__logo { color: #ff5500; }
.rdj-sc__logo .rdj-ico { width: 44px; height: 44px; }
.rdj-sc__titel { margin: 0; font: 900 clamp(24px, 3vw, 40px)/.95 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.03em; overflow-wrap: anywhere; }
.rdj-sc__art { margin: 0; }
.rdj-sc__knoepfe { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.rdj-sc__laden { display: inline-flex; align-items: center; gap: 10px; }
.rdj-sc__hinweis { margin: 4px 0 0; font: 500 12px/1.55 var(--ru-f-text); color: var(--ru-paper-70); max-width: 60ch; }
.rdj-sc__hinweis a { color: var(--ru-paper); }
.rdj-sc.is-geladen { background: #fff; border: 0; }
.rdj-sc__frame { display: block; width: 100%; border: 0; }
.rdj-sc__tracks { list-style: none; margin: 12px 0 0; padding: 0; }
.rdj-sc__tracks .t { flex: 1; color: var(--ru-paper); text-decoration: none; }
.rdj-setliste { display: grid; gap: 8px; }
.rdj-setliste ol { list-style: none; margin: 0 0 16px; padding: 0; border-top: 1px solid var(--ru-line); }
.rdj-setliste .rs-li { flex-direction: column; align-items: flex-start; gap: 4px; }
.rdj-setliste .is-kommend .m { color: var(--ru-cyan); opacity: 1; }

/* ---------------- Galerie (Blocksatz: gleiche Höhe je Reihe, kein Beschnitt) ---------------- */
.rdj-galerie { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.rdj-galerie li { --r: 1; flex: var(--r) 1 calc(var(--r) * 300px); min-width: 0; }
.rdj-galerie a { display: block; border-radius: var(--ru-r-1); overflow: hidden; background: var(--ru-ink-2); box-shadow: var(--ru-shadow-cover); }
.rdj-galerie img { display: block; width: 100%; height: auto; aspect-ratio: var(--r); object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1), filter .3s; }
.rdj-galerie a:hover img { transform: scale(1.025); filter: brightness(1.06); }
.rdj-lb { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100dvh; margin: 0; color: var(--ru-paper); }
.rdj-lb[open] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.rdj-lb::backdrop { background: rgba(13,10,31,.94); backdrop-filter: blur(8px); }
.rdj-lb img { max-width: min(96vw, 1600px); max-height: calc(100dvh - 110px); object-fit: contain; border-radius: var(--ru-r-1); box-shadow: var(--ru-shadow-cover); }
.rdj-lb__leiste { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: min(96vw, 1600px); }
.rdj-lb__kn { display: flex; gap: 8px; }
.rdj-lb__kn [hidden] { display: none; }

/* ---------------- Karten (Line-up, Startseite, Programm) ---------------- */
.rdj-karte { --g: var(--ru-genre-dark); position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;
  border-radius: var(--ru-r-2); color: var(--ru-paper); text-decoration: none; background: var(--ru-ink-2); aspect-ratio: 4 / 5; min-height: 0;
  box-shadow: var(--ru-shadow-cover); outline: 1px solid var(--ru-line-2); outline-offset: -1px; transition: outline-color .25s, transform .35s cubic-bezier(.2,.7,.2,1);
  container-type: inline-size; --rdj-n: 8; }
.rdj-karte:hover { color: var(--ru-paper); transform: translateY(-3px); outline-color: var(--ru-paper); }
.rdj-karte__bild { position: absolute; inset: 0; z-index: -2; }
.rdj-karte__bild img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; display: block; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.rdj-karte__bild img.is-hoch { object-position: 50% 20%; }
.rdj-karte:hover .rdj-karte__bild img { transform: scale(1.04); }
.rdj-karte__tint { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(13,10,31,.97) 0%, rgba(13,10,31,.72) 32%, rgba(13,10,31,.05) 62%, rgba(13,10,31,.45) 100%);
  box-shadow: inset 0 -3px 0 var(--g); }
.rdj-karte__oben { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 18px 0; }
.rdj-karte__live[hidden] { display: none; }
.rdj-karte__rolle { margin-left: auto; opacity: .85; }
.rdj-karte__unten { display: grid; gap: 10px; padding: 0 18px 22px; }
.rdj-karte__genre { opacity: .8; }
.rdj-karte__name { --rdj-max: 76px; font: 900 min(var(--rdj-max), calc((100cqi - 36px) / (var(--rdj-n) * 1.02)))/.86 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.05em; overflow-wrap: anywhere; }
.rdj-karte__kurz { font: 500 15px/1.5 var(--ru-f-text); opacity: .88; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 52ch; }
.rdj-karte__termin { display: flex; align-items: center; gap: 10px; padding-top: 10px; border-top: 1px solid var(--ru-line); font-size: 13px; }
.rdj-karte__termin .rs-dia { width: 7px; height: 7px; background: var(--ru-cyan); flex: none; }
.rdj-karte__termin b { font-weight: 600; opacity: .7; margin-right: 4px; }
.rdj-karte__pfeil { position: absolute; right: 18px; bottom: 22px; font: 600 18px/1 var(--ru-f-mono); opacity: 0; transform: translateX(-6px); transition: opacity .25s, transform .25s; }
.rdj-karte:hover .rdj-karte__pfeil { opacity: 1; transform: none; }
.rdj-karte.is-live { outline: 2px solid var(--ru-magenta); outline-offset: -2px; }
.rdj-karte.is-live .rdj-karte__tint { box-shadow: inset 0 -3px 0 var(--ru-magenta); background: linear-gradient(0deg, rgba(13,10,31,.97) 0%, rgba(13,10,31,.7) 32%, rgba(13,10,31,.05) 62%, color-mix(in srgb, var(--ru-magenta) 28%, transparent) 100%); }
.rdj-karte--klein { aspect-ratio: 4 / 5; }
.rdj-karte--klein .rdj-karte__name { --rdj-max: 46px; }
.rdj-karte--klein .rdj-karte__oben { padding: 14px 14px 0; }
.rdj-karte--klein .rdj-karte__unten { padding: 0 14px 16px; gap: 8px; }
.rdj-karte--klein .rdj-karte__termin { font-size: 12px; }

/* ---------------- Line-up-Seite ---------------- */
.rdj-kopf { position: relative; isolation: isolate; overflow: hidden; }
.rdj-kopf__bild { position: absolute; inset: 0; z-index: -2; }
.rdj-kopf__bild img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 35%; filter: saturate(.9) blur(2px) brightness(.8); transform: scale(1.06); }
.rdj-kopf__tint { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(13,10,31,.97) 0%, rgba(13,10,31,.82) 50%, rgba(13,10,31,.55) 100%), linear-gradient(0deg, var(--ru-ink) 0%, rgba(13,10,31,0) 60%); }
.rdj-kopf__in > * { min-width: 0; }
.rdj-kopf__in { grid-template-columns: minmax(0, 1fr); padding-top: clamp(110px, 12vw, 170px); padding-bottom: 36px; display: grid; gap: 14px; }
.rdj-kopf__lab { margin: 0; display: flex; align-items: center; gap: 12px; }
.rdj-kopf__lab .rs-colon { font-size: 7px; }
.rdj-kopf__titel { --rdj-n: 9; margin: 0 0 0 -.04em; font: 900 min(210px, 13vw, calc((100vw - 2 * var(--ru-gutter)) / (var(--rdj-n) * .98)))/.84 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.055em; }
.rdj-kopf__sub { margin: 0; max-width: 56ch; font: 500 clamp(16px, 1.4vw, 19px)/1.55 var(--ru-f-text); color: var(--ru-paper-70); }
.rdj-kopf__zeile { margin: 6px 0 0; }
.rdj-kopf__zeile [hidden] { display: none; }
.rdj-kopf__live { color: var(--ru-magenta); opacity: 1; }
.rdj-lineup { padding-top: 12px; }
.rdj-raster { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rdj-raster--n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Nur ein Resident: eine große Bühne statt einer einsamen Karte */
.rdj-raster--n1 { grid-template-columns: minmax(0, 1fr); }
.rdj-raster--n1 .rdj-karte { aspect-ratio: 16 / 7.5; }
.rdj-raster--n1 .rdj-karte__name { --rdj-max: 170px; font-size: min(170px, 11vw, calc((100cqi - 64px) / (var(--rdj-n) * 1.02))); }
.rdj-raster--n1 .rdj-karte__unten { padding: 0 32px 32px; max-width: 1060px; }
.rdj-raster--n1 .rdj-karte__oben { padding: 26px 32px 0; }
.rdj-raster--n1 .rdj-karte__kurz { font-size: 17px; -webkit-line-clamp: 3; }
.rdj-raster--n1 .rdj-karte__termin { font-size: 15px; }
.rdj-raster--n1 .rdj-karte__tint { background: linear-gradient(90deg, rgba(13,10,31,.92) 0%, rgba(13,10,31,.55) 42%, rgba(13,10,31,0) 72%), linear-gradient(0deg, rgba(13,10,31,.9) 0%, rgba(13,10,31,0) 50%); }
.rdj-leerstand { position: relative; overflow: hidden; display: grid; gap: 14px; justify-items: start; padding: 48px clamp(20px, 4vw, 48px); border: 1px solid var(--ru-line); border-radius: var(--ru-r-2); background: var(--ru-ink-2); }
.rdj-leerstand__fq { position: absolute; inset: 0 0 auto; height: 60px; color: var(--ru-cyan); opacity: .35; }
.rdj-leerstand p { margin: 0; max-width: 56ch; font: 500 16px/1.6 var(--ru-f-text); color: var(--ru-paper-70); }
.rdj-du { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px 32px; flex-wrap: wrap; margin-top: clamp(48px, 6vw, 88px); padding-top: 28px; border-top: 1px solid var(--ru-line); }
.rdj-du p { margin: 10px 0 0; max-width: 52ch; font: 500 16px/1.55 var(--ru-f-text); color: var(--ru-paper-70); }
.rdj-reihe { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rdj-zurueck { padding-top: 48px; }

/* ---------------- Startseite: Block „Residents“ ---------------- */
.rdj-home__raster { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rdj-home__raster--n1 { grid-template-columns: minmax(0, 1fr); }
.rdj-home__raster--n1 .rdj-karte { aspect-ratio: 21 / 8; }
.rdj-home__raster--n1 .rdj-karte__name { --rdj-max: 120px; font-size: min(120px, 8vw, calc((100cqi - 56px) / (var(--rdj-n) * 1.02))); }
.rdj-home__raster--n1 .rdj-karte__unten { padding: 0 28px 26px; max-width: 900px; }
.rdj-home__raster--n1 .rdj-karte__oben { padding: 22px 28px 0; }
.rdj-home__raster--n1 .rdj-karte__tint { background: linear-gradient(90deg, rgba(13,10,31,.92) 0%, rgba(13,10,31,.5) 45%, rgba(13,10,31,0) 75%), linear-gradient(0deg, rgba(13,10,31,.85) 0%, rgba(13,10,31,0) 55%); }
.rdj-home__raster--n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rdj-home__raster--n2 .rdj-karte, .rdj-home__raster--n3 .rdj-karte { aspect-ratio: 4 / 3; }
.rdj-home__raster--n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------------- Programm (js/programm.js): DJ-Einträge ---------------- */
.pr-b.pr-b--dj { background: linear-gradient(90deg, color-mix(in srgb, var(--ru-magenta) 24%, var(--ru-ink-2)), var(--ru-ink-2)); border-color: var(--ru-magenta); }
.pr-b--dj .pr-b__dj { display: inline-flex; align-items: center; gap: 6px; }
.pr-b--dj .pr-b__dj img { width: 22px; height: 22px; border-radius: 3px; object-fit: cover; flex: none; }
.pr-k--dj .pr-k__bild { outline: 2px solid var(--ru-magenta); outline-offset: -2px; }
.pr-djmarke { font: 600 10px/1 var(--ru-f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ru-magenta); }

/* ---------------- Handy ---------------- */
@media (max-width: 1100px) {
  .rdj-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rdj-reihe, .rdj-home__raster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rdj-raster--n1 .rdj-karte { aspect-ratio: 16 / 9; }
}
@media (max-width: 820px) {
  .rdj-hero { min-height: min(100svh, 860px); }
  .rdj-hero__bild img { object-position: 36% 18%; }
  .rdj-hero__tint { background:
    linear-gradient(0deg, var(--ru-ink) 0%, rgba(13,10,31,.86) 34%, rgba(13,10,31,.25) 62%, rgba(13,10,31,.55) 100%),
    linear-gradient(200deg, color-mix(in srgb, var(--g) 26%, transparent) 0%, transparent 40%); }
  .rdj-profil.is-live .rdj-hero__tint { background:
    linear-gradient(0deg, var(--ru-ink) 0%, rgba(13,10,31,.86) 34%, rgba(13,10,31,.25) 62%, rgba(13,10,31,.55) 100%),
    linear-gradient(200deg, color-mix(in srgb, var(--ru-magenta) 32%, transparent) 0%, transparent 40%); }
  .rdj-hero__in { padding-top: 38vh; padding-bottom: 36px; gap: 14px; }
  .rdj-hero__name { font-size: min(96px, calc((100vw - 2 * var(--ru-gutter)) / (var(--rdj-n) * .98))); }
  .rdj-hero__kurz { font-size: 15px; }
  .rdj-hero__proto .rs-colon { display: none; }
  .rdj-sc__laden { font-size: 12px; }
  .rdj-hero__termin { font-size: 12.5px; gap: 6px 10px; }
  .rdj-hero__knoepfe { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rdj-hero__knoepfe .rdj-play { grid-column: 1 / -1; justify-content: center; }
  .rdj-hero__knoepfe .rs-btn2 { justify-content: center; text-align: center; padding: 12px 8px; }
  .rdj-hero__knoepfe > :last-child:nth-child(even) { grid-column: 1 / -1; }
  .rdj-links--kopf { gap: 6px; }
  .rdj-links--kopf .rdj-link { min-height: 38px; padding: 7px 11px 7px 9px; font-size: 11px; }
  .rdj-jetzt__in { gap: 14px; padding-top: 20px; padding-bottom: 20px; }
  .rdj-jetzt__btn { width: 100%; justify-content: center; }
  .rdj-termine__raster, .rdj-ueber__raster, .rdj-sets__raster { grid-template-columns: minmax(0, 1fr); }
  .rdj-uhr { min-height: 0; padding: 22px 20px; }
  .rdj-termin { grid-template-columns: 52px 64px 1fr; gap: 4px 10px; padding: 14px 2px; }
  .rdj-termin__tag { font-size: 20px; }
  .rdj-termin__datum { font-size: 14px; }
  .rdj-termin__zeit { font-size: 13px; }
  .rdj-termin__rel { grid-column: 3; text-align: left; }
  .rdj-termin__rel:empty { display: none; }
  .rdj-ueber__seite { border-left: 0; padding-left: 0; border-top: 1px solid var(--ru-line); padding-top: 18px; }
  .rdj-bio { font-size: 16px; line-height: 1.7; }
  .rdj-sc__vorschau { min-height: 300px; }
  .rdj-sc__in { padding: 20px; }
  .rdj-sc__knoepfe .rs-btn, .rdj-sc__knoepfe .rs-btn2 { width: 100%; justify-content: center; text-align: center; box-sizing: border-box; }
  .rdj-galerie { flex-direction: column; }
  .rdj-galerie li { flex: none; width: 100%; }
  .rdj-lb__leiste { padding: 0 12px; box-sizing: border-box; }
  .rdj-raster, .rdj-raster--n2 { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .rdj-raster--n1 .rdj-karte, .rdj-karte { aspect-ratio: 4 / 5; }
  .rdj-raster--n1 .rdj-karte__name { font-size: min(88px, calc((100cqi - 36px) / (var(--rdj-n) * 1.02))); }
  .rdj-raster--n1 .rdj-karte__unten { padding: 0 18px 22px; }
  .rdj-raster--n1 .rdj-karte__oben { padding: 18px 18px 0; }
  .rdj-raster--n1 .rdj-karte__tint { background: linear-gradient(0deg, rgba(13,10,31,.97) 0%, rgba(13,10,31,.72) 32%, rgba(13,10,31,.05) 62%, rgba(13,10,31,.45) 100%); }
  .rdj-karte__kurz { font-size: 14px; }
  .rdj-reihe { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .rdj-reihe .rdj-karte__name { --rdj-max: 30px; }
  .rdj-reihe .rdj-karte__termin b { display: none; }
  .rdj-home__raster, .rdj-home__raster--n2, .rdj-home__raster--n3 { grid-template-columns: minmax(0, 1fr); }
  .rdj-home__raster .rdj-karte, .rdj-home__raster--n1 .rdj-karte { aspect-ratio: 4 / 3.6; }
  .rdj-home__raster--n1 .rdj-karte__name { font-size: min(76px, calc((100cqi - 36px) / (var(--rdj-n) * 1.02))); }
  .rdj-home__raster--n1 .rdj-karte__unten { padding: 0 18px 20px; }
  .rdj-home__raster--n1 .rdj-karte__oben { padding: 16px 18px 0; }
  .rdj-home__raster--n1 .rdj-karte__tint { background: linear-gradient(0deg, rgba(13,10,31,.97) 0%, rgba(13,10,31,.7) 36%, rgba(13,10,31,.05) 70%, rgba(13,10,31,.4) 100%); }
  .rdj-kopf__in { padding-bottom: 24px; }
  .rdj-du .rdj-sek__knoepfe { width: 100%; }
  .rdj-du .rdj-sek__knoepfe > * { flex: 1 1 auto; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .rdj-hero__bild img { animation: none; transform: none; }
  .rdj-karte, .rdj-karte__bild img, .rdj-galerie img { transition: none; }
}
html[data-bewegung="reduziert"] .rdj-hero__bild img { animation: none; transform: none; }
html[data-bewegung="reduziert"] .rdj-karte, html[data-bewegung="reduziert"] .rdj-karte__bild img { transition: none; }
@media (max-width: 820px) {
  .rdj-karte__termin > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .rdj-karte__termin { font-size: 12px; }
}

/* ---------------- Sets & Tracks als Liste (27.09.2026 abends) ----------------
   Cover kommen von unserem Server (/dj-sc-cover.php); der Player (w.soundcloud.com) erst nach „Abspielen“. */
.rdj-scl__liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ru-line); counter-reset: scl; }
.rdj-scl__e { border-bottom: 1px solid var(--ru-line-2); }
.rdj-scl__zeile { display: grid; grid-template-columns: 104px minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 16px 0; }
.rdj-scl__cover { position: relative; display: block; width: 104px; aspect-ratio: 1; border-radius: var(--ru-r-1); overflow: hidden; background: var(--ru-ink-2); box-shadow: var(--ru-shadow-cover), inset 3px 0 0 var(--g); }
.rdj-scl__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rdj-scl__cover.is-ersatz img { filter: saturate(.8) brightness(.7); }
.rdj-scl__nr { position: absolute; left: 0; bottom: 0; padding: 4px 7px; background: rgba(13,10,31,.82); color: var(--ru-paper); font-size: 11px; line-height: 1; letter-spacing: .06em; border-top-right-radius: 3px; }
.rdj-scl__txt { min-width: 0; display: grid; gap: 6px; }
.rdj-scl__art { margin: 0; }
.rdj-scl__t { margin: 0; font: 900 clamp(17px, 1.55vw, 22px)/1.08 var(--ru-f-disp); text-transform: uppercase; letter-spacing: -.02em; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rdj-scl__m { margin: 0; font-size: 12px; opacity: .7; }
.rdj-scl__kn { display: flex; align-items: center; gap: 8px; }
.rdj-scl__play .rs-play { border-left-width: 10px; border-top-width: 6px; border-bottom-width: 6px; }
.rdj-scl__pb { display: none; }
.rdj-scl__ext { width: 46px; height: 44px; padding: 0; justify-content: center; gap: 2px; }
.rdj-scl__ext .rdj-ico { color: #ff5500; width: 22px; height: 22px; }
.rdj-scl__ext i { font-style: normal; font-size: 11px; opacity: .6; }
.rdj-scl__player:empty { display: none; }
.rdj-scl__player { margin: 0 0 16px; border-radius: var(--ru-r-1); overflow: hidden; background: #fff; }
.rdj-scl__e.is-geladen .rdj-scl__t { color: var(--ru-cyan); }
.rdj-scl__e.is-geladen .rdj-scl__play { background: transparent; color: var(--ru-cyan); box-shadow: inset 0 0 0 1.5px var(--ru-cyan); cursor: default; transform: none; }
.rdj-scl__e.is-geladen .rdj-scl__pa, .rdj-scl__e.is-geladen .rdj-scl__play .rs-play { display: none; }
.rdj-scl__e.is-geladen .rdj-scl__pb { display: inline; }
.rdj-scl__hinweis { margin-top: 14px; }
.rdj-scl__alle[disabled] { border-color: var(--ru-cyan); color: var(--ru-cyan); cursor: default; background: none; }

/* „Auf SoundCloud folgen“ – großer Knopf in „Hören & folgen“ (Elfenbein wie .rs-btn, Symbol in SoundCloud-Orange) */
.rdj-folgen { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 16px 18px; border-radius: var(--ru-r-1); background: var(--ru-paper); color: var(--ru-ink);
  text-decoration: none; transition: transform .12s ease, background .15s ease; }
.rdj-folgen:hover, .rdj-folgen:focus-visible { background: #fff; color: var(--ru-ink); transform: translateY(-1px); }
.rdj-folgen__i { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: var(--ru-r-1); background: #ff5500; color: #fff; }
.rdj-folgen__i .rdj-ico { width: 26px; height: 26px; color: #fff; }
.rdj-folgen__t { flex: 1; min-width: 0; display: grid; gap: 5px; }
.rdj-folgen__t b { font: 900 15px/1.05 var(--ru-f-disp); text-transform: uppercase; letter-spacing: .01em; }
.rdj-folgen__t small { font-size: 11.5px; line-height: 1.3; opacity: .7; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rdj-folgen__p { font-style: normal; font-weight: 700; opacity: .5; transition: transform .2s, opacity .2s; }
.rdj-folgen:hover .rdj-folgen__p { opacity: 1; transform: translate(2px, -2px); }

@media (max-width: 820px) {
  .rdj-sets .rdj-sek__knoepfe { width: 100%; }
  .rdj-scl__alle { width: 100%; justify-content: center; text-align: center; }
  .rdj-scl__zeile { grid-template-columns: 76px minmax(0, 1fr); gap: 12px 14px; padding: 14px 0; }
  .rdj-scl__cover { width: 76px; }
  .rdj-scl__t { font-size: 16px; }
  .rdj-scl__kn { grid-column: 1 / -1; }
  .rdj-scl__play { flex: 1; justify-content: center; }
  .rdj-folgen { padding: 14px; }
}

/* ---------------- SoundCloud-Rücksprung (/soundcloud-callback.php) ---------------- */
.rdj-cb { background: var(--ru-ink); color: var(--ru-paper); padding: clamp(56px, 10vw, 140px) 0 clamp(56px, 8vw, 120px); }
.rdj-cb__in { display: grid; gap: 16px; max-width: 980px; }
.rdj-cb__lab { display: flex; align-items: center; gap: 10px; margin: 0; }
.rdj-cb__titel { margin: 0; overflow-wrap: anywhere; }
.rdj-cb__txt { margin: 0; max-width: 60ch; font: 500 clamp(16px, 1.3vw, 18px)/1.7 var(--ru-f-text); }
.rdj-cb__txt--2 { color: var(--ru-paper-70); }
.rdj-cb__knoepfe { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
@media (max-width: 600px) { .rdj-cb__knoepfe > * { flex: 1 1 100%; justify-content: center; } }
@media (max-width: 820px) { .rdj-folgen__t small { white-space: normal; } }

/* „Neu auf SoundCloud“ – spielt im Site-Player (27.09.2026) */
.rdj-neu { flex-direction: row !important; align-items: center !important; flex-wrap: wrap; gap: 4px 12px !important; }
.rdj-neu__play { display: flex; align-items: center; gap: 12px; flex: 1 1 100%; min-width: 0; min-height: 44px; padding: 0; background: none; border: 0; color: var(--ru-paper); font: inherit; text-align: left; cursor: pointer; }
.rdj-neu__play .t { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.rdj-neu__icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1.5px solid var(--ru-line); border-radius: 4px; transition: border-color .15s, background .15s; }
.rdj-neu__play:hover .rdj-neu__icon, .rdj-neu__play:focus-visible .rdj-neu__icon { border-color: var(--ru-paper); }
.rdj-neu.is-playing .rdj-neu__icon { background: var(--ru-magenta, #ff2bd6); border-color: var(--ru-magenta, #ff2bd6); }
.rdj-neu.is-playing:not(.is-paused) .t { color: var(--ru-magenta, #ff2bd6); }
.rdj-neu .m { padding-left: 48px; display: flex; align-items: center; gap: 10px; }
.rdj-neu__ext { color: var(--ru-paper-70, rgba(245,240,230,.7)); text-decoration: none; font-size: 13px; padding: 4px 6px; }
.rdj-neu__ext:hover { color: var(--ru-paper); }

/* Sets & Tracks: spielt im Site-Player (27.09.2026) – „Alle Player erlauben“ und Inline-Player entfallen */
.rdj-scl [data-rdj-sc-alle], .rdj-scl__player { display: none !important; }
.rdj-scl__e.is-playing .rdj-scl__play { background: var(--ru-magenta, #ff2bd6); border-color: var(--ru-magenta, #ff2bd6); color: var(--ru-ink); }
.rdj-scl__e.is-playing .rdj-scl__t { color: var(--ru-magenta, #ff2bd6); }
.rdj-scl__e .rdj-scl__pb { display: none; }
.rdj-scl__alle { display: none !important; }

/* Safari/Firefox-Rückfall: sichtbarer SoundCloud-Player in der Zeile (27.09.2026) */
.rdj-inline { flex: 1 1 100%; width: 100%; margin: 10px 0 4px; }
.rdj-inline__hin { margin: 0 0 8px; font-size: 12px; color: var(--ru-cyan, #00e5ff); }
.rdj-inline__frame { display: block; width: 100%; height: 166px; border: 0; border-radius: 4px; }
