/**
 * AUMERA Design System — CSS Custom Properties & Design Tokens
 * Current deployed values; DESIGN.md governs visual intent. The Dovetail
 * reference informed the layout but does not define a second token system.
 * Blueprint Grid under a Black Moon — faint graph lines, white type, restrained blue indicators.
 * Surfaces stack: #000000 -> #0a0a0a -> #141414 -> #1e1e1e -> #313131.
 * Accent: #6798ff (Soft Indigo). Typography: Inter + JetBrains Mono. Radii: 12px panels, 8px controls, 4px tags; navigation may use pills.
 */

:root {
  /* Au public-site identity: warm white, champagne and gold on charcoal. */
  --color-brand-gold: #c7b590;
  --color-brand-gold-rgb: 199, 181, 144;
  --color-brand-gold-bright: #e5dbc4;
  --color-brand-ivory: #fffdf6;
  --color-brand-copy: #b0b0b0;
  --brand-gradient-gold: linear-gradient(108deg, #fffdf6 0%, #fffdf6 56%, #f4eee0 80%, #d8c8a7 100%);
  --brand-gradient-gilded: linear-gradient(105deg, #aa945e 0%, #f8e6b6 42%, #bba267 72%, #292923 100%);
  --brand-gradient-icon: linear-gradient(135deg, rgba(255, 253, 246, 0.06), transparent 75%);
  /* =========================================================================
     AUMERA deployed workspace palette
     ========================================================================= */
  --color-soft-indigo: #6798ff;     /* Brand accent — iconography, stat markers, chart series */
  --color-pure-black: #000000;      /* Deepest surface — modal backdrops, full-bleed fills */
  --color-carbon: #0a0a0a;          /* Page canvas — primary background; near-black */
  --color-graphite: #141414;        /* Card surface — one step above canvas */
  --color-iron: #1e1e1e;            /* Elevated surface and border — secondary cards, table rows */
  --color-slate-edge: #313131;      /* Hairline borders on imagery and nested elements */
  --color-smoke: #454545;           /* Dark borders and separators for elevated surfaces */
  --color-mist: #7c7c7c;            /* Disabled or low-emphasis button text */
  --color-ash: #a7a7a7;             /* Secondary text — captions, metadata, helper text */
  --color-bone: #ffffff;            /* Primary text, icons, filled CTA background */

  /* Semantic Aliases & Compatibility */
  --color-blue-cornflower: #6798ff;
  --color-page-ink: #0a0a0a;
  --color-card-carbon: #1e1e1e;
  --color-deep-coal: #141414;
  --color-onyx: #000000;
  --color-steel-border: #313131;
  --color-fog: #7c7c7c;
  --color-snow: #ffffff;

  /* Brand Accent */
  --color-accent: #6798ff;
  --color-accent-rgb: 103, 152, 255;
  --color-accent-hover: #8bb2ff;
  --color-accent-muted: rgba(103, 152, 255, 0.12);
  --color-accent-secondary: #6798ff;
  --color-accent-flow: #6798ff;
  --color-accent-highlight: #93c5fd;

  /* Sparse public display accents. Most headings and all copy stay solid. */
  --text-gradient-display: var(--brand-gradient-gold);
  --text-gradient-copy: linear-gradient(110deg, #eeeae2 0%, #ccc5b8 50%, #b6b1a7 100%);

  /* Edge-weighted blueprint field. The center remains quiet for content. */
  --background-blueprint-art: url('../assets/backgrounds/aumera-blueprint-edge.webp');
  --background-blueprint-art-mobile: url('../assets/backgrounds/aumera-blueprint-edge-mobile.webp');
  --background-blueprint-position: center top;
  --background-blueprint-size: max(1440px, 100vw) auto;

  /* =========================================================================
     Surfaces (Flat tone shifts — zero box-shadows)
     ========================================================================= */
  --color-canvas: #0a0a0a;          /* Level 0: Canvas (Carbon) */
  --color-surface: #141414;         /* Level 1: Card Surface (Graphite) */
  --color-card: #141414;            /* Level 1: Card Surface (Graphite) */
  --color-section: #0a0a0a;
  --color-surface-elevated: #1e1e1e;/* Level 2: Elevated Surface (Iron) */
  --surface-canvas: #0a0a0a;
  --surface-section: #141414;
  --surface-card: #141414;
  --surface-elevated: #1e1e1e;
  --surface-border: #313131;
  --surface-inverted: #ffffff;
  --surface-raised-edge: #313131;

  /* Hairlines & Borders */
  --color-border-steel: #313131;    /* Slate edge hairline borders */
  --color-border-graphite: #454545; /* Smoke mid-tone borders on ghost buttons */
  --color-border-subtle: #1e1e1e;   /* Iron subtle divider */
  --color-border-focus: #6798ff;    /* Soft Indigo accent focus */

  /* Text & Foregrounds */
  --color-text-snow: #ffffff;       /* Primary text */
  --color-text-ash: #a7a7a7;        /* Secondary text */
  --color-text-fog: #9ca3af;        /* Disabled / de-emphasized */

  /* Status Semantics */
  --color-status-pass: #34d399;     /* pnl.positive / status.live */
  --color-status-caution: #fbbf24;  /* risk.medium / status.delayed|stale */
  --color-status-halt: #f43f5e;     /* risk.critical */
  --color-status-negative: #f43f5e; /* pnl.negative / risk.high */
  --color-status-fail: #f43f5e;     /* alias of halt, used by reference.css */
  --color-status-shadow: #6798ff;   /* paper execution / public-data feed */
  --color-status-offline: #7c7c7c;  /* status.offline */

  /* Chart neutral series */
  --chart-series-1: #6798ff;
  --chart-series-2: #ffffff;
  --chart-series-3: #a7a7a7;
  --chart-series-4: #454545;
  --chart-series-5: #313131;

  /* =========================================================================
     Geometry & Radii (12px surfaces, 8px controls, 4px micro tags)
     ========================================================================= */
  --radius-card: 12px;
  --radius-button: 8px;
  --radius-input: 8px;
  --radius-dialog: 12px;
  --radius-tag: 4px;
  --radius-micro: 4px;
  --radius-cards: 12px;
  --radius-buttons: 8px;
  --radius-inputs: 8px;
  --radius-tags: 4px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-full: 66px;
  --radius-navpills: 9999px;
  --radius-badge: 9999px;
  --radius-badge-soft: 6px;

  /* Font Weights */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;

  /* =========================================================================
     Layout & Spacing (Base 8px)
     ========================================================================= */
  --container-max-width: 1200px;
  --page-max-width: 1200px;
  --header-height: 64px;
  --announcement-height: 38px;
  --spacing-unit: 8px;
  --spacing-8: 8px;
  --spacing-16: 16px;
  --spacing-24: 24px;
  --spacing-32: 32px;
  --spacing-40: 40px;
  --spacing-64: 64px;
  --spacing-96: 96px;
  --spacing-200: 200px;
  --spacing-gap-sm: 8px;
  --spacing-gap-md: 16px;
  --spacing-gap-lg: 24px;
  --spacing-section: 80px;
  --spacing-card-padding: 24px;

  /* =========================================================================
     Typography & Font Families (Inter & JetBrains Mono)
     ========================================================================= */
  --font-inter: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-jetbrains-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --tracking-mono: 0.85px;
  /* Dense numeric tables (blotter, tape, chart axes) carry less tracking than
     labels, so rows stay column-aligned. Was referenced but never defined. */
  --tracking-mono-sm: 0.4px;

  /* Typography Scale */
  --text-caption: 12px;
  --leading-caption: 1.4;
  --tracking-caption: 0.85px;
  --text-body-sm: 14px;
  --leading-body-sm: 1.5;
  --tracking-body-sm: -0.17px;
  --text-body: 16px;
  --leading-body: 1.5;
  --tracking-body: -0.19px;
  --text-subheading: 20px;
  --leading-subheading: 1.4;
  --tracking-subheading: -0.42px;
  --text-heading-sm: 24px;
  --leading-heading-sm: 1.33;
  --tracking-heading-sm: -0.5px;
  --text-heading: 40px;
  --leading-heading: 1.2;
  --tracking-heading: -0.84px;
  --text-heading-lg: 56px;
  --leading-heading-lg: 1.14;
  --tracking-heading-lg: -2.02px;
  --text-display: 64px;
  --leading-display: 1.13;
  --tracking-display: -2.3px;

  /* =========================================================================
     Transitions
     ========================================================================= */
  --transition-fast: 140ms ease;
  --transition-normal: 200ms ease-out;

  /* =========================================================================
     Cross-System Compatibility Aliases
     ========================================================================= */
  --text-primary: var(--color-text-snow);
  --text-secondary: var(--color-text-ash);
  --text-muted: var(--color-text-fog);
  --positive: var(--color-status-pass);
  --negative: var(--color-status-negative);
  --font-ui: var(--font-sans);
  --surface-primary: var(--color-surface);
  --surface-secondary: var(--color-card);
  --surface-elevated: var(--color-surface-elevated);
  --border-subtle: var(--color-border-steel);
  --border-strong: var(--color-border-graphite);
  --brand-indigo: var(--color-accent);
  --brand-violet: var(--color-accent);
  --brand-cyan: var(--color-accent);
  --brand-ice: #bfe9ff;
}

/* Public pages share the Au palette. Operational status tokens keep their
   established meanings in the analytical workspace and public readiness UI. */
.landing-page {
  --color-accent: var(--color-brand-gold);
  --color-accent-rgb: var(--color-brand-gold-rgb);
  --color-accent-hover: var(--color-brand-gold-bright);
  --color-accent-muted: rgba(var(--color-brand-gold-rgb), 0.12);
  --color-accent-secondary: var(--color-brand-gold);
  --color-accent-flow: var(--color-brand-gold);
  --color-accent-highlight: var(--color-brand-ivory);
  --color-border-focus: var(--color-brand-gold);
  --color-text-ash: var(--color-brand-copy);
  --color-text-snow: var(--color-brand-ivory);
}

html, body {
  font-family: var(--font-sans);
  background-color: var(--color-canvas);
  color: var(--color-text-snow);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}