/*
 * AHO-MGM 1.0.111
 * Floating Glass Enterprise Intelligence
 *
 * One authoritative visual layer for the authenticated application, login and
 * two-factor flows. Existing feature styles remain as compatibility sources;
 * this file owns tokens, surfaces, controls, shell, analytics and responsive
 * behaviour for the current product generation.
 */

/* ========================================================================== */
/* 1. DESIGN TOKENS                                                           */
/* ========================================================================== */

:root {
    color-scheme: light;

    /* Typography */
    --fg-font-sans: Inter, "SF Pro Text", "Segoe UI Variable", "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --fg-font-display: Inter, "SF Pro Display", "Segoe UI Variable Display", "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --fg-font-mono: "SFMono-Regular", "Cascadia Code", "Roboto Mono", ui-monospace, Consolas, monospace;
    --fg-text-xs: .75rem;
    --fg-text-sm: .8125rem;
    --fg-text-md: .9375rem;
    --fg-text-lg: 1.0625rem;
    --fg-text-xl: 1.25rem;
    --fg-text-2xl: clamp(1.5rem, 1.18rem + .9vw, 2.15rem);
    --fg-text-3xl: clamp(1.9rem, 1.42rem + 1.6vw, 3rem);
    --fg-leading-tight: 1.18;
    --fg-leading-copy: 1.58;

    /* Spacing */
    --fg-space-1: .25rem;
    --fg-space-2: .5rem;
    --fg-space-3: .75rem;
    --fg-space-4: 1rem;
    --fg-space-5: 1.25rem;
    --fg-space-6: 1.5rem;
    --fg-space-7: 1.75rem;
    --fg-space-8: 2rem;
    --fg-space-10: 2.5rem;
    --fg-space-12: 3rem;

    /* Geometry */
    --fg-radius-xs: .5rem;
    --fg-radius-sm: .75rem;
    --fg-radius-md: 1rem;
    --fg-radius-lg: 1.25rem;
    --fg-radius-xl: 1.625rem;
    --fg-radius-2xl: 2rem;
    --fg-radius-pill: 999px;
    --fg-control-sm: 2.25rem;
    --fg-control-md: 2.75rem;
    --fg-control-lg: 3rem;
    --fg-icon-sm: 1rem;
    --fg-icon-md: 1.25rem;
    --fg-icon-lg: 1.5rem;

    /* Brand and semantic color */
    --fg-accent: #087f78;
    --fg-accent-hover: #066c67;
    --fg-accent-strong: #075f5b;
    --fg-accent-soft: rgba(8, 127, 120, .10);
    --fg-accent-softer: rgba(8, 127, 120, .055);
    --fg-accent-ring: rgba(8, 127, 120, .23);
    --fg-indigo: #5b59c7;
    --fg-rose: #bc4d78;
    --fg-sky: #357ab7;
    --fg-violet: #7959bd;
    --fg-success: #08785d;
    --fg-warning: #996515;
    --fg-danger: #b33d4c;
    --fg-info: #286fa8;

    /* Light surfaces */
    --fg-canvas: #f8f3f5;
    --fg-canvas-secondary: #f4f3f8;
    --fg-canvas-pearl: #fbfafb;
    --fg-surface: rgba(255, 255, 255, .76);
    --fg-surface-soft: rgba(255, 255, 255, .62);
    --fg-surface-strong: rgba(255, 255, 255, .91);
    --fg-surface-solid: #fffefe;
    --fg-surface-muted: #f6f4f6;
    --fg-surface-tint: rgba(244, 251, 250, .86);
    --fg-sidebar: rgba(255, 253, 254, .79);
    --fg-overlay: rgba(35, 29, 38, .28);
    --fg-highlight: rgba(255, 255, 255, .82);

    /* Text and borders */
    --fg-ink: #1d2430;
    --fg-ink-2: #3e4655;
    --fg-muted: #626b79;
    --fg-faint: #7b8491;
    --fg-inverse: #ffffff;
    --fg-line: rgba(82, 75, 89, .16);
    --fg-line-strong: rgba(70, 63, 77, .25);
    --fg-line-glass: rgba(255, 255, 255, .72);

    /* Blur, elevation and motion */
    --fg-blur-sm: 10px;
    --fg-blur-md: 18px;
    --fg-blur-lg: 28px;
    --fg-shadow-xs: 0 1px 2px rgba(43, 32, 48, .045);
    --fg-shadow-sm: 0 10px 28px rgba(54, 39, 59, .075), 0 1px 2px rgba(54, 39, 59, .04);
    --fg-shadow-md: 0 20px 54px rgba(54, 39, 59, .105), 0 3px 10px rgba(54, 39, 59, .055);
    --fg-shadow-lg: 0 32px 90px rgba(45, 31, 52, .17), 0 8px 24px rgba(45, 31, 52, .08);
    --fg-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .76);
    --fg-ease: cubic-bezier(.2, .78, .22, 1);
    --fg-motion-fast: 120ms var(--fg-ease);
    --fg-motion: 180ms var(--fg-ease);
    --fg-motion-slow: 220ms var(--fg-ease);

    /* Layout and layers */
    --fg-sidebar-width: 17rem;
    --fg-sidebar-compact: 5.25rem;
    --fg-shell-gap: 1.125rem;
    --fg-shell-inset: 1.125rem;
    --fg-topbar-height: 4.5rem;
    --fg-content-max: 112rem;
    --fg-breakpoint-mobile: 640px;
    --fg-breakpoint-tablet: 900px;
    --fg-breakpoint-notebook: 1180px;
    --fg-z-base: 0;
    --fg-z-sticky: 40;
    --fg-z-dropdown: 120;
    --fg-z-drawer: 180;
    --fg-z-modal: 240;
    --fg-z-toast: 300;

    /* Chart system */
    --aho-chart-ink: #202735;
    --aho-chart-text: #414b5b;
    --aho-chart-muted: #697585;
    --aho-chart-grid: rgba(91, 84, 99, .12);
    --aho-chart-grid-strong: rgba(91, 84, 99, .24);
    --aho-chart-track: #ebe8ec;
    --aho-chart-surface: #fffefe;
    --aho-chart-primary: #087f78;
    --aho-chart-primary-soft: #75b9b3;
    --aho-chart-area-top: rgba(8, 127, 120, .24);
    --aho-chart-area-bottom: rgba(8, 127, 120, .018);
    --aho-chart-radar-fill: rgba(91, 89, 199, .14);
    --aho-chart-series-1: #087f78;
    --aho-chart-series-2: #5b59c7;
    --aho-chart-series-3: #bc4d78;
    --aho-chart-series-4: #357ab7;
    --aho-chart-series-5: #a36b16;
    --aho-chart-series-6: #7959bd;
    --aho-chart-series-7: #c15a47;
    --aho-chart-series-8: #27848c;
    --aho-chart-series-9: #6c79c8;
    --aho-chart-series-10: #a85d8c;

    /* Compatibility aliases used by historical feature components. */
    --color-primary: var(--fg-accent);
    --color-primary-hover: var(--fg-accent-hover);
    --color-primary-soft: var(--fg-accent-soft);
    --color-success: var(--fg-success);
    --color-warning: var(--fg-warning);
    --color-danger: var(--fg-danger);
    --color-info: var(--fg-info);
    --bg-app: var(--fg-canvas);
    --bg-sidebar: var(--fg-sidebar);
    --bg-card: var(--fg-surface-strong);
    --bg-muted: var(--fg-surface-muted);
    --bg-hover: rgba(255, 255, 255, .68);
    --surface: var(--fg-surface-strong);
    --surface-raised: var(--fg-surface-solid);
    --surface-elevated: var(--fg-surface-solid);
    --surface-muted: var(--fg-surface-muted);
    --surface-soft: var(--fg-surface-soft);
    --text: var(--fg-ink);
    --text-primary: var(--fg-ink);
    --text-secondary: var(--fg-ink-2);
    --text-muted: var(--fg-muted);
    --border: var(--fg-line);
    --border-color: var(--fg-line);
    --border-subtle: var(--fg-line);
    --border-strong: var(--fg-line-strong);
    --accent: var(--fg-accent);
    --aho-accent: var(--fg-accent);
    --aho-accent-hover: var(--fg-accent-hover);
    --aho-focus: 0 0 0 4px var(--fg-accent-ring);
    --radius-sm: var(--fg-radius-sm);
    --radius-md: var(--fg-radius-md);
    --radius-lg: var(--fg-radius-lg);
    --radius-xl: var(--fg-radius-xl);
    --shadow-xs: var(--fg-shadow-xs);
    --shadow-sm: var(--fg-shadow-sm);
    --shadow-md: var(--fg-shadow-md);
    --iw-accent: var(--fg-accent);
    --iw-indigo: var(--fg-indigo);
    --iw-ink: var(--fg-ink);
    --iw-muted: var(--fg-muted);
    --iw-faint: var(--fg-faint);
    --iw-line: var(--fg-line);
    --iw-line-soft: rgba(91, 84, 99, .11);
    --iw-canvas: var(--fg-surface-solid);
    --iw-glass: var(--fg-surface);
    --iw-glass-strong: var(--fg-surface-strong);
}

:root[data-theme="dark"],
:root[data-theme-mode="dark"] {
    color-scheme: dark;
    --fg-accent: #62cfc5;
    --fg-accent-hover: #7edbd3;
    --fg-accent-strong: #9ce9e1;
    --fg-accent-soft: rgba(98, 207, 197, .14);
    --fg-accent-softer: rgba(98, 207, 197, .07);
    --fg-accent-ring: rgba(98, 207, 197, .25);
    --fg-indigo: #a9a8ff;
    --fg-rose: #f08db3;
    --fg-sky: #82bdef;
    --fg-violet: #b99bea;
    --fg-success: #66d4ad;
    --fg-warning: #e7b862;
    --fg-danger: #ff8997;
    --fg-info: #84c0ed;
    --fg-canvas: #121219;
    --fg-canvas-secondary: #17151e;
    --fg-canvas-pearl: #1a1820;
    --fg-surface: rgba(31, 29, 38, .78);
    --fg-surface-soft: rgba(34, 31, 41, .66);
    --fg-surface-strong: rgba(35, 33, 43, .93);
    --fg-surface-solid: #24222c;
    --fg-surface-muted: #2b2833;
    --fg-surface-tint: rgba(28, 42, 43, .90);
    --fg-sidebar: rgba(27, 25, 34, .84);
    --fg-overlay: rgba(3, 3, 7, .62);
    --fg-highlight: rgba(255, 255, 255, .07);
    --fg-ink: #f4f1f5;
    --fg-ink-2: #d1ccd5;
    --fg-muted: #aaa4b0;
    --fg-faint: #8c8793;
    --fg-line: rgba(225, 217, 229, .14);
    --fg-line-strong: rgba(225, 217, 229, .24);
    --fg-line-glass: rgba(255, 255, 255, .10);
    --fg-shadow-xs: 0 1px 2px rgba(0, 0, 0, .2);
    --fg-shadow-sm: 0 12px 34px rgba(0, 0, 0, .25), 0 1px 2px rgba(0, 0, 0, .2);
    --fg-shadow-md: 0 22px 64px rgba(0, 0, 0, .34), 0 4px 12px rgba(0, 0, 0, .24);
    --fg-shadow-lg: 0 36px 100px rgba(0, 0, 0, .48), 0 10px 28px rgba(0, 0, 0, .26);
    --fg-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .08);
    --aho-chart-ink: #f3f0f5;
    --aho-chart-text: #d3ced8;
    --aho-chart-muted: #aaa5b1;
    --aho-chart-grid: rgba(223, 214, 228, .13);
    --aho-chart-grid-strong: rgba(223, 214, 228, .26);
    --aho-chart-track: #37333f;
    --aho-chart-surface: #24222c;
    --aho-chart-primary: #62cfc5;
    --aho-chart-primary-soft: #397e79;
    --aho-chart-area-top: rgba(98, 207, 197, .30);
    --aho-chart-area-bottom: rgba(98, 207, 197, .035);
    --aho-chart-radar-fill: rgba(169, 168, 255, .18);
    --aho-chart-series-1: #62cfc5;
    --aho-chart-series-2: #a9a8ff;
    --aho-chart-series-3: #f08db3;
    --aho-chart-series-4: #82bdef;
    --aho-chart-series-5: #e7b862;
    --aho-chart-series-6: #b99bea;
    --aho-chart-series-7: #f08f7c;
    --aho-chart-series-8: #66c3ca;
    --aho-chart-series-9: #c3caff;
    --aho-chart-series-10: #e6a5c5;
}

/* ========================================================================== */
/* 2. BASE, ACCESSIBILITY AND MOTION                                          */
/* ========================================================================== */

html {
    min-width: 320px;
    min-height: 100%;
    background: var(--fg-canvas);
    font-size: 16px;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
}

html body {
    min-width: 320px;
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0;
    overflow-x: hidden;
    color: var(--fg-ink);
    background:
        radial-gradient(circle at 7% 4%, rgba(226, 174, 198, .28), transparent 30rem),
        radial-gradient(circle at 92% 8%, rgba(172, 217, 218, .20), transparent 32rem),
        radial-gradient(circle at 74% 88%, rgba(193, 181, 228, .20), transparent 34rem),
        linear-gradient(145deg, var(--fg-canvas-pearl), var(--fg-canvas) 46%, var(--fg-canvas-secondary));
    background-attachment: fixed;
    font-family: var(--fg-font-sans);
    font-size: var(--fg-text-md);
    line-height: var(--fg-leading-copy);
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "tnum" 1;
}

:root[data-theme="dark"] body,
:root[data-theme-mode="dark"] body {
    background:
        radial-gradient(circle at 6% 3%, rgba(112, 64, 91, .22), transparent 31rem),
        radial-gradient(circle at 93% 10%, rgba(47, 112, 111, .15), transparent 32rem),
        radial-gradient(circle at 72% 88%, rgba(87, 75, 130, .16), transparent 34rem),
        linear-gradient(145deg, var(--fg-canvas-pearl), var(--fg-canvas) 48%, var(--fg-canvas-secondary));
}

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

html body :where(button, input, select, textarea) {
    font: inherit;
}

html body :where(h1, h2, h3, h4, h5, h6, .card__title, legend) {
    color: var(--fg-ink);
    font-family: var(--fg-font-display);
    font-weight: 720;
    letter-spacing: -.025em;
    line-height: var(--fg-leading-tight);
    text-wrap: balance;
}

html body :where(p, li, dd, .page-header p) {
    text-wrap: pretty;
}

html body :where(small, .text-muted, .aho-muted) {
    color: var(--fg-muted);
}

html body :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--fg-accent-ring) !important;
    outline-offset: 3px !important;
}

html body :where(button, a, summary) {
    -webkit-tap-highlight-color: transparent;
}

html body ::selection {
    color: var(--fg-ink);
    background: rgba(98, 207, 197, .26);
}

html body .skip-link {
    z-index: calc(var(--fg-z-modal) + 10);
    left: 1rem;
    top: 1rem;
    border-radius: var(--fg-radius-sm);
    color: var(--fg-inverse);
    background: var(--fg-accent-strong);
    box-shadow: var(--fg-shadow-md);
}

html body :is(.content, .ew-shell, .iw-canvas, .aho-entry-stage)::before,
html body :is(.content, .ew-shell, .iw-canvas, .aho-entry-stage)::after {
    background-image: none !important;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    html body *,
    html body *::before,
    html body *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

/* ========================================================================== */
/* 3. FLOATING APPLICATION SHELL                                              */
/* ========================================================================== */

html body .app-shell {
    display: grid !important;
    grid-template-columns: var(--fg-sidebar-width) minmax(0, 1fr) !important;
    gap: var(--fg-shell-gap) !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    padding: var(--fg-shell-inset) !important;
    background: transparent !important;
}

html body .app-main {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    min-height: calc(100dvh - (var(--fg-shell-inset) * 2)) !important;
    margin: 0 !important;
}

html body .sidebar {
    position: sticky !important;
    z-index: var(--fg-z-sticky) !important;
    top: var(--fg-shell-inset) !important;
    left: auto !important;
    width: 100% !important;
    height: calc(100dvh - (var(--fg-shell-inset) * 2)) !important;
    min-height: 36rem;
    overflow: hidden;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-xl) !important;
    color: var(--fg-ink) !important;
    background:
        linear-gradient(150deg, var(--fg-highlight), transparent 42%),
        var(--fg-sidebar) !important;
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset) !important;
    backdrop-filter: saturate(135%) blur(var(--fg-blur-md));
    -webkit-backdrop-filter: saturate(135%) blur(var(--fg-blur-md));
}

html body .sidebar__brand {
    min-height: 5rem !important;
    padding: .875rem .875rem .75rem !important;
    border-bottom: 1px solid var(--fg-line) !important;
}

html body .brand {
    min-width: 0;
    gap: .75rem !important;
    color: var(--fg-ink) !important;
}

html body .brand__mark,
html body .brand__logo {
    display: grid !important;
    place-items: center !important;
    width: 2.625rem !important;
    min-width: 2.625rem !important;
    height: 2.625rem !important;
    border: 1px solid rgba(8, 127, 120, .20) !important;
    border-radius: .875rem !important;
    color: var(--fg-accent) !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(229, 246, 244, .70)) !important;
    box-shadow: 0 7px 18px rgba(8, 127, 120, .11), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

:root[data-theme="dark"] body .brand__mark,
:root[data-theme="dark"] body .brand__logo {
    background: linear-gradient(145deg, rgba(98, 207, 197, .18), rgba(255, 255, 255, .04)) !important;
}

html body .brand__mark svg {
    width: 1.375rem !important;
    height: 1.375rem !important;
    stroke-width: 1.8 !important;
}

html body .brand__text {
    min-width: 0;
    line-height: 1.22;
}

html body .brand__text strong {
    overflow: hidden;
    color: var(--fg-ink) !important;
    font-size: .9375rem !important;
    font-weight: 760 !important;
    letter-spacing: -.015em !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body .brand__text small {
    overflow: hidden;
    color: var(--fg-muted) !important;
    font-size: .6875rem !important;
    font-weight: 620 !important;
    letter-spacing: .025em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body :is(.sidebar__collapse, .sidebar__close) {
    width: 2.25rem !important;
    min-width: 2.25rem !important;
    height: 2.25rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .75rem !important;
    color: var(--fg-muted) !important;
    background: var(--fg-surface-soft) !important;
    transition: color var(--fg-motion), background var(--fg-motion), transform var(--fg-motion) !important;
}

html body :is(.sidebar__collapse, .sidebar__close):hover {
    color: var(--fg-accent) !important;
    background: var(--fg-surface-solid) !important;
    transform: translateY(-1px);
}

html body .sidebar__navigation {
    padding: .75rem .625rem 1rem !important;
    scrollbar-width: thin;
    scrollbar-color: var(--fg-line-strong) transparent;
}

html body .nav-section + .nav-section {
    margin-top: .875rem !important;
    padding-top: .75rem !important;
    border-top: 1px solid var(--fg-line) !important;
}

html body .nav-section__title {
    padding: 0 .75rem .375rem !important;
    color: var(--fg-faint) !important;
    font-size: .6875rem !important;
    font-weight: 760 !important;
    letter-spacing: .09em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html body .nav-section__items {
    display: grid !important;
    gap: .1875rem !important;
}

html body .nav-item {
    position: relative;
    display: flex !important;
    min-width: 0;
    min-height: 2.625rem !important;
    padding: .375rem .625rem !important;
    gap: .625rem !important;
    border: 1px solid transparent !important;
    border-radius: .875rem !important;
    color: var(--fg-ink-2) !important;
    background: transparent !important;
    font-size: .84375rem !important;
    font-weight: 640 !important;
    transition: color var(--fg-motion), border-color var(--fg-motion), background var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body .nav-item:hover {
    border-color: var(--fg-line) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-soft) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
    transform: translateX(2px);
}

html body .nav-item.is-active {
    border-color: rgba(8, 127, 120, .22) !important;
    color: var(--fg-accent-strong) !important;
    background:
        linear-gradient(90deg, rgba(8, 127, 120, .13), rgba(255, 255, 255, .52)) !important;
    box-shadow: inset 3px 0 0 var(--fg-accent), 0 8px 22px rgba(8, 127, 120, .075), var(--fg-shadow-inset) !important;
}

:root[data-theme="dark"] body .nav-item.is-active {
    color: var(--fg-accent) !important;
    background: linear-gradient(90deg, rgba(98, 207, 197, .17), rgba(255, 255, 255, .035)) !important;
}

html body .nav-item__icon {
    display: grid !important;
    place-items: center !important;
    width: 1.875rem !important;
    min-width: 1.875rem !important;
    height: 1.875rem !important;
    border-radius: .625rem !important;
    color: var(--fg-muted) !important;
    background: rgba(255, 255, 255, .35) !important;
}

html body .nav-item__icon svg {
    width: 1.0625rem !important;
    height: 1.0625rem !important;
    stroke-width: 1.85 !important;
}

html body .nav-item:is(:hover, .is-active) .nav-item__icon {
    color: var(--fg-accent) !important;
    background: var(--fg-surface-strong) !important;
}

html body .nav-item__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body .sidebar__footer {
    padding: .625rem !important;
    border-top: 1px solid var(--fg-line) !important;
    background: transparent !important;
}

html body .system-indicator {
    min-height: 3.125rem !important;
    padding: .5rem .625rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .875rem !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-soft) !important;
}

html body .system-indicator__icon {
    color: var(--fg-success) !important;
}

html body .topbar {
    position: sticky !important;
    z-index: var(--fg-z-sticky) !important;
    top: var(--fg-shell-inset) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: var(--fg-topbar-height) !important;
    margin: 0 0 var(--fg-shell-gap) !important;
    padding: .625rem .75rem .625rem 1rem !important;
    gap: .875rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    background:
        linear-gradient(135deg, var(--fg-highlight), transparent 44%),
        var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
    -webkit-backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
}

html body .topbar__left,
html body .topbar__actions {
    display: flex !important;
    align-items: center !important;
    min-width: 0;
    gap: .625rem !important;
}

html body .topbar__left { flex: 1 1 auto; }
html body .topbar__actions { flex: 0 0 auto; }

html body .topbar__title {
    min-width: 8.5rem;
    line-height: 1.14;
}

html body .topbar__eyebrow {
    color: var(--fg-faint) !important;
    font-size: .6875rem !important;
    font-weight: 720 !important;
    letter-spacing: .075em !important;
    text-transform: uppercase !important;
}

html body .topbar__title strong {
    color: var(--fg-ink) !important;
    font-size: 1rem !important;
    font-weight: 760 !important;
    letter-spacing: -.018em !important;
}

html body .topbar-search {
    display: flex !important;
    align-items: center !important;
    min-width: min(28rem, 34vw) !important;
    min-height: 2.75rem !important;
    margin-left: .5rem !important;
    padding: 0 .625rem 0 .75rem !important;
    gap: .625rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .875rem !important;
    color: var(--fg-muted) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: inset 0 1px 0 var(--fg-highlight), 0 4px 14px rgba(44, 32, 49, .035) !important;
    transition: color var(--fg-motion), border-color var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body .topbar-search:hover {
    border-color: rgba(8, 127, 120, .32) !important;
    color: var(--fg-ink) !important;
    box-shadow: 0 8px 24px rgba(8, 127, 120, .08), var(--fg-shadow-inset) !important;
    transform: translateY(-1px);
}

html body .topbar-search svg {
    width: 1.125rem !important;
    height: 1.125rem !important;
    color: var(--fg-accent) !important;
}

html body .topbar-search span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body .topbar-search kbd {
    margin-left: auto;
    padding: .1875rem .4375rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .4375rem !important;
    color: var(--fg-muted) !important;
    background: var(--fg-surface-muted) !important;
    box-shadow: 0 1px 0 var(--fg-line-strong) !important;
    font-family: var(--fg-font-mono) !important;
    font-size: .6875rem !important;
}

html body .topbar-greeting {
    color: var(--fg-muted) !important;
    font-size: .8125rem !important;
}

html body .topbar-greeting strong { color: var(--fg-ink) !important; }

html body :is(.icon-button, .aho-theme-switcher button, .user-menu) {
    min-height: 2.75rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .875rem !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
    transition: color var(--fg-motion), border-color var(--fg-motion), background var(--fg-motion), transform var(--fg-motion) !important;
}

html body :is(.icon-button, .aho-theme-switcher button, .user-menu):hover {
    border-color: rgba(8, 127, 120, .28) !important;
    color: var(--fg-accent) !important;
    background: var(--fg-surface-solid) !important;
    transform: translateY(-1px);
}

html body .aho-theme-switcher {
    display: inline-flex !important;
    padding: .1875rem !important;
    gap: .125rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .9375rem !important;
    background: var(--fg-surface-soft) !important;
}

html body .aho-theme-switcher button {
    min-height: 2.25rem !important;
    padding: 0 .625rem !important;
    border-color: transparent !important;
    border-radius: .6875rem !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: .75rem !important;
}

html body .aho-theme-switcher button[aria-pressed="true"] {
    color: var(--fg-accent-strong) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

html body .user-menu {
    padding: .25rem .5rem .25rem .3125rem !important;
    gap: .5rem !important;
}

html body .user-menu__avatar {
    display: grid !important;
    place-items: center !important;
    width: 2.125rem !important;
    min-width: 2.125rem !important;
    height: 2.125rem !important;
    border: 1px solid rgba(8, 127, 120, .20) !important;
    color: var(--fg-accent-strong) !important;
    background: linear-gradient(145deg, rgba(222, 246, 242, .9), rgba(242, 232, 240, .75)) !important;
    font-size: .75rem !important;
    font-weight: 780 !important;
}

html body .user-menu__details strong {
    color: var(--fg-ink) !important;
    font-size: .8125rem !important;
}

html body .user-menu__details small {
    color: var(--fg-muted) !important;
    font-size: .6875rem !important;
}

html body :is(.profile-dropdown, .iw-filter-sheet, .lab83-chart-menu__panel) {
    z-index: var(--fg-z-dropdown) !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-lg), var(--fg-shadow-inset) !important;
    backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
    -webkit-backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
}

html body .profile-dropdown {
    top: calc(var(--fg-shell-inset) + var(--fg-topbar-height) + .5rem) !important;
    right: var(--fg-shell-inset) !important;
    width: min(21rem, calc(100vw - 2rem)) !important;
    padding: .5rem !important;
}

html body .profile-dropdown__header {
    padding: .625rem !important;
    border-radius: .75rem !important;
    background: var(--fg-accent-softer) !important;
}

html body .profile-dropdown__divider {
    border-color: var(--fg-line) !important;
}

html body .profile-dropdown > a,
html body .profile-dropdown button {
    min-height: 2.625rem !important;
    padding: .625rem .75rem !important;
    border-radius: .6875rem !important;
    color: var(--fg-ink-2) !important;
}

html body .profile-dropdown > a:hover,
html body .profile-dropdown button:hover {
    color: var(--fg-ink) !important;
    background: var(--fg-accent-softer) !important;
}

html body .content {
    position: relative;
    z-index: 1;
    width: 100% !important;
    max-width: var(--fg-content-max) !important;
    margin: 0 auto !important;
    padding: .125rem .25rem 2.25rem !important;
    color: var(--fg-ink) !important;
}

html body .page-header {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    margin: 0 0 1.125rem !important;
    padding: 1.25rem 1.375rem !important;
    gap: 1.25rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    background: linear-gradient(135deg, var(--fg-surface-strong), var(--fg-surface-soft)) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-sm));
}

html body .page-breadcrumb {
    color: var(--fg-muted) !important;
    font-size: .75rem !important;
    font-weight: 650 !important;
}

html body .page-breadcrumb a:hover { color: var(--fg-accent) !important; }

html body .page-header h1 {
    margin: .375rem 0 .25rem !important;
    font-size: var(--fg-text-2xl) !important;
}

html body .page-header p {
    max-width: 74ch;
    margin: 0 !important;
    color: var(--fg-muted) !important;
    font-size: .875rem !important;
}

html body .app-footer {
    margin-top: auto !important;
    padding: 1rem .5rem .25rem !important;
    border: 0 !important;
    color: var(--fg-faint) !important;
    background: transparent !important;
    font-size: .75rem !important;
}

html body.sidebar-collapsed .app-shell {
    grid-template-columns: var(--fg-sidebar-compact) minmax(0, 1fr) !important;
}

html body.sidebar-collapsed .sidebar__brand {
    justify-content: center !important;
    padding-inline: .5rem !important;
}

html body.sidebar-collapsed :is(.brand__text, .nav-section__title, .nav-item__label, .system-indicator__content) {
    display: none !important;
}

html body.sidebar-collapsed .sidebar__navigation { padding-inline: .5rem !important; }
html body.sidebar-collapsed .nav-section + .nav-section { margin-top: .5rem !important; padding-top: .5rem !important; }
html body.sidebar-collapsed .nav-item { justify-content: center !important; min-height: 2.75rem !important; padding: .375rem !important; transform: none !important; }
html body.sidebar-collapsed .nav-item__icon { width: 2rem !important; min-width: 2rem !important; height: 2rem !important; }
html body.sidebar-collapsed .system-indicator { justify-content: center !important; padding: .375rem !important; }

/* ========================================================================== */
/* 4. REUSABLE FLOATING GLASS COMPONENTS                                     */
/* ========================================================================== */

/* Public component vocabulary. The existing PHP templates are mapped onto
   these primitives below, so new screens can use either the semantic Glass*
   class or the established application class without creating a second UI. */
html body :where(.FloatingGlassCard, .FloatingOptionCard, .GlassMetricCard, .GlassChartCard, .GlassExportPanel) {
    border: 1px solid var(--fg-line-glass);
    border-radius: var(--fg-radius-lg);
    color: var(--fg-ink);
    background: linear-gradient(145deg, var(--fg-highlight), transparent 44%), var(--fg-surface);
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset);
    backdrop-filter: saturate(125%) blur(var(--fg-blur-sm));
    -webkit-backdrop-filter: saturate(125%) blur(var(--fg-blur-sm));
}

html body :where(.GlassInput, .GlassSelect, .GlassSearch, .GlassDatePicker) {
    min-height: var(--fg-control-md);
    border: 1px solid var(--fg-line-strong);
    border-radius: .75rem;
    color: var(--fg-ink);
    background: var(--fg-surface-strong);
    box-shadow: inset 0 1px 2px rgba(45, 32, 50, .025), var(--fg-shadow-inset);
}

html body :where(.GlassTabs, .GlassNavigation) {
    display: flex;
    align-items: center;
    padding: .3125rem;
    gap: .1875rem;
    border: 1px solid var(--fg-line);
    border-radius: .9375rem;
    background: var(--fg-surface-soft);
}

html body :where(.GlassSidebar, .GlassDrawer, .GlassPopover, .GlassModal, .GlassTooltip) {
    border: 1px solid var(--fg-line-glass);
    color: var(--fg-ink);
    background: var(--fg-surface-strong);
    box-shadow: var(--fg-shadow-lg), var(--fg-shadow-inset);
    backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
    -webkit-backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
}

html body .GlassSidebar { border-radius: var(--fg-radius-xl); }
html body .GlassDrawer { border-radius: var(--fg-radius-xl) 0 0 var(--fg-radius-xl); }
html body :where(.GlassPopover, .GlassTooltip) { border-radius: var(--fg-radius-sm); }
html body .GlassModal { border-radius: var(--fg-radius-xl); }

html body :where(.GlassFilterChip, .GlassStatusIndicator) {
    display: inline-flex;
    align-items: center;
    min-height: 1.625rem;
    padding: .1875rem .5625rem;
    gap: .3125rem;
    border: 1px solid var(--fg-line);
    border-radius: var(--fg-radius-pill);
    color: var(--fg-ink-2);
    background: var(--fg-surface-strong);
    font-size: var(--fg-text-xs);
    font-weight: 720;
}

html body .GlassTable {
    overflow: auto;
    border: 1px solid var(--fg-line);
    border-radius: var(--fg-radius-md);
    background: var(--fg-surface-solid);
    box-shadow: var(--fg-shadow-xs);
}

html body .GlassSectionHeader {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-bottom: .75rem;
    gap: 1rem;
    border-bottom: 1px solid var(--fg-line);
}

html body .GlassNotification {
    padding: .875rem 1rem;
    border: 1px solid var(--fg-line);
    border-radius: var(--fg-radius-sm);
    color: var(--fg-ink-2);
    background: var(--fg-surface-strong);
    box-shadow: var(--fg-shadow-xs);
}

html body .GlassEmptyState {
    padding: 1.5rem;
    border: 1px dashed var(--fg-line-strong);
    border-radius: var(--fg-radius-md);
    color: var(--fg-muted);
    background: var(--fg-surface-soft);
    text-align: center;
}

html body :where(
    .fg-card,
    .card,
    .aho-card,
    .aho-form-card,
    .aho-workspace,
    .aho-admin-card,
    .aho-import-card,
    .aho-import-job-card,
    .aho-audit-detail-card,
    .aho-audit-filter-card,
    .aho-audit-summary-card,
    .aho-mfa-policy,
    .aho-profile-security-card,
    .aho-profile-theme-card,
    .aho-profile-image-card,
    .aho-annual-report-card,
    .lab82-card,
    .intel-panel,
    .aho-inventory-catalog,
    .aho-inventory-movements,
    .aho-scanner-card
) {
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    color: var(--fg-ink) !important;
    background:
        linear-gradient(145deg, var(--fg-highlight), transparent 44%),
        var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body :where(
    .aho-form-section,
    .aho-fieldset,
    .aho-permission-group,
    .aho-retention-section,
    .aho-info-item,
    .aho-security-method,
    .aho-report-sources,
    .aho-annual-media-panel,
    .aho-annual-properties
) {
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

html body :where(.card__header, .aho-form-section__header, .aho-section-heading, .intel-panel__head) {
    border-color: var(--fg-line) !important;
}

html body :where(.card__header, .card__body) {
    padding: 1.125rem 1.25rem !important;
}

html body :where(.card__header h2, .card__header h3, .card__title) {
    margin: 0;
    font-size: 1.0625rem !important;
}

html body :where(.button, .aho-button, .aho-button-primary, .aho-button-secondary, .GlassButton) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: var(--fg-control-md) !important;
    padding: .5625rem .9375rem !important;
    gap: .5rem !important;
    border: 1px solid var(--fg-line-strong) !important;
    border-radius: .75rem !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
    font-size: .8125rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: color var(--fg-motion), border-color var(--fg-motion), background var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body :where(.button, .aho-button, .aho-button-primary, .aho-button-secondary):hover:not(:disabled) {
    border-color: rgba(8, 127, 120, .34) !important;
    color: var(--fg-accent-strong) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    transform: translateY(-1px);
}

html body :where(.button--primary, .aho-button-primary, .aho-save-button, .aho-scanner-submit) {
    border-color: var(--fg-accent) !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0b9289, var(--fg-accent-strong)) !important;
    box-shadow: 0 9px 22px rgba(8, 127, 120, .18), inset 0 1px 0 rgba(255, 255, 255, .25) !important;
}

html body :where(.button--primary, .aho-button-primary, .aho-save-button, .aho-scanner-submit):hover:not(:disabled) {
    border-color: var(--fg-accent-hover) !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #087f78, #075f5b) !important;
    box-shadow: 0 12px 28px rgba(8, 127, 120, .24), inset 0 1px 0 rgba(255, 255, 255, .24) !important;
}

:root[data-theme="dark"] body :where(.button--primary, .aho-button-primary, .aho-save-button, .aho-scanner-submit) {
    color: #102221 !important;
    background: linear-gradient(135deg, #7adbd2, #51bdb4) !important;
}

html body :where(.button--small, .button--compact) {
    min-height: var(--fg-control-sm) !important;
    padding: .375rem .6875rem !important;
    font-size: .75rem !important;
}

html body :where(button, input, select, textarea):disabled,
html body [aria-disabled="true"] {
    cursor: not-allowed !important;
    opacity: .52 !important;
    transform: none !important;
    box-shadow: none !important;
}

html body :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    select,
    textarea
):not(:where(.aho-report-sheet *, .aho-a4-sheet *)) {
    width: 100%;
    min-height: var(--fg-control-md) !important;
    padding: .625rem .75rem !important;
    border: 1px solid var(--fg-line-strong) !important;
    border-radius: .75rem !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: inset 0 1px 2px rgba(45, 32, 50, .025), 0 1px 0 var(--fg-highlight) !important;
    font-size: .875rem !important;
    line-height: 1.35 !important;
    transition: border-color var(--fg-motion), box-shadow var(--fg-motion), background var(--fg-motion) !important;
}

html body textarea:not(:where(.aho-report-sheet *, .aho-a4-sheet *)) {
    min-height: 7rem !important;
    line-height: 1.52 !important;
    resize: vertical;
}

html body :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    select,
    textarea
):not(:where(.aho-report-sheet *, .aho-a4-sheet *)):hover {
    border-color: rgba(8, 127, 120, .34) !important;
    background: var(--fg-surface-solid) !important;
}

html body :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    select,
    textarea
):not(:where(.aho-report-sheet *, .aho-a4-sheet *)):focus {
    outline: 0 !important;
    border-color: var(--fg-accent) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: 0 0 0 4px var(--fg-accent-ring), inset 0 1px 1px rgba(45, 32, 50, .025) !important;
}

html body :where(input, textarea)::placeholder {
    color: var(--fg-faint) !important;
    opacity: 1 !important;
}

html body select:not(:where(.aho-report-sheet *, .aho-a4-sheet *)) {
    padding-right: 2.25rem !important;
}

html body :where(label, .aho-field > span:first-child, .field > span:first-child, legend) {
    color: var(--fg-ink-2);
    font-size: .8125rem;
    font-weight: 680;
}

html body :where(.aho-field-help, .aho80-fieldset-help, .field-help) {
    color: var(--fg-muted) !important;
    font-size: .75rem !important;
    line-height: 1.5 !important;
}

html body :where(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--fg-accent);
}

html body :where(.alert, .aho-alert, .aho-admin-notice, .aho-import-job-notice, .aho-permission-notice) {
    padding: .875rem 1rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-sm) !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs) !important;
}

html body :where(.alert--success, .aho-alert--ok) {
    border-color: color-mix(in srgb, var(--fg-success) 32%, var(--fg-line)) !important;
    color: var(--fg-success) !important;
    background: color-mix(in srgb, var(--fg-success) 7%, var(--fg-surface-solid)) !important;
}

html body :where(.alert--danger, .aho-alert--error, .aho-import-error-message) {
    border-color: color-mix(in srgb, var(--fg-danger) 32%, var(--fg-line)) !important;
    color: var(--fg-danger) !important;
    background: color-mix(in srgb, var(--fg-danger) 7%, var(--fg-surface-solid)) !important;
}

html body :where(.aho-badge, .badge, .status-badge, .aho-admin-badge, .aho-mfa-badge, .aho-stock-badge, .aho-filter-chip) {
    display: inline-flex;
    align-items: center;
    min-height: 1.625rem;
    padding: .1875rem .5625rem;
    gap: .3125rem;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-pill) !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-strong) !important;
    font-size: .6875rem !important;
    font-weight: 720 !important;
    line-height: 1.2;
}

html body :where(.aho-empty, .aho-empty-state, .empty-state, .iw-empty, .intel-empty) {
    border: 1px dashed var(--fg-line-strong) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-muted) !important;
    background: var(--fg-surface-soft) !important;
}

html body :where(.aho-confirm-backdrop, .aho-drilldown-backdrop, .aho-modal__backdrop) {
    z-index: var(--fg-z-modal) !important;
    background: var(--fg-overlay) !important;
    backdrop-filter: blur(8px) saturate(110%);
    -webkit-backdrop-filter: blur(8px) saturate(110%);
}

html body :where(.aho-confirm-dialog, .aho-drilldown-modal, .aho-modal__dialog, .aho-annual-modal__dialog) {
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-xl) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-lg), var(--fg-shadow-inset) !important;
    backdrop-filter: saturate(135%) blur(var(--fg-blur-lg));
    -webkit-backdrop-filter: saturate(135%) blur(var(--fg-blur-lg));
}

html body :where(.aho-confirm-dialog__header, .aho-drilldown-modal__header) {
    border-color: var(--fg-line) !important;
}

html body :where(.aho-confirm-dialog__close, .aho-drilldown-modal__close) {
    border: 1px solid var(--fg-line) !important;
    border-radius: .75rem !important;
    color: var(--fg-muted) !important;
    background: var(--fg-surface-soft) !important;
}

/* Opaque data surfaces: glass around them, clarity inside them. */
html body :where(
    .table-wrapper,
    .aho-table-wrap,
    .aho-data-table,
    .aho-audit-table-wrap,
    .aho-import-table-wrap,
    .aho-mfa-table-wrap,
    .aho-matrix-scroll,
    .aho-drilldown-content,
    .iw-compare-table,
    .ledger-table-wrap
) {
    overflow: auto;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: var(--fg-shadow-xs) !important;
    scrollbar-width: thin;
    scrollbar-color: var(--fg-line-strong) transparent;
}

html body :where(table, .data-table, .aho-table, .aho-audit-table, .aho-import-table, .aho-mfa-table, .aho-matrix-table) {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-solid) !important;
    font-size: .8125rem !important;
}

html body :where(table, .data-table, .aho-table, .aho-audit-table, .aho-import-table, .aho-mfa-table, .aho-matrix-table) th {
    color: var(--fg-muted) !important;
    background: var(--fg-surface-muted) !important;
    border-color: var(--fg-line) !important;
    font-size: .6875rem !important;
    font-weight: 780 !important;
    letter-spacing: .055em !important;
    text-transform: uppercase !important;
}

html body :where(table, .data-table, .aho-table, .aho-audit-table, .aho-import-table, .aho-mfa-table, .aho-matrix-table) :where(th, td) {
    min-height: 2.875rem;
    padding: .75rem .875rem !important;
    border-bottom: 1px solid var(--fg-line) !important;
    vertical-align: middle !important;
}

html body :where(table, .data-table, .aho-table, .aho-audit-table, .aho-import-table, .aho-mfa-table, .aho-matrix-table) tbody tr {
    transition: background var(--fg-motion-fast), box-shadow var(--fg-motion-fast) !important;
}

html body :where(table, .data-table, .aho-table, .aho-audit-table, .aho-import-table, .aho-mfa-table, .aho-matrix-table) tbody tr:hover {
    background: var(--fg-accent-softer) !important;
    box-shadow: inset 3px 0 0 var(--fg-accent) !important;
}

html body :where(.skeleton, .aho-skeleton, .GlassSkeleton) {
    position: relative;
    overflow: hidden;
    color: transparent !important;
    border-radius: .625rem;
    background: var(--fg-surface-muted) !important;
}

html body :where(.skeleton, .aho-skeleton, .GlassSkeleton)::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, var(--fg-highlight), transparent);
    transform: translateX(-100%);
    animation: fg-shimmer 1.35s ease-in-out infinite;
}

@keyframes fg-shimmer { to { transform: translateX(100%); } }

/* ========================================================================== */
/* 5. FLOATING OPTION CARDS AND DATA-ENTRY WORKSPACES                         */
/* ========================================================================== */

html body.page-entry .content {
    max-width: var(--fg-content-max) !important;
}

html body :where(.aho-entry-workspace, .aho-entry, .aho-entry-layout, .aho-entry-stage) {
    color: var(--fg-ink) !important;
    background: transparent !important;
}

html body .aho-entry-premium-head {
    margin-bottom: 1rem !important;
    padding: 1.25rem 1.375rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .76), rgba(241, 250, 248, .54)),
        var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-sm));
}

:root[data-theme="dark"] body .aho-entry-premium-head {
    background: linear-gradient(135deg, rgba(255, 255, 255, .065), rgba(98, 207, 197, .045)), var(--fg-surface) !important;
}

html body .aho-entry-premium-head__eyebrow,
html body :where(.iw-kicker, .aho-eyebrow) {
    color: var(--fg-accent) !important;
    font-size: .6875rem !important;
    font-weight: 780 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase !important;
}

html body .aho-entry-premium-head__icon {
    border: 1px solid rgba(8, 127, 120, .22) !important;
    border-radius: .9375rem !important;
    color: var(--fg-accent) !important;
    background: var(--fg-accent-soft) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

html body .aho-entry-quicknav {
    position: sticky !important;
    z-index: calc(var(--fg-z-sticky) - 1) !important;
    top: calc(var(--fg-shell-inset) + var(--fg-topbar-height) + .75rem) !important;
    margin: 0 0 1rem !important;
    padding: .375rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: .9375rem !important;
    background: var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-md));
    -webkit-backdrop-filter: blur(var(--fg-blur-md));
}

html body .aho-entry-quicknav a {
    min-height: 2.25rem !important;
    padding: .375rem .6875rem !important;
    border: 1px solid transparent !important;
    border-radius: .6875rem !important;
    color: var(--fg-muted) !important;
    font-size: .75rem !important;
    font-weight: 680 !important;
}

html body .aho-entry-quicknav a:is(:hover, .is-active, [aria-current="true"]) {
    border-color: var(--fg-line) !important;
    color: var(--fg-accent-strong) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: var(--fg-shadow-xs) !important;
}

html body .aho-entry-form {
    display: grid;
    gap: 1rem !important;
}

html body .aho-entry-form :where(.aho-form-section, .aho-fieldset) {
    padding: clamp(1rem, 1.2vw, 1.375rem) !important;
}

html body .aho-form-section__header {
    align-items: center !important;
    margin-bottom: 1rem !important;
    padding-bottom: .875rem !important;
}

html body .aho-section-number,
html body .aho-entry-statuscard__icon {
    display: grid !important;
    place-items: center !important;
    width: 2.75rem !important;
    min-width: 2.75rem !important;
    height: 2.75rem !important;
    border: 1px solid rgba(8, 127, 120, .20) !important;
    border-radius: .875rem !important;
    color: var(--fg-accent) !important;
    background: var(--fg-accent-soft) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

/* Floating Glass option card – variant 2. Compact, readable and stable. */
html body .aho-entry-form :where(
    label.aho73-choice,
    label.aho85-choice,
    label.choice.choice--binary,
    .aho-choice-card__label,
    .aho-role-option,
    .aho-scanner-direction__grid label > span
) {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 2.125rem minmax(0, 1fr) 1.375rem !important;
    align-items: center !important;
    min-width: 0 !important;
    min-height: 3.875rem !important;
    height: auto !important;
    padding: .625rem .6875rem !important;
    gap: .625rem !important;
    overflow: visible !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .875rem !important;
    color: var(--fg-ink-2) !important;
    background:
        linear-gradient(145deg, var(--fg-highlight), transparent 48%),
        var(--fg-surface-soft) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
    cursor: pointer;
    transition: color var(--fg-motion), border-color var(--fg-motion), background var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body .aho-entry-form :where(
    label.aho73-choice,
    label.aho85-choice,
    label.choice.choice--binary,
    .aho-choice-card__label,
    .aho-role-option,
    .aho-scanner-direction__grid label > span
):hover {
    border-color: rgba(8, 127, 120, .32) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: 0 12px 26px rgba(45, 32, 50, .08), var(--fg-shadow-inset) !important;
    transform: translateY(-2px);
}

html body .aho-entry-form :where(
    label.aho73-choice,
    label.aho85-choice,
    label.choice.choice--binary,
    .aho-role-option,
    .aho-scanner-direction__grid label
):has(input:checked) > :where(.aho-choice-card__label, span),
html body .aho-entry-form :where(
    label.aho73-choice,
    label.aho85-choice,
    label.choice.choice--binary,
    .aho-role-option
):has(input:checked) {
    border-color: rgba(8, 127, 120, .48) !important;
    color: var(--fg-accent-strong) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .72), rgba(220, 245, 241, .74)),
        var(--fg-surface-strong) !important;
    box-shadow: 0 0 0 3px var(--fg-accent-soft), 0 12px 26px rgba(8, 127, 120, .09), var(--fg-shadow-inset) !important;
}

:root[data-theme="dark"] body .aho-entry-form :where(
    label.aho73-choice,
    label.aho85-choice,
    label.choice.choice--binary,
    .aho-role-option
):has(input:checked) {
    color: var(--fg-accent) !important;
    background: linear-gradient(145deg, rgba(98, 207, 197, .17), rgba(255, 255, 255, .045)), var(--fg-surface-strong) !important;
}

html body .aho-entry-form :where(.aho-choice-card__icon, .aho73-choice__icon, .aho85-choice__icon, .choice__icon) {
    display: grid !important;
    place-items: center !important;
    width: 2.125rem !important;
    min-width: 2.125rem !important;
    height: 2.125rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .6875rem !important;
    color: var(--fg-accent) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs) !important;
}

html body .aho-entry-form :where(.aho-choice-card__icon, .aho73-choice__icon, .aho85-choice__icon, .choice__icon) svg {
    width: 1.125rem !important;
    height: 1.125rem !important;
    stroke-width: 1.8 !important;
}

html body .aho-entry-form :where(.aho-choice-card__label, .aho73-choice__label, .aho85-choice__label, .choice__label) {
    min-width: 0 !important;
    color: inherit !important;
    font-size: .8125rem !important;
    font-weight: 680 !important;
    line-height: 1.28 !important;
    overflow-wrap: anywhere !important;
}

html body .aho-entry-form :where(.aho73-choice__indicator, .aho85-choice__indicator, .choice__indicator) {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    width: 1.25rem !important;
    min-width: 1.25rem !important;
    height: 1.25rem !important;
    border: 1.5px solid var(--fg-line-strong) !important;
    border-radius: .4375rem !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: inset 0 1px 1px rgba(45, 32, 50, .05) !important;
}

html body .aho-entry-form :where(input:checked) ~ :where(.aho73-choice__indicator, .aho85-choice__indicator, .choice__indicator) {
    border-color: var(--fg-accent) !important;
    background: var(--fg-accent) !important;
    box-shadow: 0 0 0 3px var(--fg-accent-soft) !important;
}

html body .aho-entry-actionbar {
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-lg), var(--fg-shadow-inset) !important;
    backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
    -webkit-backdrop-filter: saturate(140%) blur(var(--fg-blur-md));
}

/* ========================================================================== */
/* 6. DASHBOARD – INTELLIGENCE COCKPIT                                        */
/* ========================================================================== */

html body .ew-shell {
    display: grid !important;
    gap: 1rem !important;
    max-width: none !important;
    color: var(--fg-ink) !important;
}

html body .ew-controlbar {
    min-height: 7.5rem !important;
    padding: 1.375rem 1.5rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-xl) !important;
    color: var(--fg-ink) !important;
    background:
        radial-gradient(circle at 88% 0%, rgba(8, 127, 120, .12), transparent 23rem),
        radial-gradient(circle at 16% 120%, rgba(188, 77, 120, .10), transparent 21rem),
        linear-gradient(135deg, var(--fg-surface-strong), var(--fg-surface-soft)) !important;
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-md));
}

html body .ew-controlbar > div:first-child {
    display: grid;
    gap: .25rem;
}

html body .ew-controlbar > div:first-child strong {
    font-size: var(--fg-text-2xl) !important;
    font-weight: 760 !important;
    letter-spacing: -.035em !important;
}

html body .ew-controlbar__actions {
    display: flex !important;
    align-items: end !important;
    gap: .625rem !important;
}

html body .ew-controlbar__actions :where(label, a) {
    font-size: .75rem !important;
}

html body .ew-controlbar__actions a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: var(--fg-control-md) !important;
    padding: .625rem .875rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .75rem !important;
    color: var(--fg-accent-strong) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs) !important;
    font-weight: 700 !important;
}

html body .ew-metrics {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: .75rem !important;
}

html body .ew-metric {
    position: relative;
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: center !important;
    min-width: 0 !important;
    min-height: 7.75rem !important;
    padding: 1rem !important;
    gap: .1875rem .75rem !important;
    overflow: hidden;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    color: var(--fg-ink) !important;
    background: linear-gradient(145deg, var(--fg-highlight), transparent 46%), var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-sm));
    transition: border-color var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body .ew-metric::after {
    content: "";
    position: absolute;
    inset: auto 1rem 0;
    height: 2px;
    border-radius: 2px 2px 0 0;
    background: linear-gradient(90deg, transparent, var(--fg-accent), transparent);
    opacity: .42;
}

html body .ew-metric:hover {
    border-color: rgba(8, 127, 120, .32) !important;
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset) !important;
    transform: translateY(-3px);
}

html body .ew-metric__visual {
    grid-row: 1 / span 2 !important;
    display: grid !important;
    place-items: center !important;
    width: 2.5rem !important;
    height: 2.5rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .8125rem !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs) !important;
}

html body .ew-metric__visual img {
    width: 1.25rem !important;
    height: 1.25rem !important;
}

html body .ew-metric > strong {
    align-self: end;
    font-size: clamp(1.55rem, 1.2rem + .7vw, 2.15rem) !important;
    font-weight: 740 !important;
    letter-spacing: -.045em !important;
    line-height: 1 !important;
}

html body .ew-metric > span:not(.ew-metric__visual) {
    color: var(--fg-ink-2) !important;
    font-size: .75rem !important;
    font-weight: 680 !important;
}

html body .ew-metric > small {
    grid-column: 1 / -1 !important;
    margin-top: .375rem !important;
    padding-top: .5rem !important;
    border-top: 1px solid var(--fg-line) !important;
    color: var(--fg-success) !important;
    font-size: .6875rem !important;
    font-weight: 720 !important;
}

html body .ew-metric > small.is-down { color: var(--fg-danger) !important; }
html body .ew-metric > small em { color: var(--fg-faint) !important; font-style: normal; font-weight: 600 !important; }

html body .ew-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.75fr) minmax(19rem, .75fr) !important;
    gap: 1rem !important;
}

html body :is(.ew-trend, .ew-briefing, .ew-actions) {
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    color: var(--fg-ink) !important;
    background: linear-gradient(145deg, var(--fg-highlight), transparent 44%), var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-sm));
}

html body .ew-trend { padding: 1.25rem !important; }

html body .ew-trend__canvas {
    min-height: 21rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface-solid) !important;
}

html body .ew-live {
    color: var(--fg-success) !important;
    background: color-mix(in srgb, var(--fg-success) 8%, var(--fg-surface-solid)) !important;
}

html body .ew-briefing {
    display: grid !important;
    align-content: start !important;
    padding: 1rem !important;
    gap: .5rem !important;
}

html body .ew-briefing > .iw-kicker { padding: .25rem .375rem .5rem !important; }

html body .ew-briefing a {
    display: grid !important;
    min-height: 5rem !important;
    padding: .75rem .8125rem !important;
    gap: .125rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .875rem !important;
    background: var(--fg-surface-strong) !important;
    transition: border-color var(--fg-motion), background var(--fg-motion), transform var(--fg-motion) !important;
}

html body .ew-briefing a:hover {
    border-color: rgba(8, 127, 120, .30) !important;
    background: var(--fg-surface-solid) !important;
    transform: translateX(2px);
}

html body .ew-briefing a small { color: var(--fg-faint) !important; font-size: .6875rem !important; text-transform: uppercase; letter-spacing: .05em; }
html body .ew-briefing a strong { color: var(--fg-ink) !important; font-size: .9375rem !important; }
html body .ew-briefing a span { color: var(--fg-muted) !important; font-size: .75rem !important; }

html body .ew-actions {
    display: grid !important;
    grid-template-columns: minmax(14rem, .6fr) minmax(0, 1.4fr) !important;
    align-items: center !important;
    padding: 1.125rem !important;
    gap: 1rem !important;
}

html body .ew-actions h2 { margin: .25rem 0 0 !important; font-size: 1.2rem !important; }
html body .ew-actions nav { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: .5rem !important; }

html body .ew-actions nav a {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    min-height: 2.875rem !important;
    padding: .5625rem .6875rem !important;
    gap: .5rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: .75rem !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-strong) !important;
    font-size: .75rem !important;
    font-weight: 680 !important;
    transition: border-color var(--fg-motion), color var(--fg-motion), transform var(--fg-motion) !important;
}

html body .ew-actions nav a:hover { border-color: rgba(8, 127, 120, .34) !important; color: var(--fg-accent-strong) !important; transform: translateY(-1px); }
html body .ew-actions nav a > span { color: var(--fg-faint) !important; font-family: var(--fg-font-mono); font-size: .625rem !important; }
html body .ew-actions nav a em { color: var(--fg-accent) !important; font-style: normal; }

/* ========================================================================== */
/* 7. ANALYTICS, LAB AND INTELLIGENCE                                        */
/* ========================================================================== */

html body :where(.iw-workspace, .aho-enterprise-workspace, .lab-shell, .intel-shell, .expert96-shell) {
    color: var(--fg-ink) !important;
    background: transparent !important;
}

html body .iw-commandbar,
html body :where(.lab-toolbar, .expert96-commandbar) {
    position: sticky !important;
    z-index: calc(var(--fg-z-sticky) - 1) !important;
    top: calc(var(--fg-shell-inset) + var(--fg-topbar-height) + .75rem) !important;
    padding: .625rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-md));
    -webkit-backdrop-filter: blur(var(--fg-blur-md));
}

html body .iw-identity h1,
html body :where(.intel-hero h1, .expert96-hero h1) {
    color: var(--fg-ink) !important;
    font-size: var(--fg-text-3xl) !important;
    letter-spacing: -.045em !important;
}

html body .iw-identity p,
html body :where(.intel-hero p, .expert96-hero p) {
    color: var(--fg-muted) !important;
    font-size: .875rem !important;
}

html body :where(.iw-modes, .lab-workspace-tabs, .expert96-tabs) {
    display: flex !important;
    width: 100%;
    padding: .3125rem !important;
    gap: .1875rem !important;
    overflow-x: auto;
    border: 1px solid var(--fg-line) !important;
    border-radius: .9375rem !important;
    background: var(--fg-surface-soft) !important;
    scrollbar-width: none;
}

html body :where(.iw-modes, .lab-workspace-tabs, .expert96-tabs)::-webkit-scrollbar { display: none; }

html body .iw-modes button,
html body :where(.lab-workspace-tabs a, .expert96-tabs a) {
    flex: 0 0 auto;
    min-height: 2.375rem !important;
    padding: .4375rem .75rem !important;
    border: 1px solid transparent !important;
    border-radius: .6875rem !important;
    color: var(--fg-muted) !important;
    background: transparent !important;
    font-size: .75rem !important;
    font-weight: 680 !important;
    transition: color var(--fg-motion), border-color var(--fg-motion), background var(--fg-motion), box-shadow var(--fg-motion) !important;
}

html body .iw-modes button:is([aria-current="page"], .is-active),
html body :where(.lab-workspace-tabs a, .expert96-tabs a):is(.is-active, [aria-current="page"]) {
    border-color: var(--fg-line) !important;
    color: var(--fg-accent-strong) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

html body .iw-canvas {
    display: grid !important;
    gap: 1rem !important;
    background: transparent !important;
}

html body .iw-panel {
    display: none;
    min-width: 0;
    padding: 1.125rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-lg) !important;
    background: var(--fg-surface) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-sm));
}

html body .iw-panel.is-active {
    display: block !important;
    animation: fg-panel-in var(--fg-motion-slow) both;
}

@keyframes fg-panel-in {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

html body :where(.iw-metric-strip, .lab-kpis, .intel-kpis, .lab82-kpis, .aho-quality-kpis, .aho-inventory-kpis) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)) !important;
    gap: .75rem !important;
}

html body :where(.iw-metric, .lab-kpi, .intel-kpis > article, .lab82-kpi, .aho-inventory-kpi) {
    min-width: 0 !important;
    padding: .9375rem 1rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-ink) !important;
    background: linear-gradient(145deg, var(--fg-highlight), transparent 48%), var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
    transition: border-color var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body :where(.iw-metric, .lab-kpi):hover {
    border-color: rgba(8, 127, 120, .32) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
    transform: translateY(-2px);
}

html body .iw-metric__value,
html body :where(.lab-kpi strong, .intel-kpis strong, .lab82-kpi strong, .aho-inventory-kpi strong) {
    color: var(--fg-ink) !important;
    font-size: clamp(1.45rem, 1.12rem + .7vw, 2rem) !important;
    font-weight: 740 !important;
    letter-spacing: -.04em !important;
    font-variant-numeric: tabular-nums;
}

html body .iw-metric__label,
html body :where(.lab-kpi span, .intel-kpis span, .lab82-kpi span, .aho-inventory-kpi span) {
    color: var(--fg-ink-2) !important;
    font-size: .75rem !important;
    font-weight: 680 !important;
}

html body .iw-metric__delta,
html body :where(.lab-kpi small, .intel-kpis small, .lab82-kpi small, .aho-inventory-kpi small) {
    color: var(--fg-muted) !important;
    font-size: .6875rem !important;
}

html body :where(.is-up, .is-positive) { color: var(--fg-success) !important; }
html body :where(.is-down, .is-negative) { color: var(--fg-danger) !important; }

html body .iw-stage {
    display: grid !important;
    grid-template-columns: minmax(0, 1.6fr) minmax(18rem, .55fr) !important;
    gap: 1rem !important;
    margin-top: 1rem !important;
}

html body .iw-stage__main,
html body .iw-insight-rail,
html body :where(.iw-dimension, .iw-compare-chart, .iw-anomaly-list, .iw-ai-stage, .lab-panel, .intel-trend-row, .intel-goal-card, .expert96-chart) {
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

html body .iw-stage__main { padding: 1rem !important; }
html body .iw-insight-rail { padding: .75rem !important; }

html body .iw-section-head {
    align-items: flex-start !important;
    margin-bottom: .875rem !important;
    padding-bottom: .75rem !important;
    border-bottom: 1px solid var(--fg-line) !important;
}

html body .iw-section-head h2 {
    margin: .1875rem 0 0 !important;
    font-size: 1.125rem !important;
}

html body .iw-section-head p {
    max-width: 72ch;
    color: var(--fg-muted) !important;
    font-size: .8125rem !important;
}

html body .iw-trend-wrap,
html body .lab83-chart-body {
    overflow: hidden;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface-solid) !important;
}

html body :where(canvas.aho-chart-preview, canvas.iw-trend-canvas) {
    display: block;
    width: 100% !important;
    max-width: 100%;
    border-radius: var(--fg-radius-sm) !important;
    background: var(--fg-surface-solid) !important;
}

html body .iw-month-rail {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(3.25rem, 1fr)) !important;
    margin-top: .75rem !important;
    gap: .25rem !important;
    overflow-x: auto;
    scrollbar-width: thin;
}

html body .iw-month-rail a {
    min-width: 3.25rem;
    padding: .5rem .25rem !important;
    border: 1px solid transparent !important;
    border-radius: .625rem !important;
    text-align: center;
}

html body .iw-month-rail a:hover {
    border-color: var(--fg-line) !important;
    background: var(--fg-accent-softer) !important;
}

html body .iw-month-rail span { color: var(--fg-faint) !important; font-size: .625rem !important; text-transform: uppercase; }
html body .iw-month-rail strong { color: var(--fg-ink) !important; font-size: .8125rem !important; }

html body .iw-signal,
html body .iw-contribution {
    border-color: var(--fg-line) !important;
    border-radius: .75rem !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-solid) !important;
}

html body .iw-heatmap {
    overflow-x: auto;
    padding: .875rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface-solid) !important;
}

html body .iw-heatmap__row a i {
    border-radius: .375rem !important;
    background: color-mix(in srgb, var(--fg-accent) calc(var(--heat) * 82%), var(--fg-surface-muted)) !important;
}

html body .iw-dimension-grid,
html body :where(.lab-panels, .intel-goals-grid, .expert96-chart-grid) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .875rem !important;
}

html body .iw-dimension { padding: .875rem !important; }
html body .iw-dimension__rows a { border-color: var(--fg-line) !important; }
html body .iw-dimension__rows i { background: var(--fg-surface-muted) !important; }
html body .iw-dimension__rows i b { background: linear-gradient(90deg, var(--fg-accent), #59b9b0) !important; }

html body .iw-compare-table__head,
html body .iw-compare-row {
    border-color: var(--fg-line) !important;
    background: var(--fg-surface-solid) !important;
}

html body .iw-compare-row:hover { background: var(--fg-accent-softer) !important; }

html body .intel-hero,
html body .expert96-hero,
html body .aho-quality-hero,
html body :where(.aho-inventory-hero, .aho-inventory-scan__hero) {
    padding: 1.375rem 1.5rem !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-xl) !important;
    color: var(--fg-ink) !important;
    background:
        radial-gradient(circle at 92% -10%, rgba(8, 127, 120, .14), transparent 24rem),
        linear-gradient(135deg, var(--fg-surface-strong), var(--fg-surface-soft)) !important;
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-md));
}

html body .intel-panel { padding: 1.125rem !important; }
html body .intel-trend-row { padding: .875rem 1rem !important; }
html body .intel-meter { border-radius: var(--fg-radius-pill) !important; background: var(--fg-surface-muted) !important; }
html body .intel-meter i { border-radius: inherit !important; background: linear-gradient(90deg, var(--fg-accent), #55bdb3) !important; }

html body .lab-toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .75rem !important;
}

html body .lab-kpis { margin-block: 1rem !important; }
html body .lab-insights { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: .75rem !important; }

html body .lab-insights > article {
    padding: .875rem 1rem !important;
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs), var(--fg-shadow-inset) !important;
}

html body .lab-insights > article span { color: var(--fg-faint) !important; font-size: .6875rem !important; text-transform: uppercase; letter-spacing: .05em; }
html body .lab-insights > article strong { color: var(--fg-ink) !important; font-size: .9375rem !important; }
html body .lab-insights > article small { color: var(--fg-muted) !important; font-size: .6875rem !important; }
html body .lab-panel { overflow: hidden; }

html body .aho-chart-export {
    display: flex !important;
    align-items: flex-end !important;
    flex-wrap: wrap !important;
    gap: .375rem !important;
}

html body .aho-chart-type-label {
    min-width: 9rem;
    color: var(--fg-muted) !important;
    font-size: .6875rem !important;
}

/* Client-side, data-derived chart intelligence. */
html body .fg-chart-intelligence {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    margin: .75rem 1rem 1rem;
}

html body .fg-chart-insight {
    min-width: 0;
    padding: .625rem .75rem;
    border: 1px solid var(--fg-line);
    border-radius: .75rem;
    background: var(--fg-surface-muted);
}

html body .fg-chart-insight small {
    display: block;
    margin-bottom: .125rem;
    color: var(--fg-faint) !important;
    font-size: .625rem !important;
    font-weight: 720 !important;
    letter-spacing: .06em;
    text-transform: uppercase;
}

html body .fg-chart-insight strong {
    display: block;
    overflow: hidden;
    color: var(--fg-ink) !important;
    font-size: .8125rem !important;
    font-weight: 730 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body .fg-chart-intelligence__actions {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
}

html body .fg-chart-table-toggle {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: .3125rem .625rem;
    border: 1px solid var(--fg-line);
    border-radius: .625rem;
    color: var(--fg-ink-2);
    background: var(--fg-surface-strong);
    font-size: .6875rem;
    font-weight: 700;
    cursor: pointer;
}

html body .fg-chart-table-wrap {
    grid-column: 1 / -1;
    overflow: auto;
    max-height: 19rem;
    border: 1px solid var(--fg-line);
    border-radius: .75rem;
    background: var(--fg-surface-solid);
}

html body .fg-chart-table-wrap[hidden] { display: none !important; }
html body .fg-chart-table { width: 100%; font-size: .75rem !important; }
html body .fg-chart-table caption { padding: .625rem .75rem; color: var(--fg-muted); text-align: left; font-weight: 680; }

html body .fg-chart-tooltip {
    position: fixed;
    z-index: var(--fg-z-toast);
    max-width: 17rem;
    padding: .5rem .625rem;
    pointer-events: none;
    border: 1px solid var(--fg-line-glass);
    border-radius: .625rem;
    color: var(--fg-ink);
    background: var(--fg-surface-strong);
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset);
    backdrop-filter: blur(var(--fg-blur-md));
    font-size: .75rem;
    line-height: 1.35;
    opacity: 0;
    transform: translateY(4px) scale(.98);
    transition: opacity var(--fg-motion-fast), transform var(--fg-motion-fast);
}

html body .fg-chart-tooltip.is-visible { opacity: 1; transform: translateY(0) scale(1); }
html body .fg-chart-tooltip strong { display: block; margin-top: .125rem; color: var(--fg-accent-strong); font-size: .875rem; }

/* ========================================================================== */
/* 8. ADMINISTRATION, PROFILE, INVENTORY AND REPORT WORKSPACES                */
/* ========================================================================== */

html body :where(.aho-admin-grid, .aho-feature-grid, .aho-annual-report-grid) {
    gap: .875rem !important;
}

html body :where(.aho-admin-card, .aho-feature-card, .aho-annual-report-card) {
    transition: border-color var(--fg-motion), box-shadow var(--fg-motion), transform var(--fg-motion) !important;
}

html body :where(.aho-admin-card, .aho-feature-card, .aho-annual-report-card):hover {
    border-color: rgba(8, 127, 120, .28) !important;
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset) !important;
    transform: translateY(-2px);
}

html body .aho-admin-icon,
html body :where(.aho-feature-icon, .aho-import-message-icon, .aho-audit-empty-icon, .aho-message-icon, .aho-empty-icon) {
    border: 1px solid rgba(8, 127, 120, .20) !important;
    border-radius: .875rem !important;
    color: var(--fg-accent) !important;
    background: var(--fg-accent-soft) !important;
}

html body .aho-profile-layout--enterprise {
    gap: 1rem !important;
}

html body .aho-profile-avatar {
    border: 3px solid var(--fg-surface-solid) !important;
    color: var(--fg-accent-strong) !important;
    background: linear-gradient(145deg, rgba(8, 127, 120, .15), rgba(188, 77, 120, .12)) !important;
    box-shadow: 0 0 0 1px var(--fg-line), var(--fg-shadow-sm) !important;
}

html body .aho-inventory-overview,
html body .aho-inventory-scan {
    gap: 1rem !important;
}

html body .aho-inventory-product,
html body .aho-mobile-movement-list article,
html body .aho-scanner-product {
    border-color: var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-solid) !important;
    box-shadow: var(--fg-shadow-xs) !important;
    transition: border-color var(--fg-motion), background var(--fg-motion), transform var(--fg-motion) !important;
}

html body .aho-inventory-product:hover {
    border-color: rgba(8, 127, 120, .30) !important;
    background: var(--fg-surface-tint) !important;
    transform: translateY(-1px);
}

html body :where(.aho-inventory-product__icon, .aho-scanner-product__icon, .aho-mobile-movement-list__icon) {
    border-color: rgba(8, 127, 120, .22) !important;
    color: var(--fg-accent) !important;
    background: var(--fg-accent-soft) !important;
}

html body .aho-scanner-viewport {
    border-color: var(--fg-line-strong) !important;
    border-radius: var(--fg-radius-lg) !important;
    background: #19222c !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04), var(--fg-shadow-sm) !important;
}

/* Report/PDF sheets are intentionally kept opaque and outside the glass
   rendering language. The UI around them is modernised; fachliche templates,
   checkbox coordinates and server-side PDF output remain untouched. */
html body :where(.aho-report-sheet, .aho-a4-sheet) {
    color-scheme: light;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body :where(.aho-report-toolbar, .aho-report-sources, .aho-report-quality, .aho-report-archive, .aho-annual-toolbar, .aho-annual-outline, .aho-annual-palette, .aho-annual-properties, .aho-annual-media-panel) {
    border-color: var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-sm), var(--fg-shadow-inset) !important;
}

html body .aho-annual-editor-grid {
    gap: .875rem !important;
    background: transparent !important;
}

html body .aho-annual-canvas {
    border: 1px solid var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: rgba(99, 91, 106, .08) !important;
}

/* ========================================================================== */
/* 9. AUTHENTICATION                                                         */
/* ========================================================================== */

html body.auth-page {
    display: grid !important;
    min-height: 100dvh !important;
    padding: clamp(.75rem, 2vw, 1.5rem) !important;
    color: var(--fg-ink) !important;
    background:
        radial-gradient(circle at 9% 7%, rgba(226, 174, 198, .34), transparent 31rem),
        radial-gradient(circle at 91% 11%, rgba(159, 219, 216, .24), transparent 32rem),
        radial-gradient(circle at 73% 88%, rgba(191, 177, 229, .24), transparent 35rem),
        linear-gradient(145deg, var(--fg-canvas-pearl), var(--fg-canvas), var(--fg-canvas-secondary)) !important;
    font-family: var(--fg-font-sans) !important;
}

html body.auth-page .login-page {
    align-self: stretch;
    min-height: calc(100dvh - clamp(1.5rem, 4vw, 3rem)) !important;
    overflow: hidden;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: clamp(1.25rem, 2vw, 2rem) !important;
    background: var(--fg-surface-soft) !important;
    box-shadow: var(--fg-shadow-lg), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-lg));
    -webkit-backdrop-filter: blur(var(--fg-blur-lg));
}

html body.auth-page .login-panel {
    min-height: 100% !important;
    border-color: var(--fg-line) !important;
    color: var(--fg-ink) !important;
    background: rgba(255, 255, 255, .83) !important;
}

:root[data-theme="dark"] body.auth-page .login-panel,
:root[data-theme-mode="dark"] body.auth-page .login-panel {
    border-color: var(--fg-line) !important;
    color: var(--fg-ink) !important;
    background: rgba(29, 27, 36, .88) !important;
}

html body.auth-page .login-visual {
    color: var(--fg-ink) !important;
    background:
        radial-gradient(circle at 70% 18%, rgba(8, 127, 120, .16), transparent 22rem),
        radial-gradient(circle at 25% 78%, rgba(188, 77, 120, .14), transparent 24rem),
        linear-gradient(145deg, rgba(255, 255, 255, .46), rgba(240, 235, 244, .40)) !important;
}

:root[data-theme="dark"] body.auth-page .login-visual,
:root[data-theme-mode="dark"] body.auth-page .login-visual {
    background:
        radial-gradient(circle at 70% 18%, rgba(98, 207, 197, .12), transparent 22rem),
        radial-gradient(circle at 25% 78%, rgba(240, 141, 179, .10), transparent 24rem),
        linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(18, 17, 24, .48)) !important;
}

html body.auth-page :where(.brand-mark, .brand__mark) {
    border: 1px solid rgba(8, 127, 120, .20) !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0b9289, #086a65) !important;
    box-shadow: 0 12px 30px rgba(8, 127, 120, .20), inset 0 1px 0 rgba(255, 255, 255, .28) !important;
}

html body.auth-page :where(.login-card, .security-card) {
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-xl) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-md), var(--fg-shadow-inset) !important;
}

html body.auth-page :where(.login-card h1, .security-card h1) {
    color: var(--fg-ink) !important;
    font-size: clamp(1.75rem, 1.35rem + 1vw, 2.45rem) !important;
    letter-spacing: -.04em !important;
}

html body.auth-page :where(.login-card p, .security-card p, .intro, .hint) {
    color: var(--fg-muted) !important;
}

html body.auth-page .security-shell {
    width: min(100%, 42rem) !important;
    margin: auto;
}

html body.auth-page .security-card {
    padding: clamp(1.5rem, 5vw, 2.75rem) !important;
}

html body.auth-page .qr-panel {
    border-color: var(--fg-line) !important;
    border-radius: var(--fg-radius-md) !important;
    background: var(--fg-surface-muted) !important;
}

html body.auth-page--setup .setup-page {
    width: 100%;
    min-height: calc(100dvh - clamp(1.5rem, 4vw, 3rem)) !important;
    padding: 0 !important;
}

html body.auth-page--setup .setup-container {
    width: min(100%, 70rem) !important;
    overflow: hidden !important;
    border: 1px solid var(--fg-line-glass) !important;
    border-radius: var(--fg-radius-2xl) !important;
    color: var(--fg-ink) !important;
    background: var(--fg-surface-soft) !important;
    box-shadow: var(--fg-shadow-lg), var(--fg-shadow-inset) !important;
    backdrop-filter: blur(var(--fg-blur-lg));
    -webkit-backdrop-filter: blur(var(--fg-blur-lg));
}

html body.auth-page--setup .setup-info {
    color: var(--fg-ink) !important;
    background:
        radial-gradient(circle at 88% 4%, rgba(8, 127, 120, .17), transparent 18rem),
        radial-gradient(circle at 10% 90%, rgba(188, 77, 120, .13), transparent 20rem),
        linear-gradient(145deg, rgba(255, 255, 255, .64), rgba(238, 232, 242, .48)) !important;
}

:root[data-theme="dark"] body.auth-page--setup .setup-info,
:root[data-theme-mode="dark"] body.auth-page--setup .setup-info {
    background:
        radial-gradient(circle at 88% 4%, rgba(98, 207, 197, .12), transparent 18rem),
        radial-gradient(circle at 10% 90%, rgba(240, 141, 179, .09), transparent 20rem),
        linear-gradient(145deg, rgba(255, 255, 255, .04), rgba(19, 18, 25, .42)) !important;
}

html body.auth-page--setup .setup-info :where(h1, h2, h3, p, strong, span) {
    color: inherit !important;
}

html body.auth-page--setup .setup-info :where(.brand-subtitle, .step-text, p) {
    color: var(--fg-muted) !important;
}

html body.auth-page--setup .setup-step,
html body.auth-page--setup .security-box,
html body.auth-page--setup .notice {
    border-color: var(--fg-line) !important;
    border-radius: var(--fg-radius-sm) !important;
    color: var(--fg-ink-2) !important;
    background: var(--fg-surface-strong) !important;
    box-shadow: var(--fg-shadow-xs) !important;
}

html body.auth-page--setup .step-number,
html body.auth-page--setup .icon {
    color: var(--fg-accent-strong) !important;
    background: var(--fg-accent-soft) !important;
}

html body.auth-page--setup .setup-form-panel {
    color: var(--fg-ink) !important;
    background: var(--fg-surface-strong) !important;
}

html body.auth-page--setup .submit-button {
    border-color: var(--fg-accent) !important;
    border-radius: .75rem !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0b9289, var(--fg-accent-strong)) !important;
    box-shadow: 0 10px 24px rgba(8, 127, 120, .2), inset 0 1px 0 rgba(255, 255, 255, .24) !important;
}

html body.auth-page--setup.setup-locked-page .card {
    width: min(100%, 40rem) !important;
    padding: clamp(1.75rem, 5vw, 3rem) !important;
}

/* ========================================================================== */
/* 10. RESPONSIVE INFORMATION ARCHITECTURE                                    */
/* ========================================================================== */

@media (max-width: 1480px) {
    :root {
        --fg-sidebar-width: 15rem;
        --fg-shell-gap: .875rem;
        --fg-shell-inset: .875rem;
    }
    html body .topbar-search { min-width: min(23rem, 29vw) !important; }
    html body .ew-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    html body .ew-actions nav { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 1180px) {
    :root {
        --fg-shell-inset: .75rem;
        --fg-shell-gap: .75rem;
    }

    html body .app-shell {
        display: block !important;
        padding: var(--fg-shell-inset) !important;
    }

    html body .sidebar,
    html body.sidebar-collapsed .sidebar {
        position: fixed !important;
        z-index: var(--fg-z-drawer) !important;
        top: var(--fg-shell-inset) !important;
        right: auto !important;
        bottom: var(--fg-shell-inset) !important;
        left: var(--fg-shell-inset) !important;
        width: min(19rem, calc(100vw - (var(--fg-shell-inset) * 2))) !important;
        height: auto !important;
        min-height: 0 !important;
        transform: translateX(calc(-100% - 2rem)) !important;
        transition: transform var(--fg-motion-slow) !important;
    }

    html body.sidebar-open .sidebar { transform: translateX(0) !important; }

    html body.sidebar-collapsed :is(.brand__text, .nav-section__title, .nav-item__label, .system-indicator__content) {
        display: block !important;
    }

    html body.sidebar-collapsed .sidebar__brand { justify-content: flex-start !important; padding: .875rem !important; }
    html body.sidebar-collapsed .sidebar__navigation { padding: .75rem .625rem 1rem !important; }
    html body.sidebar-collapsed .nav-section + .nav-section { margin-top: .875rem !important; padding-top: .75rem !important; }
    html body.sidebar-collapsed .nav-item { justify-content: flex-start !important; padding: .375rem .625rem !important; }

    html body .sidebar-overlay {
        z-index: calc(var(--fg-z-drawer) - 1) !important;
        background: var(--fg-overlay) !important;
        backdrop-filter: blur(5px);
    }

    html body .app-main,
    html body.sidebar-collapsed .app-main { margin: 0 !important; }

    html body .topbar { top: var(--fg-shell-inset) !important; }
    html body .topbar__menu { display: grid !important; }
    html body .topbar-search { min-width: 0 !important; flex: 1 1 auto !important; }
    html body .profile-dropdown { top: calc(var(--fg-shell-inset) + var(--fg-topbar-height) + .5rem) !important; right: var(--fg-shell-inset) !important; }
    html body .aho-entry-quicknav,
    html body .iw-commandbar,
    html body :where(.lab-toolbar, .expert96-commandbar) { top: calc(var(--fg-shell-inset) + var(--fg-topbar-height) + .625rem) !important; }
    html body .ew-grid,
    html body .iw-stage { grid-template-columns: 1fr !important; }
    html body .ew-briefing { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    html body .ew-briefing > .iw-kicker { grid-column: 1 / -1; }
    html body .ew-actions { grid-template-columns: 1fr !important; }
}

@media (max-width: 900px) {
    html body .topbar {
        min-height: 4rem !important;
        padding: .5rem !important;
    }
    html body .topbar__title,
    html body .topbar-greeting { display: none !important; }
    html body .topbar-search { margin-left: 0 !important; }
    html body .user-menu__details,
    html body .user-menu__chevron { display: none !important; }
    html body .user-menu { padding: .25rem !important; }
    html body .aho-theme-switcher button span { display: none !important; }
    html body .aho-theme-switcher button { width: 2.25rem !important; padding: 0 !important; }
    html body .page-header { align-items: flex-start !important; flex-direction: column !important; }
    html body .page-header__actions { width: 100%; }
    html body .page-header__actions :where(.button, button, a) { flex: 1 1 auto; }
    html body .iw-dimension-grid,
    html body :where(.lab-panels, .intel-goals-grid, .expert96-chart-grid) { grid-template-columns: 1fr !important; }
    html body .lab-insights { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    html body .lab-toolbar { align-items: stretch !important; flex-direction: column !important; }
    html body .lab-toolbar__year { width: 100%; }
    html body.auth-page .login-page { grid-template-columns: 1fr !important; }
    html body.auth-page .login-visual { display: none !important; }
}

@media (max-width: 680px) {
    :root {
        --fg-shell-inset: .5rem;
        --fg-shell-gap: .5rem;
        --fg-topbar-height: 3.75rem;
    }
    html { font-size: 15px; }
    html body .content { padding: 0 0 1.5rem !important; }
    html body .topbar { border-radius: 1rem !important; }
    html body .topbar-search span,
    html body .topbar-search kbd { display: none !important; }
    html body .topbar-search { width: 2.75rem !important; flex: 0 0 2.75rem !important; padding: 0 !important; justify-content: center !important; }
    html body .page-header,
    html body .ew-controlbar,
    html body .intel-hero,
    html body .expert96-hero,
    html body .aho-quality-hero,
    html body :where(.aho-inventory-hero, .aho-inventory-scan__hero) { padding: 1rem !important; border-radius: var(--fg-radius-md) !important; }
    html body .page-header h1 { font-size: 1.45rem !important; }
    html body .ew-controlbar { align-items: stretch !important; flex-direction: column !important; }
    html body .ew-controlbar__actions { align-items: stretch !important; flex-direction: column !important; width: 100%; }
    html body .ew-controlbar__actions :where(form, select, a) { width: 100% !important; }
    html body .ew-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: .5rem !important; }
    html body .ew-metric { min-height: 7rem !important; padding: .75rem !important; }
    html body .ew-trend { padding: .75rem !important; }
    html body .ew-trend__canvas { min-height: 17rem !important; }
    html body .ew-briefing { grid-template-columns: 1fr !important; }
    html body .ew-actions nav { grid-template-columns: 1fr !important; }
    html body .iw-panel { padding: .75rem !important; border-radius: var(--fg-radius-md) !important; }
    html body .iw-metric-strip,
    html body :where(.lab-kpis, .intel-kpis, .lab82-kpis, .aho-quality-kpis, .aho-inventory-kpis) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: .5rem !important; }
    html body .iw-section-head { align-items: flex-start !important; flex-direction: column !important; gap: .5rem !important; }
    html body .aho-chart-export { width: 100%; }
    html body .aho-chart-type-label { width: 100%; }
    html body .aho-chart-export .button { flex: 1 1 auto; }
    html body .fg-chart-intelligence { grid-template-columns: 1fr !important; margin-inline: .75rem; }
    html body .fg-chart-intelligence__actions,
    html body .fg-chart-table-wrap { grid-column: 1; }
    html body .lab-insights { grid-template-columns: 1fr !important; }
    html body .aho-inventory-product { grid-template-columns: 1fr !important; }
    html body .aho-inventory-product__stock { justify-items: start !important; }
    html body .aho-inventory-product__actions { justify-content: stretch !important; }
    html body .aho-inventory-product__actions .button { flex: 1 1 auto; }
    html body .aho-entry-actionbar { right: .5rem !important; bottom: .5rem !important; left: .5rem !important; }
    html body.auth-page { padding: .5rem !important; }
    html body.auth-page .login-page { min-height: calc(100dvh - 1rem) !important; border-radius: 1rem !important; }
    html body.auth-page .login-panel { padding: 1.25rem !important; }
}

@media (max-width: 430px) {
    html body .notification-button { display: none !important; }
    html body .ew-metrics,
    html body .iw-metric-strip,
    html body :where(.lab-kpis, .intel-kpis, .lab82-kpis, .aho-quality-kpis, .aho-inventory-kpis) { grid-template-columns: 1fr !important; }
    html body .aho-theme-switcher { display: none !important; }
}

@media print {
    html body { background: #ffffff !important; }
    html body :where(.sidebar, .topbar, .app-footer, .aho-entry-actionbar, .fg-chart-tooltip) { display: none !important; }
    html body .app-shell { display: block !important; padding: 0 !important; }
    html body .content { max-width: none !important; padding: 0 !important; }
    html body :where(.card, .aho-card, .iw-panel, .lab-panel, .intel-panel) { backdrop-filter: none !important; box-shadow: none !important; }
}


/* ========================================================================== */
/* Techburg MGM 1.0.112 — Enterprise Surface Unification & Precision Layout   */
/* Authoritative last layer. Visual/UI only; no domain logic changes.          */
/* ========================================================================== */

:root {
    --tb-page: #eaf0f3;
    --tb-page-2: #e5ecef;
    --tb-surface: color-mix(in srgb, var(--tb-page) 88%, #ffffff 12%);
    --tb-surface-raised: color-mix(in srgb, var(--tb-page) 76%, #ffffff 24%);
    --tb-surface-soft: color-mix(in srgb, var(--tb-page) 94%, #ffffff 6%);
    --tb-line: #c8d5dc;
    --tb-line-strong: #b5c6d0;
    --tb-ink: #10263a;
    --tb-muted: #607486;
    --tb-radius: 16px;
    --tb-radius-sm: 12px;
    --tb-shadow: 0 10px 28px rgba(24, 48, 66, .07), inset 0 1px 0 rgba(255,255,255,.55);
    --tb-shadow-hover: 0 16px 34px rgba(24, 48, 66, .11), inset 0 1px 0 rgba(255,255,255,.65);
    --tb-motion: 180ms cubic-bezier(.2,.75,.2,1);
}

:root[data-theme="dark"],
:root[data-theme-mode="dark"] {
    --tb-page: #0d1b29;
    --tb-page-2: #101f2d;
    --tb-surface: #142638;
    --tb-surface-raised: #193047;
    --tb-surface-soft: #112334;
    --tb-line: #2c455b;
    --tb-line-strong: #3a5871;
    --tb-ink: #f3f7fb;
    --tb-muted: #a5b6c6;
    --tb-shadow: 0 12px 30px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
    --tb-shadow-hover: 0 18px 38px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
}

/* One coherent application canvas. */
html body {
    background: linear-gradient(180deg, var(--tb-page) 0%, var(--tb-page-2) 100%) !important;
}
html body .content,
html body .app-main,
html body .aho-entry-form,
html body .aho-entry-layout--single,
html body :where(.lab82-shell,.lab83-shell,.expert96-shell,.iw-workspace,.intel-shell,.aho-enterprise-workspace) {
    background: transparent !important;
}

/* Global premium surface grammar — same geometry, same depth, same rhythm. */
html body :where(
    .card,.aho-card,.aho-form-card,.aho-admin-card,.aho-feature-card,.aho-import-card,
    .aho-import-job-card,.aho-audit-detail-card,.aho-audit-filter-card,.aho-audit-summary-card,
    .aho-profile-security-card,.aho-profile-theme-card,.aho-profile-image-card,.aho-annual-report-card,
    .lab82-card,.lab-panel,.intel-panel,.iw-panel,.iw-stage__main,.iw-insight-rail,
    .aho-inventory-catalog,.aho-inventory-movements,.aho-scanner-card,.GlassCard,.FloatingGlassCard,
    .expert96-chart,.expert96-quality-kpis > article,.expert96-signal-grid > article
) {
    border: 1px solid var(--tb-line) !important;
    border-radius: var(--tb-radius) !important;
    color: var(--tb-ink) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.20), transparent 46%), var(--tb-surface) !important;
    box-shadow: var(--tb-shadow) !important;
    transition: transform var(--tb-motion), border-color var(--tb-motion), box-shadow var(--tb-motion), background var(--tb-motion) !important;
}
html body :where(
    .card,.aho-card,.aho-form-card,.aho-admin-card,.aho-feature-card,.lab82-card,.lab-panel,.intel-panel,
    .iw-panel,.aho-inventory-catalog,.aho-inventory-movements,.aho-scanner-card
):hover {
    border-color: color-mix(in srgb, var(--fg-accent) 32%, var(--tb-line) 68%) !important;
    box-shadow: var(--tb-shadow-hover) !important;
}

/* Entry pages remain one smooth paper workspace, not a stack of white islands. */
html body[class*="page-entry--"] .aho-entry-form :where(.aho-form-section,.aho-fieldset,.aho-entry-group,.aho-team-options) {
    background: transparent !important;
    box-shadow: none !important;
}
html body[class*="page-entry--"] .aho-entry-form .aho-fieldset {
    border-color: color-mix(in srgb, var(--tb-line) 82%, transparent 18%) !important;
}
html body[class*="page-entry--"] .aho-entry-form :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea,.aho-number-stepper) {
    border-color: var(--tb-line) !important;
    background: var(--tb-surface-raised) !important;
    color: var(--tb-ink) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.34) !important;
}

/* Choice cards: consistent premium controls across all modules. */
html body :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card) {
    border: 1px solid var(--tb-line) !important;
    border-radius: var(--tb-radius-sm) !important;
    background: var(--tb-surface) !important;
    box-shadow: 0 4px 12px rgba(23,48,66,.045), inset 0 1px 0 rgba(255,255,255,.36) !important;
    transition: transform var(--tb-motion), border-color var(--tb-motion), box-shadow var(--tb-motion), background var(--tb-motion) !important;
}
html body :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card):hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--entry-accent,var(--fg-accent)) 38%, var(--tb-line) 62%) !important;
    box-shadow: 0 10px 22px rgba(23,48,66,.085), inset 0 1px 0 rgba(255,255,255,.46) !important;
}
html body :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card):has(input:checked) {
    border-color: color-mix(in srgb, var(--entry-accent,var(--fg-accent)) 70%, var(--tb-line) 30%) !important;
    background: color-mix(in srgb, var(--entry-accent-soft,var(--fg-accent-soft)) 58%, var(--tb-surface) 42%) !important;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--entry-accent,var(--fg-accent)) 12%, transparent), 0 10px 24px rgba(23,48,66,.08) !important;
}

/* Definitive selected indicator — centered, readable and identical everywhere. */
html body .aho-entry-form :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card) :where(.aho73-choice__indicator,.aho85-choice__indicator,.aho-choice-card__indicator,.choice__indicator) {
    display: grid !important;
    place-items: center !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    border: 1.5px solid #8fa8ba !important;
    border-radius: 7px !important;
    color: transparent !important;
    background: color-mix(in srgb, var(--tb-surface-raised) 92%, transparent 8%) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.42) !important;
}
html body .aho-entry-form :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card):has(input:checked) :where(.aho73-choice__indicator,.aho85-choice__indicator,.aho-choice-card__indicator,.choice__indicator) {
    border-color: var(--entry-accent,var(--fg-accent)) !important;
    color: #fff !important;
    background: var(--entry-accent,var(--fg-accent)) !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--entry-accent,var(--fg-accent)) 28%, transparent) !important;
}
html body .aho-entry-form :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card):has(input:checked) :where(.aho73-choice__indicator,.aho85-choice__indicator,.aho-choice-card__indicator,.choice__indicator)::before {
    content: "✓" !important;
    display: block !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    transform: translateY(-.5px);
}

/* Beratung: documentation, date, responsible person and team share ONE command row. */
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid {
    display: grid !important;
    grid-template-columns: minmax(350px,1.25fr) minmax(190px,.72fr) minmax(230px,.86fr) minmax(240px,.92fr) !important;
    gap: 14px !important;
    align-items: end !important;
    width: 100% !important;
}
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho96-documentation-block,
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho95-meta-date,
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho95-meta-employee,
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > #social-team.aho101-team-inline {
    grid-row: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho96-documentation-block { grid-column: 1 !important; }
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho95-meta-date { grid-column: 2 !important; }
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho95-meta-employee { grid-column: 3 !important; }
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > #social-team.aho101-team-inline { grid-column: 4 !important; align-self: end !important; }
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-team-switch {
    min-height: 46px !important;
    padding: 0 13px !important;
    border: 1px solid var(--tb-line) !important;
    border-radius: 12px !important;
    background: var(--tb-surface-raised) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.38) !important;
}
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-team-switch:hover {
    border-color: color-mix(in srgb, var(--entry-accent,#0b9489) 40%, var(--tb-line) 60%) !important;
}
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid .aho-choice-grid--field-contact_purpose {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
}
html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid .aho-choice-grid--field-contact_purpose > label {
    min-height: 46px !important;
}

/* Keep command rows dense on medium screens rather than creating dead space. */
@media (max-width: 1320px) {
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid {
        grid-template-columns: minmax(330px,1.3fr) minmax(180px,.72fr) minmax(220px,.9fr) !important;
    }
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > #social-team.aho101-team-inline {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        max-width: 24rem !important;
    }
}
@media (max-width: 960px) {
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho96-documentation-block { grid-column: 1 / -1 !important; grid-row: 1 !important; }
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho95-meta-date { grid-column: 1 !important; grid-row: 2 !important; }
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > .aho95-meta-employee { grid-column: 2 !important; grid-row: 2 !important; }
    html body.page-entry--social-work .app-shell .aho-entry-form .aho101-consultation-command-grid > #social-team.aho101-team-inline { grid-column: 1 / -1 !important; grid-row: 3 !important; }
}

/* Global KPI/card grids: fill available width cleanly and avoid orphaned tiny cards. */
html body :where(
    .lab82-kpi-grid,.expert96-kpis,.expert97-kpis-primary,.expert96-secondary-kpis,.expert97-kpis-secondary,
    .expert96-signal-grid,.expert96-quality-kpis,.iw-metric-strip,.lab-kpis,.intel-kpis,.aho-quality-kpis,.aho-inventory-kpis
) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit,minmax(190px,1fr)) !important;
    gap: 12px !important;
    align-items: stretch !important;
}
html body :where(.lab82-kpi,.lab82-mini,.expert96-signal,.expert96-quality-kpis > article) {
    min-height: 92px !important;
    padding: 14px 15px !important;
    border: 1px solid var(--tb-line) !important;
    border-radius: 14px !important;
    background: var(--tb-surface) !important;
    box-shadow: var(--tb-shadow) !important;
}

/* Auswertung / Expert Explorer: compact, dense, no giant empty canvas. */
html body.page-expert-evaluation .expert96-shell {
    display: grid !important;
    gap: 14px !important;
}
html body.page-expert-evaluation .expert96-commandbar {
    border: 1px solid var(--tb-line) !important;
    border-radius: var(--tb-radius) !important;
    background: var(--tb-surface) !important;
    box-shadow: var(--tb-shadow) !important;
}
html body.page-expert-evaluation .lab82-view.is-active {
    display: grid !important;
    gap: 14px !important;
    align-content: start !important;
}
html body.page-expert-evaluation .lab82-section-head {
    min-height: 72px !important;
    padding: 14px 16px !important;
    border: 1px solid var(--tb-line) !important;
    border-radius: var(--tb-radius) !important;
    background: var(--tb-surface) !important;
    box-shadow: var(--tb-shadow) !important;
}
html body.page-expert-evaluation .expert96-analysis-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1.15fr) minmax(360px,.85fr) !important;
    gap: 14px !important;
    align-items: stretch !important;
}
html body.page-expert-evaluation .expert96-analysis-grid > .lab82-card {
    padding: 16px !important;
    min-height: 0 !important;
}
html body.page-expert-evaluation .expert96-analysis-links {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 9px !important;
}
html body.page-expert-evaluation .expert96-analysis-links a {
    min-height: 50px !important;
    padding: 10px 12px !important;
    border: 1px solid var(--tb-line) !important;
    border-radius: 12px !important;
    color: var(--tb-ink) !important;
    background: var(--tb-surface-raised) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35) !important;
    transition: transform var(--tb-motion), border-color var(--tb-motion), background var(--tb-motion) !important;
}
html body.page-expert-evaluation .expert96-analysis-links a:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb,var(--fg-indigo) 38%,var(--tb-line) 62%) !important;
    background: color-mix(in srgb,var(--fg-indigo) 7%,var(--tb-surface-raised) 93%) !important;
}
html body.page-expert-evaluation .expert96-method-list {
    display: grid !important;
    gap: 9px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
html body.page-expert-evaluation .expert96-method-list li {
    position: relative;
    margin: 0 !important;
    padding: 10px 12px 10px 30px !important;
    border: 1px solid var(--tb-line) !important;
    border-radius: 11px !important;
    color: var(--tb-muted) !important;
    background: var(--tb-surface-raised) !important;
}
html body.page-expert-evaluation .expert96-method-list li::before {
    content: "✓";
    position: absolute;
    left: 10px;
    top: 9px;
    color: var(--fg-accent);
    font-weight: 900;
}
html body.page-expert-evaluation .expert96-signal-grid {
    grid-template-columns: repeat(auto-fit,minmax(220px,1fr)) !important;
}
html body.page-expert-evaluation .expert96-filter-panel {
    border: 1px solid var(--tb-line) !important;
    border-radius: 12px !important;
    background: var(--tb-surface-raised) !important;
    box-shadow: var(--tb-shadow) !important;
}

/* Tables / list rows / reports share the same enterprise surface language. */
html body :where(table,.aho-table,.GlassTable,.iw-compare-table) {
    border-color: var(--tb-line) !important;
    background: transparent !important;
}
html body :where(table,.aho-table,.GlassTable,.iw-compare-table) :where(th,td) {
    border-color: var(--tb-line) !important;
}
html body :where(table,.aho-table,.GlassTable,.iw-compare-table) th {
    color: var(--tb-ink) !important;
    background: var(--tb-surface-raised) !important;
}
html body :where(table,.aho-table,.GlassTable,.iw-compare-table) tbody tr {
    background: color-mix(in srgb,var(--tb-surface) 88%,transparent 12%) !important;
}
html body :where(table,.aho-table,.GlassTable,.iw-compare-table) tbody tr:hover {
    background: color-mix(in srgb,var(--fg-accent) 7%,var(--tb-surface) 93%) !important;
}

/* Section headings become calm, aligned anchors rather than visual cards. */
html body[class*="page-entry--"] .aho-entry-form :where(.aho-section-heading,.aho-form-section__header,.aho-entry-section-header) {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb,var(--tb-line) 78%,transparent 22%) !important;
    box-shadow: none !important;
}

/* Dark-mode hardening: never leave bright white cards behind. */
:root[data-theme="dark"] body :where(
    .card,.aho-card,.aho-form-card,.aho-fieldset,.aho-form-section,.lab82-card,.lab-panel,.intel-panel,
    .iw-panel,.expert96-chart,.expert96-analysis-links a,.expert96-method-list li,
    .aho-import-card,.aho-admin-card,.aho-annual-report-card,.aho-report-preview,.activity-report-preview
) {
    color: var(--tb-ink) !important;
    border-color: var(--tb-line) !important;
    background: var(--tb-surface) !important;
}
:root[data-theme="dark"] body :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea,.aho-number-stepper) {
    color: var(--tb-ink) !important;
    border-color: var(--tb-line) !important;
    background: var(--tb-surface-raised) !important;
}

/* Branded footer/eyebrow helper — product name is Techburg MGM, organisation stays configurable. */
html body .topbar__eyebrow,
html body .brand__text small {
    letter-spacing: .01em !important;
}

@media (max-width: 1180px) {
    html body.page-expert-evaluation .expert96-analysis-grid { grid-template-columns: 1fr !important; }
    html body.page-expert-evaluation .expert96-analysis-links { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 700px) {
    html body.page-expert-evaluation .expert96-analysis-links { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
    html body :where(.aho73-choice,.aho85-choice,.aho-choice-card,.choice-card,.card,.aho-card,.lab82-card,.expert96-analysis-links a) {
        transition: none !important;
        transform: none !important;
    }
}