:root { /* --------------------------------------------------------------- Layer 1 — brand primitives. Default palette for @barrelsgd/ui. Role-named, not colour-named, so a brand with a different hue can override without the names going stale. These become Barrels' own values when the approved brand assets land; until then they carry the existing palette so appearance is unchanged. --------------------------------------------------------------- */ --brand-primary: #15006b; --brand-primary-accent: #2478f2; --brand-accent: #39a9f5; --brand-highlight: #ff981e; --brand-surface-page: #ffffff; --brand-surface: #f3f8fc; --brand-surface-panel: #eaf3fb; --brand-surface-secondary: #eaf2fb; --brand-surface-muted: #e4eef7; --brand-text-primary: #111827; --brand-text-secondary: #4b5563; --brand-text-muted: #6b7280; --brand-text-inverse: #ffffff; --brand-border: #d0d5dd; /* Status palette. Separate from the brand palette because status meaning must survive a rebrand: a brand may change its blue, not what "danger" looks like. --status-caution is the lower-severity warning tone. */ --status-positive: #00843d; --status-caution: #ffe923; --status-warning: #ff9900; --status-negative: #cc0033; --status-neutral: #dcdcdc; --brand-font-sans: var( --font-noto-sans, var(--font-inter, ui-sans-serif, system-ui, sans-serif) ); --brand-font-document: var( --font-noto-sans, "Noto Sans", var(--brand-font-sans) ); /* Tabular/code role: raw observation codes (METAR/TAF/SYNOP), IDs, and other fixed-width data. Resolves to JetBrains Mono where an app loads it (gaa-admin, via its font-switcher registry's --font-jetbrains-mono, always present regardless of the user's chosen UI font); everywhere else it falls through to the system monospace stack. */ --brand-font-mono: var( --font-jetbrains-mono, ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace ); --brand-shadow-card: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --brand-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--brand-primary-accent) 24%, transparent); /* --------------------------------------------------------------- Shared scales. Typography, spacing, radius and elevation are not brand assets, so they stay here and are used by GMS and Barrels alike. The GMS *palette* moved to @barrelsgd/gms/styles/foundation.css in boundary 5b. --------------------------------------------------------------- */ /* Type scale. Sizes and their paired line heights; `text-body` and `leading-body` are the Tailwind utilities. */ --font-size-micro: 10px; --font-size-label: 11px; --font-size-caption: 12px; --font-size-body-sm: 13px; --font-size-body: 14px; --font-size-body-base: 16px; --font-size-nav: 20px; --font-size-heading-sm: 22px; --font-size-heading-base: 26px; --font-size-heading-md: 30px; --font-size-heading-lg: 34px; --line-height-micro: 16px; --line-height-label: 16px; --line-height-caption: 16px; --line-height-body-sm: 20px; --line-height-body: 20px; --line-height-body-base: 24px; --line-height-nav: 28px; --line-height-heading-sm: 28px; --line-height-heading-base: 32px; --line-height-heading-md: 36px; --line-height-heading-lg: 36px; /* Fixed dimensions (not general spacing). Spacing and radius are deliberately absent: their values were exact duplicates of Tailwind's own scale, so they were removed in boundary 5c rather than renamed. Defining --spacing- here would shadow Tailwind's computed scale and silently resize every p-4 in the repo. */ --header-height: 72px; /* --------------------------------------------------------------- Layer 2 — semantic contract. shadcn-compatible. Resolves through layer 1 only, never through a brand-specific palette, so overriding the layer 1 primitives rebrands every shared primitive without touching this block. --------------------------------------------------------------- */ --background: var(--brand-surface-page); --foreground: var(--brand-text-primary); --card: var(--brand-surface-page); --card-foreground: var(--brand-text-primary); --popover: var(--brand-surface-page); --popover-foreground: var(--brand-text-primary); --primary: var(--brand-primary); --primary-foreground: var(--brand-text-inverse); --secondary: var(--brand-surface-secondary); --secondary-foreground: var(--brand-primary); --muted: var(--brand-surface-muted); --muted-foreground: var(--brand-text-muted); --accent: var(--brand-accent); --accent-foreground: var(--brand-text-inverse); --destructive: var(--status-negative); --destructive-foreground: var(--brand-text-inverse); /* Status semantics. Shared primitives reference these, never a brand primitive directly, so each brand can map its own palette onto them. Deliberately not overridden in .dark: these derive from hazard colours, whose meaning must not shift between themes. */ --success: var(--status-positive); --success-foreground: var(--brand-text-inverse); --warning: var(--status-warning); --warning-foreground: var(--brand-text-primary); --info: var(--brand-primary-accent); --info-foreground: var(--brand-text-inverse); /* Soft status tier: the lower-emphasis filled treatment (badge `light-*`), as opposed to the solid tier above. Only the three tiers with consumers are defined; add others when something needs them. */ --primary-soft: var(--brand-surface-panel); --primary-soft-foreground: var(--brand-primary); --warning-soft: var(--status-caution); --warning-soft-foreground: var(--brand-text-primary); --info-soft: var(--brand-accent); --info-soft-foreground: var(--brand-text-primary); --border: var(--brand-border); --input: var(--brand-border); --ring: var(--brand-primary-accent); --radius: 0.5rem; /* Chart palette */ --chart-1: var(--brand-primary-accent); --chart-2: var(--brand-accent); --chart-3: var(--brand-primary); --chart-4: var(--brand-highlight); --chart-5: var(--status-positive); /* Sidebar semantics used by shared/admin UI */ --sidebar: var(--brand-surface-page); --sidebar-foreground: var(--brand-text-primary); --sidebar-primary: var(--brand-primary); --sidebar-primary-foreground: var(--brand-text-inverse); --sidebar-accent: var(--brand-surface-secondary); --sidebar-accent-foreground: var(--brand-primary); --sidebar-border: var(--brand-border); --sidebar-ring: var(--brand-primary-accent); /* Optional app font bridge (GMS alias; moves with the GMS block) */ color-scheme: light; }