:root {
    --brand-font-body: 'Barlow', 'Segoe UI', sans-serif;
    --brand-font-heading: 'Barlow', 'Segoe UI', sans-serif;
    --brand-font-data: 'JetBrains Mono', 'Segoe UI', monospace;

    --brand-space-1: 4px;
    --brand-space-2: 8px;
    --brand-space-3: 12px;
    --brand-space-4: 16px;
    --brand-space-5: 20px;
    --brand-space-6: 24px;
    --brand-space-7: 32px;

    --brand-radius-xs: 1px;
    --brand-radius-sm: 2px;
    --brand-radius-md: 3px;
    --brand-radius-lg: 4px;
    --brand-radius-xl: 6px;
    --brand-radius-pill: 999px;

    --brand-border: rgba(var(--mud-palette-text-primary-rgb), 0.14);
    --brand-border-strong: rgba(var(--mud-palette-text-primary-rgb), 0.26);
    --brand-hover: rgba(148, 163, 184, 0.045);
    --brand-selected: rgba(var(--mud-palette-primary-rgb), 0.065);
    --brand-selected-strong: rgba(var(--mud-palette-primary-rgb), 0.12);
    --brand-focus: rgba(var(--mud-palette-primary-rgb), 0.24);
    --brand-grid-line: rgba(148, 163, 184, 0.028);
    --brand-grid-line-strong: rgba(148, 163, 184, 0.052);
    --brand-hud-line: rgba(201, 188, 107, 0.18);
    /* Panel topline disabled (option C — plain uniform edge, no HUD fade line).
       Kept as a token so it's a one-line revert if we ever want the accent back;
       every panel ::before references it, so transparent removes them all at once. */
    --brand-panel-topline: transparent;
    /* Flat / tactical elevation. Structure is carried by 1px borders + the panel
       topline, not by drop shadows — deep floaty card shadows read as consumer SaaS,
       not control-room. Static surfaces get a hairline; only true overlays (dialogs,
       popovers, drawers) keep a modest lift via -float. */
    --brand-shadow-soft: 0 1px 2px rgba(2, 6, 23, 0.22);
    --brand-shadow-card: none;
    --brand-shadow-float: 0 8px 20px rgba(2, 6, 23, 0.34);
}

html,
body {
    font-family: var(--brand-font-body);
    background: var(--mud-palette-background);
    color: var(--mud-palette-text-primary);
    transition: background-color 0.18s ease, color 0.18s ease;
}

body {
    letter-spacing: 0.008em;
    line-height: 1.42;
    font-weight: 400;
}

.mud-typography-body2,
.mud-typography-caption,
.mud-typography-subtitle2 {
    letter-spacing: 0.014em;
}

h1,
h2,
h3,
h4,
h5,
h6,
.mud-typography-h1,
.mud-typography-h2,
.mud-typography-h3,
.mud-typography-h4,
.mud-typography-h5,
.mud-typography-h6 {
    font-family: var(--brand-font-heading);
    font-weight: 600;
    letter-spacing: -0.018em;
}

a,
.btn-link,
.mud-link {
    color: var(--mud-palette-primary);
}

::selection {
    background: rgba(var(--mud-palette-primary-rgb), 0.18);
}

.font-chakra,
.brand-data-font,
.brand-shell .mud-typography-h3,
.brand-shell .mud-typography-h4 .mud-numeric,
.brand-shell code {
    font-family: var(--brand-font-data);
}

.brand-shell,
.brand-manage-shell,
.brand-account-shell {
    position: relative;
    min-height: 100vh;
    color: var(--mud-palette-text-primary);
    isolation: isolate;
}

.brand-shell::before,
.brand-manage-shell::before,
.brand-account-shell::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-background-rgb), 0.992), rgba(var(--mud-palette-background-rgb), 1)),
        radial-gradient(circle at 0 0, rgba(var(--mud-palette-primary-rgb), 0.035), transparent 20%),
        linear-gradient(180deg, rgba(201, 188, 107, 0.04), transparent 28%),
        linear-gradient(var(--brand-grid-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--brand-grid-line) 1px, transparent 1px),
        linear-gradient(135deg, transparent 0 49.35%, rgba(201, 188, 107, 0.03) 49.45%, transparent 49.55%);
    background-size: auto, auto, auto, 40px 40px, 40px 40px, 160px 160px;
    pointer-events: none;
}

.brand-main-content,
.brand-manage-main {
    background: transparent;
}

.brand-content-shell,
.brand-manage-container,
.brand-account-frame {
    position: relative;
    z-index: 1;
}

.brand-content-shell {
    padding-top: var(--brand-space-5) !important;
    padding-bottom: var(--brand-space-6) !important;
}

.brand-appbar {
    color: var(--mud-palette-text-primary) !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.95), rgba(var(--mud-palette-background-grey-rgb), 0.92)) !important;
    border-bottom: 1px solid var(--brand-border);
    backdrop-filter: blur(8px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.02),
        inset 0 -1px 0 rgba(148, 163, 184, 0.06);
}

.brand-appbar .mud-toolbar-appbar,
.brand-appbar .mud-toolbar {
    gap: var(--brand-space-2);
    min-height: 46px;
}

.brand-appbar .mud-icon-root,
.brand-appbar .mud-button-root,
.brand-appbar .mud-switch-button {
    color: inherit !important;
}

.brand-appbar .mud-icon-button-root {
    width: 40px;
    height: 40px;
    border-radius: var(--brand-radius-sm);
    border: 1px solid transparent;
}

.brand-appbar .mud-icon-button-root:hover {
    background: var(--brand-hover);
    border-color: rgba(137, 158, 178, 0.12);
}

.brand-theme-toggle,
.brand-theme-menu .mud-icon-button-root {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.brand-theme-toggle:hover,
.brand-theme-toggle:focus-visible,
.brand-theme-menu .mud-icon-button-root:hover,
.brand-theme-menu .mud-icon-button-root:focus-visible {
    border: 0 !important;
    background: rgba(var(--mud-palette-text-primary-rgb), 0.035) !important;
    box-shadow: none !important;
}

.brand-drawer {
    width: 268px !important;
    max-width: calc(100vw - 16px);
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.95)) !important;
    border-right: 1px solid var(--brand-border);
    backdrop-filter: blur(8px);
    box-shadow:
        inset -1px 0 0 rgba(255, 255, 255, 0.015),
        18px 0 32px rgba(2, 6, 23, 0.16);
}

.brand-drawer .mud-drawer-content {
    padding: 12px 10px 14px;
}

.brand-side-drawer {
    top: 46px !important;
    height: calc(100dvh - 46px) !important;
    max-height: calc(100dvh - 46px) !important;
    z-index: 1401 !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.84), rgba(var(--mud-palette-background-grey-rgb), 0.78)) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
    border-left: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.16) !important;
    box-shadow:
        -28px 0 52px rgba(2, 6, 23, 0.28),
        -1px 0 0 rgba(255, 255, 255, 0.06),
        inset 1px 0 0 rgba(255, 255, 255, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.mud-overlay.mud-overlay-drawer,
.mud-overlay-drawer {
    background: rgba(6, 24, 48, 0.58) !important;
    backdrop-filter: none !important;
}

.brand-side-drawer .mud-drawer-content {
    height: 100%;
    padding: 16px 14px 18px;
    overflow-y: auto;
}

.brand-drawer-logo {
    margin-bottom: var(--brand-space-3);
}

.brand-org-logo {
    width: 40px !important;
    height: 40px !important;
    display: block;
    border: 0 !important;
    border-radius: var(--brand-radius-sm);
    box-shadow: none !important;
    background: #ffffff !important;
    padding: 3px !important;
    object-fit: contain;
}

.brand-main-content .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-main-content .mud-card,
.brand-account-shell .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-manage-shell .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-manage-shell .mud-card,
.mud-popover .mud-paper,
.mud-dialog .mud-paper {
    position: relative;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.98), rgba(var(--mud-palette-background-grey-rgb), 0.94));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.022),
        0 1px 3px rgba(2, 6, 23, 0.26);
    border-radius: var(--brand-radius-lg);
}

.mud-card {
    overflow: hidden;
}

.brand-main-content .mud-paper:not(.mud-alert):not(.mud-appbar)::before,
.brand-main-content .mud-card::before,
.brand-account-shell .mud-paper:not(.mud-alert):not(.mud-appbar)::before,
.brand-manage-shell .mud-paper:not(.mud-alert):not(.mud-appbar)::before,
.brand-manage-shell .mud-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
}

.brand-main-content .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-main-content .mud-card {
    border: 0;
}

.brand-main-content .mud-paper.brand-home2-console:not(.mud-alert):not(.mud-appbar) {
    box-shadow: none !important;
    filter: none !important;
}

.brand-account-shell .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-manage-shell .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-manage-shell .mud-card,
.mud-popover .mud-paper,
.mud-dialog .mud-paper {
    border: 1px solid var(--brand-border);
}

.mud-divider {
    border-color: rgba(148, 163, 184, 0.09);
}

.mud-dialog {
    border-radius: var(--brand-radius-xl);
}

.mud-dialog-title {
    min-height: 48px;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.mud-dialog .mud-dialog-content {
    padding-top: var(--brand-space-5);
}

.mud-dialog .mud-dialog-actions {
    padding: 0 var(--brand-space-5) var(--brand-space-5);
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    margin-top: var(--brand-space-4);
}

.mud-button-root {
    min-height: 40px;
    border-radius: var(--brand-radius-sm);
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0;
}

.mud-icon-button-root {
    border-radius: var(--brand-radius-sm);
}

.mud-button-filled {
    border: 1px solid rgba(137, 158, 178, 0.12);
    box-shadow: none;
}

.mud-button-filled-secondary,
.mud-button-filled-default {
    background:
        linear-gradient(180deg, rgba(56, 69, 87, 0.84), rgba(33, 44, 60, 0.92)) !important;
    border-color: rgba(148, 163, 184, 0.24) !important;
    color: #dbe4ef !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(2, 6, 23, 0.22),
        0 1px 2px rgba(2, 6, 23, 0.2) !important;
}

.mud-button-filled-secondary:hover,
.mud-button-filled-default:hover,
.mud-button-filled-secondary:focus-visible,
.mud-button-filled-default:focus-visible,
.mud-button-filled-secondary:active,
.mud-button-filled-default:active {
    background:
        linear-gradient(180deg, rgba(63, 77, 96, 0.92), rgba(39, 50, 67, 0.96)) !important;
    border-color: rgba(148, 163, 184, 0.34) !important;
    color: #f8fafc !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(2, 6, 23, 0.26),
        0 2px 5px rgba(2, 6, 23, 0.26) !important;
}

.mud-button-filled-primary {
    background:
        linear-gradient(180deg, rgba(43, 54, 71, 0.98), rgba(24, 33, 46, 1)) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
    color: var(--mud-palette-primary) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(2, 6, 23, 0.24),
        0 1px 2px rgba(2, 6, 23, 0.22) !important;
}

.mud-button-filled-primary:hover {
    background:
        linear-gradient(180deg, rgba(54, 68, 88, 1), rgba(31, 42, 58, 1)) !important;
    border-color: rgba(148, 163, 184, 0.36) !important;
    color: #ff6a92 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(2, 6, 23, 0.28),
        0 2px 5px rgba(2, 6, 23, 0.28) !important;
}

.mud-button-filled-primary:focus-visible,
.mud-button-filled-primary:active {
    background:
        linear-gradient(180deg, rgba(54, 68, 88, 1), rgba(31, 42, 58, 1)) !important;
    border-color: rgba(var(--mud-palette-primary-rgb), 0.34) !important;
    color: #ff7a9e !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(2, 6, 23, 0.3),
        0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.18),
        0 0 0 4px rgba(var(--mud-palette-primary-rgb), 0.12) !important;
}

.mud-button-outlined-primary {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.5) !important;
    background: transparent !important;
    color: var(--mud-palette-primary) !important;
}

.mud-button-outlined-secondary,
.mud-button-outlined-default {
    border-color: rgba(148, 163, 184, 0.28) !important;
    background: transparent !important;
    color: var(--mud-palette-text-primary) !important;
}

.mud-button-outlined-primary:hover,
.mud-button-outlined-primary:focus-visible,
.mud-button-outlined-primary:active {
    background: rgba(var(--mud-palette-primary-rgb), 0.06) !important;
    border-color: rgba(var(--mud-palette-primary-rgb), 0.68) !important;
    color: var(--mud-palette-primary) !important;
}

.mud-button-outlined-secondary:hover,
.mud-button-outlined-default:hover,
.mud-button-outlined-secondary:focus-visible,
.mud-button-outlined-default:focus-visible,
.mud-button-outlined-secondary:active,
.mud-button-outlined-default:active {
    background: rgba(148, 163, 184, 0.06) !important;
    border-color: rgba(148, 163, 184, 0.4) !important;
    color: var(--mud-palette-text-primary) !important;
}

.mud-button-filled-primary.mud-disabled {
    opacity: 1 !important;
    background: linear-gradient(180deg, rgba(69, 80, 95, 0.82), rgba(44, 53, 66, 0.9)) !important;
    border-color: rgba(120, 135, 156, 0.18) !important;
    color: rgba(var(--mud-palette-primary-rgb), 0.38) !important;
    box-shadow: none !important;
}

.mud-button-outlined-primary.mud-disabled {
    opacity: 1 !important;
    background: transparent !important;
    border-color: rgba(var(--mud-palette-primary-rgb), 0.22) !important;
    color: rgba(var(--mud-palette-primary-rgb), 0.34) !important;
    box-shadow: none !important;
}

.mud-button-filled-secondary.mud-disabled,
.mud-button-filled-default.mud-disabled {
    opacity: 1 !important;
    background: linear-gradient(180deg, rgba(73, 83, 97, 0.8), rgba(49, 58, 71, 0.88)) !important;
    border-color: rgba(120, 135, 156, 0.16) !important;
    color: rgba(219, 228, 239, 0.38) !important;
    box-shadow: none !important;
}

.mud-button-outlined-secondary.mud-disabled,
.mud-button-outlined-default.mud-disabled {
    opacity: 1 !important;
    background: transparent !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    color: rgba(100, 116, 139, 0.46) !important;
    box-shadow: none !important;
}

.is-light-mode .mud-button-filled-secondary,
.is-light-mode .mud-button-filled-default {
    background:
        linear-gradient(180deg, rgba(237, 241, 246, 0.98), rgba(223, 230, 238, 1)) !important;
    border-color: rgba(119, 136, 156, 0.22) !important;
    color: #334155 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        inset 0 -1px 0 rgba(148, 163, 184, 0.1),
        0 1px 2px rgba(148, 163, 184, 0.16) !important;
}

.is-light-mode .mud-button-filled-secondary:hover,
.is-light-mode .mud-button-filled-default:hover,
.is-light-mode .mud-button-filled-secondary:focus-visible,
.is-light-mode .mud-button-filled-default:focus-visible,
.is-light-mode .mud-button-filled-secondary:active,
.is-light-mode .mud-button-filled-default:active {
    background:
        linear-gradient(180deg, rgba(229, 235, 243, 1), rgba(213, 222, 232, 1)) !important;
    border-color: rgba(100, 116, 139, 0.3) !important;
    color: #1f2937 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -1px 0 rgba(148, 163, 184, 0.12),
        0 2px 5px rgba(148, 163, 184, 0.18) !important;
}

.is-light-mode .mud-button-filled-primary {
    background:
        linear-gradient(180deg, rgba(232, 237, 243, 1), rgba(215, 223, 233, 1)) !important;
    border-color: rgba(97, 112, 132, 0.28) !important;
    color: var(--mud-palette-primary) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        inset 0 -1px 0 rgba(148, 163, 184, 0.12),
        0 1px 2px rgba(148, 163, 184, 0.18) !important;
}

.is-light-mode .mud-button-filled-primary:hover,
.is-light-mode .mud-button-filled-primary:focus-visible,
.is-light-mode .mud-button-filled-primary:active {
    background:
        linear-gradient(180deg, rgba(224, 231, 240, 1), rgba(206, 216, 228, 1)) !important;
    border-color: rgba(var(--mud-palette-primary-rgb), 0.34) !important;
    color: #d93466 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.86),
        inset 0 -1px 0 rgba(148, 163, 184, 0.14),
        0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.12),
        0 0 0 4px rgba(var(--mud-palette-primary-rgb), 0.08),
        0 2px 5px rgba(148, 163, 184, 0.18) !important;
}

.is-light-mode .mud-button-outlined-primary {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.42) !important;
    background: rgba(255, 255, 255, 0.55) !important;
    color: var(--mud-palette-primary) !important;
}

.is-light-mode .mud-button-outlined-primary:hover,
.is-light-mode .mud-button-outlined-primary:focus-visible,
.is-light-mode .mud-button-outlined-primary:active {
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    border-color: rgba(var(--mud-palette-primary-rgb), 0.6) !important;
    color: #d93466 !important;
}

.is-light-mode .mud-button-outlined-secondary,
.is-light-mode .mud-button-outlined-default {
    border-color: rgba(119, 136, 156, 0.24) !important;
    background: rgba(255, 255, 255, 0.48) !important;
    color: #334155 !important;
}

.is-light-mode .mud-button-outlined-secondary:hover,
.is-light-mode .mud-button-outlined-default:hover,
.is-light-mode .mud-button-outlined-secondary:focus-visible,
.is-light-mode .mud-button-outlined-default:focus-visible,
.is-light-mode .mud-button-outlined-secondary:active,
.is-light-mode .mud-button-outlined-default:active {
    background: rgba(226, 232, 240, 0.48) !important;
    border-color: rgba(100, 116, 139, 0.34) !important;
    color: #1f2937 !important;
}

.is-light-mode .mud-button-filled-primary.mud-disabled {
    background: linear-gradient(180deg, rgba(231, 236, 242, 0.92), rgba(216, 223, 231, 0.96)) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    color: rgba(var(--mud-palette-primary-rgb), 0.3) !important;
    box-shadow: none !important;
}

.is-light-mode .mud-button-filled-secondary.mud-disabled,
.is-light-mode .mud-button-filled-default.mud-disabled {
    background: linear-gradient(180deg, rgba(236, 240, 245, 0.92), rgba(223, 229, 236, 0.96)) !important;
    border-color: rgba(148, 163, 184, 0.16) !important;
    color: rgba(71, 85, 105, 0.38) !important;
    box-shadow: none !important;
}

.is-light-mode .mud-button-outlined-primary.mud-disabled {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.18) !important;
    background: rgba(255, 255, 255, 0.4) !important;
    color: rgba(var(--mud-palette-primary-rgb), 0.26) !important;
}

.is-light-mode .mud-button-outlined-secondary.mud-disabled,
.is-light-mode .mud-button-outlined-default.mud-disabled {
    border-color: rgba(148, 163, 184, 0.16) !important;
    background: rgba(255, 255, 255, 0.38) !important;
    color: rgba(100, 116, 139, 0.38) !important;
}

.mud-chip {
    border-radius: var(--brand-radius-sm);
    font-weight: 500;
    font-family: var(--brand-font-data);
    letter-spacing: 0.03em;
    box-shadow: none;
}

.mud-chip-label {
    border-radius: var(--brand-radius-sm) !important;
}

.mud-alert,
.mud-snackbar {
    border-radius: var(--brand-radius-md);
}

/* ─── Error Boundary ─── */
.brand-error-boundary {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--brand-space-4);
    padding: var(--brand-space-7) var(--brand-space-6);
    min-height: 240px;
    text-align: center;
}

.brand-error-boundary-icon {
    color: rgba(var(--mud-palette-error-rgb), 0.7);
}

.brand-error-boundary-content {
    display: flex;
    flex-direction: column;
    gap: var(--brand-space-2);
    max-width: 420px;
}

.brand-error-boundary-title {
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mud-palette-text-primary);
}

.brand-error-boundary-message {
    font-family: var(--brand-font-body);
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.5;
}

.brand-error-boundary-countdown {
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.5);
    margin-top: var(--brand-space-1);
}

.brand-error-boundary-actions {
    display: flex;
    gap: var(--brand-space-3);
    align-items: center;
    margin-top: var(--brand-space-2);
}

.mud-snackbar {
    border: 1px solid var(--brand-border);
    background: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
    box-shadow: var(--brand-shadow-float);
}

.mud-badge,
.mud-badge-content,
.mud-avatar {
    border-radius: var(--brand-radius-sm);
}

.mud-input-control > .mud-input-control-input-container > .mud-input-slot,
.mud-input > .mud-input-slot {
    border-radius: var(--brand-radius-md);
}

.mud-input-control .mud-input-slot {
    background: rgba(var(--mud-palette-surface-rgb), 0.52);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.mud-input-control.mud-input-outlined .mud-input-slot:hover,
.mud-input-control .mud-input-slot:hover {
    background: rgba(var(--mud-palette-surface-rgb), 0.62);
}

.mud-input-label,
.mud-input-helper-text,
.mud-input-slot,
.mud-select-input {
    font-family: var(--brand-font-body);
}

.mud-input-label {
    font-size: 0.74rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mud-input-control .mud-input-slot,
.mud-input-control .mud-select-input,
.mud-input-control .mud-input-adornment {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.94);
}

.mud-input-outlined-border {
    border-color: rgba(137, 158, 178, 0.12) !important;
}

.mud-input-control.mud-input-focused .mud-input-outlined-border {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.42) !important;
}

.mud-select-item,
.mud-list-item {
    min-height: 34px;
    font-size: 0.84rem;
}

.mud-switch {
    margin-inline: 0;
}

.mud-switch .mud-switch-base {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 999px !important;
}

.mud-switch .mud-switch-base:hover,
.mud-switch .mud-switch-base:focus-visible,
.mud-switch .mud-switch-base.mud-checked,
.mud-switch .mud-switch-base.mud-disabled {
    background: transparent !important;
    box-shadow: none !important;
}

.mud-switch .mud-icon-button-root,
.mud-switch .mud-switch-base.mud-icon-button-root {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 999px !important;
}

.mud-switch .mud-icon-button-root:hover,
.mud-switch .mud-icon-button-root:focus-visible,
.mud-switch .mud-switch-base.mud-icon-button-root:hover,
.mud-switch .mud-switch-base.mud-icon-button-root:focus-visible {
    background: transparent !important;
    box-shadow: none !important;
}

.mud-switch .mud-switch-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: transparent !important;
    box-shadow: none !important;
}

.mud-switch .mud-switch-track {
    border-radius: 999px;
    opacity: 1;
    background: rgba(148, 163, 184, 0.18);
    box-shadow: none;
}

.mud-switch.mud-checked .mud-switch-track {
    background: rgba(var(--mud-palette-primary-rgb), 0.34);
}

.mud-switch .mud-switch-thumb {
    box-shadow: 0 2px 6px rgba(2, 6, 23, 0.24);
}

.mud-table {
    overflow: hidden;
    border: 1px solid var(--brand-border);
    border-radius: var(--brand-radius-lg);
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.98), rgba(var(--mud-palette-surface-rgb), 0.92));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.035),
        var(--brand-shadow-card);
}

.mud-table-toolbar {
    gap: var(--brand-space-3);
    padding: var(--brand-space-3) var(--brand-space-4);
    border-bottom: 1px solid var(--brand-border);
    background: rgba(var(--mud-palette-surface-rgb), 0.95);
}

.mud-table-toolbar .mud-input-control {
    width: min(100%, 420px);
    margin: 0;
}

.mud-table-toolbar .mud-input-slot {
    min-height: 38px;
}

.mud-table-toolbar .mud-input-control-input-container {
    padding-top: 0;
}

.mud-table-container {
    overflow: hidden;
    border: 0;
    border-radius: 0;
}

.mud-table-root {
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
}

.mud-table-head {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.02);
}

.mud-table-head .mud-table-cell {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.96);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.mud-table-body .mud-table-cell {
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    padding-top: 12px;
    padding-bottom: 12px;
}

.mud-table .mud-icon-button-root {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(137, 158, 178, 0.1);
    background: rgba(var(--mud-palette-surface-rgb), 0.42);
}

.mud-table .mud-icon-button-root:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.05);
    border-color: rgba(137, 158, 178, 0.16);
}

.mud-table-hover .mud-table-row:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.03);
}

.mud-table-pagination {
    border-top: 1px solid var(--brand-border);
    background: rgba(var(--mud-palette-surface-rgb), 0.94);
}

.mud-tabs {
    border-radius: var(--brand-radius-lg);
}

.mud-tabs-toolbar {
    gap: var(--brand-space-2);
    padding: var(--brand-space-2);
    border-bottom: 1px solid var(--brand-border);
}

.mud-tab {
    min-height: 40px;
    border-radius: var(--brand-radius-sm);
    text-transform: none;
    font-weight: 600;
}

.mud-tab.mud-tab-active {
    color: var(--mud-palette-text-primary);
    background: var(--brand-selected);
}

.mud-tab-slider {
    background: var(--mud-palette-primary);
}

.brand-dashboard-topbar-shell {
    position: relative;
    padding: 6px !important;
    border: 1px solid var(--brand-border-strong) !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.96), rgba(var(--mud-palette-background-grey-rgb), 0.94)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.018),
        0 1px 3px rgba(2, 6, 23, 0.26) !important;
}

.brand-dashboard-topbar-shell::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
}

.brand-dashboard-topbar-shell::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid rgba(201, 188, 107, 0.18);
    border-right: 1px solid rgba(201, 188, 107, 0.18);
    pointer-events: none;
}

.dashboard-toolbar,
.brand-dashboard-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--brand-space-2);
    padding: 4px;
    border-radius: calc(var(--brand-radius-lg) - 2px);
    background: transparent;
    box-shadow: none;
}

.brand-dashboard-toolbar-left,
.brand-dashboard-toolbar-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.brand-dashboard-toolbar-left {
    flex: 1 1 auto;
    min-width: 0;
}

.brand-dashboard-toolbar-right {
    justify-content: flex-end;
    min-height: 40px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.brand-dashboard-toolbar-right > * + * {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid rgba(137, 158, 178, 0.14);
}

.brand-dashboard-desktop-only {
    display: block;
}

.brand-dashboard-mobile-only {
    display: none;
    width: 100%;
}

.brand-dashboard-toolbar-mobile {
    display: none;
}

.brand-dashboard-select {
    width: 220px;
    min-width: 220px;
    max-width: 220px;
}

.brand-dashboard-command-menu {
    display: block;
}

.brand-dashboard-command-anchor {
    position: relative;
}

.brand-dashboard-command-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 38px;
    padding: 0 14px !important;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.18);
    color: var(--mud-palette-text-primary);
    font-size: 0.78rem;
    text-transform: none;
    box-shadow: none;
}

.brand-dashboard-command-button:hover,
.brand-dashboard-command-button:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.055);
}

.brand-dashboard-command-button-wide {
    width: 240px;
    min-width: 240px;
    max-width: 240px;
}

.brand-dashboard-command-button-compact {
    min-width: 132px;
}

.brand-dashboard-command-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.brand-dashboard-command-meta {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-dashboard-command-popover .mud-paper {
    border-radius: var(--brand-radius-sm) !important;
}

.brand-dashboard-command-popover-surface {
    display: flex;
    flex-direction: column;
    min-width: 220px;
    padding: 4px !important;
}

.range-control-popover {
    z-index: calc(var(--mud-zindex-popover) + 3);
}

.range-control-surface {
    display: grid;
    grid-template-columns: 152px minmax(0, 1fr);
    gap: 16px;
    width: min(820px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    padding: 12px !important;
    border: 1px solid rgba(137, 158, 178, 0.14) !important;
    border-radius: var(--brand-radius-sm) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.96);
    box-shadow: none !important;
}

.range-control-presets {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-right: 16px;
    border-right: 1px solid rgba(137, 158, 178, 0.12);
}

.range-control-section-title {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem !important;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.range-control-preset-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.range-control-preset {
    min-width: 0;
    min-height: 32px;
    padding: 0 10px !important;
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-xs);
    background: transparent;
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.range-control-preset:hover,
.range-control-preset:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.06);
}

.range-control-preset.is-active,
.range-control-preset.is-active:hover,
.range-control-preset.is-active:focus-visible {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.28);
    background: rgba(var(--mud-palette-primary-rgb), 0.12);
    color: var(--mud-palette-text-primary);
}

.range-control-custom {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.range-control-range-picker {
    width: 100%;
    margin: 0 !important;
}

.range-control-range-picker .mud-input-control {
    margin-top: 0 !important;
}

.range-control-range-picker .mud-input-slot {
    min-height: 38px;
}

.range-control-range-picker .mud-input-root,
.range-control-range-picker .mud-input-root-outlined,
.range-control-range-picker .mud-input-outlined,
.range-control-range-picker .mud-input-slot {
    border-radius: var(--brand-radius-xs);
    background: rgba(var(--mud-palette-surface-rgb), 0.94);
}

.range-control-range-picker .mud-picker,
.range-control-range-picker .mud-picker-popover-paper,
.range-control-range-picker .mud-picker-inline-container,
.range-control-range-picker .mud-picker-static-container {
    width: 100%;
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-xs);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.16);
    box-shadow: none;
}

.range-control-range-picker .mud-picker-static-container,
.range-control-range-picker .mud-picker-content,
.range-control-range-picker .mud-picker-calendar {
    padding: 0;
}

.range-control-range-picker .mud-picker-calendar-container,
.range-control-range-picker .mud-picker-calendar-content,
.range-control-range-picker .mud-picker-calendar-content-1,
.range-control-range-picker .mud-picker-calendar-content-2 {
    gap: 10px;
}

.range-control-range-picker .mud-picker-toolbar {
    min-height: 48px;
    padding: 8px 10px;
    background: rgba(var(--mud-palette-background-grey-rgb), 0.28);
    border-bottom: 1px solid rgba(137, 158, 178, 0.12);
}

.range-control-range-picker .range-control-picker-toolbar,
.range-control-range-picker .mud-picker-toolbar.range-control-picker-toolbar {
    min-height: 50px;
    padding: 10px 12px;
    background: rgba(var(--mud-palette-surface-rgb), 0.96) !important;
    border-bottom: 1px solid rgba(137, 158, 178, 0.12);
    box-shadow: none !important;
}

.range-control-range-picker .range-control-picker-toolbar,
.range-control-range-picker .range-control-picker-toolbar * {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.96) !important;
}

.range-control-range-picker .range-control-picker-toolbar .mud-picker-toolbar-text,
.range-control-range-picker .range-control-picker-toolbar .mud-picker-toolbar-content,
.range-control-range-picker .range-control-picker-toolbar .mud-picker-toolbar-landscape,
.range-control-range-picker .range-control-picker-toolbar .mud-picker-toolbar-portrait {
    background: transparent !important;
    box-shadow: none !important;
}

.range-control-range-picker .mud-picker-toolbar-text,
.range-control-range-picker .range-control-picker-toolbar .mud-picker-toolbar-text {
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.range-control-range-picker .mud-picker-toolbar-text .mud-typography,
.range-control-range-picker .mud-picker-toolbar .mud-typography,
.range-control-range-picker .range-control-picker-toolbar .mud-typography,
.range-control-range-picker .range-control-picker-toolbar .mud-picker-toolbar-text .mud-typography {
    color: inherit;
    font: inherit;
    background: transparent !important;
}

.range-control-range-picker .mud-picker-calendar-header {
    min-height: 36px;
    padding: 4px 8px;
    border-bottom: 1px solid rgba(137, 158, 178, 0.1);
}

.range-control-range-picker .mud-picker-calendar-header-switch {
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.range-control-range-picker .mud-picker-nav-button-prev,
.range-control-range-picker .mud-picker-nav-button-next {
    width: 28px;
    height: 28px;
    padding: 2px;
}

.range-control-range-picker .mud-picker-month,
.range-control-range-picker .mud-picker-month-container {
    padding: 0 6px 8px;
}

.range-control-range-picker .mud-day-label {
    height: 24px;
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    letter-spacing: 0.04em;
}

.range-control-range-picker .mud-picker-calendar-week {
    margin-bottom: 2px;
}

.range-control-range-picker .mud-day {
    width: 34px;
    height: 34px;
    margin: 1px;
    font-size: 0.94rem;
    line-height: 34px;
}

.range-control-range-picker .mud-day,
.range-control-range-picker .mud-picker-calendar-header-switch {
    font-family: var(--brand-font-data);
}

.brand-dashboard-command-option {
    justify-content: flex-start !important;
    min-height: 34px;
    padding: 0 10px !important;
    border-radius: var(--brand-radius-sm);
    color: var(--mud-palette-text-primary);
    text-transform: none;
}

.brand-dashboard-command-option:hover,
.brand-dashboard-command-option:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.06);
}

.brand-dashboard-mobile-menu-trigger {
    flex: 0 0 auto;
}

.brand-dashboard-mobile-menu-trigger .mud-icon-button-root {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.18);
    color: var(--mud-palette-text-primary);
}

.brand-dashboard-mobile-menu-trigger .mud-icon-button-root:hover,
.brand-dashboard-mobile-menu-trigger .mud-icon-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.07);
}

.brand-dashboard-select-compact {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
}

.brand-dashboard-select .mud-input-control,
.brand-dashboard-rename-input .mud-input-control,
.brand-dashboard-create-input .mud-input-control,
.brand-dashboard-select-compact .mud-input-control {
    margin: 0 !important;
}

.brand-dashboard-rename-input {
    flex: 0 0 220px;
    width: 220px;
    min-width: 220px;
    max-width: 220px;
}

.brand-dashboard-select.mud-input-control,
.brand-dashboard-rename-input.mud-input-control,
.brand-dashboard-create-input.mud-input-control,
.brand-dashboard-select-compact.mud-input-control,
.brand-dashboard-select.mud-input-control-margin-dense,
.brand-dashboard-rename-input.mud-input-control-margin-dense,
.brand-dashboard-create-input.mud-input-control-margin-dense,
.brand-dashboard-select-compact.mud-input-control-margin-dense {
    margin: 0 !important;
}

.brand-dashboard-select .mud-input-control-input-container,
.brand-dashboard-rename-input .mud-input-control-input-container,
.brand-dashboard-create-input .mud-input-control-input-container,
.brand-dashboard-select-compact .mud-input-control-input-container {
    padding-top: 0;
    padding-bottom: 0;
}

.brand-dashboard-select .mud-input-slot,
.brand-dashboard-rename-input .mud-input-slot,
.brand-dashboard-create-input .mud-input-slot {
    min-height: 38px;
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.28);
}

.brand-dashboard-rename-input .mud-input-root,
.brand-dashboard-rename-input .mud-input-slot {
    overflow: hidden;
}

.brand-dashboard-rename-input input {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.brand-dashboard-nameplate {
    display: inline-flex;
    align-items: center;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.18);
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.brand-dashboard-nameplate-loading {
    justify-content: center;
}

.brand-dashboard-range-shell {
    display: flex;
    align-items: center;
    flex: 0 0 156px;
    width: 156px;
    min-width: 156px;
    max-width: 156px;
    min-height: 36px;
    padding: 0 1px;
    border: 1px solid rgba(137, 158, 178, 0.1);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.16);
    box-sizing: border-box;
    overflow: hidden;
}

.brand-dashboard-range-shell > * {
    width: 100%;
    min-width: 0;
}

.brand-dashboard-inline-actions {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 8px;
}

.brand-dashboard-inline-label {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-dashboard-mode-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 0 10px !important;
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.22);
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-dashboard-mode-button:hover,
.brand-dashboard-mode-button:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.07);
}

.brand-dashboard-mode-switch {
    margin: 0 !important;
}

.brand-dashboard-mode-switch .mud-switch-button {
    color: var(--mud-palette-text-primary);
}

.brand-dashboard-action-cluster,
.brand-dashboard-refresh-cluster {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 38px;
    padding: 0 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.brand-dashboard-action-cluster {
    padding-left: 0;
    padding-right: 0;
}

.brand-dashboard-refresh-cluster {
    gap: 8px;
    padding-left: 0;
}

.brand-dashboard-range-button {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    min-height: 32px;
    padding: 0 8px !important;
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-dashboard-range-button .mud-button-label {
    width: 100%;
    min-width: 0;
    display: block;
    overflow: hidden;
}

.brand-dashboard-range-content {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.brand-dashboard-range-label {
    flex: 1 1 auto;
    min-width: 0;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    font-variant-numeric: tabular-nums;
}

.brand-dashboard-range-icon,
.brand-dashboard-range-button .mud-icon-root {
    flex: 0 0 auto;
    margin-left: auto;
}

.brand-dashboard-action.mud-button-root,
.brand-dashboard-action.mud-icon-button-root {
    min-width: 34px;
    width: auto;
    height: 34px;
    padding: 0 10px;
    border: 0;
    border-radius: var(--brand-radius-sm);
    background: transparent;
    box-shadow: none;
}

.brand-dashboard-action.mud-button-root:hover,
.brand-dashboard-action.mud-icon-button-root:hover,
.brand-dashboard-action.mud-button-root:focus-visible,
.brand-dashboard-action.mud-icon-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.07);
}

.brand-dashboard-danger-action.mud-button-root {
    margin-left: 0;
}

.brand-dashboard-edit-switch {
    margin-left: 2px;
    margin-right: 2px;
}

.brand-dashboard-create-panel {
    max-width: 560px;
}

.brand-dashboard-create-panel .mud-stack {
    flex-wrap: wrap;
}

.brand-dashboard-grid {
    margin-top: 8px;
}

.brand-dashboard-widget-shell {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--brand-border-strong) !important;
    border-radius: var(--brand-radius-lg) !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.94)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.016),
        0 1px 3px rgba(2, 6, 23, 0.26) !important;
}

.brand-dashboard-widget-shell::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
    z-index: 0;
}

.brand-dashboard-widget-shell::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid rgba(201, 188, 107, 0.18);
    border-right: 1px solid rgba(201, 188, 107, 0.18);
    pointer-events: none;
}

.dashboard-report-shell.report-mode .brand-dashboard-widget-shell {
    border-color: #d1d5db !important;
    box-shadow: none !important;
}

.brand-dashboard-widget-title {
    position: relative;
    z-index: 1;
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.74rem !important;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-dashboard-chart-widget {
    display: flex;
    flex-direction: column;
}

.brand-dashboard-chart-frame {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.brand-dashboard-fixed-card-shell {
    display: flex;
    flex-direction: column;
    align-self: flex-start;
    height: 200px !important;
    min-height: 200px !important;
    max-height: 200px !important;
}

.brand-dashboard-fixed-card-shell > .brand-dashboard-chart-frame,
.brand-dashboard-fixed-card-shell > .brand-dashboard-kpi-card {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

.brand-dashboard-chart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 30px;
    padding: 10px 14px 4px;
    border-bottom: 1px solid rgba(137, 158, 178, 0.08);
    background: linear-gradient(180deg, rgba(var(--mud-palette-text-primary-rgb), 0.022), transparent);
}

.brand-dashboard-chart-title {
    padding-right: 38px;
    font-size: 0.7rem !important;
    letter-spacing: 0.1em;
    line-height: 1.15;
}

.brand-dashboard-chart-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    padding: 6px 16px 10px 10px;
}

.brand-dashboard-widget-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding: 10px 14px 14px;
}

.brand-dashboard-chart-stage::before {
    content: "";
    position: absolute;
    inset: 6px 16px 10px 10px;
    border: 0;
    border-radius: var(--brand-radius-sm);
    background: transparent;
    pointer-events: none;
}

.dashboard-report-shell.report-mode .brand-dashboard-chart-stage::before {
    border: 0;
    background: transparent;
}

.brand-dashboard-chart-canvas,
.brand-dashboard-chart-state {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.brand-dashboard-chart-state {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: var(--mud-palette-text-secondary);
}

.brand-dashboard-chart-state .mud-icon-root {
    opacity: 0.78;
}

.autogemba-analysis-shell,
.autogemba-detail-chart-frame {
    min-height: 0;
    height: 100%;
}

.autogemba-analysis-stage,
.autogemba-detail-chart-stage {
    padding-top: 8px;
}

.autogemba-detail-chart-stage {
    min-height: 420px;
}

.autogemba-analysis-grid {
    align-items: stretch;
}

.autogemba-analysis-column {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
    height: 100%;
}

.autogemba-analysis-label {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.autogemba-terminal-panel {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    padding: 12px 14px;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.78), rgba(var(--mud-palette-background-grey-rgb), 0.72));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.autogemba-terminal-text {
    height: 100%;
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.76rem;
    line-height: 1.52;
    white-space: pre-wrap;
    word-break: break-word;
    overflow-y: auto;
}

.autogemba-feature-chart-shell,
.autogemba-detail-chart-canvas {
    flex: 1 1 auto;
    min-height: 0;
}

.autogemba-feature-chart-shell {
    min-height: 240px;
}

.autogemba-feature-chart {
    width: 100%;
}

.brand-vhi-chart-stage {
    min-height: 320px;
}

.brand-vhi-chart-canvas {
    min-height: 320px;
}

.brand-dashboard-widget-chip {
    border-color: rgba(137, 158, 178, 0.16) !important;
    background: rgba(8, 15, 24, 0.68) !important;
    color: var(--mud-palette-text-primary) !important;
    font-family: var(--brand-font-data);
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.brand-vhi-score-chip {
    border-color: rgba(137, 158, 178, 0.22) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.94) !important;
    color: var(--mud-palette-text-primary) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 1px 3px rgba(8, 15, 24, 0.14);
}

.brand-model-detail-shell {
    display: flex;
    flex-direction: column;
}

.brand-model-detail-hero {
    overflow: hidden;
}

.brand-model-detail-hero-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px 20px 20px;
}

.brand-model-detail-kicker,
.brand-model-detail-stat-label,
.brand-model-detail-meta-label {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem !important;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-model-detail-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.brand-model-detail-title {
    margin: 0;
    color: var(--mud-palette-text-primary);
    font-size: clamp(1.8rem, 3vw, 2.4rem) !important;
    line-height: 1.02;
}

.brand-model-detail-rename.mud-icon-button-root {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-xs);
    color: var(--mud-palette-text-secondary);
}

.brand-model-detail-device {
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.9rem !important;
    letter-spacing: 0.03em;
}

.brand-model-detail-chip-row,
.brand-model-detail-chip-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.brand-model-detail-chip {
    border-color: rgba(137, 158, 178, 0.16) !important;
    background: rgba(var(--mud-palette-background-grey-rgb), 0.24) !important;
    color: var(--mud-palette-text-primary) !important;
    font-family: var(--brand-font-data);
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.brand-model-detail-stat-grid {
    align-items: stretch;
}

.brand-model-detail-stat-card {
    height: 100%;
}

.brand-model-detail-stat-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 116px;
    padding: 14px 16px 16px;
}

.brand-model-detail-stat-value {
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data) !important;
    font-size: clamp(1.4rem, 2vw, 2rem) !important;
    font-weight: 700 !important;
    letter-spacing: -0.04em;
    line-height: 0.95;
}

.brand-model-detail-stat-value.is-healthy {
    color: #2f8f60;
}

.brand-model-detail-stat-value.is-caution {
    color: #8a762f;
}

.brand-model-detail-stat-value.is-critical {
    color: #c53b55;
}

.brand-model-detail-stat-meta {
    margin-top: auto;
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-body);
    font-size: 0.74rem !important;
    letter-spacing: 0.008em;
    line-height: 1.35;
    text-transform: none;
}

.brand-model-detail-secondary-grid,
.brand-model-detail-utility-grid {
    align-items: flex-start;
}

.brand-model-detail-utility-item {
    display: flex;
}

.brand-model-detail-secondary-chart,
.brand-model-detail-metadata-shell,
.brand-model-detail-measures-shell {
    width: 100%;
    height: auto;
}

.brand-model-detail-forecast-stage {
    min-height: 340px;
}

.brand-model-detail-training-stage {
    min-height: 240px;
}

.brand-model-detail-metadata-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 14px 16px 16px;
}

.brand-model-detail-measures-body {
    max-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    padding-right: 10px;
}

.brand-model-detail-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px 16px;
}

.brand-model-detail-meta-block,
.brand-model-detail-meta-section {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.brand-model-detail-meta-value {
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.8rem !important;
    line-height: 1.45;
}

.brand-model-detail-meta-section {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--brand-border);
}

.brand-model-detail-window-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.brand-model-detail-window-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.brand-model-detail-window-icon {
    color: var(--mud-palette-text-secondary);
    flex: 0 0 auto;
    opacity: 0.7;
}

.brand-dashboard-widget-table {
    position: relative;
    z-index: 1;
}

.brand-dashboard-widget-table thead th,
.brand-dashboard-table-widget .mud-table-head-cell,
.brand-dashboard-table-widget .mud-table-sort-label {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.96);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-dashboard-widget-table tbody td {
    font-family: var(--brand-font-body);
    font-size: 0.76rem;
}

.brand-dashboard-progress-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 18px;
}

.brand-dashboard-progress-stage,
.brand-dashboard-liquid-stage {
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 12px 16px 16px;
    overflow: hidden;
}

.brand-dashboard-progress-layout,
.brand-dashboard-liquid-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: stretch;
    column-gap: 12px;
    width: min(100%, 312px);
    height: 100%;
    max-width: 100%;
}

.brand-dashboard-progress-ring {
    position: relative;
    width: auto;
    height: min(100%, 220px);
    max-width: 100%;
    aspect-ratio: 1;
    align-self: center;
    justify-self: center;
}

.brand-dashboard-progress-circle.mud-progress-circular {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
}

.brand-dashboard-progress-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding: 0 18px;
    text-align: center;
}

.brand-dashboard-progress-value {
    font-family: var(--brand-font-data) !important;
    font-weight: 600 !important;
    letter-spacing: -0.04em;
}

.brand-dashboard-progress-track.mud-progress-circular {
    opacity: 0.16;
}

.brand-dashboard-liquid-box {
    position: relative;
    width: 100%;
    max-width: 252px;
    aspect-ratio: 1.14;
    margin-block: 8px;
    justify-self: center;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.12);
    border-radius: var(--brand-radius-lg);
    background: rgba(var(--mud-palette-surface-rgb), 0.42);
    overflow: hidden;
}

.brand-dashboard-liquid {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    transition: height 1s ease-in-out;
    z-index: 1;
}

.brand-dashboard-liquid-wave {
    position: absolute;
    left: -25%;
    width: 150%;
    height: 8px;
    border-radius: 50%;
    opacity: 0.56;
    animation: brand-dashboard-wave 3s ease-in-out infinite alternate;
    z-index: 2;
}

@keyframes brand-dashboard-wave {
    0% { transform: translateX(-10px); }
    100% { transform: translateX(10px); }
}

.brand-dashboard-liquid-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding: 0 18px;
    text-align: center;
    z-index: 3;
}

.brand-dashboard-liquid-value {
    font-family: var(--brand-font-data) !important;
    font-weight: 600 !important;
    letter-spacing: -0.04em;
}

.brand-dashboard-progress-range,
.brand-dashboard-liquid-range {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: stretch;
    padding: 6px 0;
    border-left: 1px solid rgba(137, 158, 178, 0.12);
}

.brand-dashboard-range-value {
    display: block;
    padding-left: 10px;
    color: var(--mud-palette-text-secondary) !important;
    font-family: var(--brand-font-data);
    font-size: 0.72rem !important;
    letter-spacing: 0.08em;
}

.brand-dashboard-table-stage {
    padding: 8px 14px 14px;
}

.brand-dashboard-table-title {
    min-width: 0;
    padding-right: 0;
}

.brand-dashboard-table-download.mud-icon-button-root {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 0;
}

.brand-dashboard-table-progress-shell {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 10px;
}

.brand-dashboard-table-progress-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.brand-dashboard-table-progress-label,
.brand-dashboard-table-progress-value {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.66rem !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-dashboard-table-progress-value {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.9);
}

.brand-dashboard-table-progress.mud-progress-linear {
    height: 3px;
    border-radius: 999px;
    background: rgba(137, 158, 178, 0.12);
}

.brand-dashboard-table-loading {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 4px;
}

.brand-dashboard-table-skeleton-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 88px;
    gap: 12px;
    align-items: center;
    min-height: 30px;
}

.brand-dashboard-table-skeleton-cell {
    display: block;
    width: 100%;
    height: 11px;
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        rgba(var(--mud-palette-text-primary-rgb), 0.08),
        rgba(var(--mud-palette-text-primary-rgb), 0.16),
        rgba(var(--mud-palette-text-primary-rgb), 0.08)
    );
    background-size: 200% 100%;
    animation: brand-dashboard-table-shimmer 1.35s linear infinite;
}

.brand-dashboard-table-skeleton-cell-wide {
    width: 82%;
}

.brand-dashboard-table-viewport {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.brand-dashboard-table-widget .brand-dashboard-widget-table {
    width: 100%;
}

.brand-dashboard-table-grid .mud-table-cell,
.brand-dashboard-table-grid .mud-table-head-cell,
.brand-dashboard-table-grid .mud-table-sort-label,
.brand-dashboard-table-grid .mud-input-slot,
.brand-dashboard-table-grid table th,
.brand-dashboard-table-grid table td {
    white-space: nowrap;
}

.brand-dashboard-table-grid .mud-table-cell,
.brand-dashboard-table-grid .mud-table-head-cell,
.brand-dashboard-table-grid table th,
.brand-dashboard-table-grid table td {
    padding-top: 8px;
    padding-bottom: 8px;
    vertical-align: middle;
}

.brand-dashboard-table-grid .mud-table-head-cell,
.brand-dashboard-table-grid table thead th {
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 1.1;
}

.brand-dashboard-table-widget .mud-table-root,
.brand-dashboard-table-widget .mud-table-container,
.brand-dashboard-table-widget .mud-table,
.brand-dashboard-table-widget .mud-data-grid,
.brand-dashboard-table-widget table {
    background: transparent !important;
}

.brand-dashboard-table-widget .brand-dashboard-widget-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: rgba(var(--mud-palette-surface-rgb), 0.96);
}

.brand-dashboard-table-widget .mud-table-head .mud-table-row,
.brand-dashboard-table-widget .mud-table-head-cell,
.brand-dashboard-table-widget .mud-table-head th,
.brand-dashboard-table-widget .brand-dashboard-widget-table thead th {
    box-shadow: inset 0 -1px 0 rgba(137, 158, 178, 0.1);
}

.brand-dashboard-table-widget .mud-table-body .mud-table-row,
.brand-dashboard-table-widget .mud-table-body .mud-table-row:hover,
.brand-dashboard-table-widget .brand-dashboard-widget-table tbody tr,
.brand-dashboard-table-widget .brand-dashboard-widget-table tbody tr:hover {
    background: transparent;
}

.brand-dashboard-table-widget .mud-table-row:hover .mud-table-cell,
.brand-dashboard-table-widget .brand-dashboard-widget-table tbody tr:hover td {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.035);
}

.brand-dashboard-table-widget .mud-table-cell,
.brand-dashboard-table-widget .brand-dashboard-widget-table tbody td {
    border-bottom: 1px solid rgba(137, 158, 178, 0.08);
}

.brand-dashboard-table-widget .mud-table-head-cell:first-child,
.brand-dashboard-table-widget .mud-table-cell:first-child,
.brand-dashboard-table-widget .brand-dashboard-widget-table thead th:first-child,
.brand-dashboard-table-widget .brand-dashboard-widget-table tbody td:first-child {
    padding-left: 10px;
}

.brand-dashboard-table-widget .mud-table-head-cell:last-child,
.brand-dashboard-table-widget .mud-table-cell:last-child,
.brand-dashboard-table-widget .brand-dashboard-widget-table thead th:last-child,
.brand-dashboard-table-widget .brand-dashboard-widget-table tbody td:last-child {
    padding-right: 10px;
}

.brand-dashboard-table-widget .mud-table-pagination-toolbar {
    min-height: 38px !important;
    padding: 6px 4px 0 !important;
    border-top: 1px solid rgba(137, 158, 178, 0.08);
    background: transparent;
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
}

.brand-dashboard-table-widget .mud-table-pagination-toolbar .mud-input-slot {
    min-height: 28px;
}

.brand-dashboard-table-widget .mud-table-pagination-actions .mud-icon-button-root {
    width: 30px;
    height: 30px;
}

@keyframes brand-dashboard-table-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.brand-dashboard-energy-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 14px 18px 18px;
    min-height: 0;
}

.brand-dashboard-energy-value {
    font-family: var(--brand-font-data) !important;
    font-size: 2rem !important;
    font-weight: 600 !important;
    letter-spacing: -0.04em;
    line-height: 1;
}

.brand-dashboard-energy-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.brand-dashboard-energy-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 10px;
    border-radius: var(--brand-radius-sm);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #ffffff;
}

.brand-dashboard-energy-score,
.brand-dashboard-energy-caption {
    color: var(--mud-palette-text-secondary);
}

.brand-dashboard-energy-score {
    font-family: var(--brand-font-data);
    font-size: 0.76rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.brand-dashboard-map-stage {
    padding: 0;
    position: relative;
}

.brand-dashboard-map-canvas {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
}

/* Map widget legend — a compact HUD chip explaining the excursion painting +
   geofence markers. Sits over the map, bottom-left, above the canvas. */
.brand-map-legend {
    position: absolute;
    left: 10px;
    bottom: 10px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 10px;
    max-width: 72%;
    background: rgba(8, 15, 24, 0.72);
    border: 1px solid var(--brand-border-strong);
    border-radius: var(--brand-radius-md);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    pointer-events: none;
}

.brand-map-legend-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.brand-map-legend-swatch {
    flex: 0 0 auto;
}

.brand-map-legend-swatch--excursion {
    width: 16px;
    height: 4px;
    border-radius: 2px;
    background: #f43f5e;
}

.brand-map-legend-swatch--geofence {
    width: 11px;
    height: 11px;
    border-radius: var(--brand-radius-pill);
    background: rgba(245, 158, 11, 0.95);
    border: 1px solid rgba(8, 15, 24, 0.6);
}

.brand-map-legend-label {
    font-family: var(--brand-font-data);
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.3;
    color: rgba(226, 232, 240, 0.9);
}

.brand-dashboard-kpi-card {
    min-height: 0;
    height: 100%;
}

.brand-dashboard-add-card {
    border-style: dashed !important;
    border-color: rgba(var(--mud-palette-primary-rgb), 0.22) !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-primary-rgb), 0.04), rgba(var(--mud-palette-surface-rgb), 0.88)) !important;
}

.brand-widget-edit-toolbar {
    position: absolute;
    left: 12px;
    top: 12px;
    z-index: 3;
}

.brand-widget-edit-toolbar-surface {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px !important;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.1) !important;
    border-radius: var(--brand-radius-sm) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.94) !important;
    box-shadow: 0 4px 12px rgba(2, 6, 23, 0.24) !important;
    backdrop-filter: blur(10px);
}

.brand-widget-edit-toolbar-button.mud-icon-button-root {
    width: 30px;
    height: 30px;
    border-radius: 2px;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.76);
}

.brand-widget-edit-toolbar-button.mud-icon-button-root:hover,
.brand-widget-edit-toolbar-button.mud-icon-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.06);
}

.brand-drawer .airgemba-nav {
    font-family: var(--brand-font-body) !important;
}

.brand-drawer .airgemba-nav {
    gap: 1px;
    padding: 0;
}

.brand-drawer .airgemba-nav-link,
.brand-drawer .airgemba-nav-group-toggle {
    position: relative;
    min-height: 34px;
    padding: 6px 8px 6px 10px;
    border: 0;
    border-radius: var(--brand-radius-sm);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.84);
    transition:
        color 0.16s ease,
        background-color 0.16s ease;
}

.brand-drawer .airgemba-nav-link:hover,
.brand-drawer .airgemba-nav-link:focus-visible,
.brand-drawer .airgemba-nav-group-toggle:hover,
.brand-drawer .airgemba-nav-group-toggle:focus-visible {
    color: var(--mud-palette-text-primary);
    background: rgba(var(--mud-palette-text-primary-rgb), 0.05);
}

.brand-drawer .airgemba-nav-link.active {
    color: var(--mud-palette-text-primary);
    background: linear-gradient(90deg, rgba(var(--mud-palette-primary-rgb), 0.14), rgba(var(--mud-palette-primary-rgb), 0.06) 22%, rgba(var(--mud-palette-text-primary-rgb), 0.035) 100%);
}

.brand-drawer .airgemba-nav-link.active::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 7px;
    bottom: 7px;
    width: 2px;
    border-radius: var(--brand-radius-pill);
    background: linear-gradient(180deg, rgba(201, 188, 107, 0.88), var(--mud-palette-primary));
}

.brand-drawer .airgemba-nav-link.active .airgemba-nav-icon,
.brand-drawer .airgemba-nav-link.active .airgemba-nav-chevron {
    color: var(--mud-palette-primary) !important;
}

.brand-drawer .airgemba-nav-badge {
    display: block;
}

.brand-drawer .airgemba-nav-badge .mud-badge-root {
    top: 4px;
    right: 8px;
}

.brand-drawer .airgemba-nav-chevron {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.68);
}

.brand-drawer .airgemba-nav-children {
    margin: 1px 0 2px 11px;
    padding-left: 8px;
    gap: 1px;
}

.brand-drawer .airgemba-nav-children::before {
    background: linear-gradient(
        180deg,
        rgba(var(--mud-palette-text-primary-rgb), 0) 0%,
        rgba(var(--mud-palette-text-primary-rgb), 0.14) 12%,
        rgba(var(--mud-palette-text-primary-rgb), 0.14) 88%,
        rgba(var(--mud-palette-text-primary-rgb), 0) 100%
    );
}

.brand-drawer .airgemba-nav-label {
    font-size: 0.84rem;
    font-weight: 500;
    letter-spacing: 0.015em;
}

.brand-drawer .mud-divider {
    margin: 8px 0;
}

.brand-account-frame {
    padding-left: var(--brand-space-4) !important;
    padding-right: var(--brand-space-4) !important;
}

.brand-account-logo {
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
}

.brand-account-card,
.brand-manage-card,
.brand-manage-nav {
    backdrop-filter: blur(10px);
}

.brand-account-card {
    width: 100%;
    max-width: 560px;
    border-radius: var(--brand-radius-lg) !important;
}

.brand-account-caption {
    color: var(--mud-palette-text-secondary) !important;
}

.brand-manage-container {
    padding-top: var(--brand-space-5) !important;
}

.brand-manage-nav .mud-paper {
    border-radius: var(--brand-radius-lg);
}

.brand-manage-nav .mud-nav-link {
    margin-bottom: var(--brand-space-1);
    border-radius: var(--brand-radius-sm);
}

.brand-manage-nav .mud-nav-link:hover {
    background: var(--brand-hover);
}

.brand-manage-nav .mud-nav-link.active {
    color: var(--mud-palette-text-primary);
    background: rgba(var(--mud-palette-text-primary-rgb), 0.045);
    border-left: 3px solid var(--mud-palette-primary);
}

.brand-home-grid {
    gap: 18px !important;
    align-items: flex-start !important;
}

.brand-page-header {
    align-items: end !important;
    gap: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(137, 158, 178, 0.08);
}

.brand-page-title {
    letter-spacing: -0.04em;
    font-weight: 500 !important;
}

.brand-settings-page {
    padding-bottom: 24px;
}

.brand-settings-page .settings-section {
    margin-top: 28px !important;
}

.brand-settings-page .settings-section-title {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.76rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.settings-content-panel {
    min-height: 100%;
}

.settings-content-panel > .mud-stack,
.settings-content-panel > .mud-grid,
.settings-content-panel > .mud-textfield,
.settings-content-panel > .mud-select {
    position: relative;
    z-index: 1;
}

.settings-content-panel .settings-row {
    border: 1px solid rgba(137, 158, 178, 0.1);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.26);
}

.settings-content-panel .mud-button-root {
    align-self: flex-start;
}

.settings-logo-frame {
    border: 0;
    box-shadow: none;
    background: #ffffff;
}

.brand-config-dialog .mud-dialog-content {
    padding-top: 0;
}

.brand-config-dialog .mud-dialog-title {
    padding: 14px 18px 10px;
    border-bottom: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
}

.brand-config-dialog .mud-dialog-actions {
    padding: 12px 18px 16px;
    border-top: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
    background: rgba(var(--mud-palette-surface-rgb), 0.38);
}

.brand-config-tabs {
    border: 0;
    border-radius: 0;
    overflow: visible;
    background: transparent;
}

.brand-config-tabs .mud-tabs-toolbar {
    padding: 8px 14px 0;
    background: transparent;
    border-bottom: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
}

.brand-config-tabs .mud-tabs-panels {
    background: transparent;
}

.brand-config-tabs .mud-tab {
    min-height: 36px;
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.brand-config-panel {
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.66) !important;
    box-shadow: none !important;
}

.brand-config-subpanel {
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.48) !important;
    box-shadow: none !important;
}

.brand-config-section-title {
    font-family: var(--brand-font-data);
    font-size: 0.76rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-inline-builder {
    border: 1px dashed rgba(var(--mud-palette-text-primary-rgb), 0.12) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.5) !important;
    box-shadow: none !important;
}

.brand-inline-builder .mud-stack-row {
    flex-wrap: wrap;
    align-items: flex-end !important;
}

.brand-inline-builder .mud-stack-row > * {
    flex: 1 1 180px;
    min-width: 0 !important;
}

.brand-inline-builder .mud-stack-row > .mud-icon-button-root {
    flex: 0 0 auto;
}

.brand-config-panel .mud-table-root,
.brand-config-subpanel .mud-table-root,
.brand-config-panel .mud-table-container,
.brand-config-subpanel .mud-table-container {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.brand-config-panel .mud-table-head,
.brand-config-subpanel .mud-table-head {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.03);
}

.brand-config-panel .mud-alert,
.brand-config-subpanel .mud-alert {
    box-shadow: none !important;
}

.brand-config-swatch {
    width: 30px;
    height: 20px;
    border-radius: var(--brand-radius-sm);
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.12);
}

.brand-ops-panel {
    position: relative;
    padding: 10px !important;
    border: 1px solid var(--brand-border-strong) !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.94)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.016),
        0 1px 3px rgba(2, 6, 23, 0.26) !important;
}

.brand-ops-panel::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
}

.brand-ops-panel::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid rgba(201, 188, 107, 0.18);
    border-right: 1px solid rgba(201, 188, 107, 0.18);
    pointer-events: none;
}

.brand-table-host {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.brand-table-host::before,
.brand-table-host::after {
    display: none !important;
}

.brand-device-page {
    display: flex;
    flex-direction: column;
    gap: 28px;
    margin-block: 20px 32px;
}

.brand-device-header .mud-button-root {
    min-width: 0;
}

.brand-device-header-action.mud-icon-button-root,
.brand-audit-export-action.mud-icon-button-root,
.brand-audit-export-menu .mud-button-root {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.44);
}

.brand-device-header-action.mud-icon-button-root:hover,
.brand-device-header-action.mud-icon-button-root:focus-visible,
.brand-audit-export-action.mud-icon-button-root:hover,
.brand-audit-export-action.mud-icon-button-root:focus-visible,
.brand-audit-export-menu .mud-button-root:hover,
.brand-audit-export-menu .mud-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.05);
    border-color: rgba(137, 158, 178, 0.18);
}

.brand-device-section {
    margin: 0;
}

.brand-device-section-last {
    margin-bottom: 0;
}

.brand-device-section-row {
    display: grid;
    grid-template-columns: minmax(136px, 168px) minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.brand-device-section-aside {
    padding-top: 10px;
}

.brand-device-section-title {
    margin: 0;
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.96);
    font-family: var(--brand-font-data);
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.brand-device-section-body {
    min-width: 0;
}

.brand-device-panel {
    padding: 10px !important;
}

.brand-device-filter-panel {
    margin-bottom: 14px;
    padding: 14px 16px 12px !important;
}

.brand-device-filter-grid {
    display: grid;
    grid-template-columns: minmax(240px, 1.35fr) minmax(170px, 0.78fr) minmax(170px, 0.78fr) minmax(170px, 0.78fr) auto;
    gap: 14px;
    align-items: end;
}

.brand-device-filter-search,
.brand-device-filter-select {
    min-width: 0;
}

.brand-device-filter-search .mud-input-control,
.brand-device-filter-select .mud-input-control {
    margin-top: 0 !important;
}

.brand-device-filter-actions {
    display: flex;
    align-items: end;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.brand-device-filter-direction {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.14) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.44) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.74) !important;
}

.brand-device-filter-direction:hover,
.brand-device-filter-direction:focus-visible {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.32) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.9) !important;
}

.brand-device-filter-reset {
    min-height: 42px;
    padding-inline: 14px !important;
    border-color: rgba(var(--mud-palette-text-primary-rgb), 0.14) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.44) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.74) !important;
}

.brand-device-filter-reset:hover,
.brand-device-filter-reset:focus-visible {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.32) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.9) !important;
}

.brand-device-filter-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
}

.brand-device-filter-chip {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.22) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.82) !important;
}

.brand-device-name-cell {
    font-weight: 600;
}

.brand-device-tech-chip {
    border-color: rgba(81, 160, 255, 0.2) !important;
    background: rgba(81, 160, 255, 0.06) !important;
    color: rgba(81, 160, 255, 0.95) !important;
}

.brand-device-uplink-text,
.brand-device-detail-value {
    font-family: var(--brand-font-data);
    letter-spacing: 0.03em;
}

.brand-device-muted-value {
    color: var(--mud-palette-text-secondary);
}

.brand-device-row-action {
    margin-left: auto;
}

.brand-device-group-panel {
    padding: 12px !important;
}

.brand-device-group-chipset {
    gap: 8px;
}

.brand-device-group-create {
    flex-wrap: wrap;
    align-items: end;
}

.brand-device-group-name {
    width: min(100%, 220px);
}

.brand-device-group-color {
    width: min(100%, 168px);
}

.brand-device-empty-note {
    padding: 4px 2px;
}

.brand-device-drawer-body {
    padding: 0;
}

.brand-device-drawer-topbar {
    min-height: 36px;
}

.brand-device-drawer-hero {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 2px;
}

.brand-device-drawer-title {
    margin: 0;
}

.brand-device-drawer-id {
    font-family: var(--brand-font-data);
    letter-spacing: 0.08em;
    word-break: break-all;
}

.brand-device-drawer-meta {
    margin-top: 2px;
}

.brand-device-drawer-section-label {
    margin-bottom: 10px;
}

.brand-device-detail-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.brand-device-detail-row {
    display: grid;
    gap: 6px;
    padding: 10px 12px;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-md);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.16);
}

.brand-device-detail-label {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.94);
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-device-detail-value {
    justify-content: flex-start;
    min-height: 0;
    padding: 0 !important;
    color: var(--mud-palette-text-primary) !important;
    font-size: 0.92rem;
    text-transform: none;
}

.brand-device-detail-editable {
    align-self: start;
    padding: 7px 10px !important;
    border: 1px solid rgba(137, 158, 178, 0.12) !important;
    border-radius: var(--brand-radius-sm) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.5) !important;
}

.brand-device-detail-editable:hover,
.brand-device-detail-editable:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.055) !important;
}

.brand-device-detail-editor {
    flex-wrap: nowrap;
}

.brand-device-detail-input {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 220px;
}

.brand-device-detail-input .mud-input-control {
    margin-top: 0 !important;
}

.brand-device-detail-add-row {
    margin-top: 12px;
    align-items: end;
}

.brand-device-offset-select {
    flex: 1 1 auto;
    min-width: 0;
}

.brand-device-empty-alert {
    margin-bottom: 0 !important;
}

.brand-device-drawer-loader {
    margin-top: 12px;
}

.brand-rules-page {
    display: flex;
    flex-direction: column;
    gap: 28px;
    margin-block: 20px 32px;
}

.brand-rules-section {
    margin: 0;
}

.brand-rules-section-last {
    margin-bottom: 0;
}

.brand-rules-section-row {
    display: grid;
    grid-template-columns: minmax(136px, 168px) minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.brand-rules-section-aside {
    padding-top: 10px;
}

.brand-rules-section-title {
    margin: 0;
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.96);
    font-family: var(--brand-font-data);
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.brand-rules-section-body {
    min-width: 0;
}

.brand-rules-panel {
    padding: 10px !important;
}

.brand-rules-section-meta {
    display: block;
    margin-top: 6px;
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.78);
}

.brand-rules-filter-panel {
    margin-bottom: 14px;
    padding: 14px 16px 12px !important;
}

.brand-rules-filter-grid {
    display: grid;
    grid-template-columns: minmax(240px, 1.3fr) minmax(220px, 1fr) minmax(160px, 0.78fr) minmax(160px, 0.78fr) minmax(150px, 0.72fr) auto;
    gap: 14px;
    align-items: end;
}

.brand-rules-filter-search,
.brand-rules-filter-select {
    min-width: 0;
}

.brand-rules-filter-search .mud-input-control,
.brand-rules-filter-select .mud-input-control {
    margin-top: 0 !important;
}

.brand-rules-filter-actions {
    display: flex;
    align-items: end;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.brand-rules-filter-direction {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.14) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.44) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.74) !important;
}

.brand-rules-filter-direction:hover,
.brand-rules-filter-direction:focus-visible {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.32) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.9) !important;
}

.brand-rules-filter-reset {
    min-height: 42px;
    padding-inline: 14px !important;
    border-color: rgba(var(--mud-palette-text-primary-rgb), 0.14) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.44) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.74) !important;
}

.brand-rules-filter-reset:hover,
.brand-rules-filter-reset:focus-visible {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.32) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.9) !important;
}

.brand-rules-filter-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
}

.brand-rules-filter-chip {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.22) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.82) !important;
}

.brand-rules-page-size {
    min-width: 78px;
}

.brand-rules-table-host .mud-table {
    background: transparent;
    box-shadow: none;
}

.brand-rules-source-name {
    font-weight: 600;
}

.brand-rules-description {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.88);
}

.brand-rules-status-chip.is-active {
    border-color: rgba(34, 197, 94, 0.22) !important;
    background: rgba(34, 197, 94, 0.08) !important;
    color: #22c55e !important;
}

.brand-rules-status-chip.is-triggered {
    border-color: rgba(239, 68, 68, 0.2) !important;
    background: rgba(239, 68, 68, 0.06) !important;
    color: #ef4444 !important;
}

.brand-rules-status-chip.is-disabled {
    border-color: rgba(148, 163, 184, 0.28) !important;
    background: rgba(148, 163, 184, 0.09) !important;
    color: #94a3b8 !important;
}

/* Edge_Gateway / AI-vision status chips — same subtle outlined language as the
   rules status chips (tinted border + fill + text, no filled MudBlazor colour),
   with the amber "warning" and info states the gateway liveness model needs. */
.brand-edge-status-chip.is-active {
    border-color: rgba(34, 197, 94, 0.22) !important;
    background: rgba(34, 197, 94, 0.08) !important;
    color: #22c55e !important;
}

.brand-edge-status-chip.is-warning,
.brand-edge-status-chip.is-legacy {
    border-color: rgba(245, 158, 11, 0.26) !important;
    background: rgba(245, 158, 11, 0.09) !important;
    color: #f59e0b !important;
}

.brand-edge-status-chip.is-critical {
    border-color: rgba(239, 68, 68, 0.2) !important;
    background: rgba(239, 68, 68, 0.06) !important;
    color: #ef4444 !important;
}

.brand-edge-status-chip.is-neutral {
    border-color: rgba(148, 163, 184, 0.28) !important;
    background: rgba(148, 163, 184, 0.09) !important;
    color: #94a3b8 !important;
}

.brand-edge-status-chip.is-info {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.22) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.82) !important;
}

.brand-rules-channel-chip,
.brand-rules-measure-chip {
    align-self: start;
}

.brand-rules-row-actions {
    justify-content: flex-start;
}

.brand-rules-source-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.brand-rules-source-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 164px;
    padding: 12px !important;
}

.brand-rules-source-kicker {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.94);
    font-family: var(--brand-font-data);
    font-size: 0.72rem !important;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-rules-source-help {
    color: var(--mud-palette-text-secondary);
    min-height: 20px;
}

.brand-rules-source-card .mud-input-control {
    margin-top: auto;
}

.brand-rules-events-host {
    padding: 10px !important;
}

.brand-rules-events-host .mud-table {
    background: transparent;
    box-shadow: none;
}

.brand-rules-events-toolbar {
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    min-height: 40px;
}

.brand-rules-events-toolbar-basic {
    display: flex;
    justify-content: flex-end;
}

.brand-rules-range-anchor {
    min-width: 0;
}

.brand-rules-range-button {
    min-height: 36px;
    padding-inline: 12px !important;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.42) !important;
}

.brand-rules-events-filter {
    min-width: 200px;
}

.brand-rules-events-export-button {
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.42);
}

.brand-rules-events-export-menu .mud-button-root {
    min-width: 0;
}

.brand-rules-drawer .mud-drawer-content {
    padding: 16px 14px 18px;
}

.brand-rules-drawer-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    min-height: 0;
    padding: 0;
}

.brand-rules-drawer-topbar {
    min-height: 36px;
}

.brand-rules-drawer-hero {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.brand-rules-drawer-title {
    margin: 0;
}

.brand-rules-drawer-id {
    font-family: var(--brand-font-data);
    letter-spacing: 0.08em;
    word-break: break-all;
}

.brand-rules-drawer-meta {
    margin-top: 2px;
}

.brand-rules-channel-detail {
    margin-top: 8px;
    margin-bottom: 12px;
}

.brand-rules-drawer-section-label {
    margin-bottom: 0;
}

.brand-rules-drawer-select {
    min-width: 0;
    max-width: none;
}

.brand-rules-drawer-input {
    min-width: 0;
}

.brand-rules-drawer-condition-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid rgba(137, 158, 178, 0.1);
    border-radius: var(--brand-radius-md);
    background: rgba(var(--mud-palette-surface-rgb), 0.38);
    margin-top: 8px;
}

.brand-rules-drawer-condition-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.brand-rules-drawer-inline-actions {
    align-items: center;
}

.brand-rules-drawer-condition-editor {
    display: grid;
    grid-template-columns: minmax(80px, 96px) minmax(0, 1fr);
    gap: 6px;
    align-items: center;
}

.brand-rules-drawer-select .mud-input-control,
.brand-rules-drawer-input .mud-input-control,
.brand-rules-drawer-select.mud-input-control,
.brand-rules-drawer-input.mud-input-control,
.brand-rules-drawer-select.mud-input-control-margin-dense,
.brand-rules-drawer-input.mud-input-control-margin-dense {
    margin: 0 !important;
}

.brand-rules-drawer-select .mud-input-control-input-container,
.brand-rules-drawer-input .mud-input-control-input-container {
    padding-top: 0;
    padding-bottom: 0;
}

.brand-rules-drawer-select .mud-input-control,
.brand-rules-drawer-input .mud-input-control {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.brand-rules-drawer-select .mud-input-slot,
.brand-rules-drawer-input .mud-input-slot {
    min-height: 36px;
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.24);
}

.brand-rules-drawer-select .mud-select-input,
.brand-rules-drawer-input .mud-input-input {
    padding-top: 7px;
    padding-bottom: 7px;
}

.brand-rules-drawer-condition-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.brand-rules-drawer-summary-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 10px;
    border: 1px solid rgba(137, 158, 178, 0.08);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.34);
}

.brand-rules-drawer-summary-label {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.88);
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-rules-drawer-summary-value {
    justify-content: flex-start;
    align-self: start;
    min-height: 25px !important;
    min-width: 0;
    padding: 0 !important;
    color: var(--mud-palette-text-primary) !important;
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
}

/* Geofence zone — 2-column equal-width grid of click-to-edit tiles. */
.brand-rules-drawer-geofence-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.brand-rules-drawer-geo-tile {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid rgba(137, 158, 178, 0.08);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.34);
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}

.brand-rules-drawer-geo-tile:hover {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.32);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.5);
}

.brand-rules-drawer-geo-value {
    min-height: 25px;
    color: var(--mud-palette-text-primary);
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Inputs inside a tile fill the tile width so the grid columns stay even. */
.brand-rules-drawer-geo-input {
    width: 100%;
    margin: 0;
}

.brand-rules-dialog .mud-card {
    border: 1px solid rgba(137, 158, 178, 0.11);
    border-radius: var(--brand-radius-md);
    background: rgba(var(--mud-palette-surface-rgb), 0.52);
    box-shadow: none;
}

.brand-rules-dialog .mud-card .mud-typography-subtitle1 {
    display: flex;
    align-items: center;
    gap: 8px;
}

.brand-rules-dialog-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.brand-rules-dialog-select .mud-input-control {
    margin-top: 0;
}

.brand-rules-dialog-toggle-row {
    min-height: 36px;
}

.brand-rules-dialog-toggle {
    gap: 8px !important;
}

.brand-rules-dialog-toggle-label {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.92);
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-rules-dialog-toggle .mud-switch {
    margin-right: 0;
}

.brand-rules-reset-switch {
    margin: 0 !important;
    overflow: visible;
}

.brand-rules-reset-switch .mud-switch-base,
.brand-rules-reset-switch .mud-icon-button-root,
.brand-rules-reset-switch .mud-switch-button {
    overflow: visible !important;
}

.brand-rules-reset-switch .mud-switch-base,
.brand-rules-reset-switch .mud-icon-button-root {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 26px;
    padding: 0;
}

.brand-rules-reset-switch .mud-switch-button {
    width: 42px;
    height: 26px;
}

.brand-rules-reset-switch .mud-switch-track {
    inset: 3px 0;
    height: 20px;
}

.brand-rules-reset-switch .mud-switch-thumb {
    width: 16px;
    height: 16px;
}

.brand-rules-dialog-help {
    margin-left: 0;
}

.brand-rules-dialog .mud-dialog-actions {
    padding-top: 6px;
}

@media (max-width: 960px) {
    .brand-device-section-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .brand-device-section-aside {
        padding-top: 0;
    }

    .brand-device-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .brand-device-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .brand-rules-section-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .brand-rules-section-aside {
        padding-top: 0;
    }

    .brand-rules-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .brand-rules-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .brand-rules-source-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .brand-device-header {
        align-items: stretch !important;
    }

    .brand-device-header .mud-button-root {
        width: 100%;
    }

    .brand-device-filter-panel {
        padding-inline: 12px !important;
    }

    .brand-device-filter-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .brand-device-filter-actions {
        justify-content: stretch;
    }

    .brand-device-filter-direction {
        flex: 0 0 42px;
    }

    .brand-device-filter-reset {
        flex: 1 1 auto;
    }

    .brand-device-group-name,
    .brand-device-group-color {
        width: 100%;
    }

    .brand-device-detail-editor {
        flex-wrap: wrap;
    }

    .brand-device-detail-input {
        max-width: none;
        width: 100%;
    }

    .brand-rules-filter-panel {
        padding-inline: 12px !important;
    }

    .brand-rules-filter-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .brand-rules-filter-actions {
        justify-content: stretch;
    }

    .brand-rules-filter-direction {
        flex: 0 0 42px;
    }

    .brand-rules-filter-reset {
        flex: 1 1 auto;
    }

    .brand-rules-events-filter {
        min-width: 0;
        width: 100%;
        max-width: none !important;
    }

    .brand-rules-events-toolbar {
        align-items: stretch;
    }

    .brand-rules-range-anchor {
        width: 100%;
        margin-right: 0 !important;
    }

    .brand-rules-range-button {
        width: 100%;
        justify-content: space-between;
    }

    .brand-rules-drawer-select {
        max-width: none;
        width: 100%;
    }

    .brand-rules-drawer-condition-editor,
    .brand-rules-drawer-condition-summary {
        grid-template-columns: minmax(0, 1fr);
    }
}

.brand-form-section-label {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-iso-help-button.mud-icon-button-root {
    width: 22px;
    height: 22px;
    min-width: 22px;
    padding: 0;
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.92);
    background: rgba(var(--mud-palette-surface-rgb), 0.44);
    border: 1px solid rgba(137, 158, 178, 0.18);
    border-radius: var(--brand-radius-sm);
    box-shadow: none;
    transition:
        background-color 140ms ease,
        border-color 140ms ease,
        color 140ms ease;
}

.brand-iso-help-button.mud-icon-button-root:hover,
.brand-iso-help-button.mud-icon-button-root:focus-visible,
.brand-iso-help-button.mud-icon-button-root:active {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.05);
    border-color: rgba(137, 158, 178, 0.24);
    color: var(--mud-palette-text-primary);
}

.is-light-mode .brand-iso-help-button.mud-icon-button-root {
    background: rgba(255, 255, 255, 0.58);
    border-color: rgba(119, 136, 156, 0.22);
    color: #475569;
}

.is-light-mode .brand-iso-help-button.mud-icon-button-root:hover,
.is-light-mode .brand-iso-help-button.mud-icon-button-root:focus-visible,
.is-light-mode .brand-iso-help-button.mud-icon-button-root:active {
    background: rgba(226, 232, 240, 0.56);
    border-color: rgba(100, 116, 139, 0.3);
    color: #1f2937;
}

.brand-iso-help-button .mud-icon-root {
    font-size: 0.92rem;
}

.brand-iso-help-anchor {
    position: relative;
    display: inline-flex;
}

.brand-iso-help-popover {
    z-index: calc(var(--mud-zindex-popover) + 2);
}

.brand-iso-help-popover-surface {
    display: grid;
    gap: 0;
    width: min(344px, calc(100vw - 32px));
    padding: 10px 12px !important;
    border-radius: var(--brand-radius-sm) !important;
    border: 1px solid rgba(137, 158, 178, 0.14) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.96) !important;
    box-shadow: 0 4px 12px rgba(2, 6, 23, 0.26) !important;
}

.brand-iso-help-popover-head {
    display: grid;
    gap: 2px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(137, 158, 178, 0.08);
}

.brand-iso-help-popover-head .brand-form-section-label {
    margin: 0;
}

.brand-iso-help-popover-context {
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-heading);
    font-size: 0.96rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.25;
    text-transform: none;
}

.brand-iso-help-popover-list {
    display: grid;
    gap: 0;
    max-height: min(40vh, 280px);
    margin-top: 8px;
    overflow-y: auto;
    padding-right: 4px;
}

.brand-iso-help-popover-row {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 10px 0;
}

.brand-iso-help-popover-row + .brand-iso-help-popover-row {
    border-top: 1px solid rgba(137, 158, 178, 0.08);
}

.brand-iso-help-popover-label {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    line-height: 1.25;
    text-transform: none;
    word-break: normal;
    overflow-wrap: break-word;
}

.brand-iso-help-popover-body {
    font-family: var(--brand-font-body);
    font-size: 0.78rem;
    line-height: 1.42;
    color: var(--mud-palette-text-primary);
    text-align: left;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
}

.is-light-mode .brand-iso-help-popover-surface {
    border-color: rgba(119, 136, 156, 0.18) !important;
    background: rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 4px 12px rgba(148, 163, 184, 0.2) !important;
}

.is-light-mode .brand-iso-help-popover-context {
    color: #1f2937;
}

.is-light-mode .brand-iso-help-popover-label {
    color: #64748b;
}

.is-light-mode .brand-iso-help-popover-body {
    color: rgba(30, 41, 59, 0.86);
}

@media (max-width: 600px) {
    .brand-iso-help-popover-surface {
        width: min(300px, calc(100vw - 20px));
    }
}

.brand-watchdog-prompts-panel,
.brand-watchdog-test-panel {
    padding: 12px !important;
}

.brand-watchdog-schedule-presets {
    gap: 8px !important;
}

.brand-watchdog-schedule-preset.mud-button-root {
    min-width: 0;
    padding: 0 14px;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.14);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.58);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.92);
    box-shadow: none;
    text-transform: none;
    letter-spacing: 0.02em;
    transition:
        background-color 0.16s ease,
        border-color 0.16s ease,
        color 0.16s ease,
        transform 0.16s ease;
}

.brand-watchdog-schedule-preset.mud-button-root:hover,
.brand-watchdog-schedule-preset.mud-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.055);
    border-color: rgba(var(--mud-palette-text-primary-rgb), 0.22);
    color: var(--mud-palette-text-primary);
    box-shadow: none;
}

.brand-watchdog-schedule-preset.is-active.mud-button-root {
    border-color: rgba(166, 140, 44, 0.68);
    background:
        linear-gradient(180deg, rgba(201, 188, 107, 0.30), rgba(201, 188, 107, 0.18));
    color: var(--mud-palette-text-primary);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 4px 10px rgba(2, 6, 23, 0.10);
    font-weight: 600;
}

.brand-watchdog-schedule-preset.is-active.mud-button-root:hover,
.brand-watchdog-schedule-preset.is-active.mud-button-root:focus-visible {
    background:
        linear-gradient(180deg, rgba(201, 188, 107, 0.36), rgba(201, 188, 107, 0.22));
    border-color: rgba(166, 140, 44, 0.82);
    color: var(--mud-palette-text-primary);
}

.brand-watchdog-day-chip {
    min-width: 34px;
    justify-content: center;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.14) !important;
    border-radius: var(--brand-radius-sm) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.58) !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.92) !important;
    box-shadow: none !important;
    letter-spacing: 0.02em;
    transition:
        background-color 0.16s ease,
        border-color 0.16s ease,
        color 0.16s ease,
        transform 0.16s ease;
}

.brand-watchdog-day-chip:hover,
.brand-watchdog-day-chip:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.055) !important;
    border-color: rgba(var(--mud-palette-text-primary-rgb), 0.22) !important;
    color: var(--mud-palette-text-primary) !important;
}

.brand-watchdog-day-chip.is-active {
    border-color: rgba(166, 140, 44, 0.68) !important;
    background:
        linear-gradient(180deg, rgba(201, 188, 107, 0.30), rgba(201, 188, 107, 0.18)) !important;
    color: var(--mud-palette-text-primary) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 4px 10px rgba(2, 6, 23, 0.10) !important;
    font-weight: 600;
}

.brand-watchdog-day-chip.is-active:hover,
.brand-watchdog-day-chip.is-active:focus-visible {
    background:
        linear-gradient(180deg, rgba(201, 188, 107, 0.36), rgba(201, 188, 107, 0.22)) !important;
    border-color: rgba(166, 140, 44, 0.82) !important;
    color: var(--mud-palette-text-primary) !important;
}

.brand-time-zone-picker-trigger.mud-button-root {
    justify-content: space-between;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.14);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.58);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.92);
    box-shadow: none;
    text-transform: none;
    font-size: 0.9rem;
}

.brand-time-zone-picker-trigger.mud-button-root:hover,
.brand-time-zone-picker-trigger.mud-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.055);
    border-color: rgba(var(--mud-palette-text-primary-rgb), 0.22);
    color: var(--mud-palette-text-primary);
    box-shadow: none;
}

.brand-watchdog-schedule-zone-row {
    margin-top: 4px;
    margin-bottom: 2px;
}

.brand-watchdog-schedule-zone-block {
    max-width: 304px;
    padding: 8px 10px 10px;
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.38);
}

.brand-time-zone-picker-trigger-text {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.brand-watchdog-prompts-panel {
    padding: 10px !important;
}

.brand-watchdog-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.brand-watchdog-prompts-panel .brand-watchdog-section-head {
    gap: 10px;
    margin-bottom: 6px;
}

.brand-watchdog-prompt-header,
.brand-watchdog-prompt-row {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(150px, 0.9fr) auto;
    gap: 10px;
    align-items: start;
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-header,
.brand-watchdog-prompts-panel .brand-watchdog-prompt-row {
    gap: 8px;
}

.brand-watchdog-prompt-header {
    margin-bottom: 8px;
    padding: 0 2px;
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-header {
    margin-bottom: 4px;
}

.brand-watchdog-prompt-head-cell {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-watchdog-prompt-head-spacer {
    width: 40px;
}

.brand-watchdog-prompt-row {
    padding: 10px 0;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-row {
    padding: 6px 0;
}

.brand-watchdog-prompt-cell {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid rgba(137, 158, 178, 0.11);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.36);
    color: var(--mud-palette-text-primary);
    line-height: 1.45;
    word-break: break-word;
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-cell {
    padding: 8px 10px;
    line-height: 1.35;
}

.brand-watchdog-prompt-cell.is-clickable {
    cursor: pointer;
    transition: background-color 0.16s ease, border-color 0.16s ease;
}

.brand-watchdog-prompt-cell.is-clickable:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.04);
    border-color: rgba(137, 158, 178, 0.18);
}

.brand-watchdog-prompt-value {
    min-height: 46px;
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-value {
    min-height: 38px;
}

.brand-watchdog-prompt-key-chip {
    display: flex;
    align-items: center;
    min-height: 46px;
    font-family: var(--brand-font-data);
    letter-spacing: 0.03em;
    text-transform: none;
    background: rgba(201, 188, 107, 0.08);
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-key-chip {
    min-height: 38px;
}

.brand-watchdog-prompt-input .mud-input-control {
    margin: 0 !important;
}

.brand-watchdog-prompt-input .mud-input-slot {
    background: rgba(var(--mud-palette-surface-rgb), 0.44);
}

.brand-watchdog-prompt-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-actions {
    gap: 4px;
}

.brand-watchdog-prompt-action.mud-icon-button-root,
.brand-watchdog-upload-button.mud-button-root {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.18);
    color: var(--mud-palette-text-primary);
}

.brand-watchdog-prompts-panel .brand-watchdog-prompt-action.mud-icon-button-root {
    width: 32px;
    height: 32px;
    min-width: 32px;
}

.brand-watchdog-prompt-action.mud-icon-button-root:hover,
.brand-watchdog-prompt-action.mud-icon-button-root:focus-visible,
.brand-watchdog-upload-button.mud-button-root:hover,
.brand-watchdog-upload-button.mud-button-root:focus-visible {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.055);
}

.brand-watchdog-upload-button.mud-button-root {
    width: auto;
    padding-inline: 12px !important;
    text-transform: uppercase;
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
}

.brand-watchdog-test-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.9fr);
    gap: 14px;
    align-items: start;
}

.brand-watchdog-test-preview {
    min-height: 220px;
    border: 1px solid rgba(137, 158, 178, 0.11);
    border-radius: var(--brand-radius-md);
    background: rgba(var(--mud-palette-surface-rgb), 0.34);
    overflow: hidden;
}

.brand-watchdog-test-image {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

.brand-watchdog-test-results {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 220px;
    padding: 6px 0;
}

.brand-watchdog-test-result-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid rgba(137, 158, 178, 0.1);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.32);
}

.brand-watchdog-test-result-key,
.brand-watchdog-test-result-value {
    min-width: 0;
    margin: 0;
}

.brand-watchdog-test-result-key {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.76rem !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.brand-watchdog-test-result-value {
    color: var(--mud-palette-text-primary);
    font-weight: 600;
}

@media (max-width: 900px) {
    .brand-watchdog-prompt-header,
    .brand-watchdog-prompt-row,
    .brand-watchdog-test-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .brand-watchdog-prompt-head-spacer {
        display: none;
    }

    .brand-watchdog-prompt-actions {
        justify-content: flex-end;
    }

    .brand-watchdog-test-preview,
    .brand-watchdog-test-results {
        min-height: 0;
    }
}

.mud-expansion-panels {
    gap: 8px;
}

.mud-expand-panel {
    border: 1px solid rgba(137, 158, 178, 0.11);
    border-radius: var(--brand-radius-md);
    background: rgba(var(--mud-palette-surface-rgb), 0.55);
    overflow: hidden;
}

.mud-expand-panel-header {
    min-height: 44px;
    padding: 12px 14px;
    background: rgba(var(--mud-palette-text-primary-rgb), 0.025);
}

.mud-expand-panel-content {
    padding: 6px 0 10px;
}

.mud-checkbox {
    margin-inline: 0;
}

.mud-checkbox .mud-button-root {
    min-height: 30px;
}

.brand-home-utility-row {
    min-height: 24px;
    margin-bottom: 2px;
}

.brand-home-plan-chip {
    height: 22px;
    padding-inline: 8px;
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.brand-home-version-link {
    min-width: 0;
    padding-inline: 0 !important;
}

.brand-home-version-text {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.brand-home-kpi-card,
.brand-equipment-card {
    position: relative;
    align-self: flex-start;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.93)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.018),
        0 1px 3px rgba(2, 6, 23, 0.26) !important;
    border: 1px solid var(--brand-border-strong) !important;
}

.brand-home-kpi-card {
    display: flex;
    flex-direction: column;
    height: 200px;
    min-height: 200px;
    max-height: 200px;
    flex: 0 0 auto;
}

.brand-equipment-card {
    flex: 1 1 620px;
    width: min(100%, 720px);
    min-width: 480px;
    max-width: 720px;
}

.brand-home-kpi-card::before,
.brand-equipment-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
}

.brand-home-kpi-card::after,
.brand-equipment-card::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid rgba(201, 188, 107, 0.18);
    border-right: 1px solid rgba(201, 188, 107, 0.18);
    pointer-events: none;
}

.brand-home-kpi-card .mud-card-content,
.brand-equipment-card .mud-card-content {
    padding: 18px 20px;
}

.brand-home-kpi-card .mud-card-content {
    box-sizing: border-box;
    height: 100%;
}

.brand-home-kpi-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-height: 0;
    height: 100%;
    padding-right: 20px;
}

.brand-home-kpi-led {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 12px;
    height: 12px;
    border-bottom-right-radius: var(--brand-radius-sm);
    border-top-left-radius: var(--brand-radius-sm);
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 0 0 1px rgba(2, 6, 23, 0.26);
    pointer-events: none;
}

.brand-home-kpi-led-success {
    background: linear-gradient(180deg, rgba(16, 185, 129, 0.9), rgba(5, 150, 105, 0.82));
}

.brand-home-kpi-led-warning {
    background: linear-gradient(180deg, rgba(245, 158, 11, 0.92), rgba(217, 119, 6, 0.84));
}

.brand-home-kpi-led-error {
    background: linear-gradient(180deg, rgba(244, 63, 94, 0.92), rgba(225, 29, 72, 0.84));
}

.brand-home-kpi-title {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-home-kpi-value {
    margin-top: 6px;
    font-family: var(--brand-font-data);
    font-size: 2rem !important;
    font-weight: 500 !important;
    letter-spacing: -0.04em;
    line-height: 1;
}

.brand-home-kpi-subtitle {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.92);
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.brand-home-kpi-divider {
    width: 100%;
    margin: auto 0 8px;
}

.brand-home-kpi-meta-value {
    font-family: var(--brand-font-data);
    font-size: 1rem;
    letter-spacing: -0.03em;
}

.brand-home-kpi-meta-label {
    color: var(--mud-palette-text-secondary);
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-equipment-content {
    gap: 10px;
    min-height: 150px;
}

.brand-equipment-title {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-equipment-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.brand-equipment-settings {
    position: relative !important;
    z-index: 2;
    width: 30px;
    height: 30px;
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.92) !important;
}

.brand-equipment-row {
    cursor: pointer;
    padding: 10px 0;
    border-top: 1px solid rgba(148, 163, 184, 0.07);
    transition: background-color 0.16s ease, transform 0.16s ease;
}

.brand-equipment-row:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.02);
}

.brand-map-title {
    margin-bottom: 14px !important;
}

.brand-map-filter-panel {
    padding: 12px !important;
}

.brand-map-chip-set {
    gap: 8px;
}

.brand-custom-map-toolbar {
    padding: 12px !important;
}

.brand-custom-map-toolbar-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
}

.brand-custom-map-select-shell {
    min-width: 0;
}

.brand-custom-map-select {
    width: 100%;
}

.brand-custom-map-group-shell {
    min-width: 0;
}

.brand-custom-map-chip-set {
    flex-wrap: wrap;
    align-items: flex-start;
}

.brand-custom-map-load-state {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding-inline: 4px;
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    white-space: nowrap;
}

.brand-map-shell {
    overflow: hidden;
    min-height: 80vh;
}

.brand-map-canvas {
    width: 100%;
    height: 100%;
    border-radius: var(--brand-radius-lg);
}

.brand-map-shell .mud-progress-linear {
    box-shadow: 0 0 0 1px rgba(201, 188, 107, 0.14);
}

.brand-map-status {
    border-color: rgba(137, 158, 178, 0.12) !important;
    background: rgba(var(--mud-palette-surface-rgb), 0.92) !important;
    backdrop-filter: blur(8px);
}

.brand-map-canvas .maplibregl-ctrl-top-left,
.brand-map-canvas .maplibregl-ctrl-top-right,
.brand-map-canvas .maplibregl-ctrl-bottom-left,
.brand-map-canvas .maplibregl-ctrl-bottom-right,
.brand-dashboard-map-canvas .maplibregl-ctrl-top-left,
.brand-dashboard-map-canvas .maplibregl-ctrl-top-right,
.brand-dashboard-map-canvas .maplibregl-ctrl-bottom-left,
.brand-dashboard-map-canvas .maplibregl-ctrl-bottom-right {
    margin: 12px;
}

.brand-map-canvas .maplibregl-ctrl-group,
.brand-dashboard-map-canvas .maplibregl-ctrl-group {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--brand-border-strong) !important;
    border-radius: var(--brand-radius-sm) !important;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.94)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.016),
        0 1px 3px rgba(2, 6, 23, 0.26) !important;
}

.brand-map-canvas .maplibregl-ctrl-group::before,
.brand-dashboard-map-canvas .maplibregl-ctrl-group::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
}

.brand-map-canvas .maplibregl-ctrl-group::after,
.brand-dashboard-map-canvas .maplibregl-ctrl-group::after {
    content: "";
    position: absolute;
    top: 5px;
    right: 5px;
    width: 7px;
    height: 7px;
    border-top: 1px solid rgba(201, 188, 107, 0.18);
    border-right: 1px solid rgba(201, 188, 107, 0.18);
    pointer-events: none;
}

.brand-map-canvas .maplibregl-ctrl-group button,
.brand-dashboard-map-canvas .maplibregl-ctrl-group button {
    width: 38px;
    height: 38px;
    border: 0 !important;
    background: transparent !important;
    color: var(--mud-palette-text-primary) !important;
    transition:
        background-color 140ms ease,
        box-shadow 140ms ease,
        color 140ms ease;
}

.brand-map-canvas .maplibregl-ctrl-group button + button,
.brand-dashboard-map-canvas .maplibregl-ctrl-group button + button {
    border-top: 1px solid rgba(137, 158, 178, 0.12) !important;
}

.brand-map-canvas .maplibregl-ctrl-group button:hover,
.brand-dashboard-map-canvas .maplibregl-ctrl-group button:hover {
    background: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
}

.brand-map-canvas .maplibregl-ctrl-group button:focus-visible,
.brand-dashboard-map-canvas .maplibregl-ctrl-group button:focus-visible {
    outline: none;
    background: rgba(var(--mud-palette-primary-rgb), 0.1) !important;
    box-shadow: inset 0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.28);
}

.brand-map-canvas .maplibregl-ctrl button.maplibregl-ctrl-geolocate-active,
.brand-dashboard-map-canvas .maplibregl-ctrl button.maplibregl-ctrl-geolocate-active {
    background: rgba(var(--mud-palette-primary-rgb), 0.14) !important;
}

.brand-map-canvas .maplibregl-ctrl button.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon,
.brand-dashboard-map-canvas .maplibregl-ctrl button.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon {
    filter: brightness(0) saturate(100%) invert(58%) sepia(87%) saturate(2967%) hue-rotate(164deg) brightness(100%) contrast(101%);
}

.brand-map-canvas .maplibregl-ctrl-icon,
.brand-dashboard-map-canvas .maplibregl-ctrl-icon {
    opacity: 0.9;
    filter: brightness(0) saturate(100%) invert(86%) sepia(15%) saturate(354%) hue-rotate(171deg) brightness(95%) contrast(90%);
}

.brand-map-canvas .maplibregl-ctrl-compass-arrow,
.brand-dashboard-map-canvas .maplibregl-ctrl-compass-arrow {
    opacity: 0.95;
}

.brand-map-canvas .maplibregl-ctrl-attrib,
.brand-dashboard-map-canvas .maplibregl-ctrl-attrib {
    border: 1px solid rgba(137, 158, 178, 0.12);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-surface-rgb), 0.88);
    backdrop-filter: blur(10px);
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-data);
    font-size: 0.62rem;
    letter-spacing: 0.06em;
}

.brand-map-canvas .maplibregl-ctrl-attrib a,
.brand-dashboard-map-canvas .maplibregl-ctrl-attrib a {
    color: inherit;
}

.brand-shell.is-light-mode .brand-map-canvas .maplibregl-ctrl-icon,
.brand-shell.is-light-mode .brand-dashboard-map-canvas .maplibregl-ctrl-icon {
    opacity: 1;
    filter: brightness(0) saturate(100%) invert(12%) sepia(18%) saturate(1168%) hue-rotate(176deg) brightness(95%) contrast(95%);
}

.brand-shell.is-light-mode .brand-map-canvas .maplibregl-ctrl-attrib,
.brand-shell.is-light-mode .brand-dashboard-map-canvas .maplibregl-ctrl-attrib {
    color: rgba(15, 23, 42, 0.72);
}

.airgemba-map-popup.maplibregl-popup,
.airgemba-map-popup.mapboxgl-popup {
    max-width: 360px !important;
    z-index: 5;
}

.airgemba-map-popup .maplibregl-popup-content,
.airgemba-map-popup .mapboxgl-popup-content {
    position: relative;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.airgemba-map-popup .maplibregl-popup-tip,
.airgemba-map-popup .mapboxgl-popup-tip {
    display: none !important;
}

.airgemba-map-popup__shell {
    position: relative;
    width: min(360px, calc(100vw - 48px));
    padding: 14px 14px 12px;
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-sm);
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.985), rgba(var(--mud-palette-background-grey-rgb), 0.95));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.016),
        0 8px 20px rgba(2, 6, 23, 0.34);
    backdrop-filter: blur(14px);
    color: var(--mud-palette-text-primary);
}

.airgemba-map-popup__shell::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
}

.airgemba-map-popup__shell::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid rgba(201, 188, 107, 0.18);
    border-right: 1px solid rgba(201, 188, 107, 0.18);
    pointer-events: none;
}

.airgemba-map-popup__header {
    margin-bottom: 10px;
    padding-bottom: 10px;
    padding-right: 18px;
    border-bottom: 1px solid var(--brand-border);
}

.airgemba-map-popup__title {
    font-family: var(--brand-font-heading);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--mud-palette-text-primary);
}

.airgemba-map-popup__meta {
    display: grid;
    gap: 6px;
}

.airgemba-map-popup__header + .airgemba-map-popup__meta {
    margin-top: 0;
}

.airgemba-map-popup__meta-stamp {
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.08em;
    color: var(--mud-palette-text-primary);
    text-transform: uppercase;
}

.airgemba-map-popup__metrics {
    display: grid;
    gap: 8px;
    max-height: min(42vh, 280px);
    margin-top: 10px;
    padding-top: 10px;
    padding-right: 4px;
    border-top: 1px solid var(--brand-border);
    overflow-y: auto;
}

.airgemba-map-popup__metric-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}

.airgemba-map-popup__metric-label {
    min-width: 0;
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    line-height: 1.35;
    color: var(--mud-palette-text-secondary);
    word-break: break-word;
}

.airgemba-map-popup__metric-value {
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    line-height: 1.35;
    color: var(--mud-palette-text-primary);
    text-align: right;
}

@media (max-width: 600px) {
    .airgemba-map-popup__shell {
        width: min(320px, calc(100vw - 32px));
    }

    .airgemba-map-popup__metric-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .airgemba-map-popup__metric-value {
        text-align: left;
    }
}

.brand-custom-map-shell {
    min-height: 85vh;
}

.brand-equipment-row:first-of-type {
    border-top: 0;
}

.brand-equipment-list {
    max-height: 280px;
    overflow-y: auto;
    padding-right: 4px;
}

.brand-equipment-row-grid {
    display: grid;
    grid-template-columns: 124px minmax(0, 1fr) 52px;
    align-items: center;
    gap: 8px;
}

.brand-equipment-nameplate {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 124px;
    min-width: 124px;
    max-width: 124px;
    min-height: 26px;
    padding: 4px 16px 4px 10px;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid rgba(137, 158, 178, 0.16);
    border-radius: var(--brand-radius-sm);
    background: linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.94), rgba(var(--mud-palette-background-grey-rgb), 0.9));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.brand-equipment-nameplate.is-healthy {
    //border-color: rgba(34, 197, 94, 0.22);
}

.brand-equipment-nameplate.is-watch {
    //border-color: rgba(245, 158, 11, 0.24);
}

.brand-equipment-nameplate.is-critical {
    //border-color: rgba(244, 63, 94, 0.24);
}

/* ============================================================
   Asset detail — child entity tiles (assets spec)
   ============================================================ */

/*
    Compact grid of clickable name tiles for the children list on the
    asset detail page. Visually subordinate to the page header so the
    hierarchy stays clean: smaller font (`--brand-font-data` 0.72rem
    rather than the page-title 1.5rem), thinner border, no inset
    highlight, no topline, no severity LED. The tile is the click
    target — the whole row navigates.

    Layout: a CSS grid with `auto-fill, minmax(180px, max-content)` so
    tiles flow side-by-side at their natural width up to the panel's
    edge, then wrap. They never expand to full panel width — that was
    the visual collision with the page header that flagged this redesign.
*/
.brand-asset-detail-child-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, max-content));
    gap: 6px;
    align-items: center;
}

.brand-asset-detail-child-tile {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    max-width: 280px;
    padding: 6px 10px;
    border: 1px solid var(--brand-border);
    border-radius: var(--brand-radius-sm);
    background: rgba(8, 15, 24, 0.32);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.92);
    cursor: pointer;
    text-decoration: none;
    transition:
        border-color 0.16s ease,
        background-color 0.16s ease,
        color 0.16s ease;
}

.brand-asset-detail-child-tile:hover,
.brand-asset-detail-child-tile:focus-visible {
    border-color: var(--brand-border-strong);
    background: rgba(8, 15, 24, 0.42);
    color: var(--mud-palette-text-primary);
    outline: none;
}

.brand-asset-detail-child-tile-icon {
    flex: 0 0 auto;
    font-size: 0.92rem !important;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.62);
}

.brand-asset-detail-child-tile-label {
    min-width: 0;
    flex: 1 1 auto;
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 600px) {
    .brand-asset-detail-child-grid {
        /* On narrow viewports, let tiles shrink to one-per-line so the
           text isn't crushed; max-width is removed so a long name can
           use the full width. */
        grid-template-columns: 1fr;
    }

    .brand-asset-detail-child-tile {
        max-width: none;
    }
}

.brand-equipment-chip-led {
    position: absolute;
    right: 1px;
    bottom: 1px;
    width: 10px;
    height: 10px;
    border-bottom-right-radius: calc(var(--brand-radius-sm) - 1px);
    border-top-left-radius: 2px;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
    background: var(--equipment-led-fill, rgba(148, 163, 184, 0.82));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 0 10px var(--equipment-led-glow, rgba(148, 163, 184, 0.24));
}

.brand-equipment-chip-led.is-healthy {
    --equipment-led-fill: linear-gradient(180deg, rgba(74, 222, 128, 0.98), rgba(34, 197, 94, 0.9));
    --equipment-led-glow: rgba(34, 197, 94, 0.34);
}

.brand-equipment-chip-led.is-watch {
    --equipment-led-fill: linear-gradient(180deg, rgba(251, 191, 36, 0.98), rgba(245, 158, 11, 0.9));
    --equipment-led-glow: rgba(245, 158, 11, 0.32);
}

.brand-equipment-chip-led.is-critical {
    --equipment-led-fill: linear-gradient(180deg, rgba(251, 113, 133, 0.98), rgba(244, 63, 94, 0.9));
    --equipment-led-glow: rgba(244, 63, 94, 0.34);
}

.brand-equipment-chip-led.is-neutral {
    --equipment-led-fill: linear-gradient(180deg, rgba(203, 213, 225, 0.86), rgba(148, 163, 184, 0.8));
    --equipment-led-glow: rgba(148, 163, 184, 0.22);
}

.brand-equipment-chip-led.is-muted {
    --equipment-led-fill: linear-gradient(180deg, rgba(203, 213, 225, 0.86), rgba(148, 163, 184, 0.8));
    --equipment-led-glow: rgba(148, 163, 184, 0.22);
}

.brand-equipment-spark-shell {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    display: flex;
    align-items: center;
}

.brand-equipment-label {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.92);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.brand-equipment-empty {
    font-style: italic;
    padding-left: 2px;
}

.brand-equipment-score-col {
    width: 52px;
    min-width: 52px;
    display: flex;
    align-self: stretch;
    align-items: center;
    justify-content: center;
}

.brand-equipment-score {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 100%;
    width: 100%;
    text-align: right;
    font-family: var(--brand-font-data);
    font-size: 1.2rem;
    font-weight: 600;
    letter-spacing: -0.06em;
    line-height: 0.95;
    color: var(--mud-palette-text-primary);
}

.brand-equipment-score-placeholder {
    opacity: 0.48;
}

.brand-mini-health-spark {
    width: 100%;
    height: 34px;
}

@media (max-width: 900px) {
    .brand-custom-map-toolbar-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .brand-custom-map-load-state {
        min-height: 0;
    }

    .brand-equipment-card {
        min-width: 100%;
        max-width: none;
        width: 100%;
        flex-basis: 100%;
    }

    .brand-equipment-row-grid {
        grid-template-columns: 108px minmax(0, 1fr) 44px;
        gap: 10px;
    }

    .brand-equipment-nameplate {
        width: 108px;
        min-width: 108px;
        max-width: 108px;
    }

    .brand-equipment-score-col {
        width: 44px;
        min-width: 44px;
    }

    .brand-equipment-score {
        font-size: 1.08rem;
    }
}

:where(
    .mud-button-root,
    .mud-icon-button-root,
    .mud-tab,
    .mud-nav-link,
    .mud-input-control .mud-input-slot,
    .airgemba-nav-link,
    .airgemba-nav-group-toggle
):focus-visible {
    outline: 2px solid var(--brand-focus);
    outline-offset: 2px;
}

#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    padding: 12px 48px 12px 16px;
    background: rgba(var(--mud-palette-surface-rgb), 0.97);
    color: var(--mud-palette-text-primary);
    border-top: 1px solid rgba(var(--mud-palette-error-rgb), 0.3);
    box-shadow: 0 -4px 16px rgba(2, 6, 23, 0.15);
    backdrop-filter: blur(12px);
    font-family: var(--brand-font-body);
    font-size: 0.82rem;
    align-items: center;
    gap: 12px;
}

#blazor-error-ui .blazor-error-icon {
    color: rgba(var(--mud-palette-error-rgb), 0.8);
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

#blazor-error-ui .blazor-error-text {
    flex: 1;
    line-height: 1.4;
}

#blazor-error-ui .blazor-error-reload {
    font-family: var(--brand-font-data);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--mud-palette-primary);
    padding: 6px 12px;
    border: 1px solid rgba(var(--mud-palette-primary-rgb), 0.3);
    border-radius: var(--brand-radius-sm);
    transition: background 0.15s;
}

#blazor-error-ui .blazor-error-reload:hover {
    background: rgba(var(--mud-palette-primary-rgb), 0.08);
}

#blazor-error-ui .dismiss {
    position: absolute;
    top: 8px;
    right: 12px;
    cursor: pointer;
    font-size: 1.2rem;
    line-height: 1;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.5);
    padding: 4px;
}

#blazor-error-ui .dismiss:hover {
    color: var(--mud-palette-text-primary);
}

@media (max-width: 1002px) {
    .brand-content-shell,
    .brand-manage-container {
        padding-left: var(--brand-space-3) !important;
        padding-right: var(--brand-space-3) !important;
    }

    .brand-account-logo {
        padding: var(--brand-space-4);
    }

    .dashboard-toolbar,
    .brand-dashboard-toolbar {
        padding: var(--brand-space-2) var(--brand-space-3);
    }

    .brand-dashboard-toolbar-left,
    .brand-dashboard-toolbar-right {
        width: 100%;
        padding: 0;
        border: 0;
        background: transparent;
    }

    .brand-dashboard-desktop-only {
        display: none !important;
    }

    .brand-dashboard-mobile-only {
        display: block;
        width: auto;
        min-width: 40px;
    }

    .brand-dashboard-toolbar-left {
        display: flex;
        flex: 1 1 auto;
        min-width: 0;
        align-items: center;
        gap: 8px;
        flex-wrap: nowrap;
        width: auto;
    }

    .brand-dashboard-toolbar {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 8px;
    }

    .brand-dashboard-toolbar-right {
        justify-content: flex-start;
    }

    .brand-dashboard-toolbar-mobile {
        display: flex;
        width: auto;
        justify-content: flex-end;
        align-items: center;
    }

    .brand-dashboard-toolbar-left > *,
    .brand-dashboard-command-anchor {
        min-width: 0;
    }

    .brand-dashboard-command-anchor .brand-dashboard-command-button {
        width: 100%;
        min-width: 0;
    }

    .brand-dashboard-command-anchor {
        flex: 1 1 auto;
    }

    .brand-dashboard-toolbar-right > * + * {
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }

    .brand-dashboard-select,
    .brand-dashboard-command-button-wide,
    .brand-dashboard-command-button-compact,
    .brand-dashboard-nameplate,
    .brand-dashboard-range-shell {
        min-width: 0;
    }

    .brand-dashboard-command-button-wide,
    .brand-dashboard-nameplate {
        width: 100%;
        max-width: none;
    }

    .brand-dashboard-range-shell {
        flex: 0 0 136px;
        width: 136px;
        min-width: 136px;
        max-width: 136px !important;
    }
}

@media (max-width: 720px) {
    .range-control-surface {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .range-control-presets {
        padding-right: 0;
        padding-bottom: 12px;
        border-right: 0;
        border-bottom: 1px solid rgba(137, 158, 178, 0.12);
    }
}


/* ============================================================
   Vibration trajectory — ThinkingPanel + PlanChecklist
   (vibration-agent-redesign spec, task 8.9)
   ============================================================ */

.brand-thinking-terminal {
    position: relative;
    overflow: hidden;
    padding: var(--brand-space-4) var(--brand-space-4) var(--brand-space-3);
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.1);
    border-radius: var(--brand-radius-lg);
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.94));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.016),
        var(--brand-shadow-card);
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
}

.brand-thinking-terminal::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
    z-index: 0;
}

.brand-thinking-terminal::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid var(--brand-hud-line);
    border-right: 1px solid var(--brand-hud-line);
    pointer-events: none;
}

.brand-thinking-terminal-kicker {
    position: relative;
    z-index: 1;
    display: inline-block;
    margin: 0 0 var(--brand-space-2);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.62);
    font-family: var(--brand-font-data);
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-thinking-terminal-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    /* Pin content to the bottom of the visible window so the most-recent
       line — the one carrying the blinking cursor on a fresh run — sits
       in the high-opacity region of the fade gradient. Without this the
       single-line cold-start state lays out at the top, where the
       gradient's 0% alpha makes the cursor invisible.
       Static height with internal scroll. The panel reserves a fixed
       window and lets the contents scroll inside it so the user can read
       back through the agent's reasoning trail during or after a run.
       Entries lay out top-to-bottom from the array order; the parent
       component auto-scrolls to the bottom on every update so live
       streaming follows the most-recent line by default — manual
       scrollback is honoured by the auto-scroll guard (it only re-pins
       when the user is already near the bottom). */
    justify-content: flex-end;
    gap: var(--brand-space-1);
    height: 240px;
    max-height: 240px;
    overflow-y: auto;
    overflow-x: hidden;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.86);
    font-family: var(--brand-font-data);
    font-size: 0.78rem;
    line-height: 1.5;
    /* Subtle top-edge fade only — older lines soften as they reach the very
       top edge, but the bulk of the panel (and the scrollbar over it) stays
       fully opaque so scrollback is readable. The body's `padding-top: 4.5em`
       (~22% headroom) means that when scrolled fully up the oldest line sits
       BELOW this 12% fade, so every line is readable on scrollback. Applied to
       the scroll container, the mask also clips the scrollbar — keeping the
       fade short (opaque by 12%) is what keeps the scrollbar visible over the
       remaining 88% of its track. */
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 12%);
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 12%);
    /* Three-line buffer above the cursor on cold start — `1.5em` per line
       at the panel's `line-height` lands at ~3 lines of headroom before
       the cursor block, so the empty-state cursor sits naturally in view
       without being flush to the bottom edge. */
    padding-top: 4.5em;
    padding-bottom: var(--brand-space-3);
    /* Slim, brand-tinted scrollbar so manual scrollback feels intentional —
       the default UA scrollbar is loud and breaks the terminal aesthetic. */
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--mud-palette-text-primary-rgb), 0.32) transparent;
}

.brand-thinking-terminal-body::-webkit-scrollbar {
    width: 8px;
}

.brand-thinking-terminal-body::-webkit-scrollbar-track {
    background: transparent;
}

.brand-thinking-terminal-body::-webkit-scrollbar-thumb {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.32);
    border-radius: 3px;
}

.brand-thinking-terminal-body::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.45);
}

.brand-thinking-terminal-line {
    display: flex;
    align-items: baseline;
    gap: var(--brand-space-2);
    word-break: break-word;
}

.brand-thinking-terminal-line.is-recent {
    color: var(--mud-palette-text-primary);
}

.brand-thinking-terminal-cursor {
    position: relative;
    z-index: 1;
    display: inline-block;
    width: 0.55em;
    height: 0.95em;
    margin-left: 2px;
    vertical-align: text-bottom;
    background: rgba(var(--mud-palette-primary-rgb), 0.78);
    animation: brand-thinking-cursor-blink 1.05s steps(2, end) infinite;
}

.brand-thinking-terminal-cursor::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
}

@keyframes brand-thinking-cursor-blink {
    0%, 50% {
        opacity: 1;
    }
    50.01%, 100% {
        opacity: 0;
    }
}

.brand-plan-checklist {
    position: relative;
    overflow: hidden;
    padding: var(--brand-space-4) var(--brand-space-4) var(--brand-space-3);
    border: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.1);
    border-radius: var(--brand-radius-lg);
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-surface-rgb), 0.97), rgba(var(--mud-palette-background-grey-rgb), 0.94));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.016),
        var(--brand-shadow-card);
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-body);
}

.brand-plan-checklist::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--brand-panel-topline);
    pointer-events: none;
    z-index: 0;
}

.brand-plan-checklist::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-top: 1px solid var(--brand-hud-line);
    border-right: 1px solid var(--brand-hud-line);
    pointer-events: none;
}

.brand-plan-checklist-kicker {
    position: relative;
    z-index: 1;
    display: inline-block;
    margin: 0 0 var(--brand-space-2);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.62);
    font-family: var(--brand-font-data);
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-plan-checklist-scroll {
    position: relative;
    z-index: 1;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--mud-palette-text-primary-rgb), 0.18) transparent;
}

.brand-plan-checklist-scroll::-webkit-scrollbar {
    height: 6px;
}

.brand-plan-checklist-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.brand-plan-checklist-scroll::-webkit-scrollbar-thumb {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.18);
    border-radius: 3px;
}

.brand-plan-checklist-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.28);
}

.brand-plan-timeline {
    min-width: 640px;
    padding-top: 2px;
}

.brand-plan-timeline.mud-timeline-horizontal {
    align-items: stretch;
}

.brand-plan-timeline.mud-timeline-horizontal::before {
    top: 18px;
    height: 1px;
    background: linear-gradient(90deg, rgba(var(--mud-palette-text-primary-rgb), 0.08), rgba(var(--mud-palette-text-primary-rgb), 0.16) 14%, rgba(var(--mud-palette-primary-rgb), 0.3) 50%, rgba(var(--mud-palette-text-primary-rgb), 0.16) 86%, rgba(var(--mud-palette-text-primary-rgb), 0.08));
}

.brand-plan-timeline.mud-timeline-horizontal .mud-timeline-item {
    padding: 0 var(--brand-space-2);
}

.brand-plan-timeline.mud-timeline-horizontal .mud-timeline-item .mud-timeline-item-divider {
    min-height: 36px;
}

.brand-plan-timeline.mud-timeline-horizontal .mud-timeline-item .mud-timeline-item-content {
    max-height: none;
    padding-top: var(--brand-space-3);
}

.brand-plan-timeline .mud-timeline-item-dot {
    background: transparent;
    box-shadow: none;
}

.brand-plan-step {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.74);
    font-family: var(--brand-font-body);
    transition: color 0.18s ease, opacity 0.18s ease;
}

.brand-plan-step-content {
    display: flex;
    justify-content: center;
    text-align: center;
}

.brand-plan-step-label {
    display: block;
    max-width: 132px;
    min-width: 0;
    color: inherit;
    font-family: var(--brand-font-body);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.24;
    text-wrap: balance;
}

.brand-plan-step-dot-shell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: 1.5px solid rgba(var(--mud-palette-text-primary-rgb), 0.24);
    border-radius: var(--brand-radius-pill);
    background: rgba(var(--mud-palette-surface-rgb), 0.92);
    box-shadow:
        0 0 0 4px rgba(var(--mud-palette-surface-rgb), 0.72),
        0 0 0 1px rgba(var(--mud-palette-text-primary-rgb), 0.04);
    transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}

.brand-plan-step-pending-core {
    display: block;
    width: 5px;
    height: 5px;
    border-radius: var(--brand-radius-pill);
    background: rgba(var(--mud-palette-text-primary-rgb), 0.26);
}

.brand-plan-step-progress.mud-progress-circular {
    width: 14px;
    height: 14px;
}

.brand-plan-step-complete-icon {
    font-size: 0.82rem;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.96);
}

.brand-plan-step.is-pending {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.48);
}

.brand-plan-step.is-pending .brand-plan-step-dot-shell {
    border-color: rgba(var(--mud-palette-text-primary-rgb), 0.22);
    background: rgba(var(--mud-palette-surface-rgb), 0.88);
}

.brand-plan-step.is-active {
    color: var(--mud-palette-text-primary);
}

.brand-plan-step.is-active .brand-plan-step-dot-shell {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.72);
    background: rgba(var(--mud-palette-primary-rgb), 0.08);
    box-shadow:
        0 0 0 4px rgba(var(--mud-palette-surface-rgb), 0.72),
        0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.18);
}

.brand-plan-step.is-complete {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.68);
}

.brand-plan-step.is-complete .brand-plan-step-dot-shell {
    border-color: rgba(var(--mud-palette-success-rgb), 0.52);
    background: rgba(var(--mud-palette-success-rgb), 0.34);
    box-shadow:
        0 0 0 4px rgba(var(--mud-palette-surface-rgb), 0.72),
        0 0 0 1px rgba(var(--mud-palette-success-rgb), 0.12);
}

@media (max-width: 720px) {
    .brand-plan-checklist {
        padding-right: var(--brand-space-3);
        padding-left: var(--brand-space-3);
    }

    .brand-plan-timeline {
        min-width: 560px;
    }

    .brand-plan-step-label {
        max-width: 108px;
        font-size: 0.74rem;
    }
}


/* ============================================================
   Vibration trajectory chart — breakpoint legend
   Lives inside .brand-dashboard-chart-frame, below the canvas.
   Maps each numbered BP chip on the chart to its full
   classification + label so the technician can read the chart
   and the legend together without hovering.
   ============================================================ */

.brand-trajectory-breakpoint-legend {
    list-style: none;
    margin: 0;
    padding: var(--brand-space-3) var(--brand-space-4) var(--brand-space-3);
    display: flex;
    flex-direction: column;
    gap: var(--brand-space-1);
    border-top: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
    counter-reset: bp;
}

.brand-trajectory-breakpoint-legend-row {
    display: grid;
    grid-template-columns: auto auto auto auto 1fr;
    align-items: center;
    gap: var(--brand-space-2) var(--brand-space-3);
    color: rgba(var(--mud-palette-text-primary-rgb), 0.86);
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    line-height: 1.32;
}

.brand-trajectory-breakpoint-legend-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    padding: 2px 7px 1px;
    color: #ffffff;
    font-family: var(--brand-font-data);
    font-size: 0.70rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    border-radius: var(--brand-radius-sm);
}

.brand-trajectory-breakpoint-legend-class {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--mud-palette-text-primary);
}

.brand-trajectory-breakpoint-legend-conf {
    font-variant-numeric: tabular-nums;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.62);
    font-size: 0.70rem;
}

.brand-trajectory-breakpoint-legend-time {
    font-variant-numeric: tabular-nums;
    color: rgba(var(--mud-palette-text-primary-rgb), 0.62);
    font-size: 0.70rem;
    white-space: nowrap;
}

.brand-trajectory-breakpoint-legend-label {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.78);
    font-family: var(--brand-font-body);
    font-size: 0.78rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .brand-trajectory-breakpoint-legend-row {
        grid-template-columns: auto 1fr;
        row-gap: var(--brand-space-1);
    }
    .brand-trajectory-breakpoint-legend-conf,
    .brand-trajectory-breakpoint-legend-time,
    .brand-trajectory-breakpoint-legend-label {
        grid-column: 2;
    }
}

/* ============================================================
   Vibration trajectory — selection header
   Keeps the device picker and ISO reference inside one ops panel.
   Flat hierarchy only: guide line, compact action, and a metadata
   strip. No nested card so the header stays tactical and light.
   ============================================================ */

.brand-trajectory-selection-grid {
    align-items: stretch;
}

.brand-trajectory-selection-grid > .mud-grid-item {
    display: flex;
}

.brand-trajectory-selection-grid > .mud-grid-item > * {
    width: 100%;
}

.brand-trajectory-device-select {
    width: min(100%, 460px);
    max-width: 460px;
}

.brand-trajectory-reference {
    position: relative;
    display: grid;
    align-content: start;
    gap: 10px;
    width: 100%;
    min-height: 100%;
    padding: 6px 0 4px 18px;
}

.brand-trajectory-reference::before {
    content: "";
    position: absolute;
    inset: 2px auto 2px 0;
    width: 1px;
    background: linear-gradient(
        180deg,
        rgba(201, 188, 107, 0.28),
        rgba(var(--mud-palette-primary-rgb), 0.18) 34%,
        rgba(var(--mud-palette-text-primary-rgb), 0.06) 100%
    );
    pointer-events: none;
}

.brand-trajectory-reference-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.brand-trajectory-reference-copy {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.brand-trajectory-reference-copy .brand-form-section-label {
    margin: 0;
}

.brand-trajectory-reference-title {
    margin: 0;
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-heading);
    font-size: clamp(1rem, 1.2vw, 1.18rem);
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.1;
}

.brand-trajectory-reference-action.mud-button-root {
    align-self: flex-start;
    min-width: 0;
    min-height: 31px;
    padding: 0 10px !important;
    border: 1px solid rgba(137, 158, 178, 0.14);
    border-radius: var(--brand-radius-sm);
    background: rgba(var(--mud-palette-background-grey-rgb), 0.22);
    box-shadow: none;
    color: var(--mud-palette-text-primary);
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    white-space: nowrap;
}

.brand-trajectory-reference-action.mud-button-root:hover,
.brand-trajectory-reference-action.mud-button-root:focus-visible {
    background: rgba(var(--mud-palette-background-grey-rgb), 0.34);
    border-color: rgba(137, 158, 178, 0.22);
}

.brand-trajectory-reference-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0;
    padding-top: 10px;
    border-top: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
}

.brand-trajectory-reference-fact {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding-right: 14px;
}

.brand-trajectory-reference-fact + .brand-trajectory-reference-fact {
    padding-left: 14px;
    border-left: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
}

.brand-trajectory-reference-fact-label {
    color: rgba(var(--mud-palette-text-secondary-rgb), 0.88);
    font-family: var(--brand-font-data);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.brand-trajectory-reference-fact-value {
    color: rgba(var(--mud-palette-text-primary-rgb), 0.88);
    font-family: var(--brand-font-data);
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
    text-transform: none;
    word-break: break-word;
}

.is-light-mode .brand-trajectory-reference::before {
    background: linear-gradient(
        180deg,
        rgba(201, 188, 107, 0.36),
        rgba(59, 130, 246, 0.18) 34%,
        rgba(148, 163, 184, 0.12) 100%
    );
}

.is-light-mode .brand-trajectory-reference-title {
    color: #0f172a;
}

.is-light-mode .brand-trajectory-reference-action.mud-button-root {
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(119, 136, 156, 0.18);
    color: #334155;
}

.is-light-mode .brand-trajectory-reference-action.mud-button-root:hover,
.is-light-mode .brand-trajectory-reference-action.mud-button-root:focus-visible {
    background: rgba(241, 245, 249, 0.9);
    border-color: rgba(100, 116, 139, 0.28);
    color: #0f172a;
}

.is-light-mode .brand-trajectory-reference-fact-value {
    color: rgba(15, 23, 42, 0.88);
}

@media (max-width: 960px) {
    .brand-trajectory-device-select {
        width: 100%;
        max-width: none;
    }

    .brand-trajectory-reference {
        padding-top: 2px;
        padding-left: 0;
    }

    .brand-trajectory-reference::before {
        display: none;
    }
}

@media (max-width: 720px) {
    .brand-trajectory-reference-head {
        flex-direction: column;
        align-items: stretch;
    }

    .brand-trajectory-reference-action.mud-button-root {
        align-self: flex-start;
    }

    .brand-trajectory-reference-facts {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .brand-trajectory-reference-fact {
        padding-right: 0;
    }

    .brand-trajectory-reference-fact + .brand-trajectory-reference-fact {
        padding-top: 10px;
        padding-left: 0;
        border-top: 1px solid rgba(var(--mud-palette-text-primary-rgb), 0.08);
        border-left: 0;
    }
}

/* ===== Decoder Studio ===== */
/* The code editor + decoded-output panel reuse the mono data font so the
   authoring surface reads like the rest of the data layer rather than a generic
   form field. No new frame — they sit inside the dialog's existing surface. */
.decoder-studio-code textarea {
    font-family: var(--brand-font-data);
    font-size: 0.78rem;
    line-height: 1.5;
    letter-spacing: 0;
    tab-size: 4;
}

.decoder-studio-output {
    font-family: var(--brand-font-data);
    font-size: 0.74rem;
    line-height: 1.45;
    margin: 0;
    padding: var(--brand-space-3);
    background: rgba(8, 15, 24, 0.55);
    border: 1px solid var(--brand-border);
    border-radius: var(--brand-radius-md);
    max-height: 240px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
}


/* ============================================================================
   Panel edge treatment — option C (chosen in /panel-lab).
   The top-right corner bracket matches the border weight/colour (mono) rather
   than the amber HUD accent, and the panel topline is off (see
   --brand-panel-topline above). One coherent machined frame instead of a card
   with a coloured decoration. Appended last so it wins the border colour on the
   ::after brackets defined earlier; size/position are left intact.
   ============================================================================ */
.brand-dashboard-topbar-shell::after,
.brand-dashboard-widget-shell::after,
.brand-ops-panel::after,
.brand-home-kpi-card::after,
.brand-equipment-card::after,
.brand-map-canvas .maplibregl-ctrl-group::after,
.brand-dashboard-map-canvas .maplibregl-ctrl-group::after,
.airgemba-map-popup__shell::after,
.brand-thinking-terminal::after,
.brand-plan-checklist::after {
    border-top-color: var(--brand-border-strong);
    border-right-color: var(--brand-border-strong);
}


/* ============================================================================
   Flat elevation, app-wide — kill MudBlazor's default .mud-elevation-* drop
   shadow on in-content surfaces.

   MudBlazor applies elevation via a compound selector (`.mud-paper.mud-elevation-N`,
   higher specificity than a single brand class), so our per-surface flat overrides
   lost to it. The shadow is a dark rgba — invisible on the dark surface, but clearly
   floaty in light mode (the "shadows everywhere" report). All routed page content
   renders under `.brand-main-content .brand-content-shell`; dialogs, popovers,
   drawers and snackbars render OUTSIDE it (in the overlay providers at root), so they
   keep their explicit -float lift. This 3-class selector beats MudBlazor's elevation
   and reasserts the flat hairline (borders + corner bracket carry the structure).
   ============================================================================ */
.brand-main-content .brand-content-shell .mud-paper:not(.mud-alert):not(.mud-appbar),
.brand-main-content .brand-content-shell .mud-card {
    box-shadow: none !important;
}


/* ============================================================================
   Hard kill of MudBlazor's low-elevation drop shadow, globally.

   MudCard / MudPaper default to elevation 1; their `.mud-elevation-1..4` box-shadow
   was beating every scoped override. Overlays (dialog / popover / menu / drawer flyout)
   use elevation >= 6, so zeroing 1–5 leaves their lift intact. In-content framed
   surfaces get their flat hairline from the higher-specificity `.brand-content-shell`
   rule above. This is the blunt, load-order-proof lever behind the "shadows everywhere"
   report. Appended last so it wins every tie.
   ============================================================================ */
.brand-shell .mud-elevation-1,
.brand-shell .mud-elevation-2,
.brand-shell .mud-elevation-3,
.brand-shell .mud-elevation-4,
.brand-shell .mud-elevation-5 {
    box-shadow: none !important;
}


/* ============================================================================
   Mono weight cap — JetBrains Mono is loaded at 400 + 500 only (see App.razor).
   Anything using --brand-font-data at 600/700 was rendering as browser-synthesized
   FAUX-BOLD (smeared, most visible on large numerals). Cap every mono surface at the
   heaviest real face (500) so it renders crisp. Consolidated here (rather than editing
   ~19 scattered rules, several of which are byte-identical blocks) so the mono weight
   contract lives in one place. Barlow (headings/body/buttons) is untouched — it loads
   300–700, so its 600/700 are real. If you add a new mono element, keep it <= 500 or
   add it to this list.
   ============================================================================ */
.brand-error-boundary-title,
.mud-table-head .mud-table-cell,
.brand-model-detail-stat-value,
.brand-dashboard-widget-table thead th,
.brand-dashboard-table-widget .mud-table-head-cell,
.brand-dashboard-table-widget .mud-table-sort-label,
.brand-dashboard-progress-value,
.brand-dashboard-liquid-value,
.brand-dashboard-energy-value,
.brand-device-section-title,
.brand-device-detail-label,
.brand-rules-section-title,
.brand-rules-source-kicker,
.brand-iso-help-popover-label,
.brand-equipment-score,
#blazor-error-ui .blazor-error-reload,
.brand-thinking-terminal-kicker,
.brand-plan-checklist-kicker,
.brand-trajectory-reference-fact-value,
.brand-trajectory-reference-action.mud-button-root,
.brand-trajectory-breakpoint-legend-chip {
    font-weight: 500 !important;
}


/* ============================================================================
   Framed surfaces are fully flat — no drop shadow at all. The soft "floating card"
   look was our OWN brand-kit box-shadow (the 0 1px 3px hairline), not MudBlazor.
   Structure is carried entirely by the 1px border + the mono corner bracket. This
   covers the div-based shells too (topbar / map controls) that the .brand-content-shell
   .mud-paper selector doesn't match. Overlays keep -float via their own rules.
   ============================================================================ */
.brand-home-kpi-card,
.brand-equipment-card,
.brand-dashboard-widget-shell,
.brand-dashboard-topbar-shell,
.brand-ops-panel,
.brand-map-canvas .maplibregl-ctrl-group,
.brand-dashboard-map-canvas .maplibregl-ctrl-group {
    box-shadow: none !important;
}