/* Global theme bridge loaded after isolated and page-level styles. */
.municipal-layout-root,
.municipal-layout-root * {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black) !important;
    --green-900: var(--theme-dark) !important;
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)) !important;
    --green-700: var(--theme-primary) !important;
    --green-600: color-mix(in srgb, var(--theme-primary) 84%, var(--theme-light)) !important;
    --green-500: var(--theme-light) !important;
    --green-100: color-mix(in srgb, var(--theme-light) 20%, white) !important;
    --green-50: color-mix(in srgb, var(--theme-light) 10%, white) !important;
    --emerald-950: var(--green-950) !important;
    --emerald-900: var(--green-900) !important;
    --emerald-800: var(--green-800) !important;
    --emerald-700: var(--green-700) !important;
    --emerald-600: var(--green-600) !important;
    --gold: var(--theme-accent) !important;
    --gold-700: color-mix(in srgb, var(--theme-accent) 78%, black) !important;
    --gold-600: color-mix(in srgb, var(--theme-accent) 88%, black) !important;
    --gold-500: var(--theme-accent) !important;
    --gold-300: color-mix(in srgb, var(--theme-accent) 50%, white) !important;
    --gold-100: color-mix(in srgb, var(--theme-accent) 18%, white) !important;
    --ink: var(--theme-ink) !important;
    --muted: var(--theme-muted) !important;
    --border: var(--theme-border) !important;
    --line: var(--theme-border) !important;
    --surface: #ffffff !important;
    --page-bg: var(--theme-bg) !important;
    --app-bg: var(--theme-bg) !important;
    --app-border: var(--theme-border) !important;
    --app-ink: var(--theme-ink) !important;
    --app-muted: var(--theme-muted) !important;
    --app-green-950: var(--green-950) !important;
    --app-green-900: var(--green-900) !important;
    --app-green-800: var(--green-800) !important;
    --app-green-700: var(--green-700) !important;
    --app-green-600: var(--green-600) !important;
    --app-green-100: var(--green-100) !important;
    --shadow: 0 15px 42px rgba(var(--theme-dark-rgb), .08) !important;
    --panel-shadow: 0 20px 55px rgba(var(--theme-dark-rgb), .11) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --pm-primary: var(--theme-primary) !important;
    --pm-primary-dark: var(--theme-dark) !important;
    --pm-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --pm-secondary: var(--theme-light) !important;
    --pm-gold: var(--theme-accent) !important;
    --pm-text: var(--theme-ink) !important;
    --pm-muted: var(--theme-muted) !important;
    --pm-border: var(--theme-border) !important;
    --pm-background: var(--theme-bg) !important;
    --pm-shadow: var(--panel-shadow) !important;
    --aud-primary: var(--theme-primary) !important;
    --aud-primary-dark: var(--theme-dark) !important;
    --aud-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --aud-blue: var(--theme-light) !important;
    --aud-ink: var(--theme-ink) !important;
    --aud-muted: var(--theme-muted) !important;
    --aud-line: var(--theme-border) !important;
    --aud-bg: var(--theme-bg) !important;
    --ntf-primary: var(--theme-primary) !important;
    --ntf-primary-dark: var(--theme-dark) !important;
    --ntf-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --ntf-blue: var(--theme-light) !important;
    --ntf-blue-soft: color-mix(in srgb, var(--theme-light) 12%, white) !important;
    --ntf-orange: var(--theme-accent) !important;
    --ntf-ink: var(--theme-ink) !important;
    --ntf-muted: var(--theme-muted) !important;
    --ntf-line: var(--theme-border) !important;
    --ms-primary: var(--theme-primary) !important;
    --ms-primary-dark: var(--theme-dark) !important;
    --ms-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --ms-accent: var(--theme-light) !important;
    --ms-ink: var(--theme-ink) !important;
    --ms-muted: var(--theme-muted) !important;
    --ms-line: var(--theme-border) !important;
    --intg-primary: var(--theme-primary) !important;
    --intg-primary-dark: var(--theme-dark) !important;
    --intg-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --intg-blue: var(--theme-light) !important;
    --intg-ink: var(--theme-ink) !important;
    --intg-muted: var(--theme-muted) !important;
    --intg-line: var(--theme-border) !important;
    --intg-bg: var(--theme-bg) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --luxury-emerald: var(--theme-primary) !important;
    --luxury-emerald-deep: var(--theme-dark) !important;
    --luxury-emerald-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --luxury-gold: var(--theme-accent) !important;
    --luxury-gold-deep: color-mix(in srgb, var(--theme-accent) 78%, black) !important;
    --luxury-gold-soft: color-mix(in srgb, var(--theme-accent) 16%, white) !important;
    --luxury-ink: var(--theme-ink) !important;
    --luxury-ink-soft: color-mix(in srgb, var(--theme-ink) 82%, white) !important;
    --luxury-muted: var(--theme-muted) !important;
    --luxury-border: var(--theme-border) !important;
    --luxury-cream: var(--theme-bg) !important;
    --luxury-surface: #ffffff !important;
    --luxury-shadow: var(--panel-shadow) !important;
    --luxury-shadow-soft: 0 12px 30px rgba(var(--theme-dark-rgb), .08) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --ha-green: var(--theme-primary) !important;
    --ha-deep: var(--theme-dark) !important;
    --ha-gold: var(--theme-accent) !important;
    --ha-blue: var(--theme-light) !important;
    --ha-purple: color-mix(in srgb, var(--theme-primary) 58%, #7c3aed) !important;
    --ha-orange: var(--theme-accent) !important;
    --ha-text: var(--theme-ink) !important;
    --ha-muted: var(--theme-muted) !important;
    --ha-border: rgba(var(--theme-primary-rgb), .12) !important;
    --ha-shadow: var(--panel-shadow) !important;
    --rc-green: var(--theme-primary) !important;
    --rc-deep: var(--theme-dark) !important;
    --rc-gold: var(--theme-accent) !important;
    --rc-blue: var(--theme-light) !important;
    --rc-text: var(--theme-ink) !important;
    --rc-muted: var(--theme-muted) !important;
    --rc-border: rgba(var(--theme-primary-rgb), .12) !important;
    --rc-shadow: var(--panel-shadow) !important;
    --iv-green: var(--theme-primary) !important;
    --iv-deep: var(--theme-dark) !important;
    --iv-gold: var(--theme-accent) !important;
    --iv-blue: var(--theme-light) !important;
    --iv-text: var(--theme-ink) !important;
    --iv-muted: var(--theme-muted) !important;
    --iv-border: rgba(var(--theme-primary-rgb), .12) !important;
    --iv-shadow: var(--panel-shadow) !important;
    --tx-green: var(--theme-primary) !important;
    --tx-deep: var(--theme-dark) !important;
    --tx-gold: var(--theme-accent) !important;
    --tx-blue: var(--theme-light) !important;
    --tx-text: var(--theme-ink) !important;
    --tx-muted: var(--theme-muted) !important;
    --tx-border: rgba(var(--theme-primary-rgb), .12) !important;
    --tx-shadow: var(--panel-shadow) !important;
    --lm-green: var(--theme-primary) !important;
    --lm-green-deep: var(--theme-dark) !important;
    --lm-green-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --lm-deep: var(--theme-dark) !important;
    --lm-gold: var(--theme-accent) !important;
    --lm-blue: var(--theme-light) !important;
    --lm-text: var(--theme-ink) !important;
    --lm-muted: var(--theme-muted) !important;
    --lm-border: rgba(var(--theme-primary-rgb), .12) !important;
    --lm-shadow: var(--panel-shadow) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --market-green-950: var(--green-950) !important;
    --market-green-900: var(--green-900) !important;
    --market-green-800: var(--green-800) !important;
    --market-green-700: var(--green-700) !important;
    --market-green-600: var(--green-600) !important;
    --market-green-500: var(--green-500) !important;
    --market-green-100: var(--green-100) !important;
    --market-green-50: var(--green-50) !important;
    --market-gold-600: var(--theme-accent) !important;
    --market-blue-600: var(--theme-light) !important;
    --market-purple-600: color-mix(in srgb, var(--theme-primary) 58%, #7c3aed) !important;
    --market-orange-600: var(--theme-accent) !important;
    --market-ink: var(--theme-ink) !important;
    --market-muted: var(--theme-muted) !important;
    --market-line: var(--theme-border) !important;
    --market-background: var(--theme-bg) !important;
    --community-green-900: var(--green-900) !important;
    --community-green-800: var(--green-800) !important;
    --community-green-700: var(--green-700) !important;
    --community-green-600: var(--green-600) !important;
    --community-green-100: var(--green-100) !important;
    --community-ink: var(--theme-ink) !important;
    --community-muted: var(--theme-muted) !important;
    --community-border: var(--theme-border) !important;
    --community-bg: var(--theme-bg) !important;
    --provider-green-950: var(--green-950) !important;
    --provider-green-900: var(--green-900) !important;
    --provider-green-800: var(--green-800) !important;
    --provider-green-700: var(--green-700) !important;
    --provider-green-600: var(--green-600) !important;
    --provider-green-100: var(--green-100) !important;
    --provider-ink: var(--theme-ink) !important;
    --provider-muted: var(--theme-muted) !important;
    --provider-border: var(--theme-border) !important;
    --provider-bg: var(--theme-bg) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --su-primary: var(--theme-primary) !important;
    --su-dark: var(--theme-dark) !important;
    --su-ink: var(--theme-ink) !important;
    --su-muted: var(--theme-muted) !important;
    --su-border: var(--theme-border) !important;
    --asg-primary: var(--theme-primary) !important;
    --asg-primary-dark: var(--theme-dark) !important;
    --asg-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --asg-gold: var(--theme-accent) !important;
    --asg-ink: var(--theme-ink) !important;
    --asg-muted: var(--theme-muted) !important;
    --asg-border: var(--theme-border) !important;
    --exec-primary: var(--theme-primary) !important;
    --exec-primary-dark: var(--theme-dark) !important;
    --exec-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white) !important;
    --exec-gold: var(--theme-accent) !important;
    --exec-ink: var(--theme-ink) !important;
    --exec-muted: var(--theme-muted) !important;
    --exec-border: var(--theme-border) !important;
    --rr-primary: var(--theme-primary) !important;
    --rr-dark: var(--theme-dark) !important;
    --rr-ink: var(--theme-ink) !important;
    --rr-muted: var(--theme-muted) !important;
    --rr-border: var(--theme-border) !important;
    --sla-primary: var(--theme-primary) !important;
    --sla-dark: var(--theme-dark) !important;
    --sla-ink: var(--theme-ink) !important;
    --sla-muted: var(--theme-muted) !important;
    --sla-border: var(--theme-border) !important;
    --sr-primary: var(--theme-primary) !important;
    --sr-primary-dark: var(--theme-dark) !important;
    --sr-gold: var(--theme-accent) !important;
    --sr-ink: var(--theme-ink) !important;
    --sr-muted: var(--theme-muted) !important;
    --sr-border: var(--theme-border) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --dept-green-950: var(--green-950) !important;
    --dept-green-900: var(--green-900) !important;
    --dept-green-800: var(--green-800) !important;
    --dept-green-700: var(--green-700) !important;
    --dept-green-100: var(--green-100) !important;
    --dept-gold: var(--theme-accent) !important;
    --dept-ink: var(--theme-ink) !important;
    --dept-muted: var(--theme-muted) !important;
    --dept-border: var(--theme-border) !important;
    --staff-green-950: var(--green-950) !important;
    --staff-green-900: var(--green-900) !important;
    --staff-green-800: var(--green-800) !important;
    --staff-green-700: var(--green-700) !important;
    --staff-green-100: var(--green-100) !important;
    --staff-gold: var(--theme-accent) !important;
    --staff-ink: var(--theme-ink) !important;
    --staff-muted: var(--theme-muted) !important;
    --staff-border: var(--theme-border) !important;
    --att-green-950: var(--green-950) !important;
    --att-green-900: var(--green-900) !important;
    --att-green-800: var(--green-800) !important;
    --att-green-700: var(--green-700) !important;
    --att-gold: var(--theme-accent) !important;
    --att-ink: var(--theme-ink) !important;
    --att-muted: var(--theme-muted) !important;
    --att-border: var(--theme-border) !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --news-green-950: var(--green-950) !important;
    --news-green-900: var(--green-900) !important;
    --news-green-800: var(--green-800) !important;
    --news-green-700: var(--green-700) !important;
    --news-green-100: var(--green-100) !important;
    --news-gold: var(--theme-accent) !important;
    --news-ink: var(--theme-ink) !important;
    --news-muted: var(--theme-muted) !important;
    --news-border: var(--theme-border) !important;
    --news-page-bg: var(--theme-bg) !important;
    --archive-green-950: var(--green-950) !important;
    --archive-green-900: var(--green-900) !important;
    --archive-green-800: var(--green-800) !important;
    --archive-green-700: var(--green-700) !important;
    --archive-green-100: var(--green-100) !important;
    --archive-gold-600: var(--theme-accent) !important;
    --archive-gold-500: var(--theme-accent) !important;
    --archive-gold-100: color-mix(in srgb, var(--theme-accent) 15%, white) !important;
    --archive-slate-950: var(--theme-ink) !important;
    --archive-slate-700: color-mix(in srgb, var(--theme-ink) 82%, white) !important;
    --archive-slate-500: var(--theme-muted) !important;
    --archive-border: var(--theme-border) !important;
    --archive-background: var(--theme-bg) !important;
    --archive-surface: #ffffff !important;
}

.municipal-layout-root,
.municipal-layout-root * {
    --summary-accent: var(--theme-primary) !important;
    --summary-color: var(--theme-primary) !important;
    --summary-main: var(--theme-primary) !important;
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white) !important;
    --summary-border: rgba(var(--theme-primary-rgb), .22) !important;
    --kpi-main: var(--theme-primary) !important;
    --kpi-soft: color-mix(in srgb, var(--theme-light) 15%, white) !important;
    --accent: var(--theme-primary) !important;
    --soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --category-accent: var(--theme-primary) !important;
    --category-color: var(--theme-primary) !important;
    --category-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --type-color: var(--theme-primary) !important;
    --type-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --card-accent: var(--theme-primary) !important;
    --card-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --quick-accent: var(--theme-primary) !important;
    --quick-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --focus-color: var(--theme-primary) !important;
    --focus-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --priority-color: var(--theme-primary) !important;
    --priority-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
    --day-accent: var(--theme-primary) !important;
    --day-soft: color-mix(in srgb, var(--theme-light) 14%, white) !important;
}

.municipal-layout-root :is(
    .mud-button-filled-primary,
    .mud-button-filled-secondary,
    .mud-fab-primary,
    .mud-chip-color-primary,
    .mud-progress-linear-bar,
    .mud-switch-checked .mud-switch-track,
    .mud-checkbox-checked
) {
    --mud-palette-primary: var(--theme-primary) !important;
    --mud-palette-primary-rgb: var(--theme-primary-rgb) !important;
    --mud-palette-secondary: var(--theme-accent) !important;
    --mud-palette-secondary-rgb: var(--theme-accent-rgb) !important;
}

.municipal-layout-root :is(
    [class*="hero"],
    [class*="banner"],
    [class*="header"],
    [class*="toolbar"],
    [class*="cover"]
) {
    border-color: color-mix(in srgb, var(--theme-primary) 15%, var(--theme-border));
}

.municipal-layout-root :is(
    [class*="icon"],
    [class*="emblem"],
    [class*="avatar"]
) {
    --mud-palette-primary: var(--theme-primary) !important;
}

/* Hard-coded page surfaces that do not rely on local CSS variables. */
.municipal-layout-root :is(
    .hero-panel,
    .executive-hero,
    .page-hero,
    .dashboard-hero,
    .premium-hero,
    .module-hero,
    .resource-hero,
    .report-hero,
    .settings-hero,
    .marketplace-hero,
    .community-hero,
    .provider-hero,
    .news-hero,
    .archive-hero,
    .detail-hero,
    .locked-dispatch-panel,
    [class$="-hero"]
) {
    color: #ffffff !important;
    border-color: rgba(var(--theme-accent-rgb), .24) !important;
    background:
        radial-gradient(
            circle at 84% 0%,
            rgba(var(--theme-accent-rgb), .20),
            transparent 28%
        ),
        radial-gradient(
            circle at 10% 112%,
            rgba(var(--theme-light-rgb), .18),
            transparent 34%
        ),
        linear-gradient(
            138deg,
            color-mix(in srgb, var(--theme-dark) 92%, black) 0%,
            var(--theme-dark) 56%,
            var(--theme-primary) 100%
        ) !important;
    box-shadow:
        0 28px 72px rgba(var(--theme-dark-rgb), .24),
        inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

.municipal-layout-root .hero-panel::before,
.municipal-layout-root .executive-hero::before,
.municipal-layout-root .page-hero::before,
.municipal-layout-root .dashboard-hero::before,
.municipal-layout-root .premium-hero::before,
.municipal-layout-root .module-hero::before,
.municipal-layout-root .resource-hero::before,
.municipal-layout-root .report-hero::before,
.municipal-layout-root .settings-hero::before {
    background:
        radial-gradient(
            circle at 82% 18%,
            rgba(var(--theme-accent-rgb), .22),
            transparent 24%
        ),
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(255, 255, 255, .025) 56%,
            rgba(255, 255, 255, .055) 100%
        ) !important;
}

.municipal-layout-root .hero-gold-line,
.municipal-layout-root .kpi-top-line,
.municipal-layout-root .luxury-card::before,
.municipal-layout-root .premium-card::before {
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--theme-accent),
            color-mix(in srgb, var(--theme-accent) 58%, white),
            var(--theme-accent),
            transparent
        ) !important;
    box-shadow:
        0 0 24px rgba(var(--theme-accent-rgb), .38) !important;
}

.municipal-layout-root :is(
    .hero-badge,
    .hero-meta > span,
    .hero-control-panel,
    .control-summary > span,
    .status-summary > span,
    .premium-panel,
    .premium-card,
    .luxury-card,
    .kpi-card,
    .executive-kpi,
    .module-card,
    .project-card,
    .quick-link-card,
    .decision-item,
    .alert-item,
    .finance-summary,
    .budget-progress-section,
    .satisfaction-hero
) {
    border-color: rgba(var(--theme-primary-rgb), .13) !important;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            color-mix(in srgb, var(--theme-bg) 58%, white)
        ) !important;
    box-shadow:
        0 14px 34px rgba(var(--theme-dark-rgb), .075) !important;
}

.municipal-layout-root :is(
    .hero-control-panel,
    .control-summary > span,
    .status-summary > span,
    .finance-summary,
    .budget-progress-section,
    .satisfaction-hero
) {
    color: var(--theme-ink) !important;
}

.municipal-layout-root :is(
    .municipal-emblem,
    .hero-badge-icon,
    .module-icon,
    .project-icon,
    .quick-link-card > span,
    .finance-icon,
    .kpi-icon,
    .kpi-icon-wrap,
    .operation-icon.green,
    .department-icon,
    .decision-item.success .decision-icon,
    .attachment-card.student > span,
    .attachment-card.application > span
) {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, .28) !important;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;
    box-shadow:
        0 12px 24px rgba(var(--theme-dark-rgb), .18),
        inset 0 1px 0 rgba(255, 255, 255, .18) !important;
}

.municipal-layout-root :is(
    .kpi-card.green,
    .executive-kpi,
    .executive-kpi.green,
    .trend-chip,
    .panel-badge,
    .panel-link-button,
    .success-number,
    .request-no,
    .donut-total strong,
    .module-count strong,
    .score-ring strong,
    .risk-badge.low,
    .decision-item.success .decision-icon,
    .operation-icon.green
) {
    color: var(--theme-primary) !important;
}

.municipal-layout-root :is(
    .kpi-card.gold,
    .executive-kpi.gold,
    .panel-kicker,
    .control-header small,
    .quick-links-heading span,
    .score-badge,
    .table-score,
    .pending-number
) {
    color: var(--theme-accent) !important;
}

.municipal-layout-root :is(
    .kpi-card.blue,
    .executive-kpi.blue,
    .project-icon.blue,
    .quick-link-card.blue > span,
    .operation-icon.blue,
    .finance-summary.remaining .finance-icon
) {
    color: var(--theme-primary) !important;
}

.municipal-layout-root :is(
    .project-icon.blue,
    .quick-link-card.blue > span,
    .operation-icon.blue,
    .finance-summary.remaining .finance-icon
) {
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;
}

.municipal-layout-root :is(
    .mud-input-outlined-border,
    .premium-table,
    .department-table,
    .mud-table-cell,
    .project-card,
    .quick-link-card
) {
    border-color: rgba(var(--theme-primary-rgb), .14) !important;
}

.municipal-layout-root :is(
    .premium-table .mud-table-head,
    .department-table .mud-table-head,
    .mud-table-head,
    .mud-table-row:hover
) {
    background:
        linear-gradient(
            90deg,
            color-mix(in srgb, var(--theme-light) 10%, white),
            color-mix(in srgb, var(--theme-accent) 6%, white)
        ) !important;
}

.municipal-layout-root :is(
    .kpi-label,
    .kpi-unit,
    .kpi-footer,
    .section-subtitle,
    .request-subtitle,
    .module-info small,
    .project-main > small,
    .decision-copy small,
    .finance-summary small,
    .finance-summary em,
    .hero-meta > span,
    .operation-footer,
    .satisfaction-copy p
) {
    color: var(--theme-muted) !important;
}

.municipal-layout-root :is(
    .kpi-value,
    .kpi-value-row strong,
    .section-title,
    .module-info strong,
    .project-title-line strong,
    .decision-copy strong,
    .finance-summary strong,
    .operation-heading h6,
    .operation-stat strong,
    .department-name strong,
    .quick-link-card strong,
    .request-title,
    .control-header strong,
    .panel-heading h2
) {
    color: var(--theme-ink) !important;
}

/* Light hero badges need dark text; page CSS often kept white text from dark heroes. */
.municipal-layout-root .hero-badge {
    color: var(--theme-ink) !important;
    text-shadow: none !important;
}

.municipal-layout-root .hero-badge small {
    color: color-mix(in srgb, var(--theme-ink) 64%, var(--theme-muted)) !important;
    text-shadow: none !important;
}

.municipal-layout-root .hero-badge strong {
    color: color-mix(in srgb, var(--theme-primary) 72%, var(--theme-dark)) !important;
    text-shadow: none !important;
}

.municipal-layout-root .hero-badge > span:first-child:not(.hero-badge-icon) {
    color: #ffffff !important;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb, var(--theme-accent) 82%, white),
            var(--theme-accent)
        ) !important;
}

/* Smooth dashboard polish: keep the theme global, but let the hero breathe. */
.municipal-layout-root .dashboard-shell .hero-panel {
    border-color: rgba(255, 255, 255, .14) !important;
    background:
        radial-gradient(
            circle at 82% 8%,
            rgba(var(--theme-light-rgb), .24),
            transparent 34rem
        ),
        radial-gradient(
            circle at 8% 112%,
            rgba(var(--theme-accent-rgb), .16),
            transparent 30rem
        ),
        linear-gradient(
            125deg,
            color-mix(in srgb, var(--theme-dark) 92%, black) 0%,
            color-mix(in srgb, var(--theme-dark) 80%, var(--theme-primary)) 48%,
            color-mix(in srgb, var(--theme-primary) 78%, var(--theme-light)) 100%
        ) !important;
    box-shadow:
        0 24px 56px rgba(var(--theme-dark-rgb), .20),
        inset 0 1px 0 rgba(255, 255, 255, .14) !important;
}

.municipal-layout-root .dashboard-shell .hero-panel::before {
    background:
        linear-gradient(
            100deg,
            rgba(255, 255, 255, .06),
            transparent 42%,
            rgba(255, 255, 255, .045)
        ),
        radial-gradient(
            circle at 86% 30%,
            rgba(var(--theme-accent-rgb), .12),
            transparent 24rem
        ) !important;
    opacity: .88;
}

.municipal-layout-root .dashboard-shell .hero-overlay {
    opacity: .28 !important;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(255, 255, 255, .018) 0,
            rgba(255, 255, 255, .018) 1px,
            transparent 1px,
            transparent 12px
        ),
        linear-gradient(
            90deg,
            transparent,
            rgba(255, 255, 255, .05),
            transparent
        ) !important;
}

.municipal-layout-root .dashboard-shell .hero-gold-line {
    opacity: .52 !important;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(var(--theme-accent-rgb), .72),
            rgba(255, 255, 255, .72),
            rgba(var(--theme-accent-rgb), .58),
            transparent
        ) !important;
    box-shadow: 0 0 18px rgba(var(--theme-accent-rgb), .24) !important;
}

.municipal-layout-root .dashboard-shell :is(.hero-badge, .system-online, .hero-meta span) {
    color: rgba(255, 255, 255, .82) !important;
    border-color: rgba(255, 255, 255, .18) !important;
    background: rgba(255, 255, 255, .105) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 10px 24px rgba(var(--theme-dark-rgb), .08) !important;
    backdrop-filter: blur(14px);
}

.municipal-layout-root .dashboard-shell .hero-badge small,
.municipal-layout-root .dashboard-shell .hero-meta span,
.municipal-layout-root .dashboard-shell .system-online small {
    color: rgba(255, 255, 255, .70) !important;
}

.municipal-layout-root .dashboard-shell .hero-badge strong,
.municipal-layout-root .dashboard-shell .system-online strong {
    color: #ffffff !important;
}

.municipal-layout-root .dashboard-shell .hero-badge > span:last-child {
    color: #ffffff !important;
    background: transparent !important;
    box-shadow: none !important;
}

.municipal-layout-root .dashboard-shell .hero-badge-icon {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, .18) !important;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .18),
            rgba(255, 255, 255, .08)
        ) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20) !important;
}

.municipal-layout-root .dashboard-shell .hero-control-panel {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, .20) !important;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .20),
            rgba(255, 255, 255, .10)
        ) !important;
    box-shadow:
        0 20px 42px rgba(var(--theme-dark-rgb), .13),
        inset 0 1px 0 rgba(255, 255, 255, .18) !important;
    backdrop-filter: blur(16px);
}

.municipal-layout-root .dashboard-shell .hero-control-panel :is(.control-header strong, .control-header small) {
    color: #ffffff !important;
}

.municipal-layout-root .dashboard-shell .hero-control-panel :is(.premium-date, .control-summary span) {
    color: var(--theme-ink) !important;
    border-color: rgba(255, 255, 255, .48) !important;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .95),
            rgba(255, 255, 255, .84)
        ) !important;
    box-shadow: 0 10px 22px rgba(var(--theme-dark-rgb), .08) !important;
}

.municipal-layout-root .dashboard-shell :is(.kpi-card, .premium-card) {
    border-color: color-mix(in srgb, var(--theme-primary) 12%, var(--theme-border)) !important;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .98),
            color-mix(in srgb, var(--theme-bg) 52%, white)
        ) !important;
    box-shadow:
        0 16px 38px rgba(var(--theme-dark-rgb), .075),
        inset 0 1px 0 rgba(255, 255, 255, .86) !important;
}

.municipal-layout-root .dashboard-shell .kpi-card:hover {
    border-color: color-mix(in srgb, var(--theme-primary) 24%, var(--theme-border)) !important;
    box-shadow:
        0 22px 48px rgba(var(--theme-dark-rgb), .11),
        inset 0 1px 0 rgba(255, 255, 255, .88) !important;
}