/* CLDF Radio, 31.10.2026 – eigenständige, responsive Oberfläche.
   Keine Eingriffe in globale CSS-Regeln oder andere Webseiten. */
#cldf-radio-player, #cldf-radio-player *, #cldf-radio-player *::before, #cldf-radio-player *::after {box-sizing:border-box}
#cldf-radio-player {
  --rw-wood:#763812;--rw-dark:#391605;--rw-gold:#c98a40;--rw-red:#8a0409;
  display:block; width:min(100%,842px);max-width:842px;min-width:0;
  margin:24px auto 26px; color:#fff;font:normal 15px/1.4 Arial,Helvetica,sans-serif;
  text-shadow:none;overflow:visible; isolation:isolate;
}
#cldf-radio-player .rw-frame {
  width:100%;max-width:100%;min-width:0;
  position:relative;display:flex;flex-direction:column;gap:10px;
  padding:12px;overflow:hidden;
  border:4px solid #4d220b;border-radius:18px;
  background:
    linear-gradient(90deg,rgba(28,8,1,.3),rgba(255,193,99,.10) 50%,rgba(29,8,1,.34)),
    repeating-linear-gradient(0deg,#5c270d 0px,#7f4015 11px,#4c1c07 25px,#995520 36px,#4b220e 48px);
  box-shadow:inset 0 0 0 3px #b96d2b,inset 0 0 20px #2a1006,
             0 14px 27px rgba(58,30,13,.32);
}
#cldf-radio-player .rw-frame::after {
  content:"";position:absolute;inset:6px;border:1px solid rgba(250,187,105,.23);
  border-radius:10px;pointer-events:none;z-index:3;
}
#cldf-radio-player .rw-header {
  position:relative;min-width:0;width:100%;
  background:#583016;border:2px solid #a56a32;border-radius:9px;
  box-shadow:0 2px 8px #2008017e;overflow:hidden;
}
#cldf-radio-player .rw-header img {display:block;width:100%;height:auto;aspect-ratio:802/184;object-fit:contain;object-position:center}
#cldf-radio-player .rw-controls {
  display:grid;grid-template-columns:96px minmax(0,1fr) 54px;
  align-items:center;gap:18px;min-width:0;
  padding:17px 20px;
  background:linear-gradient(145deg,#7a0306,#420000 52%,#2b0101);
  border:2px solid #c47d36;border-radius:14px;
  box-shadow:inset 0 3px 10px #1c0000,0 3px 8px #270900;
}
#cldf-radio-player .rw-play {
  width:86px;height:86px;min-width:0;display:grid;place-items:center;
  border:4px solid #fff;border-radius:50%;padding:0;
  color:white;background:linear-gradient(135deg,#dd141a,#9f0006 75%);
  box-shadow:0 0 0 3px #b80812,0 0 14px #e71b1bc7;
  cursor:pointer;transition:filter .18s,transform .18s;
}
#cldf-radio-player .rw-play:hover {filter:brightness(1.16);transform:scale(1.025)}
#cldf-radio-player .rw-play svg {width:40px;height:40px;fill:currentColor}
#cldf-radio-player .rw-now {display:flex;flex-direction:column;min-width:0;gap:4px}
#cldf-radio-player .rw-song {margin:0;color:#fff;font:800 clamp(16px,1.6vw,20px)/1.2 Arial,Helvetica,sans-serif;overflow-wrap:anywhere}
#cldf-radio-player .rw-artist {margin:0;color:#f5d9c6;font:normal 15px/1.4 Arial,Helvetica,sans-serif;overflow-wrap:anywhere}
#cldf-radio-player .rw-volume-row {display:flex;align-items:center;gap:12px;margin-top:10px;min-width:0}
#cldf-radio-player .rw-volume-row svg {width:24px;height:24px;color:#fff;flex:none}
#cldf-radio-player .rw-volume {width:100%;min-width:0;flex:1;accent-color:#db1b24;cursor:pointer}
#cldf-radio-player .rw-live {flex:none;font-size:12px;color:#ffcaad;font-weight:700;white-space:nowrap}
#cldf-radio-player .rw-bars {display:flex;align-items:flex-end;justify-content:center;gap:3px;height:48px}
#cldf-radio-player .rw-bars i {display:block;flex:1;max-width:7px;min-width:3px;background:linear-gradient(#fa4642,#bd0706);border-radius:2px 2px 0 0;box-shadow:0 0 3px #fa2b29}
#cldf-radio-player .rw-bars i:nth-child(1){height:25%}#cldf-radio-player .rw-bars i:nth-child(2){height:44%}#cldf-radio-player .rw-bars i:nth-child(3){height:61%}#cldf-radio-player .rw-bars i:nth-child(4){height:82%}#cldf-radio-player .rw-bars i:nth-child(5){height:100%}
#cldf-radio-player.rw-playing .rw-bars i{animation:rw-equalize .7s ease-in-out infinite alternate}
#cldf-radio-player.rw-playing .rw-bars i:nth-child(2n){animation-delay:-.3s}
#cldf-radio-player.rw-playing .rw-bars i:nth-child(3n){animation-delay:-.48s}
@keyframes rw-equalize{from{transform:scaleY(.4);transform-origin:bottom}to{transform:scaleY(1);transform-origin:bottom}}
#cldf-radio-player .rw-history {
  min-width:0;padding:0 12px 12px;
  color:#40200f;background:linear-gradient(115deg,#f3d9b5,#fff1dc 32%,#fff0d8 70%,#ebcda6);
  border:3px solid #9b5524;border-radius:11px;
  box-shadow:inset 0 0 0 2px #e5bb83,inset 0 3px 11px #925f3155;
}
#cldf-radio-player .rw-history h2 {margin:10px 4px 8px;color:#5a2a12;font:bold 24px/1.3 Georgia,"Times New Roman",serif}
#cldf-radio-player .rw-tracklist {height:auto;max-height:330px;overflow-y:auto;overflow-x:hidden;scrollbar-color:#a5774d #f7e4cf;overscroll-behavior:contain;border-radius:5px}
#cldf-radio-player .rw-track {
  display:grid;grid-template-columns:46px 46px minmax(0,1fr) 22px;
  align-items:center;gap:11px;padding:8px 8px;
  min-width:0;border-bottom:1px solid #d6b28a;color:#321b12;
  background:rgba(255,255,255,.15)
}
#cldf-radio-player .rw-track:nth-child(odd){background:rgba(138,64,17,.055)}
#cldf-radio-player .rw-track img {display:block;width:46px;height:46px;object-fit:cover;border:2px solid #75421f;border-radius:6px;box-shadow:0 1px 4px #49210875}
#cldf-radio-player .rw-time {color:#5d4b39;font:normal 13px/1 Arial,Helvetica,sans-serif}
#cldf-radio-player .rw-track-text {display:flex;flex-direction:column;gap:3px;min-width:0}
#cldf-radio-player .rw-track-title {color:#842514;font:bold 14px/1.2 Arial,Helvetica,sans-serif;overflow-wrap:anywhere}
#cldf-radio-player .rw-track-artist {color:#5a4a3f;font:normal 13px/1.25 Arial,Helvetica,sans-serif;overflow-wrap:anywhere}
#cldf-radio-player .rw-smallbars {color:#a31114;font:bold 16px Arial,Helvetica,sans-serif;letter-spacing:-2px;white-space:nowrap}
#cldf-radio-player .rw-empty {padding:25px 10px;color:#583b25;text-align:center}
#cldf-radio-player .rw-footer {
  display:flex;align-items:center;justify-content:center;gap:12px;min-width:0;
  padding:12px 8px;color:#fff7e9;border:1px solid #8e5429;
  border-radius:8px;background:linear-gradient(180deg,#744017,#3c1b0b);
  text-decoration:none!important;font-weight:700;font-size:14px;
}
#cldf-radio-player .rw-footer:hover{background:linear-gradient(180deg,#915022,#4f210b)}
#cldf-radio-player .rw-footer svg{width:20px;height:20px;flex:none}
#cldf-radio-player .rw-status{margin:10px 3px 0!important;color:#69442c;text-align:center;font:normal 12px/1.45 Arial,Helvetica,sans-serif}
#cldf-radio-player :is(a,button,input):focus-visible{outline:3px solid #ffc55b;outline-offset:3px}
/* Only on the Radio page; prevents old content styles from clipping the new player. */
body:has(#cldf-radio-player) .inner-main .page-panel {overflow:visible;min-width:0}
@media(max-width:720px){
 #cldf-radio-player {width:100%;margin:16px auto 22px}
 #cldf-radio-player .rw-frame {padding:8px;gap:7px;border-width:3px;border-radius:13px}
 #cldf-radio-player .rw-controls {grid-template-columns:69px minmax(0,1fr);gap:11px;padding:13px 11px}
 #cldf-radio-player .rw-play{width:62px;height:62px;border-width:3px}
 #cldf-radio-player .rw-play svg{width:30px;height:30px}
 #cldf-radio-player .rw-song{font-size:15px}
 #cldf-radio-player .rw-artist{font-size:13px}
 #cldf-radio-player .rw-bars{display:none}
 #cldf-radio-player .rw-volume-row{gap:7px;margin-top:5px}
 #cldf-radio-player .rw-volume-row svg{width:20px;height:20px}
 #cldf-radio-player .rw-live{font-size:10px}
 #cldf-radio-player .rw-history{padding:0 5px 7px}
 #cldf-radio-player .rw-history h2{font-size:19px;margin:9px 5px}
 #cldf-radio-player .rw-track {grid-template-columns:36px 37px minmax(0,1fr);gap:6px;padding:7px 4px}
 #cldf-radio-player .rw-track img{height:35px;width:35px}
 #cldf-radio-player .rw-smallbars{display:none}
 #cldf-radio-player .rw-track-title{font-size:12px}
 #cldf-radio-player .rw-track-artist,#cldf-radio-player .rw-time{font-size:11px}
 #cldf-radio-player .rw-tracklist{max-height:285px}
 #cldf-radio-player .rw-footer{font-size:11px;gap:6px}
 #cldf-radio-player .rw-footer svg{height:16px;width:16px}
}
@media(max-width:380px){
 #cldf-radio-player .rw-controls {grid-template-columns:50px minmax(0,1fr);padding:10px 7px;gap:7px}
 #cldf-radio-player .rw-play{width:47px;height:47px}
 #cldf-radio-player .rw-play svg{height:22px;width:22px}
 #cldf-radio-player .rw-volume-row{gap:5px}
 #cldf-radio-player .rw-live{font-size:9px}
 #cldf-radio-player .rw-frame{padding:6px}
}
@media(prefers-reduced-motion:reduce){#cldf-radio-player .rw-bars i{animation:none!important}}
