/* v0.5.97 — VoiceTracker.net brand alignment.
 * Uses the approved white broadcast-wave wordmark and the website's navy,
 * cobalt, and white palette. An appearance-only layer deliberately loaded
 * after existing styles. Recording/timed event states keep their semantics.
 * DO NOT change layout grids, JS, API, audio, timing, or VT server sessions.
 */
:root {
 --spl-blue:#0967d6;--select:#0967d6;--vt-heading:#10294e;
 --text:#18304f;--muted:#56708c;
 --chrome:#f3f7fc;--chrome2:#ffffff;--panel:#ffffff;--white:#ffffff;
 --line:#cddceb;--line-dark:#a6bbd2;
 --vt-surface:#f5f9ff;--vt-field:#fff;--vt-stroke:#cddceb;
 --vt-hover:#eaf2fa;
}
html,body{background:#edf3f9;color:var(--text)}
/* The same brand lockup is used on the marketing site, including the waves over i. */
.app-header{background:#0c1627;border-color:#2a405a;box-shadow:0 3px 16px rgba(2,10,29,.17)}
.brand-row,html[data-theme="dark"] .brand-row{background:#0c1627;border-bottom:0}
.vt-new-logo{display:block;object-fit:contain;object-position:left center;width:100%;height:auto;max-width:100%}
.brand-lockup{min-width:0}
.brand-lockup .header-wordmark{width:218px;max-width:45vw;height:auto;flex:none}
.brand-row .brand-descriptor{color:#b7c8df}
.brand-row .app-version{background:#192c45;border-color:#334d6c;color:#c1d5ef}
.brand-row .vt-server-state{color:#c3d5eb}
.station-tools .admin-panel-header,html[data-theme="dark"] .station-tools .admin-panel-header{color:#e8f3ff}
.brand-row .compact-label{color:#c8d9ee}
.brand-row .compact-label select,#stationSelect,
html[data-theme="dark"] .brand-row .compact-label select,html[data-theme="dark"] #stationSelect{background:#172941;color:#eaf4ff;border:1px solid #415d7d;border-radius:7px}
.brand-row .compact-label select:focus,#stationSelect:focus{outline:2px solid #59a9ff;outline-offset:2px}
.brand-row .theme-toggle,html[data-theme="dark"] .brand-row .theme-toggle{background:#192c45;border:1px solid #36516e;color:#e7f2ff}
.brand-row .theme-toggle:hover,html[data-theme="dark"] .brand-row .theme-toggle:hover{background:#213b5c;border-color:#59a9ff}
.brand-row .station-logo-control,html[data-theme="dark"] .brand-row .station-logo-control{background:#172940;border-color:#405a79;box-shadow:none}
.brand-row .station-logo-control:hover,html[data-theme="dark"] .brand-row .station-logo-control:hover{background:#1d3655;border-color:#59a9ff}
.brand-row .station-logo-square,html[data-theme="dark"] .brand-row .station-logo-square{background:rgba(89,169,255,.10);color:#9ac8ff}
.menu-strip,html[data-theme="dark"] .menu-strip{background:#132239;border-color:#2a405a;gap:4px}
.menu-btn,html[data-theme="dark"] .menu-btn{color:#c9dcf2;border-color:transparent;background:transparent}
.menu-btn:hover,html[data-theme="dark"] .menu-btn:hover{background:#1f3958;color:#fff}
.menu-btn.active,html[data-theme="dark"] .menu-btn.active{background:#0967d6;border-color:#247ee5;color:#fff;box-shadow:none}
.menu-btn.active:hover,html[data-theme="dark"] .menu-btn.active:hover{background:#247ee5;color:#fff}
.menu-btn:disabled,html[data-theme="dark"] .menu-btn:disabled{background:transparent;color:#8094ab;opacity:.6}
.app-version{white-space:nowrap}
/* Brand-consistent content surfaces without touching widths or 50/50 grids. */
.spl-panel,.spl-window{border-color:#cddceb;box-shadow:0 7px 24px rgba(20,64,108,.075)}
.panel-caption,.window-title{background:#f5f9ff;border-bottom-color:#d9e5f1;color:#173b65}
.page-toolbar h1{color:#10294e}
.log-editor-header,.log-header{background:#eaf2fa;color:#24496f;border-color:#d3e2f1}
.log-editor-footer,.billing-team-toolbar,.billing-station-create,.admin-list-toolbar{background:#f5f9ff;border-color:#d9e5f1}
.spl-btn.primary,.spl-btn.primary:not(:disabled),.billing-user-actions .spl-btn.team-login{background:#0967d6;border-color:#0967d6;color:#fff;box-shadow:0 2px 8px rgba(9,103,214,.14)}
.spl-btn.primary:hover:not(:disabled),.billing-user-actions .spl-btn.team-login:hover:not(:disabled){background:#2587ef;border-color:#2587ef;color:#fff}
.spl-btn,.log-mini-btn,.mini-media,.wave-more-btn{border-radius:7px}
input:focus,select:focus,textarea:focus{border-color:#328cf8;outline-color:#328cf8}
input[type="checkbox"],input[type="radio"],input[type="range"]{accent-color:#0967d6}
/* Recording and destructive-action red, plus timed event type colors, remain for clarity. */
/* Login: navy brand header, blue sign in, and the same white logo as the website. */
.login-view,html[data-theme="dark"] .login-view{background:#0c1627}
.login-window{border:1px solid #35516f;box-shadow:0 20px 70px rgba(1,9,28,.32);overflow:hidden}
.login-window .login-titlebar,html[data-theme="dark"] .login-window .login-titlebar{background:#132239;border-bottom:1px solid #2a405a;color:#fff}
.login-window .window-title-version{background:#1c3451;border-color:#395878;color:#cedff4}
.login-body{background:#fff}
.login-brand{padding:13px 16px 12px;background:#0c1627;border-radius:9px;margin:0 auto 12px;max-width:390px;box-sizing:border-box}
.login-brand .vt-new-logo{width:100%;height:auto}
.login-body>p{color:#56708c}
.login-legal,.login-legal>div:first-child{color:#b9cce2}
.app-legal{background:#f5f9ff;border-color:#d9e5f1}
/* Dark mode mirrors the site's dark color tokens while retaining function contrast. */
html[data-theme="dark"]{
 color-scheme:dark;--spl-blue:#59a9ff;--select:#328cf8;--text:#f4f8ff;
 --muted:#adbed5;--chrome:#14243a;--chrome2:#172a43;--panel:#132239;
 --white:#132239;--line:#2a405a;--line-dark:#4a6584;
 --vt-surface:#192c45;--vt-field:#101e30;--vt-stroke:#304a65;--vt-hover:#1e3754;
 --vt-heading:#f4f8ff;
}
html[data-theme="dark"],html[data-theme="dark"] body{background:#0b1424;color:#f4f8ff}
html[data-theme="dark"] .app-header{background:#0c1627;border-color:#2a405a}
html[data-theme="dark"] .brand-row,html[data-theme="dark"] .menu-strip{border-color:#2a405a}
html[data-theme="dark"] .spl-panel,html[data-theme="dark"] .spl-window{background:#132239;border-color:#2e4661;box-shadow:0 8px 25px rgba(0,0,0,.16)}
html[data-theme="dark"] .panel-caption,html[data-theme="dark"] .window-title{background:#1b3250;border-color:#304a65;color:#eff7ff}
html[data-theme="dark"] .page-toolbar h1{color:#fff}
html[data-theme="dark"] .log-editor-header,html[data-theme="dark"] .log-header{background:#1b3250;border-color:#304a65;color:#cbdbef}
html[data-theme="dark"] .log-editor-footer,html[data-theme="dark"] .billing-team-toolbar,html[data-theme="dark"] .billing-station-create,html[data-theme="dark"] .admin-list-toolbar{background:#172a43;border-color:#304a65}
html[data-theme="dark"] .spl-btn.primary,html[data-theme="dark"] .spl-btn.primary:not(:disabled),html[data-theme="dark"] .billing-user-actions .spl-btn.team-login{background:#0967d6;border-color:#328cf8;color:#fff}
html[data-theme="dark"] .spl-btn.primary:hover:not(:disabled),html[data-theme="dark"] .billing-user-actions .spl-btn.team-login:hover:not(:disabled){background:#2587ef;border-color:#59a9ff;color:#fff}
html[data-theme="dark"] .login-view{background:#0c1627}
html[data-theme="dark"] .login-body{background:#132239}
html[data-theme="dark"] .login-body>p{color:#adbed5}
html[data-theme="dark"] .login-brand{background:#0c1627;border:1px solid #2a405a}
html[data-theme="dark"] .app-legal{background:#132239;border-color:#2a405a}
@media(max-width:800px){.brand-lockup .header-wordmark{width:188px;max-width:52vw}}
@media(max-width:560px){.brand-lockup .header-wordmark{width:164px;max-width:68vw}.brand-row .brand-descriptor{display:none}.login-brand{padding:10px 12px}}