:root{color-scheme:dark;--cream:#fff5df;--muted:#c7bfca;--border:rgba(255,255,255,.2)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:#10071c;background-image:radial-gradient(ellipse at 20% 25%,#241252,transparent 60%),radial-gradient(ellipse at 85% 60%,#52102e,transparent 55%),radial-gradient(ellipse at 65% 85%,#42210b,transparent 55%);background-attachment:fixed;color:var(--cream);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5}#oil,.shade{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}#oil{z-index:0}.shade{background:linear-gradient(180deg,rgba(9,3,18,.53),rgba(10,3,16,.58));z-index:1}main{position:relative;z-index:2;max-width:1280px;margin:auto;padding:52px 40px 24px}header{position:relative;isolation:isolate;margin-bottom:35px}header:before{content:"";position:absolute;z-index:-1;inset:-35px -15px -15px;background:radial-gradient(ellipse at 50% 35%,rgba(8,2,16,.55) 0%,rgba(8,2,16,.25) 50%,transparent 75%);pointer-events:none}.logo{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 3px rgba(0,0,0,.85)) drop-shadow(0 5px 18px rgba(0,0,0,.6))}.headerline{display:flex;justify-content:space-between;align-items:center;margin-top:22px;font-size:13px;letter-spacing:3px}nav{display:flex;gap:30px;font-size:14px;letter-spacing:.3px}a{color:inherit;text-decoration:none}a:hover{color:#ffcba9}.bento{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:18px}.glass{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:28px;padding:28px;background:linear-gradient(135deg,rgba(36,22,44,.73),rgba(15,9,26,.55));backdrop-filter:blur(23px) saturate(1.2);-webkit-backdrop-filter:blur(23px) saturate(1.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 14px 35px rgba(6,0,15,.16)}.glass:before{content:'';position:absolute;top:0;left:30px;right:30px;height:1px;background:linear-gradient(90deg,transparent,#ffffff65,transparent)}.listen{grid-row:span 2;display:flex;flex-direction:column;min-height:640px;padding:30px}.eyebrow{display:flex;gap:10px;align-items:center;font-size:12px;letter-spacing:1.4px}.spark{font-size:24px;color:#ffcfa6}.tag{margin-left:auto;border:1px solid #ffffff40;border-radius:20px;padding:3px 10px;font-size:11px;letter-spacing:1px}.listenbody{margin:auto 0;padding:35px 0}.kicker{font-size:14px;color:var(--muted)}h1{font-size:clamp(58px,6.6vw,88px);line-height:.98;letter-spacing:-5px;margin:24px 0;font-weight:500}h1 em{font-family:Georgia,serif;font-weight:400;color:#ffcf98}.intro{color:#e1d6df;line-height:1.75}.player{border-top:1px solid #ffffff25;padding-top:23px;display:flex;gap:16px;align-items:center}.player button{border:0;border-radius:50%;background:var(--cream);color:#241027;width:58px;height:58px;flex-shrink:0;font-size:20px;cursor:pointer}.player strong,.player #status{display:block}.player strong{font-size:15px;margin:4px 0}.player #status{font-size:12px;color:var(--muted)}.small{font-size:12px;letter-spacing:1.6px}.equalizer{display:flex;gap:3px;align-items:center;height:28px;margin-left:auto}.equalizer i{width:3px;height:12px;background:#ffd197;border-radius:4px}.equalizer i:nth-child(2n){height:23px}.equalizer i:nth-child(3){height:30px}.demo .equalizer i{animation:pulse .8s alternate infinite}.demo .equalizer i:nth-child(2n){animation-delay:.3s}@keyframes pulse{to{height:5px}}h2{font-size:28px;line-height:1.15;letter-spacing:-.8px;font-weight:500;margin:22px 0 15px}.story p,.shows p,.contact p{color:var(--muted);font-size:15px;line-height:1.7}.storyfoot{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#e6d6d5;margin-top:22px}.sun{font-size:45px;line-height:1;color:#ffd39c}.cardtop{display:flex;justify-content:space-between;gap:12px;align-items:center}.muted{color:#b8aabc}.record{height:137px;width:137px;border-radius:50%;margin:18px auto 21px;background:repeating-radial-gradient(circle at center,#201426 0px,#201426 2px,#423544 3px,#130c1b 4px);box-shadow:0 14px 25px #0006;display:grid;place-items:center}.record div{border-radius:50%;background:#d69fba;color:#231325;width:53px;height:53px;text-align:center;font-size:13px;font-weight:bold;padding:12px 0;line-height:1.1;transform:rotate(-18deg)}.record small{font-size:6px}.shows h2{font-size:25px;margin-top:9px}.shows p{margin-bottom:0}.accent{color:#ffd39c}.schedule{grid-column:2/4}.schedule h2{font-size:23px;margin:0}.showrow{display:flex;align-items:center;gap:20px;padding:17px 0;border-bottom:1px solid #ffffff1c}.showrow:last-child{border:0;padding-bottom:0}.showrow time{color:#efc4a3;font-size:15px}.showrow strong{font-size:16px;font-weight:500}.showrow div span{display:block;font-size:13px;color:var(--muted);margin-top:2px}.genre{margin-left:auto;font-size:10px;letter-spacing:1.3px;border:1px solid #ffffff29;border-radius:30px;padding:5px 11px}.contact{grid-column:1/4;display:grid;grid-template-columns:1fr 1.5fr 1.2fr;align-items:center;gap:20px;padding:26px 30px}.contact>.small{grid-column:1}.contact h2{grid-column:1;margin:0;font-size:23px}.contact>p:not(.contactstatus){grid-column:2;grid-row:1/3;margin:0;max-width:310px}.contactbutton{grid-column:3;grid-row:1/3;border:1px solid #ffffff50;border-radius:40px;background:#ffffff0c;color:var(--cream);padding:15px 20px;font-size:14px;cursor:pointer}.contactstatus:empty{display:none}.contactstatus{grid-column:1/4;margin:0}footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;margin-top:25px;color:#e2d4e1;font-size:12px}
footer>span:first-child{grid-column:3;grid-row:1;justify-self:end;text-align:right;max-width:100%;overflow-wrap:anywhere}
footer>span:last-child{grid-column:1;grid-row:1;justify-self:start;text-align:left;max-width:100%;overflow-wrap:anywhere}
footer button{grid-column:2;grid-row:1;justify-self:center}
@media(max-width:700px){footer{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:14px}footer>span:first-child{grid-column:1;grid-row:3;justify-self:center;text-align:center}footer>span:last-child{grid-column:1;grid-row:1;justify-self:center;text-align:center}footer button{grid-column:1;grid-row:2;justify-self:center}}footer button{background:#190d2999;border:1px solid #ffffff30;border-radius:30px;padding:8px 15px;color:inherit;font-size:12px;cursor:pointer}button:hover{filter:brightness(1.16)}button:focus-visible,a:focus-visible{outline:3px solid #ffda98;outline-offset:5px}@media(min-width:1450px){main{padding-top:65px}}@media(max-width:1000px){main{padding:35px 25px}.bento{grid-template-columns:1.2fr 1fr}.listen{grid-row:span 2;min-height:670px}.schedule{grid-column:1/3}.contact{grid-column:1/3}.shows{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.record{margin:0;flex-shrink:0;width:100px;height:100px}.shows .cardtop{width:100%}.contact{grid-template-columns:1fr 1fr}.contact>p:not(.contactstatus){grid-row:1/3}.contactbutton{grid-column:1/3;grid-row:auto}footer>span:last-child{display:none}}@media(max-width:600px){main{padding:27px 16px 20px}header{margin-bottom:24px}.headerline{margin-top:17px;font-size:10px;letter-spacing:1.5px;gap:10px}nav{font-size:12px;gap:13px}.bento{display:flex;flex-direction:column;gap:14px}.glass{border-radius:24px;padding:24px}.listen{min-height:520px}.listenbody{padding:20px 0}h1{font-size:73px;letter-spacing:-4px}.eyebrow{font-size:10px;letter-spacing:1px}.tag{font-size:10px}.story h2{font-size:30px}.shows{gap:22px}.shows h2{font-size:24px}.schedule .cardtop{align-items:flex-start}.schedule h2{font-size:22px}.schedule .muted{font-size:9px}.showrow{gap:14px}.genre{font-size:9px;padding:4px 8px}.showrow div span{font-size:12px}.contact{display:block}.contact h2{margin:15px 0}.contactbutton{width:100%;margin-top:18px}footer{font-size:11px;gap:8px}.footnote{display:none}footer button{font-size:11px;padding:9px 11px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.demo .equalizer i{animation:none}}
/* Live radio and observed track history */
.radio-column{grid-row:span 2;display:flex;flex-direction:column;gap:18px;min-width:0}.radio-column .listen{min-height:560px;flex:1}.listenbody{padding:24px 0}.liveplayer{display:flex;gap:18px;border-top:1px solid #ffffff25;padding-top:24px;align-items:center}.cover-wrap{width:112px;flex-shrink:0}.cover-wrap img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:13px;box-shadow:0 7px 20px #0005}.cover-wrap a{display:block;font-size:11px;color:var(--muted);margin-top:6px}.cover-wrap a[hidden]{display:none}.trackinfo{min-width:0;flex:1}.trackinfo strong{display:block;font-size:19px;font-weight:500;line-height:1.25;margin:7px 0 4px;overflow-wrap:anywhere}#track-artist{display:block;font-size:14px;color:var(--muted);overflow-wrap:anywhere}.play-controls{display:flex;align-items:center;gap:12px;margin-top:14px}.play-controls button{width:46px;height:46px;flex-shrink:0;border:0;border-radius:50%;font-size:18px;background:var(--cream);color:#241027;cursor:pointer}#stream-status{font-size:12px;color:var(--muted);line-height:1.4}.volume{display:flex;align-items:center;gap:12px;margin-top:22px;font-size:12px;color:var(--muted)}.volume input{min-width:0;flex:1;accent-color:#ffd39c}.volume output{width:32px}.metadata-status{font-size:12px;color:var(--muted);margin:12px 0 0}.metadata-status:empty{display:none}.history{padding:25px}.history h2{margin:0;font-size:23px}.history ol{list-style:none;margin:15px 0 0;padding:0}.history li{display:flex;gap:12px;align-items:center;border-top:1px solid #ffffff1c;padding:12px 0}.history li:last-child{padding-bottom:0}.history img{width:42px;height:42px;object-fit:cover;border-radius:7px;flex-shrink:0}.history li div{min-width:0;flex:1}.history strong{display:block;font-size:14px;font-weight:500;overflow-wrap:anywhere}.history li span{display:block;font-size:12px;color:var(--muted);overflow-wrap:anywhere}.history time{font-size:11px;color:var(--muted)}#history-empty{color:var(--muted);font-size:13px;line-height:1.6}.history .small{font-size:10px}@media(max-width:1000px){.radio-column{grid-row:span 2}.radio-column .listen{min-height:560px}.schedule{align-self:start}}@media(max-width:600px){.radio-column{gap:14px}.radio-column .listen{min-height:510px}.cover-wrap{width:90px}.liveplayer{gap:14px}.trackinfo strong{font-size:18px}.radio-column h1{font-size:68px}.history{padding:24px}}
/* Full-width player: artwork left, title and controls right. */
.wide-player{grid-column:1/-1;grid-row:auto;min-height:0;display:grid;grid-template-columns:minmax(180px,310px) minmax(0,1fr);gap:clamp(30px,5vw,70px);align-items:center;padding:38px}.wide-player .cover-wrap{width:100%;max-width:310px}.wide-player .cover-wrap img{border-radius:20px}.player-details{min-width:0;display:flex;flex-direction:column;align-self:stretch;justify-content:center}.wide-player .eyebrow{margin-bottom:35px}.wide-player .trackinfo{flex:initial}.wide-player #track-title{font-family:Georgia,serif;font-size:clamp(32px,4.5vw,60px);line-height:1.1;letter-spacing:-1.5px;margin:12px 0;color:var(--cream);overflow-wrap:anywhere}.wide-player #track-artist{font-size:20px}.player-bottom{border-top:1px solid #ffffff25;margin-top:30px;padding-top:24px;display:grid;grid-template-columns:1fr 1.25fr;align-items:center;gap:24px}.wide-player .play-controls{margin:0}.wide-player .play-controls button{width:60px;height:60px;font-size:23px}.wide-player .volume{margin:0;flex-wrap:wrap;gap:8px}.wide-player .volume label{width:100%}.wide-player .volume input{width:70%}.history{grid-column:1;align-self:start}.schedule{grid-column:1/-1}.story,.shows{align-self:stretch}@media(max-width:1000px){.wide-player{grid-template-columns:minmax(150px,230px) minmax(0,1fr);padding:30px;gap:30px}.wide-player .eyebrow{font-size:10px;letter-spacing:1px;margin-bottom:24px}.player-bottom{grid-template-columns:1fr;gap:20px}.wide-player .volume label{width:auto}.shows{grid-column:1/-1}.history{grid-column:1}.schedule{grid-column:1/-1}}@media(max-width:600px){.wide-player{display:grid;grid-template-columns:90px minmax(0,1fr);gap:18px;padding:24px;align-items:start}.wide-player .eyebrow{display:none}.wide-player .cover-wrap img{border-radius:12px}.wide-player #track-title{font-size:30px;letter-spacing:-.6px;margin:8px 0}.wide-player #track-artist{font-size:16px}.wide-player .small{font-size:11px}.player-bottom{margin-top:20px;padding-top:18px;gap:18px}.wide-player .play-controls{flex-wrap:wrap;gap:8px}.wide-player .play-controls button{width:48px;height:48px;font-size:18px}.wide-player .volume{gap:8px}.wide-player .volume label{width:100%}.wide-player .volume input{width:50px}.wide-player .tag{display:none}.wide-player .metadata-status{font-size:12px}}
/* Original vinyl fallback rotates clockwise only while audio plays. */
.wide-player .cover-wrap img.is-fallback{border-radius:50%;box-shadow:none;animation:vinyl-turn 8s linear infinite;animation-play-state:paused}
.wide-player .cover-wrap img.is-fallback.is-playing{animation-play-state:running}
@keyframes vinyl-turn{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.wide-player .cover-wrap img.is-fallback{animation:none}}

/* Equal mobile card widths, including the history card with little content. */
.bento > .glass{min-width:0}
@media(max-width:600px){
  .bento{align-items:stretch}
  .bento > .glass{width:100%;max-width:100%;align-self:stretch}
  .history .cardtop{flex-wrap:wrap}
}
/* Geen scheidingslijnen bij laatst afgespeeld */
.history li {
  border-top: none !important;
}

/* Geen scheidingslijnen bij linkblokken */
.link-item {
  border-top: none !important;
  border-bottom: none !important;
}


/* Blijvende correctie: schermbreedte en informatieblok. */
html { overflow-x: hidden; }
@supports (overflow-x: clip) { html { overflow-x: clip; } }
.bento > article#contact > .cardtop { flex-wrap: wrap; }
.bento > article#contact > .cardtop > h2 {
  font-size: 24px;
  line-height: 1.3;
  min-width: 0;
  overflow-wrap: anywhere;
}
.bento > article#contact > p.block-description {
  font-size: 16px;
  line-height: 1.6;
  font-weight: 400;
  margin: 14px 0 0;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.bento > article#contact > .cardtop > .small { font-size: 12px; }

/* Compactere links in de DJ Mixes- en Remixes-tegels. */
.links-block .links-list {
  flex: initial;
  justify-content: flex-start;
  align-content: flex-start;
  gap: 0;
}

.links-block .link-item {
  flex: 0 0 auto;
  padding-top: 4px;
  padding-bottom: 4px;
}
.links-block .link-item:hover {
  border-radius: 8px;
}

/* Linkregels zijn volledig klikbaar; een aparte pijl is niet nodig.
   Het CMS maakt deze span automatisch aan, daarom verbergen we hem hier. */
.link-arrow {
  display: none;
}

/* Bovenste externe links: een getekend uitgaand-link-icoon in plaats van emoji.
   Verwijder daarom het ketting-emoji uit de menutekst in het CMS. */
.headerline nav a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 999px;
  background: rgba(13,6,27,.22);
  letter-spacing: .35px;
  transition: background .2s, border-color .2s, transform .2s;
}
.headerline nav a::after {
  content: '';
  width: 7px;
  height: 7px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: translateY(-1px);
  opacity: .9;
}
.headerline nav a:hover {
  color: var(--cream);
  background: rgba(255,203,169,.14);
  border-color: rgba(255,203,169,.62);
  transform: translateY(-1px);
}

/* Onderste informatieblok: rustiger en beter leesbaar. */
.bento > article#contact {
  padding: 28px 30px 30px;
}
.bento > article#contact > .cardtop {
  align-items: baseline;
}
.bento > article#contact > .block-description {
  max-width: 920px;
  line-height: 1.65;
}
@media(max-width:600px) {
  .headerline nav { gap: 8px; }
  .headerline nav a { padding: 6px 8px; }
  .bento > article#contact { padding: 24px; }
}