:root,
html[data-theme="light"]{
  color-scheme:light;
  --bg:#f4f6f9;
  --bg2:#eef1f5;
  --surface:#ffffff;
  --surface2:#f7f9fc;
  --surface3:#eef2f7;
  --border:rgba(15,23,42,.10);
  --border2:rgba(15,23,42,.18);
  --text:#111318;
  --soft:#2c313a;
  --muted:#596273;
  --sub:#687181;
  --accent:#5f7800;
  --accent2:#799900;
  --accent-fill:#d7ff3f;
  --accent-fill2:#e8ff89;
  --accent-soft:rgba(95,120,0,.09);
  --success:#167548;
  --warning:#946200;
  --danger:#b4232d;
  --info:#1c5f9f;
  --control-bg:rgba(15,23,42,.035);
  --control-hover:rgba(15,23,42,.065);
  --divider:rgba(15,23,42,.085);
  --row-hover:rgba(15,23,42,.028);
  --shadow:0 18px 55px rgba(15,23,42,.08);
  --shadow-lg:0 28px 85px rgba(15,23,42,.14);
  --topbar-bg:rgba(255,255,255,.90);
  --sidebar-bg:rgba(255,255,255,.98);
  --chart-grid:rgba(15,23,42,.10);
  --chart-label:#687181;
  --chart-accent:#6b8700;
  --chart-fill-start:rgba(107,135,0,.18);
  --chart-fill-end:rgba(107,135,0,0);
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#050505;
  --bg2:#0a0a0b;
  --surface:#0e0e10;
  --surface2:#141416;
  --surface3:#18181b;
  --border:rgba(255,255,255,.075);
  --border2:rgba(255,255,255,.14);
  --text:#f6f6f7;
  --soft:#c9c9ce;
  --muted:#8f8f98;
  --sub:#6f6f78;
  --accent:#d7ff3f;
  --accent2:#e8ff89;
  --accent-fill:#d7ff3f;
  --accent-fill2:#e8ff89;
  --accent-soft:rgba(215,255,63,.09);
  --success:#73e6a7;
  --warning:#f2c66d;
  --danger:#ff747d;
  --info:#79baff;
  --control-bg:rgba(255,255,255,.035);
  --control-hover:rgba(255,255,255,.065);
  --divider:rgba(255,255,255,.055);
  --row-hover:rgba(255,255,255,.018);
  --shadow:0 18px 55px rgba(0,0,0,.18);
  --shadow-lg:0 30px 90px rgba(0,0,0,.46);
  --topbar-bg:rgba(5,5,5,.86);
  --sidebar-bg:rgba(7,7,8,.98);
  --chart-grid:rgba(255,255,255,.075);
  --chart-label:#85858d;
  --chart-accent:#d7ff3f;
  --chart-fill-start:rgba(215,255,63,.18);
  --chart-fill-end:rgba(215,255,63,0);
}

html,body{background-color:var(--bg);color:var(--text)}
body{background:radial-gradient(circle at 75% -15%,color-mix(in srgb,var(--accent-fill) 5%,transparent),transparent 31%),var(--bg);color:var(--text)}
p{color:var(--muted)}
::selection{background:var(--accent-fill);color:#111318}
*{scrollbar-color:color-mix(in srgb,var(--text) 24%,transparent) var(--bg2)}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text) 24%,transparent)}

/* Brand and controls */
.brand-mark{border-color:var(--border2);background:radial-gradient(circle at 35% 25%,color-mix(in srgb,var(--text) 9%,transparent),transparent 42%),var(--surface2)}
.brand-mark:before{border-color:color-mix(in srgb,var(--accent) 32%,transparent)}
.brand-mark-core{background:var(--accent-fill);box-shadow:0 0 12px color-mix(in srgb,var(--accent-fill) 70%,transparent)}
.brand-product{color:var(--muted)}
.btn{border-color:var(--border2);background:var(--control-bg);color:var(--text)}
.btn:hover{background:var(--control-hover)}
.btn-primary{border-color:color-mix(in srgb,var(--accent-fill) 68%,#7b8f00);background:linear-gradient(var(--accent-fill2),var(--accent-fill));color:#111804;box-shadow:0 10px 30px color-mix(in srgb,var(--accent-fill) 15%,transparent)}
.btn-primary:hover{background:linear-gradient(#f0ffac,#ddff56)}
.btn-secondary{background:linear-gradient(var(--surface2),color-mix(in srgb,var(--surface2) 72%,var(--bg)))}
.btn-ghost{background:transparent;color:var(--muted)}
.btn-ghost:hover{background:var(--control-hover);color:var(--text)}
.btn-danger{border-color:color-mix(in srgb,var(--danger) 28%,transparent);background:color-mix(in srgb,var(--danger) 9%,transparent);color:var(--danger)}

.form-label{color:var(--soft)}
.form-hint{color:var(--sub)}
.form-input,.form-select,.form-textarea{border-color:var(--border2);background:var(--surface);color:var(--text)}
.form-input::placeholder,.form-textarea::placeholder{color:color-mix(in srgb,var(--muted) 80%,transparent)}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}
.form-select option{background:var(--surface);color:var(--text)}
.input-icon{color:var(--sub)}
.password-toggle{color:var(--sub)}
.password-toggle:hover{background:var(--control-hover);color:var(--soft)}

.card,.surface,.dashboard-card{border-color:var(--border);background:var(--surface);box-shadow:var(--shadow)}
.card-header,.card-footer,.dashboard-card-header,.dashboard-card-footer{border-color:var(--divider)}
.card-title,.dashboard-card-title{color:var(--soft)}
.card-subtitle,.dashboard-card-subtitle{color:var(--sub)}

/* Alerts and badges use dark text in light mode for readable status colors. */
html[data-theme="light"] .alert-success{border-color:rgba(22,117,72,.24);background:rgba(22,117,72,.08);color:#155d3c}
html[data-theme="light"] .alert-warning{border-color:rgba(148,98,0,.24);background:rgba(148,98,0,.08);color:#745000}
html[data-theme="light"] .alert-error{border-color:rgba(180,35,45,.24);background:rgba(180,35,45,.07);color:#8f1d26}
html[data-theme="dark"] .alert-success{color:#b8f2d0}
html[data-theme="dark"] .alert-warning{color:#f2d79f}
html[data-theme="dark"] .alert-error{color:#ffb4ba}
.badge{border-color:var(--border);background:var(--control-bg);color:var(--muted)}
.badge-success{border-color:color-mix(in srgb,var(--success) 28%,transparent);background:color-mix(in srgb,var(--success) 9%,transparent);color:var(--success)}
.badge-warning{border-color:color-mix(in srgb,var(--warning) 28%,transparent);background:color-mix(in srgb,var(--warning) 9%,transparent);color:var(--warning)}
.badge-danger{border-color:color-mix(in srgb,var(--danger) 28%,transparent);background:color-mix(in srgb,var(--danger) 9%,transparent);color:var(--danger)}
.badge-info{border-color:color-mix(in srgb,var(--info) 28%,transparent);background:color-mix(in srgb,var(--info) 9%,transparent);color:var(--info)}
.badge-accent{border-color:color-mix(in srgb,var(--accent) 28%,transparent);background:var(--accent-soft);color:var(--accent)}

/* Tables, lists, dropdowns, modal */
.data-table th{border-color:var(--border);color:var(--sub)}
.data-table td{border-color:var(--divider);color:var(--muted)}
.data-table tbody tr:hover{background:var(--row-hover)}
.table-primary{color:var(--soft)}
.table-secondary{color:var(--sub)}
.meta-row{border-color:var(--divider)}
.meta-key{color:var(--muted)}
.meta-value{color:var(--soft)}
.info-item{border-color:var(--divider);background:var(--surface2)}
.info-item-label{color:var(--sub)}
.info-item-value{color:var(--soft)}
.filter-bar{background:var(--surface2)}
.progress{background:color-mix(in srgb,var(--text) 8%,transparent)}
.progress-bar{background:linear-gradient(90deg,#8eaa14,var(--accent-fill));box-shadow:0 0 15px color-mix(in srgb,var(--accent-fill) 22%,transparent)}
.avatar{background:linear-gradient(var(--surface2),var(--surface3));color:var(--soft)}
.dropdown-menu{border-color:var(--border2);background:color-mix(in srgb,var(--surface) 97%,transparent);box-shadow:var(--shadow-lg)}
.dropdown-item{color:var(--muted)}
.dropdown-item:hover,.dropdown-item.active{background:var(--control-hover);color:var(--text)}
.dropdown-item-danger{color:var(--danger)}
.empty-state-icon{background:var(--surface2);color:var(--sub)}
.empty-state-title{color:var(--text)}
.empty-state-copy{color:var(--muted)}
.pagination-link{color:var(--muted)}
.pagination-link:hover,.pagination-link.is-active{border-color:color-mix(in srgb,var(--accent) 30%,transparent);background:var(--accent-soft);color:var(--accent)}
.modal-backdrop{background:rgba(15,23,42,.56)}
.modal{background:var(--surface);box-shadow:0 30px 100px rgba(15,23,42,.25)}
.toast{background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg)}
.skeleton{background:color-mix(in srgb,var(--text) 7%,transparent)}
.skeleton:after{background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--text) 7%,transparent),transparent)}

/* Dashboard shell */
.sidebar{border-color:var(--border);background:var(--sidebar-bg);box-shadow:none}
.sidebar-header,.sidebar-footer{border-color:var(--divider)}
.sidebar-section-label{color:var(--sub)}
.sidebar-link{color:var(--muted)}
.sidebar-link:hover{background:var(--control-hover);color:var(--soft)}
.sidebar-link.is-active{border-color:color-mix(in srgb,var(--accent) 18%,transparent);background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 11%,transparent),color-mix(in srgb,var(--accent) 3%,transparent));color:var(--accent)}
.sidebar-link-icon{color:var(--sub)}
.sidebar-link.is-active .sidebar-link-icon{color:var(--accent)}
.sidebar-user-name{color:var(--soft)}
.sidebar-user-role{color:var(--sub)}
.sidebar-close,.topbar-mobile-toggle{background:var(--surface2);color:var(--muted)}
.topbar{border-color:var(--border);background:var(--topbar-bg)}
.topbar-eyebrow{color:var(--sub)}
.topbar-title{color:var(--soft)}
.topbar-status{color:var(--muted)}
.dashboard-eyebrow,.live-indicator{color:var(--accent)}
.dashboard-eyebrow:before,.live-indicator-dot{background:var(--accent-fill);box-shadow:0 0 8px color-mix(in srgb,var(--accent-fill) 72%,transparent)}
.dashboard-description{color:var(--muted)}
.dashboard-metric{border-color:var(--border);background:var(--surface);box-shadow:var(--shadow)}
.dashboard-metric:hover{border-color:var(--border2)}
.dashboard-metric:after{background:radial-gradient(circle,color-mix(in srgb,var(--text) 5%,transparent),transparent 68%)}
.dashboard-metric.is-accent:after{background:radial-gradient(circle,color-mix(in srgb,var(--accent-fill) 14%,transparent),transparent 68%)}
.dashboard-metric-label{color:var(--muted)}
.dashboard-metric-icon{background:var(--surface2)}
.dashboard-metric-value{color:var(--text)}
.dashboard-metric-meta{color:var(--sub)}
.summary-strip{border-color:var(--border);background:var(--surface)}
.summary-strip-item{border-color:var(--divider)}
.summary-strip-label{color:var(--sub)}
.summary-strip-value{color:var(--soft)}
.campaign-item,.play-item,.station-item{border-color:var(--divider)}
.campaign-item:hover,.play-item:hover,.station-item:hover{background:var(--row-hover)}
.campaign-name,.play-spot,.station-name{color:var(--soft)}
.campaign-client,.campaign-progress-meta,.play-meta,.play-time,.station-meta,.station-status{color:var(--sub)}
.play-status{border-color:color-mix(in srgb,var(--accent) 18%,transparent);background:var(--accent-soft)}
.play-status-dot{background:var(--accent-fill);box-shadow:0 0 7px color-mix(in srgb,var(--accent-fill) 72%,transparent)}
.station-logo{background:var(--surface2);color:var(--sub)}
.quick-action,.report-card,.detail-header{background:var(--surface2)}
.quick-action-title,.report-card-title{color:var(--soft)}
.quick-action-copy,.report-card-copy,.detail-header-meta{color:var(--sub)}
.report-card-icon{border-color:color-mix(in srgb,var(--accent) 20%,transparent);background:var(--accent-soft);color:var(--accent)}
.client-summary-logo{background:var(--surface2)}
.client-summary-name{color:var(--text)}
.client-summary-meta,.chart-summary-label{color:var(--sub)}
.chart-summary-value,.detail-header-title{color:var(--text)}
.mobile-nav{background:color-mix(in srgb,var(--surface) 96%,transparent)!important;border-color:var(--border)!important;box-shadow:0 -10px 35px rgba(15,23,42,.08)!important}
.mobile-nav-link{color:var(--muted)!important}
.mobile-nav-link.is-active{color:var(--accent)!important}
.demo-session-timer{border-color:var(--border2)!important;background:var(--control-bg)!important;color:var(--text)}
.demo-session-timer.is-ending{border-color:color-mix(in srgb,var(--danger) 45%,transparent)!important;background:color-mix(in srgb,var(--danger) 9%,transparent)!important;color:var(--danger)!important}

/* Auth */
.auth-page{background:radial-gradient(circle at 72% 18%,color-mix(in srgb,var(--accent-fill) 11%,transparent),transparent 27%),radial-gradient(circle at 15% 85%,color-mix(in srgb,var(--text) 4%,transparent),transparent 31%),var(--bg)}
.auth-grid{background-image:linear-gradient(color-mix(in srgb,var(--text) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--text) 7%,transparent) 1px,transparent 1px);opacity:.28}
.auth-glow-one{background:color-mix(in srgb,var(--accent-fill) 12%,transparent)}
.auth-glow-two{background:color-mix(in srgb,var(--text) 5%,transparent)}
.auth-card{border-color:var(--border);background:color-mix(in srgb,var(--surface) 96%,transparent);box-shadow:var(--shadow-lg)}
.auth-card:after{background:radial-gradient(circle,color-mix(in srgb,var(--accent-fill) 11%,transparent),transparent 68%)}
.auth-eyebrow{color:var(--accent)}
.auth-eyebrow:before{background:var(--accent-fill);box-shadow:0 0 8px color-mix(in srgb,var(--accent-fill) 72%,transparent)}
.auth-title{color:var(--text)}
.auth-subtitle{color:var(--muted)}
.auth-card-footer{border-color:var(--divider)}
.auth-security{color:var(--muted)}
.auth-footer{color:var(--sub)}

/* Pricing */
.pricing-hero{border-color:color-mix(in srgb,var(--accent) 22%,transparent);background:radial-gradient(circle at 85% 0,color-mix(in srgb,var(--accent-fill) 16%,transparent),transparent 34%),linear-gradient(135deg,var(--surface),var(--surface2));box-shadow:var(--shadow)}
.pricing-kicker{color:var(--accent)}
.pricing-kicker-dot{background:var(--accent-fill);box-shadow:0 0 14px color-mix(in srgb,var(--accent-fill) 72%,transparent)}
.pricing-hero-copy{color:var(--muted)}
.pricing-note{color:var(--sub)}
.pricing-card{background:var(--surface);box-shadow:var(--shadow)}
.pricing-card:hover{border-color:var(--border2);box-shadow:var(--shadow-lg)}
.pricing-card.is-featured{border-color:color-mix(in srgb,var(--accent) 48%,transparent);background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--accent-fill) 14%,transparent),transparent 30%),var(--surface);box-shadow:var(--shadow-lg)}
.pricing-card-ribbon{background:var(--accent-fill);color:#111804}
.pricing-card-caption,.pricing-frequency-sub,.pricing-deal-regular{color:var(--sub)}
.pricing-price span,.pricing-frequency-main span{color:var(--muted)}
.pricing-frequency{border-color:var(--divider);background:var(--surface2)}
.pricing-deal{border-color:color-mix(in srgb,var(--success) 24%,transparent);background:color-mix(in srgb,var(--success) 8%,transparent)}
.pricing-deal-title,.pricing-deal-total strong{color:var(--success)}
.pricing-deal-badge{background:color-mix(in srgb,var(--success) 11%,transparent);color:var(--success)}
.pricing-deal-total span,.pricing-deal-per-station{color:color-mix(in srgb,var(--success) 82%,var(--muted))}
.pricing-card-benefits{border-color:var(--divider)}
.pricing-benefit{color:var(--muted)}
.pricing-benefit:before{color:var(--accent)}
.pricing-value-strip{border-color:var(--border);background:var(--surface);box-shadow:var(--shadow)}
.pricing-value-item{color:var(--muted)}
.pricing-value-title span{color:var(--accent)}
.pricing-value-check{background:var(--accent-soft);color:var(--accent)}
.pricing-policy-card{background:var(--surface)}
.pricing-policy-icon{background:var(--accent-soft);color:var(--accent)}
.pricing-cta{border-color:color-mix(in srgb,var(--accent) 26%,transparent);background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--accent-fill) 14%,transparent),transparent 35%),var(--surface)}
.pricing-legal-line{color:var(--sub)}

/* Payments */
.nexi-mode-card.is-test{border-color:color-mix(in srgb,var(--warning) 32%,transparent);background:color-mix(in srgb,var(--warning) 5%,var(--surface))}
.nexi-mode-card.is-live{border-color:color-mix(in srgb,var(--danger) 30%,transparent);background:color-mix(in srgb,var(--danger) 4%,var(--surface))}
.nexi-key-panel{background:var(--surface2)}
.payment-station-options a{color:var(--muted)}
.payment-station-options a:hover,.payment-station-options a.is-selected{border-color:color-mix(in srgb,var(--accent) 45%,transparent);background:var(--accent-soft);color:var(--accent)}
.payment-terms{color:var(--muted)}
.payment-terms a,.payment-total .meta-value,.payment-result-meta strong{color:var(--accent)}
.payment-security-note{border-color:color-mix(in srgb,var(--success) 22%,transparent);background:color-mix(in srgb,var(--success) 7%,transparent);color:var(--success)}
.payment-result-meta{color:var(--muted)}

/* Accounting */
.accounting-hero{border-color:color-mix(in srgb,var(--accent) 22%,transparent);background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--accent-fill) 15%,transparent),transparent 34%),var(--surface);box-shadow:var(--shadow)}
.accounting-kicker{color:var(--accent)}
.accounting-hero p,.money-step-label,.business-score-label{color:var(--muted)}
.money-step,.business-score-card{background:var(--surface)}
.money-step.is-main,.business-score-card.is-accent{border-color:color-mix(in srgb,var(--accent) 22%,transparent);background:linear-gradient(150deg,color-mix(in srgb,var(--accent-fill) 12%,transparent),color-mix(in srgb,var(--accent-fill) 3%,transparent)),var(--surface)}
.money-step-meta,.business-score-copy{color:var(--sub)}
.accounting-note{border-color:color-mix(in srgb,var(--warning) 20%,transparent);background:color-mix(in srgb,var(--warning) 6%,transparent);color:var(--muted)}
.simple-bar-value,.simple-bar-label{color:var(--sub)}
.simple-bar-track{background:var(--surface3)}
.simple-bar-fill{background:linear-gradient(180deg,var(--accent-fill),color-mix(in srgb,var(--accent-fill) 32%,transparent))}
.plain-list-row{border-color:var(--divider)}
.plain-list-title{color:var(--soft)}
.plain-list-sub{color:var(--sub)}
.accounting-chip{border-color:color-mix(in srgb,var(--accent) 22%,transparent);background:var(--accent-soft);color:var(--accent)}

/* PWA install UI */
.pwa-install-dialog{border-color:var(--border2);background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg)}
.pwa-install-close{border-color:var(--border);background:var(--surface2);color:var(--muted)}
.pwa-install-icon{background:var(--surface2);border-color:var(--border)}
.pwa-install-kicker{color:var(--accent)}
.pwa-install-copy{color:var(--muted)}
.pwa-install-benefit{border-color:var(--border);background:var(--surface2);color:var(--soft)}
.pwa-install-benefit>span:first-child{color:var(--accent)}
.pwa-install-instructions{border-color:color-mix(in srgb,var(--accent) 22%,transparent);background:var(--accent-soft);color:var(--soft)}
.pwa-install-instructions strong{color:var(--text)}
.pwa-install-note{color:var(--sub)}
.pwa-install-toast{border-color:color-mix(in srgb,var(--accent) 24%,transparent);background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg)}

/* Theme switcher */
.theme-switcher{display:inline-flex;align-items:center;gap:3px;padding:3px;border:1px solid var(--border);border-radius:999px;background:var(--surface2);box-shadow:0 1px 2px rgba(15,23,42,.04)}
.theme-option{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;height:30px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:.67rem;font-weight:720;cursor:pointer;transition:.16s var(--ease)}
.theme-option:hover{color:var(--text);background:var(--control-hover)}
.theme-option.is-active,.theme-option[aria-pressed="true"]{background:var(--surface);color:var(--text);box-shadow:0 1px 4px rgba(15,23,42,.10)}
.theme-option svg{width:14px;height:14px;flex:0 0 14px}
.theme-switcher-auth{position:fixed;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));z-index:1300}
html[data-theme="dark"] .theme-option.is-active,html[data-theme="dark"] .theme-option[aria-pressed="true"]{box-shadow:0 1px 5px rgba(0,0,0,.45)}

@media(max-width:760px){
  .topbar .theme-option{width:30px;min-width:30px;padding:0}
  .topbar .theme-option-label{display:none}
  .theme-switcher-auth{right:12px;top:12px}
}
