:root{ --primary:#3151af; --primary-dark:#28428f; --secondary:#f59e0b; --primary-soft:rgba(30,58,138,.1); --primary-soft-strong:rgba(30,58,138,.18); /* Secondary (accent) soft washes — used for chip/tab hover states so the interaction colour matches the active fill family. The JS branding applier overrides --secondary at runtime but leaves these alone; the wash colours are intentionally derived from a static rgba of the default accent so they read as a neutral lightening rather than a hue-specific tint. Brands that want a strong accent hover can override these vars in admin-app.js applyBranding (TODO). */ --secondary-soft:rgba(245,158,11,.10); --secondary-soft-strong:rgba(245,158,11,.18); /* Accent at 50% — legacy; form controls use --input-border at rest. */ --secondary-border:rgba(254,174,6,.50); /* Default rest border for input / select / textarea / Tom Select. */ --input-border:rgba(0,0,0,.30); /* Text/icon colour on filled accent (active chip/tab). Default is dark warm brown that reads well on the default amber accent; brands with a vivid/dark accent (deep blue, red) should override to white via Settings → branding. */ --secondary-contrast:#422006; /* Glow shadow used under active chip/tab pills. Centralised so all surfaces share the same drop-shadow. */ --secondary-glow:0 2px 8px rgba(245,158,11,.28); /* Focus ring on form controls (3px accent @ 30%). */ --secondary-ring:0 0 0 3px rgba(245,158,11,.30); --bg-page:#edeef2; /* Scrollbar — darker wash of page background (follows white-label bg). */ --scrollbar-track:color-mix(in srgb, var(--bg-page) 88%, #000); --scrollbar-thumb:color-mix(in srgb, var(--bg-page) 55%, #000); --scrollbar-thumb-hover:color-mix(in srgb, var(--bg-page) 40%, #000); /* Sticky nav height — tree pane starts below it. */ --admin-nav-h:56px; --bg-modal:var(--bg-page); /* modals share the page bg */ --bg-soft:rgba(255,255,255,.45); /* table headers \u2014 white wash makes header LIGHTER than bg */ --bg-soft-strong:rgba(255,255,255,.65); /* th hover, sortable hover */ --bg-soft-row:rgba(255,255,255,.30); /* tr:hover td (slightly lighter than bg) */ --side-tabs-bg:var(--secondary); /* accent rail */ /* Inactive side-tab labels and hover wash. Derived from --secondary-contrast so they always stay legible on the branded accent rail (light contrast on vivid accents, dark contrast on pale/amber accents). The active item gets a solid white pill on top of the rail and keeps its own dark text. */ --side-tab-text:color-mix(in srgb, var(--secondary-contrast) 85%, transparent); --side-tab-text-hover:var(--secondary-contrast); --side-tab-hover-bg:color-mix(in srgb, var(--secondary-contrast) 12%, transparent); --side-tab-text-muted:#8d8a82; /* legacy neutral fallback for non-rail labels */ --border-soft:rgba(0,0,0,.08); /* hairline on tinted surfaces */ --border-table:rgba(0,0,0,.05); /* in-table row dividers, lighter */ /* ── Typography stack ────────────────────────────────────── Roboto / Roboto Mono / Roboto Condensed are served locally from /fonts/roboto.css (see admin.html ). System fallbacks kick in while the WOFF2 is still loading (font-display:swap). */ --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif; --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; --font-condensed:'Fira Sans Condensed','Inter',system-ui,-apple-system,sans-serif; /* ── Label / muted-text colour ───────────────────────────── Single source of truth for