: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(137, 158, 178, 0.1);
    --brand-border-strong: rgba(137, 158, 178, 0.18);
    --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);
    --brand-panel-topline: linear-gradient(90deg, rgba(201, 188, 107, 0.34), rgba(var(--mud-palette-primary-rgb), 0.16) 24%, rgba(148, 163, 184, 0.06) 58%, transparent 100%);
    --brand-shadow-soft: 0 8px 18px rgba(2, 6, 23, 0.18);
    --brand-shadow-card: 0 14px 30px rgba(2, 6, 23, 0.24);
    --brand-shadow-float: 0 20px 44px rgba(2, 6, 23, 0.3);
}

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 12px 28px rgba(2, 6, 23, 0.2);
    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-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 10px 22px rgba(2, 6, 23, 0.16) !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 12px 26px rgba(2, 6, 23, 0.2) !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 10px 22px rgba(2, 6, 23, 0.18) !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 12px 26px rgba(2, 6, 23, 0.24) !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;
}

.brand-shell.is-light-mode .mud-button-filled-secondary,
.brand-shell.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 8px 18px rgba(148, 163, 184, 0.12) !important;
}

.brand-shell.is-light-mode .mud-button-filled-secondary:hover,
.brand-shell.is-light-mode .mud-button-filled-default:hover,
.brand-shell.is-light-mode .mud-button-filled-secondary:focus-visible,
.brand-shell.is-light-mode .mud-button-filled-default:focus-visible,
.brand-shell.is-light-mode .mud-button-filled-secondary:active,
.brand-shell.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 10px 20px rgba(148, 163, 184, 0.14) !important;
}

.brand-shell.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 10px 22px rgba(148, 163, 184, 0.14) !important;
}

.brand-shell.is-light-mode .mud-button-filled-primary:hover,
.brand-shell.is-light-mode .mud-button-filled-primary:focus-visible,
.brand-shell.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 10px 20px rgba(148, 163, 184, 0.14) !important;
}

.brand-shell.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;
}

.brand-shell.is-light-mode .mud-button-outlined-primary:hover,
.brand-shell.is-light-mode .mud-button-outlined-primary:focus-visible,
.brand-shell.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;
}

.brand-shell.is-light-mode .mud-button-outlined-secondary,
.brand-shell.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;
}

.brand-shell.is-light-mode .mud-button-outlined-secondary:hover,
.brand-shell.is-light-mode .mud-button-outlined-default:hover,
.brand-shell.is-light-mode .mud-button-outlined-secondary:focus-visible,
.brand-shell.is-light-mode .mud-button-outlined-default:focus-visible,
.brand-shell.is-light-mode .mud-button-outlined-secondary:active,
.brand-shell.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;
}

.brand-shell.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;
}

.brand-shell.is-light-mode .mud-button-filled-secondary.mud-disabled,
.brand-shell.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;
}

.brand-shell.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;
}

.brand-shell.is-light-mode .mud-button-outlined-secondary.mud-disabled,
.brand-shell.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);
}

.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 rgba(137, 158, 178, 0.12) !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 14px 28px rgba(2, 6, 23, 0.2) !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-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;
    width: 156px;
    min-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);
}

.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: space-between;
    gap: 6px;
    width: 100%;
    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%;
    justify-content: space-between;
}

.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 rgba(137, 158, 178, 0.12) !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 14px 28px rgba(2, 6, 23, 0.2) !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 10px 18px rgba(8, 15, 24, 0.08);
}

.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-data);
    font-size: 0.72rem !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.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-dashboard-widget-table {
    position: relative;
    z-index: 1;
}

.brand-dashboard-widget-table thead th {
    color: var(--mud-palette-text-secondary);
    font-family: var(--brand-font-body);
    font-size: 0.7rem;
    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-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;
}

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

.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 10px 22px rgba(2, 6, 23, 0.12) !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-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 rgba(137, 158, 178, 0.11) !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 14px 28px rgba(2, 6, 23, 0.2) !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-table-host .mud-table-toolbar .mud-input-control {
    width: min(100%, 300px);
}

.brand-device-table-search {
    max-width: 300px;
}

.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-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;
}

.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;
}

.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-rules-section-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

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

    .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-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-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-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 14px 30px rgba(2, 6, 23, 0.22) !important;
    border: 1px solid rgba(137, 158, 178, 0.11) !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-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 {
    background: rgba(var(--mud-palette-surface-rgb), 0.97);
    color: var(--mud-palette-text-primary);
    border-top: 1px solid rgba(var(--mud-palette-primary-rgb), 0.16);
    box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.08);
}

@media (max-width: 959.98px) {
    .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: 320px;
    max-height: 320px;
    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;
    /* Strong fade — start fully transparent at the top, ramp to fully
       opaque at the bottom so the most-recent line is crisp and older
       lines visibly recede into the panel chrome. */
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.18) 12%, rgba(0, 0, 0, 0.65) 38%, rgba(0, 0, 0, 1) 70%);
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.18) 12%, rgba(0, 0, 0, 0.65) 38%, rgba(0, 0, 0, 1) 70%);
    /* 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.18) transparent;
}

.brand-thinking-terminal-body::-webkit-scrollbar {
    width: 6px;
}

.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.18);
    border-radius: 3px;
}

.brand-thinking-terminal-body::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--mud-palette-text-primary-rgb), 0.28);
}

.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;
    }
}