.station-about{display:block;width:max-content;max-width:calc(100% - 42px);font-size:12px;line-height:1.5;margin:0 14px 10px;text-decoration:underline;text-underline-offset:3px;opacity:.8}.station-about:hover{opacity:1}.seo-home{max-width:100%;padding-top:36px;border-top:1px solid var(--line,#88957544);line-height:1.75}.seo-home>p,.seo-home details{max-width:850px}.seo-home h2{font-size:clamp(23px,3vw,30px);margin:24px 0 16px}.seo-home details{border-bottom:1px solid #88957544;padding:14px 0}.seo-home summary{cursor:pointer;font-weight:700}.seo-genres{display:flex;flex-wrap:wrap;gap:10px}.seo-genres a{border:1px solid #88957566;border-radius:24px;padding:7px 15px;font-size:14px;text-decoration:none}.seo-genres a:hover{background:#dfef5630}.breadcrumbs{font-size:13px;line-height:1.7;overflow-wrap:anywhere;margin-bottom:22px}.seo-stations{list-style:none;padding:0!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.seo-stations li{min-width:0;border:1px solid #88957555;border-radius:12px}.seo-stations a{display:flex;gap:12px;align-items:center;padding:13px;text-decoration:none!important;height:100%;overflow-wrap:anywhere}.seo-stations img{width:44px;height:44px;object-fit:contain;border-radius:7px;flex-shrink:0;padding:3px}.seo-stations strong{display:block;font-size:15px;line-height:1.5}.seo-stations small{display:block;font-size:13px;opacity:.75}.station-page-heading{display:flex;align-items:center;gap:22px}.station-page-heading>img{width:104px;height:104px;object-fit:contain;border-radius:18px;padding:8px;flex-shrink:0}.station-page-heading h1{font-size:clamp(26px,4vw,40px);margin:8px 0}.station-page-heading .eyebrow{font-size:12px}.station-facts{display:grid;grid-template-columns:150px 1fr;gap:9px;margin:20px 0}.station-facts dt{font-weight:700}.station-facts dd{margin:0;overflow-wrap:anywhere}.seo-page .info-actions button{white-space:normal;min-height:48px;line-height:1.5}.seo-page .muted{font-size:14px;opacity:.8}.seo-page a:focus-visible,.seo-genres a:focus-visible{outline:3px solid #9db629;outline-offset:3px}@media(max-width:600px){.seo-stations{grid-template-columns:1fr}.station-page-heading{align-items:flex-start;gap:14px}.station-page-heading>img{width:66px;height:66px;border-radius:10px;padding:5px}.station-page-heading h1{font-size:25px}.station-facts{grid-template-columns:1fr;gap:2px}.station-facts dd{margin-bottom:10px}.station-about{font-size:12px;margin-left:11px}.seo-genres a{font-size:13px;padding:6px 12px}.seo-page{overflow-wrap:anywhere}}

/* The station details link occupies its own row, outside the playback button. */
.station-card{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(72px,1fr) 28px;align-items:stretch;gap:4px;min-height:132px;padding:14px}
.station-card .station-select{grid-column:1;grid-row:1;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;min-width:0;min-height:72px;width:100%;padding:0 40px 0 0}
.station-card .station-art{flex:0 0 56px;width:56px;height:62px}
.station-card .station-copy{flex:1;min-width:0;padding:0}
.station-card .station-copy strong{display:block;max-width:none;line-height:1.35;overflow-wrap:anywhere;word-break:normal}
.station-card .station-copy small{display:block;margin-top:5px;line-height:1.45}
.station-card .station-about{grid-column:1;grid-row:2;justify-self:start;align-self:center;display:flex;align-items:center;width:auto;max-width:calc(100% - 40px);min-height:28px;margin:0 40px 0 68px;font-size:13px;line-height:1.4;white-space:nowrap;opacity:.8}
.station-card .card-play{top:14px;right:14px}
.station-card .card-favorite{right:14px;bottom:14px;width:28px;height:28px}
@media(max-width:640px){
 .station-card{grid-template-rows:minmax(112px,1fr) 28px;min-height:164px;padding:12px 10px;gap:4px}
 .station-card .station-select{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;min-height:112px;padding:0}
 .station-card .station-art{flex:0 0 42px;width:42px;height:42px}
 .station-card .station-copy{flex:1;width:100%;padding:0}
 .station-card .station-copy strong{font-size:14px;line-height:1.35}
 .station-card .station-copy small{font-size:12px;margin-top:4px}
 .station-card .station-about{margin:0 32px 0 0;max-width:calc(100% - 32px);font-size:12px}
 .station-card .card-play{top:12px;right:10px;width:30px;height:30px}
 .station-card .card-favorite{right:10px;bottom:12px;width:26px;height:26px}
}

html[data-station-id] .info-page{margin-bottom:32px}
@media(max-width:600px){html[data-station-id] .info-page{margin-bottom:20px}}

/* Compact station details control, without an extra card row. */
.station-card{display:flex;min-height:104px;padding:14px;gap:0}
.station-card .station-select{min-height:74px;padding-right:40px}
.station-card .station-about{position:absolute;right:47px;bottom:14px;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-height:24px;max-width:none;margin:0;border:1px solid currentColor;border-radius:50%;font:600 13px/1 Georgia,serif;text-decoration:none;opacity:.65}
.station-card .station-about:hover{opacity:1;background:#a8bb3120}
@media(max-width:640px){.station-card{min-height:146px;padding:12px 10px}.station-card .station-select{min-height:120px;padding:0 0 24px}.station-card .station-about{right:43px;bottom:12px;width:22px;height:22px;min-height:22px}}

/* Shared baseline and equal hit areas for station actions. */
.station-card .station-about,.station-card .card-favorite{bottom:12px;width:28px;height:28px;min-height:28px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;opacity:1;line-height:1;color:var(--muted)}
.station-card .card-favorite{right:12px}
.station-card .station-about{right:46px}
.station-card .station-about svg,.station-card .card-favorite svg{display:block;width:21px;height:21px;flex-shrink:0}
@media(max-width:640px){.station-card .card-favorite{right:9px}.station-card .station-about{right:43px}}

@media(max-width:640px){.station-card .station-select{padding-bottom:40px}}

@media(min-width:641px){.station-card .station-copy{padding-bottom:28px}}

#preset-feedback{font-size:14px;line-height:1.5;margin:14px 0;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.recent-stations{margin:24px 0 8px;min-width:0}.recent-stations[hidden]{display:none}.recent-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.recent-heading h2{font-size:17px;margin:0}.recent-heading a{font-size:13px;text-decoration:underline;text-underline-offset:3px;color:var(--muted)}.recent-list{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x proximity}.recent-station{display:flex;align-items:center;gap:9px;flex:1 0 160px;max-width:220px;min-height:64px;min-width:0;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--panel);text-align:left;scroll-snap-align:start}.recent-station .station-art{width:36px;height:36px;flex:0 0 36px}.recent-station>span:last-of-type{font-size:13px;font-weight:600;line-height:1.35;overflow-wrap:anywhere;flex:1;min-width:0}.recent-station>svg{width:14px;height:14px;flex:0 0 14px}.recent-station:hover{background:#a8bb311a}@media(max-width:640px){.recent-heading{align-items:flex-start}.recent-heading h2{font-size:16px}.recent-heading a{max-width:115px;text-align:right;font-size:12px}.recent-station{flex:0 0 175px}}

/* Mood photographs stay behind the existing contrast layers in both themes. */
.console{--mood-image:url('/assets/night-city.webp')}
.console[data-mood=morning]{--mood-image:url('/assets/mood-morning.webp')}
.console[data-mood=work]{--mood-image:url('/assets/mood-work.webp')}
.console[data-mood=road]{--mood-image:url('/assets/mood-road.webp')}
.console[data-mood=evening]{--mood-image:url('/assets/mood-evening.webp')}
.console:before{filter:saturate(.55);opacity:.85}
html[data-theme=light] .console:before{filter:saturate(.6);opacity:.85}
.catalog-more,.station-list-more{text-align:center;margin:24px 0}
.catalog-more:has([hidden]){display:none}
.seo-stations>li[hidden]{display:none}

.station-card[hidden],.station-list-more button[hidden],#show-more-stations[hidden]{display:none}

/* Both sets of transport buttons follow the selected six-station preset. */
.mood-controls{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0}
.mood-context{font-size:12px;line-height:1.4;color:var(--muted);text-align:center}
.mood-transport{display:flex;align-items:center;justify-content:center;gap:9px}
.mood-skip{border:1px solid var(--line);background:var(--paper);width:40px;height:40px;flex-shrink:0}
.mood-skip svg{width:21px;height:21px}
.now-card .hero-controls{grid-column:1/-1;grid-row:3;justify-self:stretch;margin-top:4px}
.now-card .hero-controls .hero-play{position:static;grid-area:auto;justify-self:auto;width:52px;height:52px}
.player-controls{flex-shrink:0;min-width:154px}
.player-controls .player-play{flex-shrink:0}
.player .next-station{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;padding:10px 12px;font-size:12px}
.next-station svg{width:18px;height:18px}
@media(max-width:1100px) and (min-width:641px){.player .next-station{width:40px;height:40px;padding:8px}.player .next-station span{display:none}.player-controls{min-width:140px}.mood-transport{gap:5px}}
@media(max-width:640px){
 body{padding-bottom:165px}
 .now-card .hero-controls{grid-row:2;grid-column:1/-1;flex-direction:row;justify-content:space-between;gap:8px;margin-top:0}
 .hero-controls .mood-context{text-align:left;max-width:140px}
 .now-card .hero-controls .hero-play{width:44px;height:44px}
 .hero-controls .mood-transport{gap:7px}
 .now-card .hero-heart{top:4px;bottom:auto;left:auto;right:0}
 .player .player-inner{display:grid;grid-template-columns:38px minmax(0,1fr) 32px 32px;gap:8px;padding:10px 12px;min-height:124px}
 .player .player-art{width:38px;height:42px;grid-column:1;grid-row:1}
 .player .player-info{grid-column:2;grid-row:1;min-width:0}
 .player .player-info strong{font-size:15px}
 .player .player-info>span:last-child{font-size:10px}
 .player .timer-button{grid-column:3;grid-row:1;width:32px;height:36px;margin:0}
 .player .next-station{grid-column:4;grid-row:1;width:32px;height:36px;padding:6px;margin:0}
 .player .next-station span{display:none}
 .player .player-controls{grid-column:1/-1;grid-row:2;flex-direction:row;justify-content:space-between;gap:8px;min-width:0;padding-top:5px;border-top:1px solid var(--line)}
 .player-controls .mood-context{text-align:left;font-size:12px}
 .player-controls .mood-transport{gap:8px}
 .player-controls .player-play{width:40px;height:40px}
 .player-controls .mood-skip{width:36px;height:36px}
 .player .player-volume{display:none}
 .toast{bottom:155px}
}
.mood-transport .player-play,.mood-transport .hero-play{order:0}
@media(max-width:640px){.now-card{grid-template-rows:minmax(145px,auto) 44px}.hero-controls .mood-context{font-size:12px}}

.console-random{display:flex;align-items:center;gap:12px;margin:18px 0 0}.console-random .random-button{display:inline-flex;align-items:center;gap:8px;margin:0;white-space:nowrap}.console-random small{color:var(--muted);font-size:12px;line-height:1.4}@media(max-width:640px){.console-random{flex-wrap:wrap;gap:8px 12px;margin-top:16px}.console-random .random-button{font-size:13px;padding:10px 12px}.console-random small{font-size:11px}}
.console-random .random-button{background:var(--paper);color:var(--ink);border:1px solid var(--line)}.console-random .random-button:hover{border-color:#8aa536;background:var(--olive)}
/* Explicit transport hover colors override the generic icon-button hover. */
html .mood-controls .mood-skip{color:var(--ink);transition:background-color .15s,border-color .15s,color .15s}
html .mood-controls .mood-skip:hover,html .mood-controls .mood-skip:focus-visible{background:#303923;color:#edf5ce;border-color:#a4b65f}
html[data-theme=light] .mood-controls .mood-skip:hover,html[data-theme=light] .mood-controls .mood-skip:focus-visible{background:#e3edcc;color:#253617;border-color:#94aa60}
/* Keep the divider below the catalog clear of its final row, including favorites. */
#radio-genres{margin-top:32px}
@media(max-width:640px){#radio-genres{margin-top:24px}}

/* Keep the random-source caption readable over bright mood photos. */
html[data-theme=dark] .console-random small{color:#f1f4e8;background:#141810eb;padding:4px 6px;border-radius:4px}
