/* Radio accent layer. Familiar panorama, upright controls, decorative angles. */
#radio-panel{--station-teal:#39b8ae;--station-ink:#071b20;--station-light:#9ee7dd;}
#radio-panel .radio-card{position:relative;border:1px solid #41877f;border-top:3px solid var(--station-teal);background:linear-gradient(135deg,rgba(9,31,36,.97),rgba(5,10,16,.95));box-shadow:0 14px 48px #0009;padding:20px;border-radius:2px 18px 2px 2px;}
#radio-panel .radio-card::after{content:'';position:absolute;right:0;top:-3px;width:24px;height:24px;background:linear-gradient(45deg,transparent 49%,var(--station-teal) 50%,var(--station-teal) 55%,#08131b 56%);pointer-events:none;}
.station-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:19px;}
.station-pill{color:var(--station-light);font-size:10px;letter-spacing:.13em;border:1px solid #41877f;padding:6px 8px;}
.station-frequency{font-size:11px;letter-spacing:.15em;color:#c9b992;}
.station-dial{height:14px;border-bottom:1px solid #69b7ac;background:repeating-linear-gradient(90deg,transparent 0,transparent 11px,#688c8766 12px,#688c8766 13px);position:relative;margin-bottom:20px;}
.station-dial span{position:absolute;height:21px;width:3px;bottom:-4px;left:31%;background:#e6c078;transform:skew(-12deg);}
.audio-playing .station-dial{border-bottom-color:#9ee7dd;box-shadow:0 4px 10px -5px #39b8ae;}
#radio-panel h2{font-size:clamp(23px,2.1vw,31px);line-height:1.15;margin:8px 0;}
#track-meta{font-size:13px;color:#cdc9bc;line-height:1.5;}
#radio-panel .transport{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:18px 0;}
#radio-panel .transport button{min-height:44px;border-color:#5e817c;text-shadow:none;}
#radio-panel #play-track{background:#39b8ae;color:#04191d;font-weight:bold;border-color:#81e3d4;}
#radio-panel #close-radio{grid-column:1/-1;background:transparent;border-color:transparent;color:#d8d1bf;}
#radio-panel button:disabled{opacity:.45;cursor:not-allowed;}
#radio-panel input[type=range]{accent-color:#39b8ae;min-height:32px;}
#radio-panel :is(button,a,summary,input):focus-visible{outline:3px solid #f1d594;outline-offset:3px;}
#radio-panel .listener-feedback-link{display:block;text-align:center;border-color:#69b7ac;color:#b6f1e8;min-height:44px;}
.station-help{font-size:12px;line-height:1.55;color:#c6c9c4;margin:10px 0 0;}
.station-program{margin-top:14px;background:#081119ed;border:1px solid #64766b;padding:0 13px;}
.station-program summary{padding:14px 0;cursor:pointer;font-size:14px;min-height:44px;}
.station-program ol{padding-left:24px;}
.station-program button{width:100%;text-align:left;padding:12px 8px;background:transparent;border:0;color:#f4f1ea;min-height:44px;}
.station-program button[aria-current=true]{color:#9ee7dd;border-left:2px solid #39b8ae;}
.station-program .station-help{margin-bottom:14px;}
.station-articles{display:inline-block;margin:12px 0 0;padding:12px 0;color:#e6c078;font-size:13px;min-height:44px;}
#radio-dock{border-top:2px solid #39b8ae;}#radio-dock #dock-play{background:#123b3b;border-color:#69b7ac;}
@media(min-width:761px){#radio-panel{width:min(380px,32vw);top:11%;max-height:80dvh;}}
@media(max-width:760px){#radio-panel .radio-card{padding:14px;} .station-heading{margin-bottom:12px;}.station-dial{margin-bottom:14px;}#radio-panel h2{font-size:24px;}#radio-panel .transport{margin:12px 0;}}
@media(prefers-reduced-motion:reduce){#radio-panel *{animation:none!important;transition:none!important;}}

/* Keep the primary controls in view while the program remains scrollable. */
#radio-panel .menu-object-cue{width:88px;margin-bottom:8px;}
#radio-panel>h1{font-size:32px;margin:6px 0 12px;}
#radio-panel .station-heading{margin-bottom:12px;}
#radio-panel .station-dial{margin-bottom:14px;}
#radio-panel .transport{margin:12px 0;}
#radio-panel #volume-value{margin-left:5px;}
@media(max-width:760px){#radio-panel .menu-object-cue{display:none;}#radio-panel>h1{font-size:26px;}#radio-panel>.eyebrow{margin-top:0;}}

.station-program-title{display:block;padding:12px 8px;min-height:44px;color:#f4f1ea;}
.station-program-title[aria-current=true]{color:#9ee7dd;border-left:2px solid #39b8ae;}

/* Viewport-sized office workspaces; accessible overflow for enlarged text. */
#radio-panel,#article-panel{top:84px;bottom:auto;width:min(600px,calc(100vw - 64px));max-height:calc(100dvh - 108px);overflow:auto;scrollbar-gutter:stable}
#radio-panel{left:4%;right:auto}
#article-panel{right:4%;left:auto;height:calc(100dvh - 108px);display:flex;flex-direction:column}
#radio-panel>.menu-object-cue{float:left;width:64px;margin:0 14px 8px 0}
#article-panel>.menu-object-cue{display:none}
#radio-panel>.eyebrow,#article-panel>.eyebrow{margin:0 0 4px}
#radio-panel>h1,#article-panel>h1{font-size:32px;margin:0 0 12px}
#radio-panel>.radio-card{clear:both;padding:16px}
#radio-panel .station-heading{margin-bottom:8px}
#radio-panel .station-dial{margin-bottom:10px;height:10px}
#radio-panel .transport{margin:10px 0}
#radio-panel .transport button:disabled{display:none}
#radio-panel .station-help{margin-top:6px}
#radio-panel .station-program{margin-top:10px}
#radio-panel .station-program ol{max-height:24dvh;overflow:auto}
#radio-panel .station-articles{margin-top:4px;padding:8px 0}
#article-panel>.article-card{clear:both;flex:1;min-height:0;max-height:none;display:flex;flex-direction:column;padding:16px;overflow:visible}
#article-panel .article-list{scrollbar-gutter:stable;flex:1;min-height:90px;max-height:none;overflow:auto;margin-top:8px}
#article-panel .article-link{font-size:17px;line-height:1.45;padding:12px 4px!important}
#article-panel .article-thumbnail{width:88px;height:66px;flex-basis:88px}
#article-panel #article-count{margin:8px 0;font-size:14px}
.article-paging{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0}
.article-paging button{min-height:44px;padding:8px 12px;border:1px solid var(--brass);background:var(--navy);color:var(--gold)}
.article-paging button:disabled{opacity:.45}
#article-page{font-size:14px;text-align:center}
#article-panel .gallery-office-link,#article-panel .archive-link{margin:0;padding:10px 4px;min-height:44px;display:block;flex-shrink:0}
.has-radio #article-panel{height:calc(100dvh - 172px);max-height:calc(100dvh - 172px)}
@media(max-width:900px){
 #radio-panel,#article-panel{top:124px;max-height:calc(100dvh - 148px)}
 #article-panel{height:calc(100dvh - 148px)}
 .has-radio #article-panel{height:calc(100dvh - 212px);max-height:calc(100dvh - 212px)}
}
@media(max-width:760px){
 #radio-panel.room-panel,#article-panel.room-panel,.has-radio #radio-panel.room-panel,.has-radio #article-panel.room-panel{
 top:124px!important;bottom:auto!important;left:12px!important;right:auto!important;width:calc(100vw - 24px)!important;max-height:calc(100dvh - 140px);padding:10px}
 #article-panel.room-panel{height:calc(100dvh - 140px)}
 .has-radio #article-panel.room-panel{height:calc(100dvh - 206px);max-height:calc(100dvh - 206px)}
 .has-radio #radio-panel.room-panel{max-height:calc(100dvh - 206px)}
 #radio-panel>h1,#article-panel>h1{font-size:26px;margin-bottom:8px}
 #radio-panel>.radio-card,#article-panel>.article-card{padding:12px}
 #radio-panel .station-heading,#radio-panel .station-dial{display:none}
 #radio-panel #track-title{font-size:24px}
 #radio-panel #track-meta{margin:6px 0}
 #radio-panel .listener-feedback-slot{margin-top:8px}
 #radio-panel .station-help{font-size:12px}
 #article-panel .article-link{font-size:16px;padding:10px 4px!important}
 #article-panel .article-thumbnail{width:72px;height:54px;flex-basis:72px}
 #article-panel #article-count{margin:6px 0}
 #article-panel .article-list{min-height:76px}
}
@media(max-height:600px){
 #radio-panel,#article-panel{top:116px}
 #article-panel{height:auto}
 #article-panel .article-list{flex:none;height:160px}
}

/* Program numbers stay inside the scrollport in a dedicated, aligned column. */
#radio-panel .station-program ol{list-style:none;padding:0;margin:8px 0 12px;scrollbar-gutter:stable}
#radio-panel .station-program li{display:grid;grid-template-columns:2.75em minmax(0,1fr);align-items:baseline;column-gap:8px;border-bottom:1px solid #64766b44}
#radio-panel .station-program li:last-child{border-bottom:0}
#radio-panel .station-program-number{font-family:var(--font-chrome);font-size:14px;font-variant-numeric:tabular-nums;text-align:right;color:#c9b992;padding:12px 0;text-shadow:none}
#radio-panel .station-program-title{min-width:0;overflow-wrap:anywhere;white-space:normal;line-height:1.5;margin:0}
#radio-panel .station-program li:has([aria-current=true]) .station-program-number{color:#9ee7dd}
