/* Jeffrey Services Radio 6.4.2 — structure & navigation repair
   Shared additive layer: visual only; no auth, playback or database changes. */
:root { --js642-line:#31353c; --js642-surface:#121519; --js642-muted:#b8b7b4; --js642-gold:#edcb91; }
.js-layout-641 { max-width:100%; }
.js-layout-641 :is(.radio-topbar,.ru-nav,.js63-header,.site-header,.topbar) { box-sizing:border-box; }
.js-layout-641 [hidden] { display:none!important; }
/* /radio and /radio/stations: only ONE primary route menu; filters stay in the sidebar. */
.js-page-catalog .radio-layout {grid-template-columns:228px minmax(0,1fr);}
.js-page-catalog .radio-sidebar {width:228px;min-width:0;box-sizing:border-box;}
.js-page-catalog .radio-brand {min-width:0;}
.js-page-catalog .radio-brand strong {font-family:'DM Sans',system-ui,sans-serif;letter-spacing:.03em;line-height:1.12;}
.js-page-catalog .radio-brand small {letter-spacing:.13em;}
.js-page-catalog .radio-body {min-width:0;width:100%;}
.js-page-catalog .radio-topbar {
 display:grid;grid-template-columns:minmax(140px,178px) minmax(230px,1fr) max-content max-content;
 grid-template-areas:'title search listeners account' 'nav nav nav nav';
 column-gap:clamp(10px,1.4vw,22px);row-gap:13px;align-items:center;
 width:100%;min-height:0;height:auto;padding:18px clamp(18px,2.7vw,38px) 15px;
 border-bottom:1px solid var(--js642-line);background:#0d1013f5;
}
.js-page-catalog .radio-topbar-title {grid-area:title;min-width:0;}
.js-page-catalog .radio-topbar-title strong {display:block;font-size:18px;line-height:1.25;white-space:nowrap;}
.js-page-catalog .radio-topbar-listeners {grid-area:listeners;justify-self:end;white-space:nowrap;margin:0;min-width:0;}
.js-page-catalog .radio-search {grid-area:search;justify-self:stretch;width:100%;min-width:0;max-width:none;margin:0;}
.js-page-catalog .radio-search input {min-width:0;width:100%;}
.js-page-catalog .radio-account-controls {grid-area:account;justify-self:end;display:flex;align-items:center;justify-content:flex-end;min-width:0;gap:9px;flex-wrap:nowrap;max-width:100%;margin:0;}
.js-page-catalog .radio-user {display:inline-flex;align-items:center;min-width:0;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.js-page-catalog .radio-discord-logout {flex:0 0 auto;}
.js-page-catalog .sig-radio-shortcuts {grid-area:nav;display:flex;align-items:center;justify-content:flex-start;gap:7px;flex-wrap:wrap;width:100%;min-width:0;margin:0;padding-top:11px;border-top:1px solid #ffffff16;}
.js-page-catalog .sig-radio-shortcuts a {font-size:12px;min-height:40px;white-space:nowrap;padding:9px 13px;display:inline-flex;align-items:center;}
.js-page-catalog .sig-radio-shortcuts a.is-current {background:#342a1c;border-color:#bf985d;color:#f6dba9;}
.js-page-catalog .sig-radio-shortcuts .sig-site-link {margin-left:auto;color:#c4c0b8;border-color:#32363b;background:#15181b;}
.js-page-catalog .radio-topbar .radio-home-link {display:none!important;}
.js-page-catalog .radio-main {min-width:0;}
.js-page-catalog .radio-hero {margin-top:25px;}
.js-page-catalog .radio-sidebar-end {min-width:0;}
.js-page-catalog .radio-sidebar-end a {overflow-wrap:anywhere;}
/* At medium widths the header uses deliberate rows instead of letting items auto-wrap. */
@media (max-width:1450px) {
 .js-page-catalog .radio-topbar {grid-template-columns:minmax(140px,1fr) auto minmax(175px,max-content);grid-template-areas:'title listeners account' 'search search search' 'nav nav nav';}
 .js-page-catalog .radio-topbar-listeners {justify-self:center;}
 .js-page-catalog .radio-search {max-width:none;}
 .js-page-catalog .sig-radio-shortcuts {flex-wrap:wrap;}
}
@media (max-width:1050px) {
 .js-page-catalog .radio-layout {grid-template-columns:204px minmax(0,1fr);}
 .js-page-catalog .radio-sidebar {width:204px;}
 .js-page-catalog .radio-topbar {grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'title account' 'search search' 'listeners listeners' 'nav nav';padding:15px 18px;gap:10px 12px;}
 .js-page-catalog .radio-topbar-listeners {justify-self:start;}
 .js-page-catalog .sig-radio-shortcuts {flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;padding-bottom:4px;scrollbar-width:thin;}
 .js-page-catalog .sig-radio-shortcuts a {flex:0 0 auto;}
 .js-page-catalog .sig-radio-shortcuts .sig-site-link {margin-left:0;}
}
@media (max-width:850px) {
 .js-page-catalog .radio-layout {display:block;}
 .js-page-catalog .radio-sidebar {width:100%;height:auto;min-height:0;position:relative;display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:12px 18px;border-right:0;border-bottom:1px solid var(--js642-line);overflow:hidden;}
 .js-page-catalog .radio-side-nav,.js-page-catalog .radio-sidebar-caption,.js-page-catalog .radio-sidebar-end {display:none!important;}
 .js-page-catalog .radio-brand {padding:0;margin:0;flex:0 1 auto;min-width:0;}
 .js-page-catalog .radio-topbar {position:relative;top:auto;}
}
@media (max-width:650px) {
 .js-page-catalog .radio-topbar {grid-template-columns:minmax(110px,1fr) auto;grid-template-areas:'title account' 'search search' 'listeners listeners' 'nav nav';padding:12px 13px;gap:9px 7px;}
 .js-page-catalog .radio-account-controls {grid-area:account;justify-self:end;max-width:100%;min-width:0;width:auto;}
 .js-page-catalog .radio-topbar-title {max-width:100%;}
 .js-page-catalog .radio-topbar-title strong {font-size:16px;}
 .js-page-catalog .radio-user {max-width:115px;font-size:11px;}
 .js-page-catalog .radio-discord-logout,.js-page-catalog .radio-discord-login {width:auto;min-width:0;font-size:11px;padding:9px 12px;}
 .js-page-catalog .radio-topbar-listeners {justify-self:start;}
 .js-page-catalog .sig-radio-shortcuts {gap:6px;}
 .js-page-catalog .sig-radio-shortcuts a {font-size:11px;min-height:40px;padding:8px 11px;}
 .js-page-catalog .radio-main {padding-top:0;}
 .js-page-catalog .radio-hero {margin-top:15px;}
}
@media (max-width:365px) {
 .js-page-catalog .radio-discord-logout {padding:7px 8px;font-size:10px;}
 .js-page-catalog .radio-user {max-width:82px;}
}
/* Universe: predictable panel layout at medium widths; no floating account/status.
   The original styling intentionally uses a two-tier desktop header. */
#js-universe .ru-nav {isolation:isolate;}
#js-universe .ru-nav > * {min-width:0;}
#js-universe .ru-nav > .ru-auth-slot {align-self:center;}
#js-universe .ru-nav > .ru-nav-tools {max-width:100%;}
#js-universe .ru-nav-tools .ru-role-link {flex:0 0 auto;}
@media (min-width:851px) and (max-width:1160px) {
 #js-universe .ru-nav {grid-template-areas:'brand account' 'primary primary' 'search actions';}
 #js-universe .ru-nav > .ru-nav-tools {overflow-x:auto;scrollbar-width:thin;}
}
@media (max-width:850px) {
 #js-universe .ru-nav {grid-template-areas:'brand account' 'search search' 'actions actions';}
 #js-universe .ru-nav > .ru-signature-nav {display:none!important;}
 #js-universe .ru-nav > .ru-nav-tools {overflow-x:auto;scrollbar-width:thin;}
}
/* Control / Studio / Approvals / Admin: same readable surface widths and button spacing. */
.js-page-control .top,.js-page-admin .topbar,.js-page-studio .js63-header,.js-page-approvals .js63-header {min-width:0;}
.js-page-control .sidebar a,.js-page-admin .sidebar a {overflow-wrap:anywhere;}
.js-page-control .app main,.js-page-admin .app main {min-width:0;}
.js-page-studio .js63-screen,.js-page-approvals .js63-screen {max-width:100%;min-width:0;}
.js-page-studio .js63-grid>*,.js-page-approvals .js63-grid>* {min-width:0;}
/* Scalable focus and reduced motion. */
.js-layout-641 :is(.sig-radio-shortcuts a,.radio-topbar button,.ru-nav a):focus-visible {outline:2px solid #f8dcad;outline-offset:3px;}
@media(prefers-reduced-motion:reduce){.js-layout-641 *{scroll-behavior:auto!important;}}