:root {
    --theme-bg: #fff8f1;
    --theme-bg-alt: #fff1e5;
    --theme-nav-bg: rgba(255, 255, 255, 0.9);
    --theme-panel-bg: rgba(255, 255, 255, 0.92);
    --theme-card-bg: #fff4e8;
    --theme-card-bg-strong: #ffffff;
    --theme-border: rgba(15, 23, 42, 0.12);
    --theme-border-soft: rgba(15, 23, 42, 0.08);
    --theme-text: #17120d;
    --theme-heading: #111827;
    --theme-muted: #5f6775;
    --theme-accent: #f97316;
    --theme-accent-strong: #ea580c;
    --theme-accent-bg: rgba(249, 115, 22, 0.12);
    --theme-accent-faint: rgba(249, 115, 22, 0.07);
    --theme-pill-bg: rgba(255, 255, 255, 0.78);
    --theme-danger: #dc2626;
    --theme-danger-bg: rgba(220, 38, 38, 0.1);
    --theme-success: #15803d;
    --theme-success-bg: rgba(21, 128, 61, 0.1);
    --theme-warning: #b45309;
    --theme-warning-bg: rgba(217, 119, 6, 0.14);
    --radius-sm: 12px;
    --radius-md: 18px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --shadow-soft: 0 18px 44px rgba(15, 23, 42, 0.08);
    --shadow-pop: 0 26px 56px rgba(249, 115, 22, 0.16);
    --shadow-tight: 0 10px 24px rgba(15, 23, 42, 0.08);
    --transition-fast: 0.18s ease;
    --transition-med: 0.28s ease;
    --font-sans: "Aptos", "Segoe UI Variable Display", "Trebuchet MS", "Segoe UI", sans-serif;
}

html body.theme-blue {
    --theme-bg: #fff8f2 !important;
    --theme-bg-alt: #fff1e4 !important;
    --theme-nav-bg: rgba(255, 255, 255, 0.9) !important;
    --theme-panel-bg: rgba(255, 255, 255, 0.93) !important;
    --theme-card-bg: #fff4e7 !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(15, 23, 42, 0.13) !important;
    --theme-border-soft: rgba(15, 23, 42, 0.08) !important;
    --theme-text: #17120d !important;
    --theme-heading: #111827 !important;
    --theme-muted: #5f6775 !important;
    --theme-accent: #f97316 !important;
    --theme-accent-strong: #ea580c !important;
    --theme-accent-bg: rgba(249, 115, 22, 0.12) !important;
    --theme-accent-faint: rgba(249, 115, 22, 0.07) !important;
    --theme-pill-bg: rgba(255, 255, 255, 0.78) !important;
}

html body.theme-light {
    --theme-bg: #fffbf7 !important;
    --theme-bg-alt: #fff2e7 !important;
    --theme-nav-bg: rgba(255, 255, 255, 0.94) !important;
    --theme-panel-bg: rgba(255, 255, 255, 0.96) !important;
    --theme-card-bg: #fff6ec !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(15, 23, 42, 0.12) !important;
    --theme-border-soft: rgba(15, 23, 42, 0.08) !important;
    --theme-text: #17120d !important;
    --theme-heading: #0f172a !important;
    --theme-muted: #596170 !important;
    --theme-accent: #f97316 !important;
    --theme-accent-strong: #ea580c !important;
    --theme-accent-bg: rgba(249, 115, 22, 0.11) !important;
    --theme-accent-faint: rgba(249, 115, 22, 0.06) !important;
    --theme-pill-bg: rgba(255, 255, 255, 0.84) !important;
}

html body.theme-dark {
    --theme-bg: #020617 !important;
    --theme-bg-alt: #0f172a !important;
    --theme-nav-bg: rgba(6, 11, 23, 0.9) !important;
    --theme-panel-bg: rgba(8, 15, 28, 0.92) !important;
    --theme-card-bg: #0f1b2d !important;
    --theme-card-bg-strong: #111c31 !important;
    --theme-border: rgba(148, 163, 184, 0.2) !important;
    --theme-border-soft: rgba(148, 163, 184, 0.12) !important;
    --theme-text: #e5edf7 !important;
    --theme-heading: #f8fafc !important;
    --theme-muted: #9fb1c8 !important;
    --theme-accent: #f59e0b !important;
    --theme-accent-strong: #fb923c !important;
    --theme-accent-bg: rgba(245, 158, 11, 0.16) !important;
    --theme-accent-faint: rgba(245, 158, 11, 0.08) !important;
    --theme-pill-bg: rgba(15, 23, 42, 0.78) !important;
}

html body.theme-contrast {
    --theme-bg: #ffffff !important;
    --theme-bg-alt: #fff3e7 !important;
    --theme-nav-bg: rgba(255, 255, 255, 0.98) !important;
    --theme-panel-bg: #ffffff !important;
    --theme-card-bg: #fff5eb !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(0, 0, 0, 0.16) !important;
    --theme-border-soft: rgba(0, 0, 0, 0.08) !important;
    --theme-text: #0f0f0f !important;
    --theme-heading: #000000 !important;
    --theme-muted: #464646 !important;
    --theme-accent: #f97316 !important;
    --theme-accent-strong: #ea580c !important;
    --theme-accent-bg: rgba(249, 115, 22, 0.14) !important;
    --theme-accent-faint: rgba(249, 115, 22, 0.08) !important;
    --theme-pill-bg: rgba(255, 255, 255, 0.92) !important;
}

html body.theme-sand {
    --theme-bg: #fbf3e8 !important;
    --theme-bg-alt: #f7ebdc !important;
    --theme-nav-bg: rgba(255, 251, 244, 0.94) !important;
    --theme-panel-bg: rgba(255, 252, 247, 0.95) !important;
    --theme-card-bg: #fff7ec !important;
    --theme-card-bg-strong: #fffdf9 !important;
    --theme-border: rgba(28, 25, 23, 0.14) !important;
    --theme-border-soft: rgba(28, 25, 23, 0.08) !important;
    --theme-text: #1a1410 !important;
    --theme-heading: #111827 !important;
    --theme-muted: #62584e !important;
    --theme-accent: #f59e0b !important;
    --theme-accent-strong: #d97706 !important;
    --theme-accent-bg: rgba(245, 158, 11, 0.14) !important;
    --theme-accent-faint: rgba(245, 158, 11, 0.08) !important;
    --theme-pill-bg: rgba(255, 250, 242, 0.86) !important;
}

html body.theme-red {
    --theme-bg: #fff4f0 !important;
    --theme-bg-alt: #ffebe4 !important;
    --theme-nav-bg: rgba(255, 250, 248, 0.94) !important;
    --theme-panel-bg: rgba(255, 253, 251, 0.95) !important;
    --theme-card-bg: #fff6f1 !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(17, 24, 39, 0.13) !important;
    --theme-border-soft: rgba(17, 24, 39, 0.08) !important;
    --theme-text: #17120d !important;
    --theme-heading: #111827 !important;
    --theme-muted: #655f5f !important;
    --theme-accent: #f05a28 !important;
    --theme-accent-strong: #e14d1c !important;
    --theme-accent-bg: rgba(240, 90, 40, 0.12) !important;
    --theme-accent-faint: rgba(240, 90, 40, 0.06) !important;
    --theme-pill-bg: rgba(255, 255, 255, 0.82) !important;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    height: 100%;
    color-scheme: light;
    background: #fff8f1;
}

body {
    min-height: 100%;
    margin: 0;
    font-family: var(--font-sans);
    color: var(--theme-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(249, 115, 22, 0.18), transparent 34%),
        radial-gradient(circle at 88% 8%, rgba(251, 191, 36, 0.12), transparent 22%),
        linear-gradient(180deg, #fffdf9 0%, var(--theme-bg) 52%, #fff5ea 100%);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

html.app-loading,
html.app-loading body {
    min-height: 100%;
    overflow: hidden;
}

html.app-loading body > :not(.app-loading-indicator) {
    visibility: hidden !important;
}

.app-loading-indicator {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: grid;
    place-items: center;
    padding: 2rem;
    background:
        radial-gradient(circle at 24% 20%, rgba(249, 115, 22, 0.14), transparent 30%),
        linear-gradient(180deg, #fffdf9 0%, var(--theme-bg) 58%, #fff5ea 100%);
    opacity: 1;
    transition: opacity 0.28s ease, visibility 0.28s ease;
}

.app-loading-image {
    width: clamp(96px, 18vw, 180px);
    height: auto;
    animation: app-loading-pulse 1.15s ease-in-out infinite;
    filter: drop-shadow(0 18px 28px rgba(15, 23, 42, 0.16));
}

html.app-loaded .app-loading-indicator {
    visibility: hidden;
    opacity: 0;
}

html.dark-mode .app-loading-indicator,
html body.theme-dark .app-loading-indicator {
    background:
        radial-gradient(circle at 24% 20%, rgba(125, 184, 240, 0.14), transparent 30%),
        linear-gradient(180deg, #020617 0%, #0f172a 100%);
}

@keyframes app-loading-pulse {
    0%,
    100% {
        transform: scale(0.94);
        opacity: 0.74;
    }

    50% {
        transform: scale(1);
        opacity: 1;
    }
}

body::before,
body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

body::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.34)),
        linear-gradient(90deg, rgba(17, 24, 39, 0.035) 1px, transparent 1px),
        linear-gradient(rgba(17, 24, 39, 0.03) 1px, transparent 1px);
    background-size: auto, 44px 44px, 44px 44px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.4), transparent 85%);
}

body::after {
    background:
        radial-gradient(circle at 18% 22%, rgba(249, 115, 22, 0.08), transparent 18%),
        radial-gradient(circle at 78% 0%, rgba(17, 24, 39, 0.05), transparent 18%);
}

a {
    color: var(--theme-accent-strong);
    text-decoration: none;
}

a:hover {
    color: var(--theme-heading);
    text-decoration: underline;
}

button,
input,
select,
textarea {
    font: inherit;
}

img {
    max-width: 100%;
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.app-shell,
.workflow-shell,
.pole-shell,
.page,
.page-container {
    position: relative;
    z-index: 1;
}

.full-width {
    width: 100vw;
    margin-left: 50%;
    transform: translateX(-50%);
}

.app-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.app-main {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.5rem;
}

.page-container,
.page,
.pole-shell {
    width: min(1280px, calc(100% - 2.5rem));
    margin: 0 auto;
}

.page-container {
    padding: 2.4rem clamp(1.5rem, 2.6vw, 2.5rem) 3rem;
}

.page,
.pole-shell {
    padding: 2rem 0 3rem;
}

.app-nav {
    position: sticky;
    top: 0;
    z-index: 50;
    border-bottom: 1px solid var(--theme-border);
    background: var(--theme-nav-bg);
    backdrop-filter: blur(16px);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.04);
}

.app-nav-inner {
    width: min(1380px, calc(100% - 2.5rem));
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1rem 1.2rem;
    flex-wrap: wrap;
    padding: 0.95rem 0;
}

.app-header {
    overflow: hidden;
}

.app-header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(14, 116, 144, 0.1), transparent 42%),
        linear-gradient(90deg, rgba(15, 23, 42, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px);
    background-size: auto, 64px 64px, 64px 64px;
    opacity: 0.85;
}

.app-header::after {
    content: "";
    position: absolute;
    left: clamp(1rem, 5vw, 5rem);
    right: clamp(1rem, 5vw, 5rem);
    bottom: 0;
    z-index: 1;
    height: 3px;
    pointer-events: none;
    background: linear-gradient(90deg, #2563eb, #0e7490 46%, #c2410c);
    opacity: 0.9;
}

.app-header-inner {
    position: relative;
    z-index: 2;
    align-items: center;
    padding-block: 0.88rem !important;
}

.app-header-brand {
    display: flex;
    align-items: center;
    gap: clamp(0.8rem, 2vw, 1.25rem);
    min-width: min(100%, 520px);
}

.app-header-context {
    display: grid;
    gap: 0.22rem;
    min-width: min(36vw, 410px);
    padding-left: clamp(0.75rem, 1.7vw, 1.2rem);
    border-left: 1px solid rgba(15, 23, 42, 0.14);
}

.app-header-title {
    margin: 0;
    color: var(--theme-heading);
    font-family: var(--font-sans);
    font-size: clamp(1.18rem, 1.7vw, 1.58rem);
    line-height: 1;
    font-weight: 850;
    letter-spacing: 0;
}

.app-header-subtitle {
    margin: 0;
    max-width: 42rem;
    color: var(--theme-muted);
    font-size: 0.84rem;
    font-weight: 750;
    line-height: 1.25;
}

.app-nav-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
    color: var(--theme-muted);
    font-size: 0.875rem;
}

.app-nav-actions > span {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid var(--theme-border-soft);
}

.logo {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0;
    flex: 0 0 auto;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--theme-heading);
    line-height: 1;
    --logo-width: clamp(320px, 34vw, 500px);
    --logo-aspect: 5 / 1;
    --logo-image: url("../ggg.png");
    --logo-position: left center;
    --logo-size: contain;
    --logo-filter: none;
}

.app-nav .logo {
    --logo-width: clamp(280px, 24vw, 420px);
    --logo-aspect: 1036 / 226;
    --logo-image: url("../assets/ggg-nav.png");
    --logo-position: left center;
    --logo-size: contain;
    --logo-filter: drop-shadow(0 10px 18px rgba(15, 23, 42, 0.08));
}

.logo::before {
    content: "";
    display: block;
    width: var(--logo-width);
    aspect-ratio: var(--logo-aspect);
    background-image: var(--logo-image);
    background-position: var(--logo-position);
    background-repeat: no-repeat;
    background-size: var(--logo-size);
    filter: var(--logo-filter);
}

html.dark-mode body .app-nav .logo,
html body.theme-dark .app-nav .logo {
    --logo-image: url("../assets/ggg-night-nav.png");
    --logo-position: left center;
    --logo-size: contain;
    --logo-filter: drop-shadow(0 14px 24px rgba(2, 6, 23, 0.18));
}

.logo-mark {
    display: none;
}

.logo-mark::before {
    content: none;
}

.logo-mark::after {
    content: none;
}

.logo > :not(.logo-mark) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.logo-text-primary {
    color: var(--theme-heading);
}

.logo-text-accent {
    color: var(--theme-accent-strong);
}

.nav-pill,
.app-nav .app-nav-actions a,
.app-nav .app-nav-actions a:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 42px;
    padding: 0.65rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--theme-border);
    background: var(--theme-pill-bg);
    color: var(--theme-text);
    text-decoration: none;
    transition:
        transform var(--transition-fast),
        border-color var(--transition-fast),
        background var(--transition-fast),
        box-shadow var(--transition-fast),
        color var(--transition-fast);
}

.nav-pill:hover,
.app-nav .app-nav-actions a:hover {
    transform: translateY(-1px);
    border-color: rgba(249, 115, 22, 0.35);
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(249, 115, 22, 0.12);
    color: var(--theme-heading);
    text-decoration: none;
}

.nav-pill:active,
.app-nav .app-nav-actions a:active {
    transform: translateY(0) scale(0.99);
}

.nav-pill-dot {
    width: 10px;
    height: 10px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.28);
    box-shadow: 0 0 0 4px rgba(17, 24, 39, 0.06);
}

.nav-pill.is-active,
.app-nav .app-nav-actions a.is-active {
    border-color: rgba(249, 115, 22, 0.45);
    background: rgba(249, 115, 22, 0.12);
    color: var(--theme-heading);
    box-shadow: 0 10px 24px rgba(249, 115, 22, 0.12);
}

.nav-pill.is-active .nav-pill-dot,
.app-nav .app-nav-actions a.is-active .nav-pill-dot {
    background: var(--theme-accent);
    box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.14);
}

.nav-pill.is-danger:hover,
.app-nav .app-nav-actions a.is-danger:hover {
    border-color: rgba(220, 38, 38, 0.28);
    box-shadow: 0 10px 20px rgba(220, 38, 38, 0.09);
}

.pole-lookup {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.pole-lookup-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 42px;
    padding: 0.62rem 1.05rem;
    border: 1px solid rgba(15, 23, 42, 0.2);
    border-radius: 12px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.2), transparent),
        linear-gradient(135deg, #111827, #334155);
    color: #ffffff;
    font-weight: 800;
    letter-spacing: 0;
    box-shadow:
        0 12px 26px rgba(15, 23, 42, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
    cursor: pointer;
    white-space: nowrap;
    transition:
        transform var(--transition-fast),
        border-color var(--transition-fast),
        background var(--transition-fast),
        box-shadow var(--transition-fast);
}

.pole-lookup-icon {
    position: relative;
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    border: 2px solid currentColor;
    border-radius: 50%;
    opacity: 0.92;
}

.pole-lookup-icon::after {
    content: "";
    position: absolute;
    right: -5px;
    bottom: -4px;
    width: 7px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(45deg);
    transform-origin: left center;
}

.pole-lookup-toggle:hover,
.pole-lookup-toggle:focus-visible,
.pole-lookup-toggle.is-active,
.pole-lookup.is-active .pole-lookup-toggle,
.pole-lookup.is-open .pole-lookup-toggle {
    transform: translateY(-1px);
    border-color: rgba(249, 115, 22, 0.55);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent),
        linear-gradient(135deg, #0f172a, var(--theme-accent-strong));
    box-shadow:
        0 14px 30px rgba(249, 115, 22, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
    outline: none;
}

.pole-lookup-toggle.is-active,
.pole-lookup.is-active .pole-lookup-toggle {
    border-color: rgba(59, 130, 246, 0.65);
    box-shadow:
        0 14px 30px rgba(59, 130, 246, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.pole-lookup-panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    width: min(360px, calc(100vw - 2rem));
    display: grid;
    gap: 0.55rem;
    padding: 0.65rem;
    border: 1px solid var(--theme-border);
    border-radius: 12px;
    background: var(--theme-panel-bg);
    box-shadow: var(--shadow-soft);
    backdrop-filter: blur(16px);
    z-index: 90;
}

.pole-lookup-panel[hidden] {
    display: none;
}

.pole-lookup-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem;
    align-items: center;
}

.pole-lookup-input {
    min-width: 0;
    min-height: 42px;
}

.pole-lookup-go {
    min-height: 42px;
    padding: 0 0.85rem;
    border: 1px solid rgba(249, 115, 22, 0.35);
    border-radius: 10px;
    background: var(--theme-accent);
    color: #ffffff;
    font-weight: 700;
    cursor: pointer;
    transition:
        transform var(--transition-fast),
        background var(--transition-fast),
        box-shadow var(--transition-fast);
}

.pole-lookup-go:hover,
.pole-lookup-go:focus-visible {
    transform: translateY(-1px);
    background: var(--theme-accent-strong);
    box-shadow: 0 10px 20px rgba(249, 115, 22, 0.18);
}

.pole-lookup-message {
    position: relative;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--theme-border-soft);
    border-radius: 10px;
    background: var(--theme-card-bg-strong);
    color: var(--theme-muted);
    font-size: 0.82rem;
    line-height: 1.35;
}

.pole-lookup-message.is-error {
    border-color: rgba(220, 38, 38, 0.28);
    background: var(--theme-danger-bg);
    color: var(--theme-danger);
}

.pole-lookup-suggestions {
    display: grid;
    gap: 0.25rem;
    max-height: 240px;
    overflow: auto;
}

.pole-lookup-option {
    width: 100%;
    min-height: 38px;
    padding: 0.55rem 0.65rem;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--theme-text);
    text-align: left;
    cursor: pointer;
    transition:
        background var(--transition-fast),
        color var(--transition-fast),
        transform var(--transition-fast);
}

.pole-lookup-option:hover,
.pole-lookup-option:focus-visible {
    background: var(--theme-accent-bg);
    color: var(--theme-heading);
    transform: translateY(-1px);
    outline: none;
}

html.dark-mode body .pole-lookup-panel,
html body.theme-dark .pole-lookup-panel {
    background: rgba(8, 15, 28, 0.96);
}

html.dark-mode body .pole-lookup-toggle,
html body.theme-dark .pole-lookup-toggle {
    border-color: rgba(245, 158, 11, 0.42);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent),
        linear-gradient(135deg, #f59e0b, #92400e);
    color: #111827;
    box-shadow:
        0 14px 30px rgba(245, 158, 11, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

html.dark-mode body .pole-lookup-toggle:hover,
html.dark-mode body .pole-lookup-toggle:focus-visible,
html.dark-mode body .pole-lookup-toggle.is-active,
html.dark-mode body .pole-lookup.is-active .pole-lookup-toggle,
html.dark-mode body .pole-lookup.is-open .pole-lookup-toggle,
html body.theme-dark .pole-lookup-toggle:hover,
html body.theme-dark .pole-lookup-toggle:focus-visible,
html body.theme-dark .pole-lookup-toggle.is-active,
html body.theme-dark .pole-lookup.is-active .pole-lookup-toggle,
html body.theme-dark .pole-lookup.is-open .pole-lookup-toggle {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent),
        linear-gradient(135deg, #fbbf24, #f97316);
}

html.dark-mode body .pole-lookup-toggle.is-active,
html.dark-mode body .pole-lookup.is-active .pole-lookup-toggle,
html body.theme-dark .pole-lookup-toggle.is-active,
html body.theme-dark .pole-lookup.is-active .pole-lookup-toggle {
    border-color: rgba(96, 165, 250, 0.78);
    box-shadow:
        0 14px 30px rgba(96, 165, 250, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

html.dark-mode body .pole-lookup-message,
html body.theme-dark .pole-lookup-message {
    background: rgba(15, 23, 42, 0.9);
}

@media (max-width: 720px) {
    .pole-lookup {
        width: 100%;
    }

    .pole-lookup-toggle {
        width: 100%;
    }

    .pole-lookup-panel {
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        width: min(340px, calc(100vw - 1.5rem));
    }
}

.admin-nav-dropdown {
    position: relative;
    display: inline-flex;
}

.admin-nav-trigger {
    cursor: pointer;
    user-select: none;
    text-decoration: none;
}

.admin-nav-caret {
    width: 0.52rem;
    height: 0.52rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-1px);
    transition: transform var(--transition-fast);
    opacity: 0.72;
}

.admin-nav-dropdown:hover .admin-nav-caret,
.admin-nav-dropdown:focus-within .admin-nav-caret {
    transform: rotate(225deg) translateY(-1px);
}

.admin-nav-menu {
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    min-width: 240px;
    display: grid;
    gap: 0.25rem;
    padding: 0.5rem;
    border: 1px solid var(--theme-border);
    border-radius: 16px;
    background: var(--theme-panel-bg);
    box-shadow: var(--shadow-soft);
    backdrop-filter: blur(16px);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition:
        opacity var(--transition-fast),
        visibility var(--transition-fast),
        transform var(--transition-fast);
    z-index: 80;
}

.admin-nav-dropdown:hover .admin-nav-menu,
.admin-nav-dropdown:focus-within .admin-nav-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.admin-nav-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.72rem 0.82rem;
    border-radius: 12px;
    color: var(--theme-text);
    text-decoration: none;
    transition:
        background var(--transition-fast),
        color var(--transition-fast),
        transform var(--transition-fast);
}

.admin-nav-item:hover,
.admin-nav-item:focus-visible,
.admin-nav-item.is-active {
    background: var(--theme-accent-bg);
    color: var(--theme-heading);
    text-decoration: none;
}

.admin-nav-item:hover,
.admin-nav-item:focus-visible {
    transform: translateY(-1px);
}

.admin-nav-item-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.26);
    box-shadow: 0 0 0 4px rgba(17, 24, 39, 0.05);
}

.admin-nav-item.is-active .admin-nav-item-dot,
.admin-nav-item:hover .admin-nav-item-dot,
.admin-nav-item:focus-visible .admin-nav-item-dot {
    background: var(--theme-accent);
    box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.14);
}

.theme-switcher {
    display: inline-flex;
    align-items: center;
    padding-left: 0.9rem;
    margin-left: 0.2rem;
    border-left: 1px solid var(--theme-border);
}

.theme-mode-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 36px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.theme-mode-toggle:focus-visible {
    outline: 2px solid var(--theme-accent);
    outline-offset: 4px;
    border-radius: 999px;
}

.theme-mode-track {
    position: relative;
    display: block;
    width: 66px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.28);
    background: linear-gradient(135deg, #fde68a 0%, #f59e0b 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        0 10px 24px rgba(245, 158, 11, 0.2);
    transition:
        background var(--transition-med),
        border-color var(--transition-med),
        box-shadow var(--transition-med),
        transform var(--transition-fast);
}

.theme-mode-toggle:hover .theme-mode-track {
    transform: translateY(-1px);
}

.theme-mode-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 2;
    transition: color var(--transition-med), opacity var(--transition-med);
}

.theme-mode-icon svg {
    width: 12px;
    height: 12px;
    display: block;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.theme-mode-icon--sun {
    left: 9px;
    color: #92400e;
}

.theme-mode-icon--moon {
    right: 9px;
    color: rgba(120, 53, 15, 0.62);
}

.theme-mode-thumb {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(180deg, #ffffff 0%, #fff7db 100%);
    box-shadow:
        0 8px 18px rgba(120, 53, 15, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.85);
    transition:
        transform var(--transition-med),
        background var(--transition-med),
        box-shadow var(--transition-med);
    z-index: 1;
}

.theme-mode-thumb::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.16);
    transition:
        width var(--transition-med),
        height var(--transition-med),
        background var(--transition-med),
        box-shadow var(--transition-med);
}

.card,
.panel,
.pole-card,
.dashboard-section,
.dashboard-panel,
.project-card,
.upload-panel,
.pole-detail-card,
.scan-card,
.view-bar,
.view-builder,
.view-builder-section,
.view-picker-menu,
.module-card,
.module-column,
.dash-manage-item,
.arcgis-manage-item,
.arcgis-manage-card,
.dash-modal-card,
.section-modal-card,
.modal-content,
.image-modal-bg {
    position: relative;
    border-radius: var(--radius-lg);
    border: 1px solid var(--theme-border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 249, 243, 0.92));
    box-shadow: var(--shadow-soft);
    color: var(--theme-text);
}

.card::before,
.panel::before,
.project-card::before,
.dashboard-panel::before,
.dashboard-section::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at top right, rgba(249, 115, 22, 0.08), transparent 34%);
    pointer-events: none;
}

.card {
    padding: 1.75rem;
    overflow: hidden;
}

.card-inner {
    position: relative;
    z-index: 1;
}

.card-pill-row,
.hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.card-pill,
.hero-stat,
.project-badge,
.badge,
.view-picker-default,
.pill-status,
.dash-manage-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.72rem;
    border-radius: 999px;
    border: 1px solid rgba(249, 115, 22, 0.18);
    background: rgba(249, 115, 22, 0.08);
    color: var(--theme-heading);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.alert,
.form-message,
.dash-msg,
.arcgis-manage-msg,
.arcgis-filter-saved-msg,
.small-muted {
    color: var(--theme-muted);
}

.alert {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.8rem 0.95rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.72);
    margin-bottom: 1rem;
}

.alert-danger {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.2);
    color: #991b1b;
}

.alert-success {
    background: rgba(21, 128, 61, 0.08);
    border-color: rgba(21, 128, 61, 0.2);
    color: #166534;
}

.form-title,
.page-title,
.project-name,
.panel-title,
.module-title,
.module-item-title,
.pole-title {
    color: var(--theme-heading);
}

.form-title {
    font-size: 1.18rem;
    font-weight: 700;
    margin: 0 0 0.4rem;
}

.form-subtitle,
.page-subtitle,
.small-muted,
.project-meta,
.panel-subtitle,
.upload-meta,
.project-footer {
    color: var(--theme-muted);
}

.form-subtitle,
.page-subtitle {
    font-size: 0.92rem;
    line-height: 1.6;
}

.form-group {
    margin-bottom: 1rem;
}

.form-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.45rem;
    font-size: 0.82rem;
    color: var(--theme-muted);
}

.form-label span {
    color: var(--theme-heading);
    font-weight: 600;
}

.form-input,
.input,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
select,
textarea {
    width: 100%;
    padding: 0.78rem 0.95rem;
    border-radius: 14px;
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.9);
    color: var(--theme-text);
    outline: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
    transition:
        border-color var(--transition-fast),
        box-shadow var(--transition-fast),
        background var(--transition-fast),
        transform var(--transition-fast);
}

.form-input::placeholder,
.input::placeholder,
textarea::placeholder,
input::placeholder {
    color: rgba(95, 103, 117, 0.75);
}

.form-input:focus,
.input:focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):focus,
select:focus,
textarea:focus {
    border-color: rgba(249, 115, 22, 0.55);
    background: #ffffff;
    box-shadow:
        0 0 0 4px rgba(249, 115, 22, 0.1),
        0 6px 18px rgba(249, 115, 22, 0.08);
    transform: translateY(-1px);
}

.form-aux {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1.3rem;
    font-size: 0.82rem;
    color: var(--theme-muted);
}

.form-checkbox-wrap {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.form-checkbox,
input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: var(--theme-accent);
}

.btn,
.btn-primary,
.btn-secondary,
.btn-ghost,
.btn-ghost-soft,
.btn-primary-soft,
.saved-btn,
.arcgis-map-btn,
.arcgis-table-btn,
.view-picker-btn,
.view-picker-tab,
.pole-scope-btn,
.filter-add,
.dash-filter-add,
.arcgis-filter-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 42px;
    padding: 0.7rem 1.15rem;
    border-radius: 999px;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition:
        transform var(--transition-fast),
        box-shadow var(--transition-fast),
        border-color var(--transition-fast),
        background var(--transition-fast),
        color var(--transition-fast),
        filter var(--transition-fast);
}

.btn-primary,
.btn-primary-soft,
.arcgis-map-btn--primary,
.arcgis-filter-add,
.filter-add,
.dash-filter-add {
    background: linear-gradient(135deg, #fb923c, var(--theme-accent));
    color: #ffffff;
    border-color: rgba(234, 88, 12, 0.2);
    box-shadow: 0 16px 30px rgba(249, 115, 22, 0.22);
}

.btn-primary:hover,
.btn-primary-soft:hover,
.arcgis-map-btn--primary:hover,
.arcgis-filter-add:hover,
.filter-add:hover,
.dash-filter-add:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-pop);
    filter: saturate(1.02);
    text-decoration: none;
}

.btn-primary:active,
.btn-primary-soft:active,
.arcgis-map-btn--primary:active {
    transform: translateY(0) scale(0.99);
}

.btn-ghost,
.btn-ghost-soft,
.btn-secondary,
.saved-btn,
.arcgis-map-btn,
.arcgis-table-btn,
.view-picker-btn,
.view-picker-tab,
.pole-scope-btn {
    border-color: var(--theme-border);
    background: rgba(255, 255, 255, 0.82);
    color: var(--theme-text);
    box-shadow: var(--shadow-tight);
}

.btn-ghost:hover,
.btn-ghost-soft:hover,
.btn-secondary:hover,
.saved-btn:hover,
.arcgis-map-btn:hover,
.arcgis-table-btn:hover,
.view-picker-btn:hover,
.view-picker-tab:hover,
.pole-scope-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(249, 115, 22, 0.32);
    background: #ffffff;
    color: var(--theme-heading);
    text-decoration: none;
}

.btn-small {
    min-height: 38px;
    padding: 0.55rem 0.95rem;
    font-size: 0.82rem;
}

.danger-text {
    color: var(--theme-danger) !important;
}

.page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.2rem;
    margin-bottom: 1.8rem;
}

.page-title-wrap {
    display: grid;
    gap: 0.4rem;
}

.page-title {
    margin: 0;
    font-size: clamp(1.7rem, 2.5vw, 2.2rem);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: 0;
}

.page-subtitle {
    margin: 0;
    max-width: 52rem;
}

.login-grid {
    width: min(1180px, 100%);
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.95fr);
    gap: 2.5rem;
    align-items: stretch;
}

.login-hero {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.2rem;
    padding: 2rem 0;
}

.login-hero .logo {
    --logo-width: clamp(320px, 34vw, 460px);
}

.login-hero .logo::before {
    width: var(--logo-width);
}

.login-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(249, 115, 22, 0.16);
    background: rgba(255, 255, 255, 0.68);
    color: var(--theme-heading);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    width: fit-content;
}

.kicker-pill {
    width: 30px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #111827, var(--theme-accent));
}

.login-title {
    margin: 0;
    font-size: clamp(2.6rem, 5vw, 4.2rem);
    line-height: 0.98;
    letter-spacing: 0;
    color: var(--theme-heading);
}

.login-subtitle {
    margin: 0;
    max-width: 38rem;
    font-size: 1rem;
    line-height: 1.75;
    color: var(--theme-muted);
}

.hero-stats {
    margin-top: 0.6rem;
}

.hero-stat {
    padding-inline: 0.9rem;
    background: rgba(255, 255, 255, 0.72);
    border-color: var(--theme-border);
    color: var(--theme-heading);
}

.projects-grid,
.dashboard-grid,
.dashboard-section-grid,
.module-grid,
.preview-grid,
.report-grid {
    display: grid;
    gap: 1.2rem;
}

.projects-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.project-card {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    padding: 1.25rem;
    overflow: hidden;
}

.project-card:hover {
    transform: translateY(-3px);
    border-color: rgba(249, 115, 22, 0.3);
    box-shadow: var(--shadow-pop);
}

.project-name-row,
.project-footer,
.card-header,
.card-actions,
.dashboard-section-header,
.dashboard-section-controls,
.pole-header,
.pole-header-actions,
.view-actions,
.filter-actions,
.dash-filter-actions,
.arcgis-manage-actions,
.panel-header,
.module-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.project-name {
    font-size: 1rem;
    font-weight: 700;
}

.project-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    font-size: 0.84rem;
}

.project-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.subtle-link {
    color: var(--theme-accent-strong);
    border-bottom: 1px solid rgba(249, 115, 22, 0.25);
    padding-bottom: 1px;
}

.subtle-link:hover {
    border-bottom-color: rgba(17, 24, 39, 0.25);
}

.problem-poles-table,
.report-table,
.view-table,
.table,
.arcgis-data-table,
.dashboard-panel-body table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.9rem;
    color: var(--theme-text);
}

.problem-poles-table th,
.problem-poles-table td,
.report-table th,
.report-table td,
.view-table th,
.view-table td,
.table th,
.table td,
.arcgis-data-table th,
.arcgis-data-table td,
.dashboard-panel-body th,
.dashboard-panel-body td {
    padding: 0.82rem 0.9rem;
    border-bottom: 1px solid var(--theme-border-soft);
    background: rgba(255, 255, 255, 0.74);
}

.problem-poles-table th,
.report-table th,
.view-table th,
.table th,
.arcgis-data-table thead th,
.dashboard-panel-body th {
    text-align: left;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--theme-muted);
    background: rgba(255, 243, 230, 0.92);
}

.problem-poles-table tbody tr:hover td,
.report-table tbody tr:hover td,
.view-table tbody tr:hover td,
.table tbody tr:hover td,
.arcgis-data-table tbody tr:hover td,
.dashboard-panel-body tbody tr:hover td {
    background: rgba(249, 115, 22, 0.06);
}

.problem-poles-table tr:last-child td,
.report-table tr:last-child td,
.view-table tr:last-child td,
.table tr:last-child td,
.arcgis-data-table tr:last-child td,
.dashboard-panel-body tr:last-child td {
    border-bottom: none;
}

.pagination,
.table-pagination,
.arcgis-table-pagination,
.arcgis-manage-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pole-grid,
.pole-detail-layout {
    display: grid;
    gap: 1rem;
}

.pole-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
}

.info-list,
.pole-detail-list,
.scan-list,
.thumb-list,
.comment,
.note {
    display: grid;
    gap: 0.75rem;
}

.info-row,
.pole-row,
.form-row {
    display: grid;
    gap: 0.85rem;
    align-items: center;
}

.info-row,
.pole-row {
    grid-template-columns: 180px 1fr;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--theme-border-soft);
}

.info-row:last-child,
.pole-row:last-child {
    border-bottom: none;
}

.info-row strong,
.pole-row strong,
.view-label,
.module-item-meta,
.upload-title {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--theme-muted);
}

.pole-map,
.pole-detail-map,
.dashboard-map-embed,
.map-embed {
    width: 100%;
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 1px solid var(--theme-border);
    background: linear-gradient(180deg, #fffaf5, #fde8d0);
    box-shadow: var(--shadow-tight);
}

.dashboard-map-embed iframe,
.map-embed iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.note,
.comment,
.scan-card,
.file-row,
.existing-image,
.thumb,
.pole-detail-card {
    padding: 0.9rem 1rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.78);
}

.file-row,
.existing-image,
.thumb,
.dash-manage-row,
.module-item-actions,
.arcgis-manage-row-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.panel {
    min-height: calc(100vh - 120px);
}

.panel-header {
    padding: 1rem 1.15rem 0.9rem;
    border-bottom: 1px solid var(--theme-border-soft);
}

.panel-body {
    padding: 1rem 1.15rem 1.15rem;
    overflow: auto;
    flex: 1;
}

.workflow-grid {
    display: grid;
    gap: 1.2rem;
    padding: 1.2rem;
}

.view-bar,
.view-builder,
.dash-modal-card,
.arcgis-manage-card {
    padding: 1rem 1.1rem;
}

.view-bar,
.view-builder {
    margin-top: 0.9rem;
}

.view-bar-left,
.builder-controls,
.dashboard-actions,
.dashboard-controls,
.dashboard-panel-controls,
.filter-section-actions,
.arcgis-filter-saved-actions {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.view-picker {
    position: relative;
}

.view-picker-menu {
    width: min(360px, 92vw);
    padding: 0.9rem;
    z-index: 40;
}

.view-picker-tabs,
.module-modal-tabs {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.view-picker-tab.is-active,
.module-modal-tab.is-active,
.pole-scope-btn.is-active,
.view-picker-default.is-active {
    background: rgba(249, 115, 22, 0.13) !important;
    color: var(--theme-heading) !important;
    border-color: rgba(249, 115, 22, 0.28) !important;
    box-shadow: none !important;
}

.pole-scope-toggle,
.builder-controls,
.dashboard-section,
.dashboard-panel-body,
.module-column,
.arcgis-filter-saved,
.arcgis-filter-panel,
.arcgis-draw-panel,
.arcgis-table-shell,
.arcgis-table-toolbar,
.arcgis-manage-item {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 249, 243, 0.9));
}

.pole-scope-toggle,
.module-column,
.arcgis-filter-panel,
.arcgis-draw-panel,
.arcgis-table-shell,
.arcgis-filter-saved {
    border: 1px solid var(--theme-border);
    border-radius: var(--radius-md);
}

.filter-grid,
.filter-row,
.dash-filter-row,
.arcgis-filter-grid,
.arcgis-filter-row,
.view-builder-row {
    display: grid;
    gap: 0.55rem;
    align-items: center;
}

.filter-row,
.dash-filter-row {
    grid-template-columns: 80px 1fr 1fr 1.2fr 32px;
}

.arcgis-filter-grid,
.arcgis-filter-row {
    grid-template-columns: 90px 1fr 1fr 1.2fr 38px;
}

.view-builder-row {
    grid-template-columns: 1.2fr 1fr 1fr 90px auto;
}

.filter-remove,
.dash-filter-remove,
.arcgis-filter-remove,
.panel-remove {
    border: 1px solid rgba(220, 38, 38, 0.18);
    background: rgba(220, 38, 38, 0.08);
    color: #b91c1c;
    border-radius: 12px;
    cursor: pointer;
}

.filter-remove:hover,
.dash-filter-remove:hover,
.arcgis-filter-remove:hover,
.panel-remove:hover {
    background: rgba(220, 38, 38, 0.14);
}

.dash-modal,
.arcgis-manage-modal,
.section-modal,
.image-modal {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.22);
    backdrop-filter: blur(10px);
    z-index: 130;
}

.dash-modal-card,
.arcgis-manage-card,
.section-modal-card,
.modal-content {
    width: min(720px, 92vw);
    max-height: 90vh;
    overflow: auto;
}

.arcgis-manage-card {
    width: min(560px, 92vw);
}

.image-modal-bg {
    width: min(1200px, 96vw);
    padding: 1rem;
}

.module-card,
.module-column,
.module-item,
.module-item-body,
.table-field-box,
.table-field-picker {
    display: grid;
    gap: 0.75rem;
}

.module-column {
    min-height: 140px;
    padding: 1rem;
    border-style: dashed;
}

.module-column.is-drop-target {
    border-color: rgba(249, 115, 22, 0.42);
    background: rgba(249, 115, 22, 0.08);
}

.module-column-placeholder,
.arcgis-empty,
.arcgis-table-empty-state {
    color: var(--theme-muted);
}

.module-add-btn,
.module-column-plus {
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.88);
    color: var(--theme-accent-strong);
    box-shadow: var(--shadow-tight);
}

.module-add-btn {
    width: 46px;
    height: 46px;
    font-size: 1.35rem;
}

.module-column-plus {
    width: 38px;
    height: 38px;
    font-size: 1.15rem;
}

.small-muted,
.panel-subtitle,
.arcgis-table-page-info,
.arcgis-table-count {
    font-size: 0.84rem;
    line-height: 1.5;
}

.badge-open,
.pill-status--active {
    background: var(--theme-success-bg);
    border-color: rgba(21, 128, 61, 0.16);
    color: #166534;
}

.badge-progress,
.badge-waiting,
.pill-status--paused {
    background: var(--theme-warning-bg);
    border-color: rgba(180, 83, 9, 0.18);
    color: #9a3412;
}

.badge-closed,
.pill-status--closed {
    background: rgba(17, 24, 39, 0.06);
    border-color: rgba(17, 24, 39, 0.1);
    color: var(--theme-muted);
}

.app-footer {
    padding: 1rem 1.5rem 1.8rem;
    text-align: center;
    color: var(--theme-muted);
    font-size: 0.78rem;
}

.map-page,
.map-full-bleed {
    width: 100%;
}

.arcgis-map-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--theme-border);
    background: linear-gradient(180deg, #fffbf8, #fff0df);
    box-shadow: var(--shadow-soft);
}

.arcgis-map-view {
    width: 100%;
    height: 100%;
}

.arcgis-table-view,
.arcgis-table-scroll,
.arcgis-table-shell {
    background: rgba(255, 255, 255, 0.94);
}

.arcgis-table-shell {
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow: hidden;
}

.arcgis-table-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--theme-border);
}

.arcgis-table-title {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--theme-heading);
}

.arcgis-table-title-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: radial-gradient(circle at 30% 30%, #fdba74, var(--theme-accent-strong) 65%, transparent 70%);
    box-shadow: 0 0 0 5px rgba(249, 115, 22, 0.12);
}

.arcgis-table-search,
.arcgis-table-meta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.arcgis-table-search {
    margin-left: auto;
}

.arcgis-table-wrap {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 360px;
    border-top: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.96);
    transition: transform 0.25s ease, opacity 0.2s ease;
    z-index: 5;
    box-shadow: 0 -16px 36px rgba(15, 23, 42, 0.08);
}

.arcgis-table-wrap.is-collapsed {
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
}

.arcgis-table-toggle {
    position: absolute;
    bottom: 16px;
    right: 16px;
    z-index: 10;
    padding: 0.65rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.9);
    color: var(--theme-heading);
    cursor: pointer;
    box-shadow: var(--shadow-tight);
    backdrop-filter: blur(12px);
}

.arcgis-table-toggle:hover {
    background: #ffffff;
}

.map-fullscreen-mode {
    position: relative;
    height: 100vh;
    overflow: hidden;
    --map-nav-height: 76px;
}

.map-stage {
    position: relative;
}

.map-fullscreen-mode .map-stage {
    position: fixed;
    top: var(--map-nav-height);
    left: 0;
    right: 0;
    height: calc(100vh - var(--map-nav-height));
    z-index: 1;
}

.map-stage .arcgis-map-card {
    height: 100%;
}

.map-fullscreen-mode .arcgis-map-card {
    border-radius: 0;
    border: none;
}

.map-fullscreen-mode .app-nav {
    position: fixed;
    left: 0;
    right: 0;
}

.map-project-overlay,
.project-map-pill {
    position: absolute;
    z-index: 20;
    max-width: 560px;
    padding: 1rem 1.15rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--shadow-soft);
    backdrop-filter: blur(14px);
}

.map-project-overlay {
    top: calc(72px + 1rem);
    left: 1.5rem;
}

.project-map-pill {
    top: 12px;
    right: 12px;
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.project-map-pill .pill-title {
    max-width: 320px;
    font-weight: 700;
    color: var(--theme-heading);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project-map-pill .pill-meta {
    color: var(--theme-muted);
    font-size: 0.82rem;
}

.project-map-pill .pill-divider {
    width: 1px;
    height: 22px;
    background: var(--theme-border);
}

.arcgis-map-card .esri-popup__main-container,
.arcgis-map-card .esri-popup__header,
.arcgis-map-card .esri-popup__content,
.arcgis-map-card .esri-popup__footer,
.arcgis-map-card .esri-feature__content,
.arcgis-map-card .esri-feature__main-container {
    background: rgba(255, 255, 255, 0.97) !important;
    color: var(--theme-text) !important;
}

.arcgis-map-card .esri-popup__main-container {
    border: 1px solid var(--theme-border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-soft) !important;
}

.arcgis-map-card .esri-popup__header {
    border-bottom: 1px solid var(--theme-border) !important;
}

.arcgis-map-card .esri-popup__header-title,
.arcgis-map-card .esri-popup__content,
.arcgis-map-card .esri-popup__main-container,
.arcgis-map-card .esri-widget,
.arcgis-map-card .esri-feature-fields {
    color: var(--theme-text) !important;
}

.arcgis-map-card .esri-attachments__list-item,
.arcgis-project-attachments {
    border-color: var(--theme-border) !important;
    background: rgba(255, 248, 240, 0.9) !important;
}

.arcgis-map-card .esri-attachments__title,
.arcgis-map-card .esri-attachments__list-item-title {
    color: var(--theme-muted) !important;
}

.arcgis-manage-modal,
.dash-modal {
    display: none;
    align-items: center;
    justify-content: center;
}

.arcgis-manage-modal.is-open,
.dash-modal.is-open {
    display: flex;
}

.arcgis-filter-panel,
.arcgis-draw-panel {
    position: absolute;
    top: 12px;
    right: 12px;
    width: min(520px, calc(100% - 24px));
    padding: 1rem;
    box-shadow: var(--shadow-soft);
}

.arcgis-draw-panel {
    max-width: 420px;
}

.arcgis-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.9rem;
}

.arcgis-filter-title {
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--theme-heading);
}

.arcgis-filter-close,
.arcgis-filter-clear {
    border: 1px solid var(--theme-border);
    background: rgba(255, 255, 255, 0.85);
    color: var(--theme-text);
    border-radius: 12px;
    cursor: pointer;
}

.arcgis-filter-suggest {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-tight);
    z-index: 15;
}

.arcgis-filter-suggest.is-hidden {
    display: none;
}

.arcgis-filter-suggest-item {
    width: 100%;
    text-align: left;
    padding: 0.7rem 0.85rem;
    border: none;
    border-bottom: 1px solid var(--theme-border-soft);
    background: rgba(255, 255, 255, 0.96);
    color: var(--theme-text);
    cursor: pointer;
}

.arcgis-filter-suggest-item:hover {
    background: rgba(249, 115, 22, 0.09);
}

.arcgis-draw-editing {
    margin-bottom: 0.8rem;
    padding: 0.8rem 0.95rem;
    border: 1px dashed rgba(249, 115, 22, 0.36);
    border-radius: 14px;
    background: rgba(249, 115, 22, 0.08);
}

.arcgis-draw-status {
    margin: 0.75rem 0 0.5rem;
    color: var(--theme-muted);
}

.arcgis-draw-status.is-error,
.arcgis-manage-msg.is-error,
.arcgis-filter-saved-msg.is-error,
.dash-msg.is-error {
    color: #b91c1c;
}

.arcgis-manage-msg.is-success,
.arcgis-filter-saved-msg.is-success,
.dash-msg.is-success {
    color: #166534;
}

.arcgis-manage-list,
.dash-manage-list {
    display: grid;
    gap: 0.75rem;
    max-height: 48vh;
    overflow: auto;
}

.arcgis-table-empty-state {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(6px);
}

.arcgis-table-shell.is-empty .arcgis-table-empty-state {
    display: flex;
}

.arcgis-table-shell.is-empty .arcgis-table-pagination {
    display: none;
}

html body[class] .app-nav {
    background: var(--theme-nav-bg) !important;
    border-bottom-color: var(--theme-border) !important;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.04) !important;
}

html body:not([class]) {
    color: var(--theme-text) !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(249, 115, 22, 0.18), transparent 34%),
        radial-gradient(circle at 88% 8%, rgba(251, 191, 36, 0.12), transparent 22%),
        linear-gradient(180deg, #fffdf9 0%, var(--theme-bg) 52%, #fff5ea 100%) !important;
}

html body:not([class]) a {
    color: var(--theme-accent-strong) !important;
}

html body:not([class]) a:hover {
    color: var(--theme-heading) !important;
}

html body[class] .app-nav .app-nav-actions :is(a, a:visited, .nav-pill) {
    background: var(--theme-pill-bg) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: var(--shadow-tight) !important;
}

html body[class] .app-nav .app-nav-actions :is(a, .nav-pill):hover {
    background: #ffffff !important;
    border-color: rgba(249, 115, 22, 0.32) !important;
    color: var(--theme-heading) !important;
}

html body[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) {
    background: var(--theme-accent-bg) !important;
    border-color: rgba(249, 115, 22, 0.34) !important;
    color: var(--theme-heading) !important;
}

html body[class] .app-nav .app-nav-actions :is(a, .nav-pill) .nav-pill-dot {
    background: rgba(17, 24, 39, 0.3) !important;
    box-shadow: 0 0 0 4px rgba(17, 24, 39, 0.06) !important;
}

html body[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) .nav-pill-dot {
    background: var(--theme-accent) !important;
    box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.14) !important;
}

html body[class] :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn) {
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
    background: rgba(255, 255, 255, 0.84) !important;
    box-shadow: var(--shadow-tight) !important;
}

html body:not([class]) :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn) {
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
    background: rgba(255, 255, 255, 0.84) !important;
    box-shadow: var(--shadow-tight) !important;
}

html body[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add) {
    color: #ffffff !important;
    border-color: rgba(234, 88, 12, 0.2) !important;
    background: linear-gradient(135deg, #fb923c, var(--theme-accent)) !important;
    box-shadow: 0 16px 30px rgba(249, 115, 22, 0.22) !important;
}

html body:not([class]) :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add) {
    color: #ffffff !important;
    border-color: rgba(234, 88, 12, 0.2) !important;
    background: linear-gradient(135deg, #fb923c, var(--theme-accent)) !important;
    box-shadow: 0 16px 30px rgba(249, 115, 22, 0.22) !important;
}

html body[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add):hover {
    background: linear-gradient(135deg, #fd9f53, var(--theme-accent-strong)) !important;
}

html body:not([class]) :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add):hover {
    background: linear-gradient(135deg, #fd9f53, var(--theme-accent-strong)) !important;
}

html body[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn):hover {
    background: #ffffff !important;
    border-color: rgba(249, 115, 22, 0.32) !important;
    color: var(--theme-heading) !important;
}

html body:not([class]) :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn):hover {
    background: #ffffff !important;
    border-color: rgba(249, 115, 22, 0.32) !important;
    color: var(--theme-heading) !important;
}

html body[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html body:not([class]) :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html body[class] :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .page-container, .project-map-pill) {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 248, 241, 0.93)) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: var(--shadow-soft) !important;
}

html body:not([class]) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .page-container, .project-map-pill) {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 248, 241, 0.93)) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: var(--shadow-soft) !important;
}

html body[class] :is(.project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge) {
    background: var(--theme-accent-bg) !important;
    border-color: rgba(249, 115, 22, 0.18) !important;
    color: var(--theme-heading) !important;
}

html body:not([class]) :is(.project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge) {
    background: var(--theme-accent-bg) !important;
    border-color: rgba(249, 115, 22, 0.18) !important;
    color: var(--theme-heading) !important;
}

html body[class] :is(.page-subtitle, .form-subtitle, .small-muted, .project-meta, .panel-subtitle, .upload-meta, .project-footer, .dashboard-panel-controls label, .builder-controls label, .filter-grid-header, .arcgis-filter-label, .arcgis-filter-saved label) {
    color: var(--theme-muted) !important;
}

html body:not([class]) :is(.page-subtitle, .form-subtitle, .small-muted, .project-meta, .panel-subtitle, .upload-meta, .project-footer, .dashboard-panel-controls label, .builder-controls label, .filter-grid-header, .arcgis-filter-label, .arcgis-filter-saved label) {
    color: var(--theme-muted) !important;
}

html body[class] :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th) {
    background: rgba(255, 243, 230, 0.94) !important;
    color: var(--theme-muted) !important;
    border-bottom-color: var(--theme-border) !important;
}

html body:not([class]) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th) {
    background: rgba(255, 243, 230, 0.94) !important;
    color: var(--theme-muted) !important;
    border-bottom-color: var(--theme-border) !important;
}

html body[class] :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td) {
    background: rgba(255, 255, 255, 0.76) !important;
    border-bottom-color: var(--theme-border-soft) !important;
    color: var(--theme-text) !important;
}

html body:not([class]) :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td) {
    background: rgba(255, 255, 255, 0.76) !important;
    border-bottom-color: var(--theme-border-soft) !important;
    color: var(--theme-text) !important;
}

html.dark-mode body,
html body.theme-dark {
    color-scheme: dark;
    color: var(--theme-text) !important;
    min-height: 100vh;
    background-color: #020617 !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(59, 130, 246, 0.18), transparent 24%),
        radial-gradient(circle at 85% 10%, rgba(245, 158, 11, 0.12), transparent 18%),
        linear-gradient(180deg, #08111f 0%, #040b16 48%, #020617 100%) !important;
    background-attachment: fixed;
}

html.dark-mode {
    background: #020617;
    color-scheme: dark;
}

html.dark-mode .app-shell,
html body.theme-dark .app-shell {
    min-height: 100vh;
}

html.dark-mode body::before,
html body.theme-dark::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.02)),
        linear-gradient(90deg, rgba(148, 163, 184, 0.05) 1px, transparent 1px),
        linear-gradient(rgba(148, 163, 184, 0.04) 1px, transparent 1px) !important;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), transparent 85%);
}

html.dark-mode body::after,
html body.theme-dark::after {
    background:
        radial-gradient(circle at 18% 22%, rgba(59, 130, 246, 0.08), transparent 18%),
        radial-gradient(circle at 78% 0%, rgba(245, 158, 11, 0.06), transparent 16%) !important;
}

html.dark-mode body[class] .app-nav,
html body.theme-dark[class] .app-nav {
    background: var(--theme-nav-bg) !important;
    border-bottom-color: var(--theme-border) !important;
    box-shadow: 0 14px 28px rgba(2, 6, 23, 0.34) !important;
}

html.dark-mode body[class] .app-nav .app-nav-actions :is(a, a:visited, .nav-pill),
html body.theme-dark[class] .app-nav .app-nav-actions :is(a, a:visited, .nav-pill) {
    background: var(--theme-pill-bg) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: 0 10px 22px rgba(2, 6, 23, 0.24) !important;
}

html.dark-mode body[class] .app-nav .app-nav-actions :is(a, .nav-pill):hover,
html body.theme-dark[class] .app-nav .app-nav-actions :is(a, .nav-pill):hover {
    background: rgba(30, 41, 59, 0.96) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
    color: var(--theme-heading) !important;
}

html.dark-mode body[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active),
html body.theme-dark[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) {
    background: var(--theme-accent-bg) !important;
    border-color: rgba(245, 158, 11, 0.34) !important;
    color: var(--theme-heading) !important;
}

html.dark-mode body[class] .app-nav .app-nav-actions :is(a, .nav-pill) .nav-pill-dot,
html body.theme-dark[class] .app-nav .app-nav-actions :is(a, .nav-pill) .nav-pill-dot {
    background: rgba(148, 163, 184, 0.55) !important;
    box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.08) !important;
}

html.dark-mode body[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) .nav-pill-dot,
html body.theme-dark[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) .nav-pill-dot {
    background: var(--theme-accent) !important;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.16) !important;
}

html.dark-mode body[class] :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn),
html body.theme-dark[class] :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn) {
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
    background: rgba(15, 23, 42, 0.82) !important;
    box-shadow: 0 12px 24px rgba(2, 6, 23, 0.28) !important;
}

html.dark-mode body[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add),
html body.theme-dark[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add) {
    color: #111827 !important;
    border-color: rgba(245, 158, 11, 0.32) !important;
    background: linear-gradient(135deg, #fbbf24, #f97316) !important;
    box-shadow: 0 16px 30px rgba(245, 158, 11, 0.24) !important;
}

html.dark-mode body[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add):hover,
html body.theme-dark[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add):hover {
    background: linear-gradient(135deg, #fcd34d, #fb923c) !important;
}

html.dark-mode body[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn):hover,
html body.theme-dark[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn):hover {
    background: rgba(30, 41, 59, 0.96) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
    color: var(--theme-heading) !important;
}

html.dark-mode body[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea),
html body.theme-dark[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    background: rgba(15, 27, 45, 0.9) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
}

html.dark-mode body[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea):focus,
html body.theme-dark[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea):focus {
    background: #122033 !important;
    border-color: rgba(245, 158, 11, 0.42) !important;
    box-shadow:
        0 0 0 4px rgba(245, 158, 11, 0.1),
        0 8px 20px rgba(2, 6, 23, 0.36) !important;
    color: var(--theme-heading) !important;
}

html.dark-mode body[class] :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .page-container, .project-map-pill),
html body.theme-dark[class] :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .page-container, .project-map-pill) {
    background: linear-gradient(180deg, rgba(13, 23, 39, 0.96), rgba(6, 14, 26, 0.96)) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: 0 20px 44px rgba(2, 6, 23, 0.42) !important;
}

html.dark-mode body[class] :is(.project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge),
html body.theme-dark[class] :is(.project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge) {
    background: var(--theme-accent-bg) !important;
    border-color: rgba(245, 158, 11, 0.24) !important;
    color: var(--theme-heading) !important;
}

html.dark-mode body[class] :is(.alert, .form-message, .dash-msg, .arcgis-manage-msg, .arcgis-filter-saved-msg),
html body.theme-dark[class] :is(.alert, .form-message, .dash-msg, .arcgis-manage-msg, .arcgis-filter-saved-msg) {
    background: rgba(15, 23, 42, 0.82) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html.dark-mode body[class] .alert-danger,
html body.theme-dark[class] .alert-danger {
    background: rgba(127, 29, 29, 0.24) !important;
    border-color: rgba(248, 113, 113, 0.28) !important;
    color: #fecaca !important;
}

html.dark-mode body[class] .alert-success,
html body.theme-dark[class] .alert-success {
    background: rgba(20, 83, 45, 0.24) !important;
    border-color: rgba(74, 222, 128, 0.26) !important;
    color: #bbf7d0 !important;
}

html.dark-mode body[class] :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th),
html body.theme-dark[class] :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th) {
    background: #122033 !important;
    color: var(--theme-muted) !important;
    border-bottom-color: var(--theme-border) !important;
}

html.dark-mode body[class] :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td),
html body.theme-dark[class] :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td) {
    background: rgba(7, 15, 28, 0.78) !important;
    border-bottom-color: var(--theme-border-soft) !important;
    color: var(--theme-text) !important;
}

html.dark-mode body[class] :is(.problem-poles-table tbody tr:hover td, .report-table tbody tr:hover td, .view-table tbody tr:hover td, .table tbody tr:hover td, .dashboard-panel-body tbody tr:hover td, .arcgis-data-table tbody tr:hover td),
html body.theme-dark[class] :is(.problem-poles-table tbody tr:hover td, .report-table tbody tr:hover td, .view-table tbody tr:hover td, .table tbody tr:hover td, .dashboard-panel-body tbody tr:hover td, .arcgis-data-table tbody tr:hover td) {
    background: rgba(245, 158, 11, 0.08) !important;
}

html.dark-mode body[class] .app-footer,
html body.theme-dark[class] .app-footer {
    color: var(--theme-muted) !important;
}

html.dark-mode body .theme-mode-track,
html body.theme-dark .theme-mode-track {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 58%, #334155 100%);
    border-color: rgba(148, 163, 184, 0.28);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 12px 24px rgba(2, 6, 23, 0.34);
}

html.dark-mode body .theme-mode-icon--sun,
html body.theme-dark .theme-mode-icon--sun {
    color: rgba(148, 163, 184, 0.42);
}

html.dark-mode body .theme-mode-icon--moon,
html body.theme-dark .theme-mode-icon--moon {
    color: #e2e8f0;
}

html.dark-mode body .theme-mode-thumb,
html body.theme-dark .theme-mode-thumb {
    transform: translateX(30px);
    background: linear-gradient(180deg, #e2e8f0 0%, #cbd5e1 100%);
    box-shadow:
        0 10px 20px rgba(2, 6, 23, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

html.dark-mode body .theme-mode-thumb::before,
html body.theme-dark .theme-mode-thumb::before {
    width: 13px;
    height: 13px;
    background: #dbeafe;
    box-shadow: -4px 0 0 1px #0f172a;
}

html body[class] .arcgis-map-card,
html body[class] .arcgis-table-wrap,
html body[class] .arcgis-table-shell,
html body[class] .arcgis-table-toolbar,
html body[class] .arcgis-table-view,
html body[class] .arcgis-table-scroll {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html body:not([class]) .arcgis-map-card,
html body:not([class]) .arcgis-table-wrap,
html body:not([class]) .arcgis-table-shell,
html body:not([class]) .arcgis-table-toolbar,
html body:not([class]) .arcgis-table-view,
html body:not([class]) .arcgis-table-scroll {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
}

html body[class] .arcgis-map-card .esri-popup__main-container,
html body[class] .arcgis-map-card .esri-popup__header,
html body[class] .arcgis-map-card .esri-popup__content {
    background: rgba(255, 255, 255, 0.97) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}

html body:not([class]) .arcgis-map-card .esri-popup__main-container,
html body:not([class]) .arcgis-map-card .esri-popup__header,
html body:not([class]) .arcgis-map-card .esri-popup__content {
    background: rgba(255, 255, 255, 0.97) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}

html body[class] :is(.dash-modal, .arcgis-manage-modal, .section-modal, .image-modal) {
    background: rgba(15, 23, 42, 0.22) !important;
}

html body:not([class]) :is(.dash-modal, .arcgis-manage-modal, .section-modal, .image-modal) {
    background: rgba(15, 23, 42, 0.22) !important;
}

@media (max-width: 1100px) {
    .login-grid,
    .pole-grid {
        grid-template-columns: 1fr;
    }

    .project-map-pill {
        left: 12px;
        right: 12px;
        max-width: none;
    }
}

@media (max-width: 900px) {
    .app-main {
        align-items: flex-start;
    }

    .app-nav .logo {
        --logo-width: clamp(240px, 36vw, 320px);
    }

    .app-nav-inner,
    .page-container,
    .page,
    .pole-shell {
        width: min(100%, calc(100% - 1.5rem));
    }

    .page-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-nav-menu {
        right: auto;
        left: 0;
    }

    .page-container {
        padding: 1.85rem 1.15rem 2.4rem;
    }

    .login-grid {
        gap: 1.5rem;
    }

    .login-hero {
        padding-top: 0.5rem;
    }

    .map-project-overlay {
        left: 1rem;
        right: 1rem;
        max-width: none;
    }
}

@media (max-width: 760px) {
    .app-nav .logo {
        --logo-width: clamp(220px, 58vw, 280px);
    }

    .card,
    .panel,
    .pole-card {
        padding: 1.15rem;
        border-radius: 20px;
    }

    .app-nav-actions > span,
    .nav-pill,
    .app-nav .app-nav-actions a {
        width: 100%;
        justify-content: flex-start;
    }

    .theme-switcher {
        width: 100%;
        margin-left: 0;
        padding-left: 0;
        border-left: none;
        border-top: 1px solid var(--theme-border);
        padding-top: 0.8rem;
    }

    .info-row,
    .pole-row,
    .form-row {
        grid-template-columns: 1fr;
    }

    .filter-row,
    .dash-filter-row,
    .arcgis-filter-row,
    .view-builder-row {
        grid-template-columns: 1fr;
    }

    .workflow-grid {
        padding: 1rem;
    }

    .map-fullscreen-mode {
        --map-nav-height: 138px;
    }
}

@media (max-width: 640px) {
    .app-main {
        padding: 1.2rem 0.9rem 1.8rem;
    }

    .admin-nav-menu {
        min-width: min(82vw, 240px);
    }

    .page-container {
        padding: 1.35rem 0.9rem 2rem;
    }

    .card {
        padding: 1.2rem;
    }

    .login-kicker,
    .hero-stat,
    .card-pill {
        width: 100%;
        justify-content: center;
    }

    .hero-stats,
    .card-pill-row {
        width: 100%;
    }

    .arcgis-map-card .esri-popup__main-container {
        width: min(92vw, 520px) !important;
        max-width: min(92vw, 520px) !important;
        height: min(72vh, 620px) !important;
    }

    .map-project-overlay,
    .project-map-pill {
        position: static;
        margin: 0.85rem;
    }
}

/* Modern app refresh: shared paint layer only; behavior stays in the PHP/JS pages. */
:root {
    --theme-bg: #f4f7fb;
    --theme-bg-alt: #e9eef6;
    --theme-nav-bg: rgba(255, 255, 255, 0.88);
    --theme-panel-bg: rgba(255, 255, 255, 0.94);
    --theme-card-bg: #ffffff;
    --theme-card-bg-strong: #ffffff;
    --theme-border: rgba(15, 23, 42, 0.12);
    --theme-border-soft: rgba(15, 23, 42, 0.075);
    --theme-text: #172033;
    --theme-heading: #0b1220;
    --theme-muted: #64748b;
    --theme-accent: #2563eb;
    --theme-accent-strong: #1d4ed8;
    --theme-accent-bg: rgba(37, 99, 235, 0.1);
    --theme-accent-faint: rgba(37, 99, 235, 0.055);
    --theme-secondary: #0f766e;
    --theme-secondary-bg: rgba(15, 118, 110, 0.09);
    --theme-pill-bg: rgba(255, 255, 255, 0.78);
    --radius-sm: 8px;
    --radius-md: 8px;
    --radius-lg: 8px;
    --radius-xl: 10px;
    --shadow-tight: 0 8px 18px rgba(15, 23, 42, 0.07);
    --shadow-soft: 0 18px 48px rgba(15, 23, 42, 0.09);
    --shadow-pop: 0 22px 54px rgba(37, 99, 235, 0.16);
    --font-sans: "Bahnschrift", "Aptos Display", "Franklin Gothic Medium", "Trebuchet MS", sans-serif;
}

html body.theme-blue,
html body.theme-light,
html body.theme-sand,
html body.theme-red {
    --theme-bg: #f4f7fb !important;
    --theme-bg-alt: #e9eef6 !important;
    --theme-nav-bg: rgba(255, 255, 255, 0.88) !important;
    --theme-panel-bg: rgba(255, 255, 255, 0.94) !important;
    --theme-card-bg: #ffffff !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(15, 23, 42, 0.12) !important;
    --theme-border-soft: rgba(15, 23, 42, 0.075) !important;
    --theme-text: #172033 !important;
    --theme-heading: #0b1220 !important;
    --theme-muted: #64748b !important;
    --theme-accent: #2563eb !important;
    --theme-accent-strong: #1d4ed8 !important;
    --theme-accent-bg: rgba(37, 99, 235, 0.1) !important;
    --theme-accent-faint: rgba(37, 99, 235, 0.055) !important;
    --theme-pill-bg: rgba(255, 255, 255, 0.78) !important;
}

html body.theme-dark,
html.dark-mode body {
    --theme-bg: #070b13 !important;
    --theme-bg-alt: #0e1726 !important;
    --theme-nav-bg: rgba(7, 12, 22, 0.9) !important;
    --theme-panel-bg: rgba(13, 20, 33, 0.94) !important;
    --theme-card-bg: #0f1724 !important;
    --theme-card-bg-strong: #121c2d !important;
    --theme-border: rgba(148, 163, 184, 0.18) !important;
    --theme-border-soft: rgba(148, 163, 184, 0.1) !important;
    --theme-text: #dbe6f5 !important;
    --theme-heading: #f8fafc !important;
    --theme-muted: #99abc2 !important;
    --theme-accent: #60a5fa !important;
    --theme-accent-strong: #93c5fd !important;
    --theme-accent-bg: rgba(96, 165, 250, 0.14) !important;
    --theme-accent-faint: rgba(96, 165, 250, 0.075) !important;
    --theme-secondary: #2dd4bf !important;
    --theme-secondary-bg: rgba(45, 212, 191, 0.1) !important;
    --theme-pill-bg: rgba(15, 23, 42, 0.72) !important;
}

html,
body,
html body[class],
html body:not([class]) {
    background:
        linear-gradient(180deg, #f8fafc 0%, #f4f7fb 42%, #edf3f8 100%) !important;
    color: var(--theme-text) !important;
}

body::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.16)),
        linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px),
        linear-gradient(rgba(15, 23, 42, 0.028) 1px, transparent 1px) !important;
    background-size: auto, 56px 56px, 56px 56px !important;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.32), transparent 78%) !important;
}

body::after {
    display: none !important;
}

html.dark-mode body,
html body.theme-dark,
html.dark-mode body[class],
html body.theme-dark[class] {
    background:
        linear-gradient(180deg, #0b1220 0%, #070b13 56%, #04070d 100%) !important;
}

html.dark-mode body::before,
html body.theme-dark::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.006)),
        linear-gradient(90deg, rgba(148, 163, 184, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(148, 163, 184, 0.038) 1px, transparent 1px) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) {
    background:
        linear-gradient(112deg, rgba(4, 47, 46, 0.22) 0%, rgba(14, 116, 144, 0.12) 27%, rgba(248, 250, 252, 0.92) 52%, rgba(248, 250, 252, 0.98) 100%),
        linear-gradient(180deg, #f8fafc 0%, #eef6f4 45%, #f7faf8 100%) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed)::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.14)),
        linear-gradient(90deg, rgba(15, 23, 42, 0.038) 1px, transparent 1px),
        linear-gradient(rgba(15, 23, 42, 0.032) 1px, transparent 1px),
        repeating-linear-gradient(135deg, rgba(14, 116, 144, 0.045) 0 1px, transparent 1px 22px) !important;
    background-size: auto, 56px 56px, 56px 56px, auto !important;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.38), transparent 82%) !important;
    animation: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed)::after {
    display: block !important;
    inset: 5.8rem auto auto clamp(1rem, 4vw, 4rem);
    width: min(54vw, 680px);
    aspect-ratio: 1036 / 226;
    background: url("../assets/ggg-nav.png") no-repeat left top / contain !important;
    opacity: 0.11;
    animation: none !important;
}

html body[class] .app-nav,
html body:not([class]) .app-nav {
    background: var(--theme-nav-bg) !important;
    border-bottom: 1px solid var(--theme-border) !important;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08) !important;
    backdrop-filter: blur(18px) saturate(1.1);
}

.app-nav-inner {
    padding: 0.72rem 0 !important;
    gap: 0.8rem 1rem !important;
}

.app-nav .logo {
    --logo-width: clamp(210px, 18vw, 310px) !important;
    --logo-filter: drop-shadow(0 8px 18px rgba(15, 23, 42, 0.06)) !important;
}

.app-nav-actions {
    gap: 0.55rem !important;
}

.app-nav-actions > span {
    min-height: 38px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.7) !important;
    border-color: var(--theme-border-soft) !important;
    color: var(--theme-muted) !important;
}

.nav-pill,
.app-nav .app-nav-actions a,
.app-nav .app-nav-actions a:visited,
html body[class] .app-nav .app-nav-actions :is(a, a:visited, .nav-pill) {
    min-height: 38px !important;
    padding: 0.55rem 0.82rem !important;
    border-radius: 999px !important;
    background: var(--theme-pill-bg) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: 0 5px 14px rgba(15, 23, 42, 0.055) !important;
}

.nav-pill-dot,
html body[class] .app-nav .app-nav-actions :is(a, .nav-pill) .nav-pill-dot {
    width: 8px !important;
    height: 8px !important;
    background: rgba(100, 116, 139, 0.42) !important;
    box-shadow: 0 0 0 4px rgba(100, 116, 139, 0.09) !important;
}

.nav-pill:hover,
.app-nav .app-nav-actions a:hover,
html body[class] .app-nav .app-nav-actions :is(a, .nav-pill):hover {
    background: #ffffff !important;
    border-color: rgba(37, 99, 235, 0.28) !important;
    color: var(--theme-heading) !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.12) !important;
}

.nav-pill.is-active,
.app-nav .app-nav-actions a.is-active,
html body[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) {
    background: var(--theme-accent-bg) !important;
    border-color: rgba(37, 99, 235, 0.28) !important;
    color: var(--theme-heading) !important;
}

.nav-pill.is-active .nav-pill-dot,
.app-nav .app-nav-actions a.is-active .nav-pill-dot,
html body[class] .app-nav .app-nav-actions :is(a.is-active, .nav-pill.is-active) .nav-pill-dot {
    background: var(--theme-accent) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.14) !important;
}

.page-container,
.page,
.pole-shell {
    width: min(1360px, calc(100% - 2rem)) !important;
}

html body[class] .page-container,
html body:not([class]) .page-container {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.page-container {
    padding-top: clamp(1.35rem, 2vw, 2rem) !important;
}

.page-header {
    margin-bottom: 1.35rem !important;
}

.page-title,
.pole-page-title,
.dashboard-page-title,
.compare-title,
.form-title {
    color: var(--theme-heading) !important;
    letter-spacing: 0 !important;
}

.page-title {
    font-size: clamp(1.8rem, 2.5vw, 2.45rem) !important;
}

.page-subtitle,
.pole-page-subtitle,
.panel-subtitle,
.pole-panel-subtitle,
.project-meta,
.ticket-subtext {
    color: var(--theme-muted) !important;
}

.card,
.panel,
.pole-card,
.dashboard-section,
.dashboard-panel,
.project-card,
.upload-panel,
.pole-detail-card,
.scan-card,
.view-bar,
.view-builder,
.view-builder-section,
.view-picker-menu,
.module-card,
.module-column,
.dash-manage-item,
.arcgis-manage-item,
.arcgis-manage-card,
.dash-modal-card,
.section-modal-card,
.modal-content,
.image-modal-bg,
.ticket-panel,
.pole-panel,
.pole-ticket-card,
.pole-ticket-modal-card,
.ticket-pole-row,
html body[class] :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .project-map-pill) {
    border-radius: 8px !important;
    border-color: var(--theme-border) !important;
    background: rgba(255, 255, 255, 0.88) !important;
    box-shadow: var(--shadow-soft) !important;
    color: var(--theme-text) !important;
}

.card::before,
.panel::before,
.project-card::before,
.dashboard-panel::before,
.dashboard-section::before {
    display: none !important;
}

.project-card,
.pole-gallery-card,
.ticket-panel,
.pole-ticket-card,
.dashboard-section,
.dashboard-panel {
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

.project-card:hover,
.pole-gallery-card:hover,
.pole-ticket-card:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(37, 99, 235, 0.22) !important;
    box-shadow: 0 20px 46px rgba(15, 23, 42, 0.11) !important;
}

.card-pill,
.hero-stat,
.project-badge,
.badge,
.view-picker-default,
.pill-status,
.dash-manage-badge,
.ticket-status,
.ticket-priority,
.pole-ticket-status,
.pole-ticket-priority {
    border-radius: 999px !important;
    border-color: rgba(37, 99, 235, 0.16) !important;
    background: var(--theme-accent-bg) !important;
    color: var(--theme-heading) !important;
    letter-spacing: 0.04em !important;
}

.ticket-priority--critical,
.pole-ticket-priority--critical,
.alert-danger {
    border-color: rgba(220, 38, 38, 0.2) !important;
    background: rgba(220, 38, 38, 0.08) !important;
}

.ticket-priority--high,
.pole-ticket-priority--high,
.ticket-status--waiting,
.pole-ticket-status--waiting {
    border-color: rgba(217, 119, 6, 0.2) !important;
    background: rgba(217, 119, 6, 0.1) !important;
}

.ticket-status--resolved,
.ticket-status--closed,
.pole-ticket-status--resolved,
.pole-ticket-status--closed,
.alert-success {
    border-color: rgba(15, 118, 110, 0.18) !important;
    background: var(--theme-secondary-bg) !important;
}

.btn,
.btn-primary,
.btn-secondary,
.btn-ghost,
.btn-ghost-soft,
.btn-primary-soft,
.saved-btn,
.arcgis-map-btn,
.arcgis-table-btn,
.view-picker-btn,
.view-picker-tab,
.pole-scope-btn,
.filter-add,
.dash-filter-add,
.arcgis-filter-add,
html body[class] :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn) {
    min-height: 40px !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.btn-primary,
.btn-primary-soft,
.arcgis-map-btn--primary,
.filter-add,
.dash-filter-add,
.arcgis-filter-add,
html body[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add) {
    background: linear-gradient(135deg, #2563eb, #0f766e) !important;
    border-color: rgba(37, 99, 235, 0.18) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.2) !important;
}

.btn-primary:hover,
.btn-primary-soft:hover,
.arcgis-map-btn--primary:hover,
.filter-add:hover,
.dash-filter-add:hover,
.arcgis-filter-add:hover,
html body[class] :is(.btn.btn-primary, .btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add):hover {
    background: linear-gradient(135deg, #1d4ed8, #0d9488) !important;
    box-shadow: 0 18px 38px rgba(37, 99, 235, 0.25) !important;
}

.btn-ghost,
.btn-ghost-soft,
.btn-secondary,
.saved-btn,
.arcgis-map-btn,
.arcgis-table-btn,
.view-picker-btn,
.view-picker-tab,
.pole-scope-btn,
html body[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn) {
    background: rgba(255, 255, 255, 0.78) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.055) !important;
}

.btn-ghost:hover,
.btn-ghost-soft:hover,
.btn-secondary:hover,
.saved-btn:hover,
.arcgis-map-btn:hover,
.arcgis-table-btn:hover,
.view-picker-btn:hover,
.view-picker-tab:hover,
.pole-scope-btn:hover,
html body[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn):hover {
    background: #ffffff !important;
    border-color: rgba(37, 99, 235, 0.26) !important;
    color: var(--theme-heading) !important;
}

.form-label span {
    color: var(--theme-heading) !important;
    font-weight: 750 !important;
}

.form-input,
.input,
.theme-select,
.nice-select,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
select,
textarea,
html body[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.94) !important;
    border-color: rgba(15, 23, 42, 0.14) !important;
    color: var(--theme-text) !important;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
}

.form-input:focus,
.input:focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):focus,
select:focus,
textarea:focus {
    border-color: rgba(37, 99, 235, 0.46) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.11) !important;
    transform: none !important;
}

.alert,
.form-message,
.dash-msg,
.arcgis-manage-msg,
.arcgis-filter-saved-msg {
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.82) !important;
    border-color: var(--theme-border) !important;
}

.problem-poles-table,
.report-table,
.view-table,
.table,
.arcgis-data-table,
.dashboard-panel-body table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.problem-poles-table th,
.report-table th,
.view-table th,
.table th,
.arcgis-data-table thead th,
.dashboard-panel-body th,
html body[class] :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th) {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border-bottom-color: rgba(15, 23, 42, 0.1) !important;
}

.problem-poles-table td,
.report-table td,
.view-table td,
.table td,
.arcgis-data-table td,
.dashboard-panel-body td,
html body[class] :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td) {
    background: rgba(255, 255, 255, 0.86) !important;
    border-bottom-color: var(--theme-border-soft) !important;
}

.problem-poles-table tbody tr:hover td,
.report-table tbody tr:hover td,
.view-table tbody tr:hover td,
.table tbody tr:hover td,
.arcgis-data-table tbody tr:hover td,
.dashboard-panel-body tbody tr:hover td {
    background: rgba(37, 99, 235, 0.045) !important;
}

.admin-nav-menu,
.view-picker-menu,
.modal-content,
.dash-modal-card,
.section-modal-card,
.pole-ticket-modal-card {
    backdrop-filter: blur(18px) saturate(1.1) !important;
}

.project-footer,
.card-actions,
.dashboard-section-controls,
.pole-header-actions,
.ticket-toolbar,
.pole-ticket-toolbar {
    gap: 0.65rem !important;
}

.pole-return-btn {
    background: linear-gradient(135deg, #2563eb, #0f766e) !important;
    border-color: rgba(37, 99, 235, 0.2) !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.2) !important;
}

.pole-problem-banner {
    border-radius: 8px !important;
    background: linear-gradient(135deg, rgba(254, 242, 242, 0.96), rgba(255, 247, 237, 0.94)) !important;
    box-shadow: 0 16px 36px rgba(220, 38, 38, 0.08) !important;
}

.pole-gallery-card,
.ticket-empty,
.pole-empty,
.pole-ticket-comment,
.pole-ticket-attachment,
.pole-ticket-context-item,
.ticket-pole-row {
    border-radius: 8px !important;
}

.arcgis-map-card,
.arcgis-map-view,
.pole-gallery-preview,
.pole-gallery-preview img {
    border-radius: 8px !important;
}

html.dark-mode body[class] .app-nav,
html body.theme-dark[class] .app-nav {
    background: var(--theme-nav-bg) !important;
    box-shadow: 0 14px 34px rgba(2, 6, 23, 0.36) !important;
}

html.dark-mode body[class] .app-header::before,
html body.theme-dark[class] .app-header::before {
    background:
        linear-gradient(110deg, rgba(96, 165, 250, 0.12), transparent 42%),
        linear-gradient(90deg, rgba(148, 163, 184, 0.055) 1px, transparent 1px),
        linear-gradient(rgba(148, 163, 184, 0.045) 1px, transparent 1px);
}

html.dark-mode body[class] .app-header-context,
html body.theme-dark[class] .app-header-context {
    border-left-color: rgba(148, 163, 184, 0.24);
}

html.dark-mode body[class] .app-header-title,
html body.theme-dark[class] .app-header-title {
    color: #f8fafc;
}

html.dark-mode body[class] .app-nav-actions > span,
html body.theme-dark[class] .app-nav-actions > span {
    background: rgba(15, 23, 42, 0.82) !important;
    border-color: rgba(148, 163, 184, 0.28) !important;
    color: #e5edf7 !important;
    box-shadow: 0 10px 24px rgba(2, 6, 23, 0.26) !important;
}

html.dark-mode body[class] .app-nav .app-nav-actions :is(a, a:visited, .nav-pill),
html body.theme-dark[class] .app-nav .app-nav-actions :is(a, a:visited, .nav-pill),
html.dark-mode body[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn),
html body.theme-dark[class] :is(.btn-ghost, .btn-ghost-soft, .btn-secondary, .saved-btn, .arcgis-map-btn:not(.arcgis-map-btn--primary), .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn) {
    background: rgba(15, 23, 42, 0.78) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}

html.dark-mode body[class] :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .project-map-pill),
html body.theme-dark[class] :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .project-map-pill) {
    background: rgba(15, 23, 42, 0.88) !important;
    border-color: var(--theme-border) !important;
    box-shadow: 0 20px 48px rgba(2, 6, 23, 0.42) !important;
}

html.dark-mode body[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea),
html body.theme-dark[class] :is(.form-input, .input, .theme-select, .nice-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    background: rgba(8, 14, 25, 0.9) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
}

html.dark-mode body .login-card,
html body.theme-dark .login-card {
    background: rgba(15, 23, 42, 0.94) !important;
    border-color: rgba(148, 163, 184, 0.3) !important;
    color: #dbe6f5 !important;
    box-shadow: 0 22px 52px rgba(2, 6, 23, 0.48) !important;
}

html.dark-mode body .login-card .card-pill,
html body.theme-dark .login-card .card-pill {
    background: rgba(96, 165, 250, 0.22) !important;
    border-color: rgba(147, 197, 253, 0.5) !important;
    color: #eff6ff !important;
}

html.dark-mode body .login-card .form-title,
html.dark-mode body .login-card .form-label span,
html body.theme-dark .login-card .form-title,
html body.theme-dark .login-card .form-label span {
    color: #f8fafc !important;
}

html.dark-mode body .login-card .form-subtitle,
html.dark-mode body .login-card .form-aux,
html.dark-mode body .login-card .form-aux span,
html.dark-mode body .login-card .form-label span + span,
html body.theme-dark .login-card .form-subtitle,
html body.theme-dark .login-card .form-aux,
html body.theme-dark .login-card .form-aux span,
html body.theme-dark .login-card .form-label span + span {
    color: #c7d7ea !important;
}

html.dark-mode body .login-card .form-input,
html body.theme-dark .login-card .form-input {
    background: #07111f !important;
    border-color: rgba(148, 163, 184, 0.38) !important;
    color: #f8fafc !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

html.dark-mode body .login-card .form-input::placeholder,
html body.theme-dark .login-card .form-input::placeholder {
    color: #94a9c2 !important;
}

html.dark-mode body .login-card .form-input:focus,
html body.theme-dark .login-card .form-input:focus {
    background: #0d1a2d !important;
    border-color: rgba(147, 197, 253, 0.72) !important;
    color: #ffffff !important;
    box-shadow:
        0 0 0 4px rgba(96, 165, 250, 0.18),
        0 8px 20px rgba(2, 6, 23, 0.36) !important;
}

html.dark-mode body[class] :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th),
html body.theme-dark[class] :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .dashboard-panel-body th, .arcgis-data-table thead th) {
    background: rgba(15, 23, 42, 0.96) !important;
    color: var(--theme-muted) !important;
}

html.dark-mode body[class] :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td),
html body.theme-dark[class] :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .dashboard-panel-body td, .arcgis-data-table tbody td) {
    background: rgba(8, 14, 25, 0.84) !important;
}

html.dark-mode .pole-problem-banner,
html body.theme-dark .pole-problem-banner {
    background: linear-gradient(135deg, rgba(127, 29, 29, 0.42), rgba(88, 28, 28, 0.26)) !important;
    border-color: rgba(248, 113, 113, 0.24) !important;
}

@media (max-width: 900px) {
    .app-nav-inner,
    .page-container,
    .page,
    .pole-shell {
        width: min(100%, calc(100% - 1rem)) !important;
    }

    .app-nav-inner {
        padding: 0.65rem 0 !important;
    }

    .app-nav .logo {
        --logo-width: clamp(200px, 38vw, 280px) !important;
    }

    .app-header-brand {
        width: 100%;
        align-items: flex-start;
        flex-direction: column;
        gap: 0.7rem;
    }

    .app-header-context {
        width: 100%;
        min-width: 0;
        padding-left: 0;
        padding-top: 0.65rem;
        border-left: 0;
        border-top: 1px solid rgba(15, 23, 42, 0.12);
    }
}

@media (max-width: 760px) {
    .app-nav-actions {
        width: 100% !important;
        justify-content: stretch !important;
    }

    .app-nav-actions > span,
    .nav-pill,
    .app-nav .app-nav-actions a {
        min-height: 40px !important;
    }

    .card,
    .panel,
    .pole-card,
    .dashboard-section,
    .dashboard-panel,
    .project-card {
        padding: 1rem !important;
    }

    html body:not(.login-page):not(.project-map-page):not(.map-embed)::after {
        width: min(88vw, 520px);
        opacity: 0.055;
    }
}

/* Branded sign-in composition. Visual-only layer; form posts and portal flows are unchanged. */
:root {
    --font-sans: "Bahnschrift", "Aptos Display", "Franklin Gothic Medium", "Trebuchet MS", sans-serif;
    --font-display: "Bahnschrift", "Aptos Display", "Franklin Gothic Medium", "Trebuchet MS", sans-serif;
    --theme-bg: #eef6f4;
    --theme-bg-alt: #dcebe9;
    --theme-accent: #0e7490;
    --theme-accent-strong: #155e75;
    --theme-accent-bg: rgba(14, 116, 144, 0.12);
    --theme-secondary: #c2410c;
    --theme-secondary-bg: rgba(194, 65, 12, 0.09);
}

html body.login-page {
    background:
        linear-gradient(135deg, #082f38 0%, #103943 46%, #164957 100%) !important;
}

html body.login-page::before {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.075) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px),
        linear-gradient(135deg, rgba(20, 184, 166, 0.08), transparent 42%, rgba(37, 99, 235, 0.08)) !important;
    background-size: 72px 72px, 72px 72px, auto !important;
    mask-image: none !important;
    opacity: 0.92;
}

html body.login-page::after {
    display: block !important;
    background:
        linear-gradient(90deg, rgba(3, 24, 35, 0.42) 0%, transparent 22% 72%, rgba(3, 24, 35, 0.18) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 44%, rgba(3, 24, 35, 0.22)) !important;
    opacity: 1;
}

.app-main {
    min-height: calc(100vh - 48px);
    padding: clamp(1.25rem, 4vw, 4rem) !important;
}

.login-grid {
    width: min(520px, 100%) !important;
    min-height: min(560px, calc(100vh - 8rem));
    grid-template-columns: 1fr !important;
    gap: clamp(1.25rem, 3vw, 2rem) !important;
    align-items: center !important;
    justify-items: center !important;
}

.login-hero {
    position: relative;
    isolation: isolate;
    justify-content: center !important;
    min-height: 0;
    padding: 0 !important;
    color: #f8fafc;
    animation: portal-hero-rise 720ms ease-out both;
}

.login-hero::before {
    display: none;
}

.login-hero > * {
    position: relative;
    z-index: 1;
}

.login-hero .logo {
    --logo-width: min(88vw, 500px) !important;
    --logo-filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.16)) !important;
    margin-bottom: 0;
}

.login-kicker,
.hero-stats {
    display: none !important;
}

.login-title {
    max-width: 11ch;
    font-family: var(--font-display);
    font-size: clamp(2.8rem, 7vw, 6.2rem) !important;
    line-height: 0.92 !important;
    letter-spacing: 0 !important;
    color: #ffffff !important;
    text-shadow:
        0 1px 0 rgba(3, 24, 35, 0.24),
        0 10px 22px rgba(0, 0, 0, 0.34);
}

.login-subtitle {
    max-width: 42rem !important;
    color: #f8fbff !important;
    font-size: clamp(0.98rem, 1.4vw, 1.08rem) !important;
    line-height: 1.65 !important;
    font-weight: 800;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.34);
}

.login-card,
html body .login-card {
    align-self: center;
    width: min(420px, 100%);
    border: 1px solid rgba(255, 255, 255, 0.68) !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 56px rgba(3, 24, 35, 0.34) !important;
    backdrop-filter: none;
    animation: portal-panel-enter 620ms ease-out 90ms both;
}

.login-card .card-inner {
    gap: 1.1rem;
}

.login-card .card-pill-row {
    display: none;
}

.login-card .form-title {
    font-family: var(--font-display);
    font-size: clamp(1.6rem, 3vw, 2rem) !important;
    line-height: 1.05;
    color: #0f172a !important;
}

.login-card .form-subtitle {
    color: #526371 !important;
}

.login-card .form-input {
    min-height: 48px;
    background: #fbfcfd !important;
    border-color: rgba(15, 23, 42, 0.16) !important;
}

.login-card .btn-primary {
    min-height: 50px !important;
    background: linear-gradient(90deg, #2563eb, #0e7490) !important;
    box-shadow: 0 14px 26px rgba(14, 116, 144, 0.22) !important;
}

.login-card .btn-primary:hover {
    transform: translateY(-1px);
    background: linear-gradient(90deg, #1d4ed8, #0f766e) !important;
}

.app-footer {
    position: fixed;
    left: clamp(1rem, 4vw, 4rem);
    bottom: 1rem;
    z-index: 2;
    color: rgba(255, 255, 255, 0.7) !important;
    background: transparent !important;
    border: 0 !important;
}

@keyframes portal-hero-rise {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes portal-panel-enter {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes portal-grid-drift {
    from {
        background-position: 0 0, 0 0, 0 0;
    }
    to {
        background-position: 72px 0, 0 72px, 54px 54px;
    }
}

@keyframes portal-current-sweep {
    0%, 100% {
        transform: translateX(-3%);
        opacity: 0.42;
    }
    50% {
        transform: translateX(3%);
        opacity: 0.82;
    }
}

@media (min-width: 901px) {
    html body.login-page::before,
    html body.login-page::after {
        animation: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.login-page::before,
    html body.login-page::after,
    .login-hero,
    .login-card {
        animation: none !important;
    }
}

@media (max-width: 900px) {
    html body.login-page {
        background:
            linear-gradient(135deg, #082f38 0%, #103943 46%, #164957 100%) !important;
    }

    .login-grid {
        min-height: auto;
        grid-template-columns: 1fr !important;
        align-items: center !important;
    }

    .login-hero {
        justify-content: center !important;
        text-align: center;
    }

    .login-title {
        max-width: 10ch;
    }

    .app-footer {
        position: static;
        padding: 0 1rem 1rem !important;
        color: rgba(255, 255, 255, 0.72) !important;
    }
}

@media (max-width: 640px) {
    .app-main {
        padding: 1rem !important;
    }

    .login-hero {
        padding-top: 1rem !important;
    }

    .login-hero .logo {
        --logo-width: min(94vw, 520px) !important;
        margin-bottom: 0.85rem;
    }

    .login-title {
        font-size: clamp(2.2rem, 13vw, 3.2rem) !important;
    }

    .login-card,
    html body .login-card {
        width: 100%;
    }
}

/* Command center component refresh */
html body:not(.login-page):not(.project-map-page):not(.map-embed)::after {
    display: none !important;
    background: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-nav-bg: rgba(248, 250, 252, 0.86) !important;
    --theme-panel-bg: rgba(255, 255, 255, 0.82) !important;
    --theme-card-bg: rgba(248, 250, 252, 0.84) !important;
    --theme-card-bg-strong: rgba(255, 255, 255, 0.92) !important;
    --theme-border: rgba(15, 23, 42, 0.14) !important;
    --theme-border-soft: rgba(15, 23, 42, 0.075) !important;
    --theme-accent: #2563eb !important;
    --theme-accent-strong: #1d4ed8 !important;
    --theme-accent-bg: rgba(37, 99, 235, 0.11) !important;
    --theme-accent-faint: rgba(37, 99, 235, 0.055) !important;
    --theme-secondary: #0f766e !important;
    --theme-secondary-bg: rgba(15, 118, 110, 0.1) !important;
    --shadow-soft: 0 18px 46px rgba(15, 23, 42, 0.105) !important;
    --shadow-tight: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
    --shadow-pop: 0 24px 52px rgba(37, 99, 235, 0.18) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed)::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0.1)),
        linear-gradient(90deg, rgba(37, 99, 235, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(15, 118, 110, 0.04) 1px, transparent 1px),
        repeating-linear-gradient(135deg, rgba(15, 23, 42, 0.035) 0 1px, transparent 1px 24px) !important;
    background-size: auto, 56px 56px, 56px 56px, auto !important;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.34), transparent 86%) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .app-main,
html body:not(.login-page):not(.project-map-page):not(.map-embed) main {
    position: relative;
    z-index: 1;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-shell, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog) {
    position: relative !important;
    border-radius: 8px !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(248, 250, 252, 0.78)),
        linear-gradient(135deg, rgba(37, 99, 235, 0.035), rgba(15, 118, 110, 0.035)) !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.095) !important;
    backdrop-filter: blur(18px) saturate(1.12) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .dashboard-section, .dashboard-panel, .project-card, .metric-card, .compare-scan-card, .compare-metric-card, .dashboard-inventory-overview, .inventory-query-panel)::before {
    display: block !important;
    content: "" !important;
    position: absolute !important;
    inset: 0 auto auto 0 !important;
    width: 100% !important;
    height: 3px !important;
    z-index: 2 !important;
    border-radius: 8px 8px 0 0 !important;
    background: linear-gradient(90deg, #2563eb, #0f766e, rgba(15, 23, 42, 0.12)) !important;
    pointer-events: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .dashboard-inventory-overview-item) {
    overflow: hidden !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .dashboard-inventory-overview-item)::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    background:
        linear-gradient(115deg, transparent 0 58%, rgba(37, 99, 235, 0.04) 58% 68%, transparent 68%),
        radial-gradient(circle at 100% 0%, rgba(15, 118, 110, 0.1), transparent 30%) !important;
    pointer-events: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .dashboard-inventory-overview-item) > * {
    position: relative !important;
    z-index: 1 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-inventory-overview-item, .project-card, .pole-gallery-card, .pole-ticket-card, .compare-metric-card) {
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-inventory-overview-item, .project-card, .pole-gallery-card, .pole-ticket-card, .compare-metric-card):hover {
    transform: translateY(-2px) !important;
    border-color: rgba(37, 99, 235, 0.28) !important;
    box-shadow: 0 22px 54px rgba(15, 23, 42, 0.13) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-label, .compare-metric-label, .dashboard-inventory-overview-name, .inventory-query-label, .inventory-detail-search-label, .inventory-detail-pagination-label, .form-label span, .filter-grid-header, th) {
    color: #52627a !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-value, .compare-metric-value, .dashboard-inventory-overview-value) {
    color: #07111f !important;
    letter-spacing: 0 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-page-btn, .compare-table-tab, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close) {
    min-height: 40px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(15, 23, 42, 0.14) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 245, 249, 0.86)) !important;
    color: #172033 !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.075) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn) {
    border-color: rgba(37, 99, 235, 0.32) !important;
    background: linear-gradient(135deg, #2563eb, #0e7490 58%, #0f766e) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 34px rgba(37, 99, 235, 0.24) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-page-btn, .compare-table-tab, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close):hover:not(:disabled) {
    transform: translateY(-1px) !important;
    border-color: rgba(37, 99, 235, 0.34) !important;
    background: #ffffff !important;
    color: #07111f !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.14) !important;
    text-decoration: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn):hover:not(:disabled) {
    background: linear-gradient(135deg, #1d4ed8, #0891b2 58%, #0d9488) !important;
    color: #ffffff !important;
    box-shadow: 0 20px 42px rgba(37, 99, 235, 0.28) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-table-tab.is-active, .view-picker-tab.is-active, .pole-scope-btn.is-active, .inventory-query-page-number.is-active) {
    border-color: rgba(37, 99, 235, 0.36) !important;
    background: rgba(37, 99, 235, 0.12) !important;
    color: #0f172a !important;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12), 0 10px 24px rgba(37, 99, 235, 0.11) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    min-height: 40px !important;
    border-radius: 8px !important;
    border-color: rgba(15, 23, 42, 0.14) !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #172033 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 6px 16px rgba(15, 23, 42, 0.045) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea):focus {
    border-color: rgba(37, 99, 235, 0.52) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12), 0 10px 24px rgba(37, 99, 235, 0.09) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table, .report-table, .view-table, .table, .arcgis-data-table, .dashboard-panel-body table, .compare-table, .inventory-query-table, .inventory-detail-table) {
    overflow: hidden !important;
    border-radius: 8px !important;
    border: 1px solid rgba(15, 23, 42, 0.1) !important;
    background: rgba(255, 255, 255, 0.84) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th) {
    background:
        linear-gradient(180deg, rgba(226, 232, 240, 0.92), rgba(241, 245, 249, 0.92)) !important;
    color: #475569 !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.11) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td) {
    background: rgba(255, 255, 255, 0.72) !important;
    border-bottom-color: rgba(15, 23, 42, 0.07) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table tbody tr:hover td, .report-table tbody tr:hover td, .view-table tbody tr:hover td, .table tbody tr:hover td, .arcgis-data-table tbody tr:hover td, .dashboard-panel-body tbody tr:hover td, .compare-table tbody tr:hover td, .inventory-query-table tbody tr:hover td, .inventory-detail-table tbody tr:hover td) {
    background: rgba(37, 99, 235, 0.055) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card-pill, .hero-stat, .project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge, .ticket-status, .ticket-priority, .pole-ticket-status, .pole-ticket-priority, .compare-count-badge, .compare-status, .inventory-detail-pill, .inventory-query-results-summary, .inventory-query-page-info, .compare-page-summary) {
    border-radius: 8px !important;
    border: 1px solid rgba(37, 99, 235, 0.16) !important;
    background: rgba(37, 99, 235, 0.095) !important;
    color: #172033 !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-status.is-problem, .ticket-priority--critical, .pole-ticket-priority--critical, .alert-danger) {
    border-color: rgba(220, 38, 38, 0.24) !important;
    background: rgba(220, 38, 38, 0.095) !important;
    color: #991b1b !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-status.is-normal, .ticket-status--resolved, .ticket-status--closed, .pole-ticket-status--resolved, .pole-ticket-status--closed, .alert-success) {
    border-color: rgba(15, 118, 110, 0.22) !important;
    background: rgba(15, 118, 110, 0.1) !important;
    color: #115e59 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-accent: #60a5fa !important;
    --theme-accent-strong: #93c5fd !important;
    --theme-accent-bg: rgba(96, 165, 250, 0.16) !important;
    --theme-secondary: #2dd4bf !important;
    --theme-secondary-bg: rgba(45, 212, 191, 0.13) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-shell, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-shell, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog) {
    border-color: rgba(148, 163, 184, 0.2) !important;
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.9), rgba(8, 14, 25, 0.82)),
        linear-gradient(135deg, rgba(96, 165, 250, 0.08), rgba(45, 212, 191, 0.06)) !important;
    box-shadow: 0 20px 50px rgba(2, 6, 23, 0.42) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-label, .compare-metric-label, .dashboard-inventory-overview-name, .inventory-query-label, .inventory-detail-search-label, .inventory-detail-pagination-label, .form-label span, .filter-grid-header, th),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-label, .compare-metric-label, .dashboard-inventory-overview-name, .inventory-query-label, .inventory-detail-search-label, .inventory-detail-pagination-label, .form-label span, .filter-grid-header, th) {
    color: #a8bbd4 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-value, .compare-metric-value, .dashboard-inventory-overview-value),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-value, .compare-metric-value, .dashboard-inventory-overview-value) {
    color: #f8fafc !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close) {
    border-color: rgba(148, 163, 184, 0.22) !important;
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.94), rgba(15, 23, 42, 0.9)) !important;
    color: #e5edf7 !important;
    box-shadow: 0 10px 24px rgba(2, 6, 23, 0.32) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn) {
    border-color: rgba(96, 165, 250, 0.34) !important;
    background: linear-gradient(135deg, #2563eb, #0891b2 58%, #0f766e) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 38px rgba(37, 99, 235, 0.3) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    border-color: rgba(148, 163, 184, 0.22) !important;
    background: rgba(15, 23, 42, 0.82) !important;
    color: #e5edf7 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 8px 18px rgba(2, 6, 23, 0.24) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table, .report-table, .view-table, .table, .arcgis-data-table, .dashboard-panel-body table, .compare-table, .inventory-query-table, .inventory-detail-table),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table, .report-table, .view-table, .table, .arcgis-data-table, .dashboard-panel-body table, .compare-table, .inventory-query-table, .inventory-detail-table) {
    border-color: rgba(148, 163, 184, 0.18) !important;
    background: rgba(15, 23, 42, 0.82) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th) {
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.96), rgba(15, 23, 42, 0.94)) !important;
    color: #a8bbd4 !important;
    border-bottom-color: rgba(148, 163, 184, 0.18) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td) {
    background: rgba(15, 23, 42, 0.62) !important;
    border-bottom-color: rgba(148, 163, 184, 0.12) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card-pill, .hero-stat, .project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge, .ticket-status, .ticket-priority, .pole-ticket-status, .pole-ticket-priority, .compare-count-badge, .compare-status, .inventory-detail-pill, .inventory-query-results-summary, .inventory-query-page-info, .compare-page-summary),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card-pill, .hero-stat, .project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge, .ticket-status, .ticket-priority, .pole-ticket-status, .pole-ticket-priority, .compare-count-badge, .compare-status, .inventory-detail-pill, .inventory-query-results-summary, .inventory-query-page-info, .compare-page-summary) {
    border-color: rgba(96, 165, 250, 0.22) !important;
    background: rgba(96, 165, 250, 0.14) !important;
    color: #e5edf7 !important;
}

/* Command center spacing and inventory polish */
html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-panel-body, .compare-table-panel, .panel-body, .card-inner) {
    padding: clamp(1.25rem, 1.7vw, 1.65rem) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-panel-body, .compare-table-panel) > :is(.compare-section-title-row, .dashboard-panel-head):first-child {
    margin-top: 0 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .compare-section-title-row {
    padding: 0.2rem 0 0.75rem !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-table-toolbar, .compare-pagination-footer, .compare-table-shell, .inventory-query-table-toolbar, .inventory-query-pagination, .inventory-query-table-shell) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-search-empty, .inventory-query-empty) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview::before,
html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview::after {
    display: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-heading {
    padding: 0.1rem 0 0.25rem !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-grid {
    gap: 0.85rem !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item {
    min-height: 132px !important;
    padding: 1.25rem !important;
    border-color: rgba(15, 23, 42, 0.1) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(248, 250, 252, 0.7)),
        linear-gradient(135deg, rgba(37, 99, 235, 0.04), rgba(15, 118, 110, 0.035)) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.075) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item::before {
    inset: 0 auto auto 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.92), rgba(15, 118, 110, 0.8), rgba(148, 163, 184, 0.2)) !important;
    opacity: 1 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item:hover {
    border-color: rgba(37, 99, 235, 0.22) !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.11) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-name {
    max-width: none !important;
    font-size: 0.86rem !important;
    color: #52627a !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-value {
    font-size: clamp(2.25rem, 3.7vw, 3.15rem) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-detail {
    font-size: 0.84rem !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table-panel {
    padding: 1.15rem !important;
    border-color: rgba(15, 23, 42, 0.1) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(248, 250, 252, 0.54)) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table-shell {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table {
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table thead th {
    background: rgba(226, 232, 240, 0.68) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table tbody:empty::after {
    display: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.rank-item .progress-fill, .dashboard-panel .progress-fill) {
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.9), rgba(15, 118, 110, 0.72)) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .rank-item .progress-track {
    background: rgba(148, 163, 184, 0.14) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview {
    background: transparent !important;
    box-shadow: none !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item {
    border-color: rgba(148, 163, 184, 0.17) !important;
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.88), rgba(8, 14, 25, 0.78)),
        linear-gradient(135deg, rgba(96, 165, 250, 0.08), rgba(45, 212, 191, 0.055)) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-name,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-name {
    color: #a8bbd4 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table-panel,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-table-panel {
    border-color: rgba(148, 163, 184, 0.18) !important;
    background: rgba(15, 23, 42, 0.48) !important;
}

/* Calm cool-blue finish: flat surfaces, minimal gradients */
html body:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-bg: #edf5fb !important;
    --theme-bg-alt: #e6f0f8 !important;
    --theme-nav-bg: rgba(248, 252, 255, 0.88) !important;
    --theme-panel-bg: rgba(248, 252, 255, 0.86) !important;
    --theme-card-bg: rgba(249, 252, 255, 0.88) !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(31, 79, 128, 0.16) !important;
    --theme-border-soft: rgba(31, 79, 128, 0.1) !important;
    --theme-text: #162235 !important;
    --theme-heading: #0b1628 !important;
    --theme-muted: #5a6d84 !important;
    --theme-accent: #2f6fb4 !important;
    --theme-accent-strong: #245c98 !important;
    --theme-accent-bg: rgba(47, 111, 180, 0.11) !important;
    --theme-accent-faint: rgba(47, 111, 180, 0.06) !important;
    --theme-secondary: #3f8aa8 !important;
    --theme-secondary-bg: rgba(63, 138, 168, 0.1) !important;
    background: #edf5fb !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed)::before {
    background: rgba(47, 111, 180, 0.035) !important;
    mask-image: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed)::after {
    display: none !important;
    background: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag) {
    border-color: rgba(31, 79, 128, 0.14) !important;
    background: rgba(249, 252, 255, 0.88) !important;
    box-shadow: 0 14px 34px rgba(21, 45, 74, 0.08) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .dashboard-section, .dashboard-panel, .project-card, .metric-card, .compare-scan-card, .compare-metric-card, .inventory-query-panel)::before,
html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item::before {
    background: #6f9dca !important;
    opacity: 0.95 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .dashboard-inventory-overview-item)::after {
    display: none !important;
    background: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close, .admin-panel-trigger) {
    border-color: rgba(31, 79, 128, 0.16) !important;
    background: rgba(247, 251, 255, 0.92) !important;
    color: #162235 !important;
    box-shadow: 0 8px 18px rgba(21, 45, 74, 0.07) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active) {
    border-color: #2f6fb4 !important;
    background: #2f6fb4 !important;
    color: #ffffff !important;
    box-shadow: 0 12px 26px rgba(47, 111, 180, 0.22) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-table-tab.is-active, .btn-primary, .btn-primary-soft) :is(.compare-count-badge, .badge, .card-pill) {
    border-color: rgba(255, 255, 255, 0.34) !important;
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-ghost-soft, .btn-primary-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close):hover:not(:disabled) {
    border-color: rgba(47, 111, 180, 0.34) !important;
    background: #ffffff !important;
    color: #0b1628 !important;
    box-shadow: 0 12px 26px rgba(47, 111, 180, 0.13) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active):hover:not(:disabled) {
    border-color: #245c98 !important;
    background: #245c98 !important;
    color: #ffffff !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    border-color: rgba(31, 79, 128, 0.16) !important;
    background: rgba(255, 255, 255, 0.9) !important;
    box-shadow: 0 5px 14px rgba(21, 45, 74, 0.045) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea):focus {
    border-color: rgba(47, 111, 180, 0.55) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(47, 111, 180, 0.12) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table, .report-table, .view-table, .table, .arcgis-data-table, .dashboard-panel-body table, .compare-table, .inventory-query-table, .inventory-detail-table) {
    border-color: rgba(31, 79, 128, 0.12) !important;
    background: rgba(255, 255, 255, 0.78) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th) {
    background: #e7eff7 !important;
    color: #53677f !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table td, .report-table td, .view-table td, .table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td) {
    background: rgba(255, 255, 255, 0.68) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card-pill, .hero-stat, .project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge, .ticket-status, .ticket-priority, .pole-ticket-status, .pole-ticket-priority, .compare-count-badge, .compare-status, .inventory-detail-pill, .inventory-query-results-summary, .inventory-query-page-info, .compare-page-summary) {
    border-color: rgba(47, 111, 180, 0.18) !important;
    background: rgba(47, 111, 180, 0.1) !important;
    color: #1e4168 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.rank-item .progress-fill, .dashboard-panel .progress-fill, .progress-fill) {
    background: #5d91c3 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.progress-track, .rank-item .progress-track) {
    background: rgba(31, 79, 128, 0.12) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.pole-map, .pole-detail-map, .dashboard-map-embed, .map-embed) {
    background: #e6f0f8 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-accent: #7fb2e5 !important;
    --theme-accent-strong: #a9cdf0 !important;
    --theme-accent-bg: rgba(127, 178, 229, 0.15) !important;
    --theme-secondary: #7fb2e5 !important;
    --theme-secondary-bg: rgba(127, 178, 229, 0.12) !important;
    background: #0b1421 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed)::before,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed)::before {
    background: rgba(127, 178, 229, 0.035) !important;
    mask-image: none !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag) {
    border-color: rgba(169, 205, 240, 0.2) !important;
    background: rgba(14, 26, 42, 0.9) !important;
    box-shadow: 0 16px 36px rgba(2, 6, 23, 0.34) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close) {
    border-color: rgba(169, 205, 240, 0.22) !important;
    background: rgba(16, 31, 50, 0.96) !important;
    color: #d9e8f7 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active) {
    border-color: #7fb2e5 !important;
    background: #2f6fb4 !important;
    color: #ffffff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-table-tab.is-active, .btn-primary, .btn-primary-soft) :is(.compare-count-badge, .badge, .card-pill),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.compare-table-tab.is-active, .btn-primary, .btn-primary-soft) :is(.compare-count-badge, .badge, .card-pill) {
    border-color: rgba(255, 255, 255, 0.34) !important;
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.problem-poles-table th, .report-table th, .view-table th, .table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th) {
    background: #142337 !important;
    color: #b5cce3 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.rank-item .progress-fill, .dashboard-panel .progress-fill, .progress-fill),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.rank-item .progress-fill, .dashboard-panel .progress-fill, .progress-fill) {
    background: #7fb2e5 !important;
}

/* App-wide cool-blue refinement */
html body:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-bg: #edf6fd !important;
    --theme-bg-alt: #e4f0fa !important;
    --theme-nav-bg: rgba(247, 251, 255, 0.9) !important;
    --theme-panel-bg: rgba(246, 251, 255, 0.9) !important;
    --theme-card-bg: rgba(249, 252, 255, 0.92) !important;
    --theme-card-bg-strong: #ffffff !important;
    --theme-border: rgba(42, 100, 158, 0.18) !important;
    --theme-border-soft: rgba(42, 100, 158, 0.11) !important;
    --theme-text: #142338 !important;
    --theme-heading: #09172a !important;
    --theme-muted: #55708d !important;
    --theme-accent: #2f75bd !important;
    --theme-accent-strong: #245f9f !important;
    --theme-accent-bg: rgba(47, 117, 189, 0.12) !important;
    --theme-accent-faint: rgba(47, 117, 189, 0.065) !important;
    --theme-secondary: #5b98c6 !important;
    --theme-secondary-bg: rgba(91, 152, 198, 0.12) !important;
    background-color: #edf6fd !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-container, .card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .ticket-create-modal, .ticket-create-confirm-card, .ticket-selected-panel, .ticket-category-filters, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag) {
    border-color: rgba(42, 100, 158, 0.16) !important;
    background: rgba(248, 252, 255, 0.92) !important;
    color: var(--theme-text) !important;
    box-shadow: 0 14px 34px rgba(21, 50, 82, 0.075) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-create-modal .ticket-panel-head, .inventory-map-dialog-head, .panel-header, .card-header, .dashboard-section-header, .dashboard-panel-head, .compare-section-title-row) {
    border-color: rgba(47, 117, 189, 0.16) !important;
    background: #f5faff !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-title, .form-title, .panel-title, .ticket-panel-title, .dashboard-panel-title, .dashboard-inventory-heading, .compare-title, .compare-section-title-row h2, .compare-section-title-row h3, .project-name, .module-title, .pole-title) {
    color: #09172a !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-subtitle, .form-subtitle, .small-muted, .panel-subtitle, .ticket-panel-subtitle, .ticket-subtext, .project-meta, .upload-meta, .compare-subtext, .inventory-query-subtext, .dashboard-panel-subtitle) {
    color: #55708d !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close, .ticket-pagination-btn, .ticket-category-filter, .ticket-pole-action, .admin-panel-trigger) {
    border-color: rgba(42, 100, 158, 0.17) !important;
    background: #f7fbff !important;
    color: #142338 !important;
    box-shadow: 0 8px 18px rgba(21, 50, 82, 0.06) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active, .ticket-tab.is-active, .ticket-pagination-btn.is-active) {
    border-color: #2f75bd !important;
    background: #2f75bd !important;
    color: #ffffff !important;
    box-shadow: 0 12px 26px rgba(47, 117, 189, 0.2) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    border-color: rgba(42, 100, 158, 0.18) !important;
    background: #fbfdff !important;
    color: #142338 !important;
    box-shadow: 0 5px 14px rgba(21, 50, 82, 0.04) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea):focus {
    border-color: rgba(47, 117, 189, 0.56) !important;
    box-shadow: 0 0 0 4px rgba(47, 117, 189, 0.12) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table, .problem-poles-table, .report-table, .view-table, .arcgis-data-table, .dashboard-panel-body table, .compare-table, .inventory-query-table, .inventory-detail-table, .ticket-table, .ticket-pole-table) {
    border-color: rgba(42, 100, 158, 0.13) !important;
    background: rgba(255, 255, 255, 0.82) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table th, .problem-poles-table th, .report-table th, .view-table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th, .ticket-table th, .ticket-pole-table th) {
    background: #e3eef8 !important;
    color: #4d6681 !important;
    border-bottom-color: rgba(42, 100, 158, 0.15) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table td, .problem-poles-table td, .report-table td, .view-table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td, .ticket-table td, .ticket-pole-table td) {
    background: rgba(255, 255, 255, 0.72) !important;
    border-bottom-color: rgba(42, 100, 158, 0.08) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card-pill, .hero-stat, .project-badge, .badge, .view-picker-default, .pill-status, .dash-manage-badge, .ticket-status, .ticket-priority, .pole-ticket-status, .pole-ticket-priority, .compare-count-badge, .compare-status, .inventory-detail-pill, .inventory-query-results-summary, .inventory-query-page-info, .compare-page-summary, .ticket-selected-count, .ticket-problem-chip) {
    border-color: rgba(47, 117, 189, 0.18) !important;
    background: rgba(47, 117, 189, 0.1) !important;
    color: #214a76 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.progress-fill, .rank-item .progress-fill, .dashboard-panel .progress-fill) {
    background: #5d94c8 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .dashboard-section, .dashboard-panel, .project-card, .metric-card, .compare-scan-card, .compare-metric-card, .inventory-query-panel, .ticket-panel)::before {
    background: #7aa9d2 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-bg: #0b1421 !important;
    --theme-bg-alt: #101f33 !important;
    --theme-panel-bg: rgba(14, 27, 45, 0.92) !important;
    --theme-card-bg: rgba(14, 27, 45, 0.92) !important;
    --theme-border: rgba(169, 205, 240, 0.22) !important;
    --theme-border-soft: rgba(169, 205, 240, 0.14) !important;
    --theme-accent: #83b9ec !important;
    --theme-accent-strong: #b5d7f5 !important;
    --theme-accent-bg: rgba(131, 185, 236, 0.16) !important;
    --theme-muted: #a9bed4 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-container, .card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .ticket-create-modal, .ticket-create-confirm-card, .ticket-selected-panel, .ticket-category-filters, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-container, .card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .ticket-create-modal, .ticket-create-confirm-card, .ticket-selected-panel, .ticket-category-filters, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag) {
    border-color: rgba(169, 205, 240, 0.2) !important;
    background: rgba(14, 27, 45, 0.92) !important;
}

/* Header art refresh */
html body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header,
html body:not(.login-page):not(.project-map-page):not(.map-embed) .app-nav.app-header {
    background:
        radial-gradient(ellipse 58% 115% at 14% 0%, rgba(96, 165, 250, 0.2), transparent 58%),
        radial-gradient(ellipse 42% 90% at 82% 8%, rgba(125, 184, 232, 0.16), transparent 62%),
        linear-gradient(180deg, rgba(247, 251, 255, 0.96), rgba(231, 242, 252, 0.9)) !important;
    border-bottom-color: rgba(47, 117, 189, 0.22) !important;
    box-shadow: 0 18px 46px rgba(21, 50, 82, 0.08) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::before {
    background:
        radial-gradient(ellipse 64% 42% at 8% 120%, rgba(47, 117, 189, 0.12), transparent 72%),
        radial-gradient(ellipse 42% 30% at 46% 108%, rgba(111, 157, 202, 0.18), transparent 70%),
        radial-gradient(ellipse 56% 28% at 92% 112%, rgba(91, 152, 198, 0.13), transparent 68%) !important;
    background-size: auto !important;
    opacity: 1 !important;
    mask-image: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::after {
    left: clamp(1rem, 4vw, 4rem) !important;
    right: clamp(1rem, 4vw, 4rem) !important;
    height: 2px !important;
    background: #6f9dca !important;
    opacity: 0.85 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header-context {
    border-left-color: rgba(47, 117, 189, 0.22) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-header,
html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-nav.app-header,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-nav.app-header {
    background:
        radial-gradient(ellipse 58% 115% at 14% 0%, rgba(96, 165, 250, 0.18), transparent 58%),
        radial-gradient(ellipse 42% 90% at 82% 8%, rgba(127, 178, 229, 0.14), transparent 62%),
        linear-gradient(180deg, rgba(13, 27, 45, 0.96), rgba(9, 19, 33, 0.94)) !important;
    border-bottom-color: rgba(127, 178, 229, 0.26) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::before,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::before {
    background:
        radial-gradient(ellipse 64% 42% at 8% 120%, rgba(96, 165, 250, 0.12), transparent 72%),
        radial-gradient(ellipse 42% 30% at 46% 108%, rgba(127, 178, 229, 0.13), transparent 70%),
        radial-gradient(ellipse 56% 28% at 92% 112%, rgba(91, 152, 198, 0.1), transparent 68%) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::after,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::after {
    background: #7fb2e5 !important;
    opacity: 0.72 !important;
}

/* Dark-mode blue contrast pass */
html.dark-mode,
html.dark-mode body,
html body.theme-dark,
html.dark-mode body[class],
html body.theme-dark[class] {
    color-scheme: dark;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) {
    --theme-bg: #081424 !important;
    --theme-bg-alt: #0d1e33 !important;
    --theme-nav-bg: rgba(8, 18, 32, 0.94) !important;
    --theme-panel-bg: rgba(12, 28, 48, 0.94) !important;
    --theme-card-bg: rgba(13, 31, 53, 0.94) !important;
    --theme-card-bg-strong: #10243c !important;
    --theme-border: rgba(137, 190, 239, 0.24) !important;
    --theme-border-soft: rgba(137, 190, 239, 0.15) !important;
    --theme-text: #dcecff !important;
    --theme-heading: #f4f9ff !important;
    --theme-muted: #9fb9d4 !important;
    --theme-accent: #7db8f0 !important;
    --theme-accent-strong: #acd5ff !important;
    --theme-accent-bg: rgba(125, 184, 240, 0.18) !important;
    --theme-accent-faint: rgba(125, 184, 240, 0.09) !important;
    --theme-secondary: #8fc7ee !important;
    --theme-secondary-bg: rgba(143, 199, 238, 0.16) !important;
    background: #081424 !important;
    color: #dcecff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed)::before,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed)::before {
    background:
        radial-gradient(ellipse 64% 46% at 16% 0%, rgba(77, 148, 217, 0.12), transparent 68%),
        radial-gradient(ellipse 42% 30% at 86% 8%, rgba(125, 184, 240, 0.08), transparent 66%) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-header,
html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-nav.app-header,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-nav.app-header {
    background:
        radial-gradient(ellipse 60% 120% at 12% 0%, rgba(85, 157, 224, 0.2), transparent 58%),
        radial-gradient(ellipse 48% 90% at 82% 6%, rgba(125, 184, 240, 0.12), transparent 62%),
        #0b1a2d !important;
    border-bottom-color: rgba(125, 184, 240, 0.42) !important;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.34) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::before,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .app-header::before {
    background:
        radial-gradient(ellipse 64% 42% at 8% 120%, rgba(125, 184, 240, 0.12), transparent 72%),
        radial-gradient(ellipse 42% 30% at 46% 108%, rgba(88, 151, 210, 0.13), transparent 70%),
        radial-gradient(ellipse 56% 28% at 92% 112%, rgba(72, 133, 193, 0.1), transparent 68%) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-title, .form-title, .panel-title, .ticket-panel-title, .dashboard-panel-title, .dashboard-inventory-heading, .compare-title, .compare-section-title-row h2, .compare-section-title-row h3, .project-name, .module-title, .pole-title, .app-header-title),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-title, .form-title, .panel-title, .ticket-panel-title, .dashboard-panel-title, .dashboard-inventory-heading, .compare-title, .compare-section-title-row h2, .compare-section-title-row h3, .project-name, .module-title, .pole-title, .app-header-title) {
    color: #f4f9ff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-subtitle, .form-subtitle, .small-muted, .panel-subtitle, .ticket-panel-subtitle, .ticket-subtext, .project-meta, .upload-meta, .compare-subtext, .inventory-query-subtext, .dashboard-panel-subtitle, .app-header-subtitle),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-subtitle, .form-subtitle, .small-muted, .panel-subtitle, .ticket-panel-subtitle, .ticket-subtext, .project-meta, .upload-meta, .compare-subtext, .inventory-query-subtext, .dashboard-panel-subtitle, .app-header-subtitle) {
    color: #9fb9d4 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-container, .card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .ticket-create-modal, .ticket-create-confirm-card, .ticket-selected-panel, .ticket-category-filters, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.page-container, .card, .panel, .pole-card, .dashboard-section, .dashboard-panel, .project-card, .upload-panel, .pole-detail-card, .scan-card, .view-bar, .view-builder, .view-builder-section, .view-picker-menu, .module-card, .module-column, .dash-manage-item, .arcgis-manage-item, .arcgis-manage-card, .dash-modal-card, .section-modal-card, .modal-content, .image-modal-bg, .ticket-panel, .ticket-create-modal, .ticket-create-confirm-card, .ticket-selected-panel, .ticket-category-filters, .pole-panel, .pole-ticket-card, .pole-ticket-modal-card, .ticket-pole-row, .dashboard-hero-summary, .dashboard-inventory-overview-item, .metric-card, .compare-scan-card, .compare-metric-card, .compare-table-column, .inventory-query-panel, .inventory-query-condition, .inventory-query-table-panel, .inventory-detail-shell, .inventory-detail-table-shell, .inventory-map-dialog, .empty-state, .mini-tag) {
    border-color: rgba(137, 190, 239, 0.24) !important;
    background: rgba(13, 31, 53, 0.94) !important;
    color: #dcecff !important;
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .dashboard-section, .dashboard-panel, .project-card, .metric-card, .compare-scan-card, .compare-metric-card, .inventory-query-panel, .ticket-panel)::before,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.card, .panel, .dashboard-section, .dashboard-panel, .project-card, .metric-card, .compare-scan-card, .compare-metric-card, .inventory-query-panel, .ticket-panel)::before {
    background: #7db8f0 !important;
    opacity: 0.9 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close, .ticket-pagination-btn, .ticket-category-filter, .ticket-pole-action, .admin-panel-trigger, .app-nav .app-nav-actions a, .app-nav .app-nav-actions .nav-pill, .app-nav-actions > span),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn, .btn-secondary, .btn-ghost, .btn-ghost-soft, .saved-btn, .arcgis-map-btn, .arcgis-table-btn, .view-picker-btn, .view-picker-tab, .pole-scope-btn, .compare-page-btn, .compare-table-tab, .compare-collapse-toggle, .inventory-query-page-btn, .inventory-query-remove, .inventory-detail-page-btn, .inventory-map-dialog-close, .ticket-pagination-btn, .ticket-category-filter, .ticket-pole-action, .admin-panel-trigger, .app-nav .app-nav-actions a, .app-nav .app-nav-actions .nav-pill, .app-nav-actions > span) {
    border-color: rgba(137, 190, 239, 0.28) !important;
    background: rgba(16, 38, 64, 0.96) !important;
    color: #dcecff !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active, .ticket-tab.is-active, .ticket-pagination-btn.is-active, .app-nav .app-nav-actions a.is-active, .app-nav .app-nav-actions .nav-pill.is-active),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.btn-primary, .btn-primary-soft, .arcgis-map-btn--primary, .filter-add, .dash-filter-add, .arcgis-filter-add, .compare-submit, .inventory-query-add, .pole-return-btn, .compare-table-tab.is-active, .inventory-query-page-number.is-active, .ticket-tab.is-active, .ticket-pagination-btn.is-active, .app-nav .app-nav-actions a.is-active, .app-nav .app-nav-actions .nav-pill.is-active) {
    border-color: rgba(125, 184, 240, 0.55) !important;
    background: #245f9f !important;
    color: #ffffff !important;
    box-shadow: 0 12px 28px rgba(34, 104, 173, 0.28) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    border-color: rgba(137, 190, 239, 0.24) !important;
    background: #10243c !important;
    color: #f4f9ff !important;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.18) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea)::placeholder,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.form-input, .input, .theme-select, .nice-select, .compare-search-input, .inventory-detail-search-input, .inventory-detail-pagination-select, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea)::placeholder {
    color: #7f9bb8 !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table th, .problem-poles-table th, .report-table th, .view-table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th, .ticket-table th, .ticket-pole-table th),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table th, .problem-poles-table th, .report-table th, .view-table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th, .ticket-table th, .ticket-pole-table th) {
    background: #132a45 !important;
    color: #b9d3ed !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table td, .problem-poles-table td, .report-table td, .view-table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td, .ticket-table td, .ticket-pole-table td),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table td, .problem-poles-table td, .report-table td, .view-table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td, .ticket-table td, .ticket-pole-table td) {
    background: rgba(16, 36, 60, 0.82) !important;
    color: #dcecff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-empty, .empty-state),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-empty, .empty-state) {
    border-color: rgba(137, 190, 239, 0.18) !important;
    color: #c5d9ee !important;
    background: rgba(10, 24, 42, 0.58) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-panel .dashboard-panel-subtitle,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .inventory-query-panel .dashboard-panel-subtitle {
    color: #c8dcf0 !important;
}

html.dark-mode body.compare-page :is(.compare-section-title-row, .compare-table-toolbar, .compare-pagination-footer),
html body.theme-dark.compare-page :is(.compare-section-title-row, .compare-table-toolbar, .compare-pagination-footer),
html.dark-mode body.compare-page .compare-table-panel > :first-child,
html body.theme-dark.compare-page .compare-table-panel > :first-child {
    background: #0d1f35 !important;
    color: #dcecff !important;
    border-color: rgba(137, 190, 239, 0.2) !important;
}

html.dark-mode body.compare-page .compare-section-title-row :is(h2, h3, span, button),
html body.theme-dark.compare-page .compare-section-title-row :is(h2, h3, span, button) {
    color: #dcecff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-create-modal .ticket-panel-head, .ticket-panel-head, .inventory-map-dialog-head, .panel-header, .card-header, .dashboard-section-header, .dashboard-panel-head, .compare-section-title-row, .compare-table-toolbar, .compare-pagination-footer),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-create-modal .ticket-panel-head, .ticket-panel-head, .inventory-map-dialog-head, .panel-header, .card-header, .dashboard-section-header, .dashboard-panel-head, .compare-section-title-row, .compare-table-toolbar, .compare-pagination-footer) {
    border-color: rgba(137, 190, 239, 0.22) !important;
    background: #0e2138 !important;
    color: #dcecff !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-create-modal .ticket-panel-head, .ticket-panel-head, .inventory-map-dialog-head, .panel-header, .card-header, .dashboard-section-header, .dashboard-panel-head, .compare-section-title-row, .compare-table-toolbar, .compare-pagination-footer) :is(h1, h2, h3, p, span, label),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.ticket-create-modal .ticket-panel-head, .ticket-panel-head, .inventory-map-dialog-head, .panel-header, .card-header, .dashboard-section-header, .dashboard-panel-head, .compare-section-title-row, .compare-table-toolbar, .compare-pagination-footer) :is(h1, h2, h3, p, span, label) {
    color: inherit !important;
}

/* Reduce nested box visual weight */
html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-inventory-overview, .dashboard-hero-summary, .dashboard-panel-body, .compare-table-panel, .inventory-query-table-panel, .ticket-selected-panel, .ticket-category-filters, .inventory-query-condition-list, .ticket-pole-picker) {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-inventory-overview)::before,
html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-hero-summary, .dashboard-panel-body, .compare-table-panel, .inventory-query-table-panel, .ticket-selected-panel, .ticket-category-filters, .inventory-query-condition-list, .ticket-pole-picker)::before,
html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-hero-summary, .dashboard-panel-body, .compare-table-panel, .inventory-query-table-panel, .ticket-selected-panel, .ticket-category-filters, .inventory-query-condition-list, .ticket-pole-picker)::after {
    display: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-grid {
    gap: 0 !important;
    border-top: 1px solid rgba(42, 100, 158, 0.12);
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item {
    min-height: 128px !important;
    border-width: 0 0 1px 0 !important;
    border-radius: 0 !important;
    border-color: rgba(42, 100, 158, 0.12) !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item::before {
    inset: 1rem auto 1rem 0 !important;
    width: 3px !important;
    height: auto !important;
    border-radius: 999px !important;
    background: rgba(93, 148, 200, 0.72) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item:hover {
    background: rgba(47, 117, 189, 0.055) !important;
    box-shadow: none !important;
    transform: none !important;
}

@media (min-width: 821px) {
    html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item {
        border-right: 1px solid rgba(42, 100, 158, 0.1) !important;
    }

    html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item:nth-child(4n) {
        border-right: 0 !important;
    }
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card) {
    border-width: 0 0 1px 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card)::before,
html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card)::after {
    display: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card):hover {
    background: rgba(47, 117, 189, 0.05) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table, .problem-poles-table, .report-table, .view-table, .arcgis-data-table, .dashboard-panel-body table, .compare-table, .inventory-query-table, .inventory-detail-table, .ticket-table, .ticket-pole-table) {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table th, .problem-poles-table th, .report-table th, .view-table th, .arcgis-data-table thead th, .dashboard-panel-body th, .compare-table th, .inventory-query-table th, .inventory-detail-table th, .ticket-table th, .ticket-pole-table th) {
    background: transparent !important;
    border-bottom-width: 1px !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.table td, .problem-poles-table td, .report-table td, .view-table td, .arcgis-data-table td, .dashboard-panel-body td, .compare-table td, .inventory-query-table td, .inventory-detail-table td, .ticket-table td, .ticket-pole-table td) {
    background: transparent !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-inventory-overview-grid, .dashboard-inventory-overview-item, .metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card),
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-inventory-overview-grid, .dashboard-inventory-overview-item, .metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card) {
    border-color: rgba(137, 190, 239, 0.16) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item:hover,
html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card):hover,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item:hover,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) :is(.metric-card, .compare-metric-card, .project-card, .pole-ticket-card, .ticket-pole-row, .inventory-query-condition, .scan-card, .pole-detail-card):hover {
    background: rgba(125, 184, 240, 0.075) !important;
}

/* Inventory asset totals: data field treatment, not nested cards */
html body:not(.login-page):not(.project-map-page):not(.map-embed) :is(.dashboard-hero, .dashboard-hero-summary, .dashboard-inventory-overview) {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview {
    padding-top: 1.2rem !important;
    border-top: 2px solid rgba(44, 128, 203, 0.72) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-heading {
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-grid {
    gap: clamp(1.25rem, 2.4vw, 2.1rem) clamp(1.15rem, 2.2vw, 2rem) !important;
    border: 0 !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item {
    min-height: 126px !important;
    padding: 0.35rem 0.5rem 0.45rem 1.35rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item::before {
    inset: 0.35rem auto 0.35rem 0 !important;
    width: 3px !important;
    height: auto !important;
    border-radius: 999px !important;
    background: rgba(82, 146, 205, 0.82) !important;
}

html body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview-item:hover {
    background: rgba(47, 117, 189, 0.07) !important;
    transform: translateX(2px) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-overview {
    border-top-color: rgba(105, 174, 238, 0.78) !important;
}

html.dark-mode body:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-heading,
html body.theme-dark:not(.login-page):not(.project-map-page):not(.map-embed) .dashboard-inventory-heading {
    border-bottom-color: transparent !important;
}
