/*
 * TradeGospel shared visual foundation.
 *
 * This file is the stable token authority for public and authenticated pages.
 * It loads before page and component styles; scoped compatibility aliases keep
 * existing surfaces on the same palette while components migrate checkpoint by
 * checkpoint.
 */

:root {
  color-scheme: light;

  --tg-foundation-light-canvas: #f4f6f8;
  --tg-foundation-light-surface: #ffffff;
  --tg-foundation-light-surface-subtle: #edf1f4;
  --tg-foundation-light-text: #17212b;
  --tg-foundation-light-text-secondary: #465762;
  --tg-foundation-light-text-muted: #667781;
  --tg-foundation-light-structure: #d8e0e6;
  --tg-foundation-light-structure-strong: #a9b7c1;

  --tg-foundation-dark-canvas: #11161b;
  --tg-foundation-dark-surface: #192128;
  --tg-foundation-dark-text: #f2f5f7;
  --tg-foundation-dark-text-muted: #aebac2;
  --tg-foundation-dark-structure: #34424c;

  --tg-semantic-positive: #087852;
  --tg-semantic-positive-on-dark: #65d7b5;
  --tg-semantic-negative: #bd3f35;
  --tg-semantic-negative-on-dark: #f08078;
  --tg-semantic-cost: #9c5a00;
  --tg-semantic-cost-on-dark: #f2c966;
  --tg-semantic-evidence: #2f62b3;
  --tg-semantic-evidence-on-dark: #78a9ff;
  --tg-semantic-diagnosis: #6650a8;
  --tg-semantic-improvement: #0b806d;
  --tg-semantic-improvement-lime: #c2e85b;
  --tg-semantic-warning: #8a6500;
  --tg-semantic-missing: #667781;
  --tg-semantic-focus: #1f6fb2;

  --tg-font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
  --tg-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --tg-content-max: 1520px;
  --tg-page-gutter: 24px;
  --tg-grid-gap: 16px;
  --tg-control-min-size: 44px;
  --tg-radius-xs: 4px;
  --tg-radius-sm: 6px;
  --tg-radius-md: 8px;
  --tg-radius-card: 8px;
  --tg-shadow-card: 0 12px 30px rgba(23, 33, 43, .08);
  --tg-shadow-float: 0 24px 60px rgba(23, 33, 43, .16);
  --tg-shadow-focus: 0 0 0 4px rgba(31, 111, 178, .18);
}

/* Active light roles. Explicit dark-mode activation is added at its release gate. */
html body.launch-page,
html body.auth-page,
html body.policy-body,
html body.error-page,
html body.tg-theme-launch.workspace-visual-r1 {
  --tg-canvas: var(--tg-foundation-light-canvas);
  --tg-canvas-subtle: var(--tg-foundation-light-surface-subtle);
  --tg-surface-1: var(--tg-foundation-light-surface);
  --tg-surface-2: var(--tg-foundation-light-surface-subtle);
  --tg-surface-3: #e5ebef;
  --tg-surface-4: #dce4e9;
  --tg-surface-hover: #e8eef2;
  --tg-surface-pressed: #dce5ea;
  --tg-surface-overlay: rgba(255, 255, 255, .96);
  --tg-scrim: rgba(17, 22, 27, .58);
  --tg-text-primary: var(--tg-foundation-light-text);
  --tg-text-secondary: var(--tg-foundation-light-text-secondary);
  --tg-text-muted: var(--tg-foundation-light-text-muted);
  --tg-text-faint: #7a8992;
  --tg-text-inverse: var(--tg-foundation-dark-text);
  --tg-border-subtle: rgba(52, 66, 76, .16);
  --tg-border-default: var(--tg-foundation-light-structure);
  --tg-border-strong: var(--tg-foundation-light-structure-strong);
  --tg-grid: rgba(52, 66, 76, .14);
  --tg-focus: var(--tg-semantic-focus);
  --tg-positive: var(--tg-semantic-positive);
  --tg-negative: var(--tg-semantic-negative);
  --tg-cost: var(--tg-semantic-cost);
  --tg-info: var(--tg-semantic-evidence);
  --tg-diagnosis: var(--tg-semantic-diagnosis);
  --tg-improvement: var(--tg-semantic-improvement);

  /* Compatibility aliases for the current public and workspace styles. */
  --paper: var(--tg-canvas);
  --paper-2: var(--tg-canvas-subtle);
  --white: var(--tg-surface-1);
  --ink: var(--tg-text-primary);
  --ink-2: var(--tg-foundation-dark-surface);
  --muted: var(--tg-text-muted);
  --line: var(--tg-border-default);
  --acid: var(--tg-semantic-improvement-lime);
  --amber: var(--tg-semantic-cost);
  --focus: var(--tg-semantic-focus);
  --font: var(--tg-font-sans);
  --shell: min(var(--tg-content-max), calc(100vw - (2 * var(--tg-page-gutter))));

  --vf-paper: var(--tg-canvas);
  --vf-paper-deep: var(--tg-canvas-subtle);
  --vf-card: var(--tg-surface-1);
  --vf-ink: var(--tg-text-primary);
  --vf-muted: var(--tg-text-muted);
  --vf-line: var(--tg-border-default);
  --vf-side: var(--tg-foundation-dark-canvas);
  --vf-side-soft: var(--tg-foundation-dark-surface);
  --vf-teal: var(--tg-semantic-improvement);
  --vf-mint: var(--tg-semantic-positive-on-dark);
  --vf-acid: var(--tg-semantic-improvement-lime);
  --vf-blue: var(--tg-semantic-evidence);
  --vf-violet: var(--tg-semantic-diagnosis);
  --vf-amber: var(--tg-semantic-cost);
  --vf-red: var(--tg-semantic-negative);
}

html body.launch-page {
  --mint: var(--tg-semantic-positive-on-dark);
  --coral: var(--tg-semantic-negative-on-dark);
  --blue: var(--tg-semantic-evidence-on-dark);
}

html body.auth-page,
html body.policy-body,
html body.error-page,
html body.tg-theme-launch.workspace-visual-r1 {
  --mint: var(--tg-semantic-improvement);
  --mint-strong: var(--tg-semantic-positive);
  --coral: var(--tg-semantic-negative);
  --blue: var(--tg-semantic-evidence);
  --panel: var(--tg-surface-1);
  --deep: var(--tg-canvas);
  --cream: var(--tg-surface-1);
}

@media (max-width: 720px) {
  :root {
    --tg-page-gutter: 16px;
    --tg-grid-gap: 12px;
  }
}