/* The photograph supplies the object. Every control is real HTML. */
.culture-page{--stone:#edf0ed;--ink:#183a31;--rule:#bfc8c2;--cobalt:#2455b8;background:var(--stone);color:var(--ink)}
.culture-page .culture-root{max-width:1080px;padding:2rem 40px;margin:auto;font-family:Archivo,sans-serif}
.culture-root .archive-mast{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--rule);padding-bottom:1rem}
.culture-root .archive-mast h1{font:500 1.125rem/1.4 Archivo,sans-serif;letter-spacing:-.025em;margin:0}
.culture-root .archive-mast p{font-size:.75rem;letter-spacing:.055em;margin:0;line-height:1.6}
.listening-desk{margin:2rem 0 3.5rem;text-align:center}
.culture-root .radio-intro h2{font:400 clamp(2rem,4vw,3rem)/1.1 CWSection,Archivo,sans-serif;letter-spacing:-.02em;margin:0}
.culture-root .radio-intro p{font-size:.875rem;line-height:1.6;margin:.5rem 0 0}
.radio-receiver{max-width:360px;margin:1.25rem auto 0;min-width:0}
.radio-object{position:relative;isolation:isolate}
.radio-photo{display:block;width:100%;height:auto;aspect-ratio:2/3}
.culture-root .receiver-maker{position:absolute;left:39.2%;top:38.6%;width:18.1%;height:2.4%;display:flex;align-items:center;justify-content:center;font:700 clamp(5px,.65vw,8px)/1 Archivo,sans-serif;letter-spacing:.035em;color:#183a31}
.radio-player{min-width:0;background:#f2f2f2;box-shadow:0 0 0 1px #a3ada6;border-radius:3px}
.radio-player iframe{display:block;width:100%;border:0;height:120px;background:#f2f2f2;border-radius:2px}
.culture-root .radio-transport button[hidden]{display:none}
.culture-root .radio-transport button{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:52px;min-width:44px;height:44px;min-height:44px;border:1px solid #777f7b;border-radius:5px;color:#183a31;background:#e4e8e5;box-shadow:0 2px 0 #747e77,inset 0 1px 0 #fff;cursor:pointer;transition:transform 100ms ease,box-shadow 100ms ease}
.culture-root .radio-transport button:active{transform:translateY(2px);box-shadow:inset 0 1px 2px #747e77}
.radio-position{font:500 12px/1.5 Archivo,sans-serif;letter-spacing:.07em;white-space:nowrap;color:#183a31;font-variant-numeric:tabular-nums}
.radio-caption{margin:.75rem auto 0;text-align:center}
.culture-root #selected-host{font-size:.75rem;line-height:1.6;margin:0 0 .25rem}
.culture-root #selected-title{font:500 1rem/1.5 Archivo,sans-serif;letter-spacing:-.015em;margin:0;text-wrap:balance;overflow-wrap:anywhere}
.culture-colophon a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;color:inherit;text-underline-offset:5px;font-size:.75rem;line-height:1.5}
.radio-programme{max-width:760px;margin:0 auto 3.5rem}
.culture-root .radio-programme h2{font:500 1rem/1.4 Archivo,sans-serif;letter-spacing:-.015em;margin:0 0 1rem}
.programme-list{border-top:1px solid var(--rule)}
.radio-session{display:flex;gap:1.25rem;align-items:flex-start;border-bottom:1px solid var(--rule)}
.session-index{font:400 .75rem/1.5 Archivo,sans-serif;min-width:2rem;white-space:nowrap;margin-top:1.35rem;color:#56665c;font-variant-numeric:tabular-nums}
.radio-session.is-selected .session-index{font-weight:750;color:var(--ink)}
.radio-session.is-selected .session-index::after{content:'•';margin-left:5px}
.session-title{position:relative;display:block;color:inherit;text-decoration:none;flex:1;min-width:0;min-height:44px;padding:1.15rem 1.75rem 1.15rem 0}
.culture-root .session-title h3{font:500 1rem/1.45 Archivo,sans-serif;letter-spacing:-.015em;margin:0;overflow-wrap:anywhere}
.culture-root .session-credit{font-size:.75rem;line-height:1.6;margin:.25rem 0 0;color:#526359}
.session-arrow{position:absolute;right:0;top:1.15rem;font-size:1rem}
.culture-colophon{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-top:1px solid var(--rule);padding-top:.75rem}
.culture-root .culture-colophon p{font-size:.75rem;line-height:1.7;margin:0}
.culture-colophon a{flex-shrink:0}
.culture-page .culture-footer{max-width:1000px;margin:0 auto;padding:1rem 0 2rem}
.culture-root :focus-visible{outline:3px solid var(--cobalt);outline-offset:4px}
.culture-root .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(hover:hover) and (pointer:fine){.session-title:hover h3{text-decoration:underline;text-underline-offset:5px}.culture-root .radio-transport button:hover{background:#f2f4f2}}
@media(max-width:600px){.culture-page .culture-root{padding:1.25rem 16px 1.5rem}.culture-root .archive-mast h1{font-size:1rem}.culture-root .archive-mast p{font-size:.6875rem}.listening-desk{margin:1.5rem 0 2.5rem}.radio-receiver{margin-top:1rem}.culture-root .receiver-maker{font-size:6px}.radio-caption{padding:0 .5rem}.radio-programme{margin-bottom:2.5rem}.radio-session{gap:.625rem}.session-title{padding-block:1rem}.session-index{margin-top:1.2rem}.culture-root .session-title h3{font-size:.9375rem}.culture-colophon{display:block}.culture-colophon a{margin-top:.5rem}.culture-page .culture-footer{margin-inline:16px}}
@media(prefers-reduced-motion:reduce){.culture-root .radio-transport button{transition:none}.culture-root .radio-transport button:active{transform:none}}
@media print{.radio-object,.radio-status{display:none}.listening-desk{margin:1rem 0}.radio-receiver{max-width:none}.radio-programme{max-width:none}.radio-session{break-inside:avoid}.culture-colophon{display:block}}

@media(min-width:901px){.archive-room{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:4rem;margin:2rem 0 3rem}.listening-desk{margin:0}.radio-programme{margin:0;width:100%}.culture-root .radio-programme h2{margin-bottom:1.25rem}}

@media print{.archive-room{display:block}}

/* The native player is the sole display in the silver face. */
.radio-console{position:absolute;left:11.25%;right:12.5%;top:45%;bottom:11%;display:flex;flex-direction:column;justify-content:center;gap:14px}
.radio-topline{position:relative;display:grid;place-items:center;height:44px;flex:none}
.radio-transport{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:18px;margin:0}
.radio-transport[hidden]{display:none}
.radio-transport svg{width:21px;height:21px;fill:currentColor;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}

.radio-player{padding:3px;border:1px solid #858f88;box-shadow:inset 0 2px 4px #183a3126,0 1px 0 #fafbf6;background:#ccd3cd;border-radius:5px}
.radio-intro{display:flex;justify-content:center;align-items:center;gap:1.25rem;flex-wrap:wrap;text-align:left}
.poolside-print{flex:none;width:104px;margin:0;padding:4px 4px 9px;background:#fafbf6;transform:rotate(4deg);box-shadow:1px 2px 0 #bec6bf,3px 7px 10px #183a3126}
.poolside-scene{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.radio-object{transform:perspective(900px) rotateX(var(--radio-x,0deg)) rotateY(var(--radio-y,0deg));transition:transform 180ms cubic-bezier(.25,1,.5,1);transform-origin:50% 65%}
@media(max-width:600px){.radio-intro{gap:1rem}.poolside-print{width:80px}.culture-root .radio-intro h2{font-size:clamp(1.8rem,7.3vw,2.5rem)}}
@media(max-width:360px){.poolside-print{width:72px}.radio-intro{gap:.75rem}}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){.radio-object{transform:none;transition:none}}
@media print{.poolside-print,.radio-console{display:none}}

/* One white LCD, original provider meter, one row of real transport keys. */
.radio-display{height:128px;flex:none;display:grid;grid-template-columns:68px minmax(0,1fr);align-items:center;gap:6px;padding:3px 3px 3px 6px;border:1px solid #858f88;border-radius:5px;background:#fff;box-shadow:inset 0 2px 4px #183a3126,0 1px 0 #fff}
.radio-display img{display:block;width:68px;height:68px;object-fit:contain}
.radio-display [hidden]{display:none!important}
#cover-unavailable{width:68px;height:68px;display:grid;place-items:center;text-align:center;font-size:11px;line-height:1.5;color:#344e43}
.radio-screen-content{grid-column:2;grid-row:1;min-width:0}
.radio-display .radio-player{position:relative;min-width:0;height:120px;padding:0;border:0;border-radius:0;box-shadow:none;background:#fff}
.radio-display .radio-player iframe{display:block;width:100%;height:120px;background:#fff;border:0;border-radius:0}
.radio-display>img,.radio-display>#cover-unavailable{grid-column:1;grid-row:1}
.display-source{display:flex;align-items:center;min-height:44px;font:500 11px/1.3 Archivo,sans-serif;color:#183a31;text-decoration:none;letter-spacing:.025em}
.display-source:hover{text-decoration:underline;text-underline-offset:3px}
.radio-display.is-enhanced .radio-meter{height:44px;overflow:hidden}
.radio-display.is-enhanced .radio-meter iframe{position:absolute;inset:-60px 0 auto;pointer-events:none;filter:brightness(1.055)}
.radio-display.is-enhanced .radio-meter iframe[data-provider="Mixcloud"]{top:-68px;left:-50px;width:calc(100% + 104px)}
/* Keep prepared media contexts laid out while only the selected meter is shown. */
.radio-display.is-enhanced .radio-meter iframe.is-inactive{opacity:0}
/* Safari's first native Play occupies the same center key. The same frame then
   supplies the LCD meter; CSS movement preserves its activated media context. */
.radio-primary-frame{position:absolute;z-index:2;pointer-events:none;overflow:hidden}
.radio-primary-viewport{position:absolute;inset:0;overflow:hidden}
.radio-primary-frame iframe{position:absolute;top:-60px;left:0;width:100%;height:120px;border:0;background:#fff;filter:brightness(1.055);pointer-events:none}
.radio-primary-frame iframe.is-inactive{opacity:0}
.radio-primary-frame.is-start-key{overflow:visible;pointer-events:auto}
.radio-primary-frame.is-start-key .radio-primary-viewport{width:44px;height:44px;inset:0 auto auto calc(50% - 22px)}
/* The same visible HTML key sits below a transparent native Play hit target.
   Its frame remains interactive so the first tap still activates provider media. */
.radio-primary-frame.is-start-key iframe{top:-10px;left:-8px;width:188px;pointer-events:auto;filter:none;opacity:0}
.radio-display.needs-native-start + .radio-topline #radio-play{color:#183a31}
.radio-primary-frame.is-start-key:focus-within{outline:3px solid var(--cobalt);outline-offset:4px}
/* Reveal provider links for keyboard traversal, with room below the receiver.
   Disabled previous/next keys are covered; no other focusable control is. */
.radio-primary-frame.is-start-key.is-keyboard-focused{left:0!important;width:100%!important;height:120px!important;background:#fff;outline:3px solid var(--cobalt);outline-offset:4px}
.radio-primary-frame.is-start-key.is-keyboard-focused .radio-primary-viewport{inset:0;width:100%;height:120px;border-radius:4px}
.radio-primary-frame.is-start-key.is-keyboard-focused iframe{inset:0;width:100%;opacity:1}
.radio-object:has(.radio-primary-frame.is-start-key.is-keyboard-focused){margin-bottom:100px}
.radio-display.needs-native-start .radio-meter::before{content:"";position:absolute;left:8px;right:8px;top:50%;height:3px;border-radius:2px;background:#c8cec9}
#radio-seek{position:absolute;inset:0;width:100%;height:44px;min-height:44px;margin:0;opacity:0;cursor:pointer}
#radio-seek:disabled{cursor:wait}
.radio-meter:has(#radio-seek:focus-visible){outline:3px solid #2455b8;outline-offset:2px}
.radio-time{display:flex;justify-content:space-between;gap:3px;margin:0;padding:2px 8px 0;font:11px/1.4 Archivo,sans-serif;font-variant-numeric:tabular-nums;color:#344e43}
.radio-time>span[aria-hidden]{display:none}
.radio-display[data-provider="SoundCloud"] .radio-time{display:none}
.radio-display.needs-native-start .radio-time{display:flex}
.radio-transport{gap:12px}
.radio-transport .pause-symbol{display:none}
.radio-transport [data-playing="true"] .pause-symbol{display:block}
.radio-transport [data-playing="true"] .play-symbol{display:none}
.culture-root .radio-transport button:disabled{color:#687970;cursor:wait}
.player-help{margin:.75rem 0 0;font-size:.875rem;line-height:1.6}
@media(max-width:360px){.radio-display{grid-template-columns:56px minmax(0,1fr);gap:4px;padding-left:4px}.radio-display img,#cover-unavailable{width:56px;height:56px}}

/* A small station sign below the object, with its own motion control. */
.radio-caption{margin:.625rem auto 0;padding:0;text-align:left}
.radio-sign{padding:9px 12px;border:1px solid #29483b;border-radius:5px;background:#142c24;box-shadow:inset 0 1px 2px #08170f,0 2px 0 #a5b0a6}
.radio-sign[hidden]{display:none}
.sign-window{overflow:hidden;min-width:0;height:27px;contain:paint}
.sign-track{display:flex;width:max-content;color:#d4e4a2;animation:station-scroll var(--sign-duration) linear 1.2s infinite;animation-play-state:paused}
.sign-track svg{flex:none;display:block;max-width:none;fill:currentColor}
.sign-icon{fill:#ecb874}
.radio-caption[data-running="true"] .sign-track{animation-play-state:running}
.sign-meta{display:flex;justify-content:space-between;align-items:center;min-height:44px;padding-inline:2px}
.culture-root .sign-meta .radio-position{margin:0;font-size:10px;letter-spacing:.1em}
.culture-root #text-motion{display:flex;align-items:center;gap:.5rem;min-width:44px;min-height:44px;padding:0 0 0 12px;border:0;border-radius:0;background:transparent;color:#405c4b;font:400 10px/1.4 Archivo,sans-serif;letter-spacing:.02em;cursor:pointer;box-shadow:none}
.culture-root #text-motion[hidden]{display:none}
.text-motion-state{min-width:20px;text-align:right;font-weight:600}
.caption-copy{text-align:center}
.radio-caption.is-enhanced:where(:not(.is-static)) .caption-copy{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.radio-caption.is-static .radio-sign{display:none}
@keyframes station-scroll{from{transform:translateX(0)}to{transform:translateX(var(--sign-distance))}}
@media(hover:hover){.culture-root #text-motion:hover{text-decoration:underline;text-underline-offset:4px}}
@media(prefers-reduced-motion:reduce){.sign-track{animation:none!important}.radio-caption .radio-sign{display:none}.radio-caption.is-enhanced .caption-copy{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal}.culture-root #text-motion{display:none}}
@media print{.radio-sign,#text-motion{display:none!important}.radio-caption.is-enhanced .caption-copy{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal}.sign-meta{justify-content:center}}

/* The station sign becomes a physical companion to the photographed radio. */
.radio-caption{margin:0 auto;text-align:left}
.radio-sign{position:relative;isolation:isolate;aspect-ratio:3/1;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.radio-sign::before{content:"";position:absolute;left:9%;right:9%;top:30%;height:43%;border-radius:3px;background:#142c24;z-index:-1}
.sign-case{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;pointer-events:none;user-select:none}
.radio-sign .sign-window{position:absolute;left:9%;right:9%;top:30%;height:43%;display:flex;align-items:center;border-radius:3px;background:transparent;contain:paint;overflow:hidden}
.radio-sign .sign-track{height:27px;flex:none}
.radio-caption .sign-meta{margin-top:-3px;padding-inline:12px}

/* Fixed emitters behind the lit glyphs. Centered 3px tiles share the strip's middle row. */
.radio-sign .sign-window{background-color:#10271c;background-image:radial-gradient(circle at 1.5px 1.5px,#304b36 .75px,#203a29 1px,transparent 1.15px),linear-gradient(90deg,#07180e44 .5px,transparent .5px),linear-gradient(#07180e44 .5px,transparent .5px);background-size:3px 3px;background-position:0 center;box-shadow:inset 0 2px 4px #04140db3,inset 0 -1px 2px #57744933}
.radio-sign .sign-track{position:relative;color:#dcecae;animation-timing-function:steps(var(--sign-steps),end);filter:drop-shadow(0 0 .35px #d8f79844)}