@font-face{font-family:Franklin;src:url("/records/fonts/franklingothic-regular/franklingothic-regular-webfont.woff2") format("woff2");font-display:swap}
@font-face{font-family:Mono;src:url("/radio/assets/mono.woff2") format("woff2");font-display:swap}
:root{color-scheme:dark;--bg:#080808;--ink:#f4f0ef;--paper:#080808;--soft:#55504e;--muted:#f4f0ef;--rec:#ff658a;--on-ink:#080808;--gutter:28px;--bar:180px}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-padding-bottom:calc(var(--bar) + 32px)}
body{margin:0;padding-bottom:calc(var(--bar) + 40px);background:var(--bg);color:var(--ink);font:17px/1.5 Franklin,Arial,sans-serif;overflow-wrap:anywhere}
p,h1,h2,h3{margin:0}
button,input,a,summary{font:inherit}
button{cursor:pointer;border-radius:0;color:inherit}
a{color:inherit;text-underline-offset:4px}
button:disabled{opacity:.55;cursor:wait}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--rec);outline-offset:4px}
.visually-hidden,.now-meta,#stopBtn{display:none}
.skip{position:absolute;top:-60px;left:20px;background:var(--ink);color:var(--on-ink);padding:12px;z-index:50}
.skip:focus{top:12px}
.masthead,.shell{width:min(1120px,100% - 2*var(--gutter));margin-inline:auto}
.masthead{padding-top:36px}
.masthead-top{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-size:clamp(48px,7vw,88px);line-height:1;letter-spacing:-.045em}
.brand-sep{color:var(--rec)}
.rec-dot{display:inline-block;flex:none;width:10px;height:10px;border-radius:50%;background:var(--rec)}
.brand .rec-dot{width:14px;height:14px}
.tagline{margin-top:16px;font-size:20px}
.curation-mark{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:10px;color:var(--muted);font-size:14px;line-height:1.5}
.curation-mark span+span::before{content:"·";margin-right:12px}
.explore-link{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-size:14px}
.label,.count,.now-tag,.station-place,.station-freq,.feature-status{font-family:Mono,monospace}
.label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dial{position:relative;height:26px;margin:24px 0 0;border-bottom:1px solid var(--soft);background:repeating-linear-gradient(90deg,var(--soft) 0 1px,transparent 1px 12px) bottom/100% 8px no-repeat}
.needle{position:absolute;left:calc(var(--pos,0) * (100% - 2px));bottom:-1px;width:2px;height:26px;background:var(--rec);transition:left .3s}
.listening-start{display:grid;grid-template-columns:1.15fr 1fr;margin-top:32px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.infr-feature{padding:28px 32px 28px 0}
.infr-feature h2{margin:10px 0 12px;font-size:clamp(32px,4vw,48px);letter-spacing:-.025em;line-height:1.1}
.feature-description{max-width:38ch;font-size:19px;color:var(--muted)}
.listen-button,.pick-play{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 20px;background:var(--ink);color:var(--on-ink);border:1px solid var(--ink);font-size:16px}
.listen-button{margin-top:24px}
.listen-button::before{content:"";width:0;height:0;border-left:9px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
.listen-button:hover,.pick-play:hover{background:var(--paper);color:var(--ink)}
.feature-status{font-size:12px;margin-top:12px;color:var(--muted)}
.station-submit{display:inline-flex;align-items:center;min-height:44px;margin-top:6px;font-size:13px;color:var(--muted)}
.pick{padding:28px 0 28px 32px;border-left:1px solid var(--soft)}
.pick-body{display:flex;flex-direction:column;align-items:flex-start}
.pick-name{margin-top:14px;font-size:28px;line-height:1.15;letter-spacing:-.02em}
.pick-place{margin-top:6px;font-size:15px;color:var(--muted)}
summary{cursor:pointer;min-height:44px;padding-block:10px;font-size:14px}
.pick-note{margin:14px 0 16px;font-size:16px;line-height:1.6;color:var(--muted)}
.pick-play{margin-top:12px;background:transparent;color:var(--ink);min-height:44px;padding:8px 16px}
.section{padding-top:24px}
.explore{padding-top:48px}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.section-head h2{font-size:24px;font-weight:400;letter-spacing:-.015em}
.count{font-size:12px;color:var(--muted)}
.explore-intro{margin:8px 0 20px;color:var(--muted)}
.discovery-tools{display:grid;grid-template-columns:1fr minmax(200px,.6fr);gap:24px;align-items:end}
.station-search{display:grid;gap:8px}
.station-search input{width:100%;min-height:48px;border:1px solid var(--soft);border-radius:0;background:var(--paper);color:var(--ink);padding:10px 14px;font-size:16px}
.country-filter{position:relative}
.country-filter>summary{padding:12px 16px;border:1px solid var(--soft);background:var(--paper);min-height:48px;font-size:16px}
.playlists{position:absolute;top:100%;left:0;right:0;max-height:360px;overflow:auto;background:var(--paper);border:1px solid var(--soft);z-index:25;padding:8px;box-shadow:0 12px 24px #0002}
.playlist{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;text-align:left;border:0;background:transparent;padding:8px 12px}
.playlist:hover{background:var(--bg)}
.playlist.active{color:var(--ink);box-shadow:inset 3px 0 var(--rec);font-weight:700;background:var(--bg)}
.playlist small{font:12px Mono,monospace;color:var(--muted)}
.station-list{margin-top:16px;border-top:1px solid var(--soft)}
.station-entry{padding:18px 0;border-bottom:1px solid var(--soft)}
.station{width:100%;display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:20px;text-align:left;border:0;background:transparent;padding:6px 0;min-height:64px}
.station:hover .station-name{text-decoration:underline;text-underline-offset:5px}
.station-freq{display:flex;flex-direction:column;gap:6px;color:var(--muted)}
.station-freq b{font-size:23px;font-weight:400}
.station-freq i{font-size:10px;font-style:normal;letter-spacing:.03em}
.station-name{font-size:23px;line-height:1.2}
.station-place{margin-top:5px;font-size:12px;color:var(--muted)}
.station-action{display:inline-flex;align-items:center;gap:8px;min-width:90px;justify-content:flex-end;font-size:14px}
.station-action::after{content:"";width:0;height:0;border-left:7px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent}
.station.active .station-name{color:var(--rec)}
.station.active .station-action{color:var(--rec)}
.station-context{margin-left:84px;max-width:65ch}
.station-note{padding:8px 0 12px;font-size:17px;line-height:1.6;color:var(--muted)}
.station-website{display:inline-flex;align-items:center;min-height:44px;font-size:14px}
.station-entry>.station-submit{margin-left:84px}
.empty-state{padding:32px 0}
.empty-state button{margin-top:12px;min-height:44px;padding:8px 16px;background:var(--ink);color:var(--on-ink);border:0}
.player{position:fixed;inset:auto 0 0;z-index:30;background:var(--paper);border-top:1px solid var(--ink);padding:16px var(--gutter) calc(16px + env(safe-area-inset-bottom))}
.player-inner{width:min(1120px,100%);margin:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;align-items:center}
.now-tag{display:flex;align-items:center;gap:8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.now-tag .rec-dot{background:var(--muted);width:6px;height:6px}
.is-playing .now-tag .rec-dot{background:var(--rec)}
.now-count{margin-left:12px}
.player-inner>*{min-width:0}
.now-title{grid-column:1;font-size:23px;line-height:1.2}
.now-place{grid-column:1;font-size:13px;color:var(--muted)}
.now-playing{grid-column:1;display:none;font-size:14px;margin-top:4px}
.now-playing.has-title{display:block}
.programme-meta{position:relative;display:grid;grid-template-columns:max-content minmax(0,1fr);gap:1px 0;margin:0;line-height:1.4}
.programme-meta dt{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.programme-meta dd{margin:0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.programme-meta .programme-track{grid-column:1 / -1;font-size:16px;font-weight:700}
.programme-meta dd:last-child::before{content:"·";padding-inline:7px;opacity:.65}
.now-playing strong{font-weight:400;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:break-word}
.now-place{overflow-wrap:normal}
.volume-hint{font-size:11px;max-width:12ch;text-align:right}
.controls{grid-column:2;grid-row:1 / span 4;display:flex;gap:8px;align-items:center}
.control{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--soft);background:transparent}
.control.primary{width:56px;height:56px;background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.control:hover{border-color:var(--ink)}
.volume-control{grid-column:2;display:flex;align-items:center;gap:8px;font-size:12px}
.volume-control label{display:flex;align-items:center}
.volume-control label span{display:none}
.volume-control input{width:100px;height:24px;accent-color:var(--rec)}
.volume-control output{font-size:12px;min-width:2ch}
.player-actions,.player-message{grid-column:1 / -1;font-size:13px;color:var(--muted)}
.player-actions:not(:has(a:not([hidden]))),.player-message:empty{display:none}
.dial-update{padding:24px 0;border-bottom:1px solid var(--soft)}
.dial-update time{font-size:13px;color:var(--muted)}
@media(max-width:640px){
:root{--gutter:20px;--bar:170px}
.masthead{padding-top:24px}.masthead-top{gap:12px}.brand{font-size:clamp(32px,10vw,52px);gap:6px}.tagline{margin-top:20px;font-size:20px;line-height:1.35;max-width:25ch}.curation-mark{display:grid;gap:3px;margin-top:12px;font-size:14px}.curation-mark span+span::before{content:none}
.explore-link{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-size:14px}
.listening-start{grid-template-columns:1fr;margin-top:24px}.infr-feature{padding:24px 0}.infr-feature h2{font-size:38px}.feature-description{font-size:18px;max-width:32ch}.listen-button{margin-top:20px}
.pick{padding:24px 0;border-left:0;border-top:1px solid var(--soft)}.pick-name{font-size:25px}.pick-play{margin-top:8px}
.explore{padding-top:32px}.section-head{align-items:start;flex-wrap:wrap;gap:6px}.section-head h2{font-size:25px}.discovery-tools{grid-template-columns:1fr;gap:12px}
.station{grid-template-columns:42px 1fr;gap:12px}.station-name{font-size:21px}.station-freq b{font-size:20px}.station-freq i{font-size:9px}.station-place{font-size:11px}.station-action{grid-column:2;justify-content:flex-start;min-height:24px}.station-context,.station-entry>.station-submit{margin-left:0}.station-note{font-size:16px;line-height:1.6}
.player{padding:8px var(--gutter) calc(8px + env(safe-area-inset-bottom))}.player-inner{grid-template-columns:minmax(0,1fr) auto;gap:3px 10px}.now-title{font-size:18px;grid-column:1 / -1}.now-place{font-size:12px;grid-column:1 / -1;grid-row:3}.now-playing{font-size:12px;grid-column:1 / -1;grid-row:4;margin-top:0;text-align:left}.controls{grid-row:5;grid-column:1;gap:6px}.control{width:44px}.control.primary{width:48px;height:48px}.volume-control{grid-row:5;grid-column:2;gap:4px;justify-content:flex-end}.volume-control input{width:clamp(44px,15vw,70px);margin-inline:0}.now-tag{grid-column:1 / -1}.now-count{margin-left:auto}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}