/* Confirmed Figma values only. Unconfirmed visual tokens remain undefined. */
:root {
  --color-chrome: #ffffff;
  --color-bg: #fafaf8;
  --color-surface: #ffffff;
  --color-surface-selected: #efefed;
  --color-avatar: #e7e7e7;

  --color-text: #1c1f1c;
  --color-text-muted: #515351;
  --color-text-inverse: #ffffff;

  --color-border: #dfe0df;
  --color-border-active: #1c1f1c;

  --color-inverse: #1c1f1c;
  /* Yellow is the accent: primary actions, selected and highlighted states, the current page and status dots. */
  --color-accent: #ffdd00;
  --color-accent-hover: #ffe633;
  --color-accent-pressed: #f2d100;
  --color-accent-text: #1c1f1c;
  --color-inverse-hover: #353535;
  --color-selected: var(--color-accent);
  --color-selected-text: var(--color-accent-text);

  --color-marker: #1c1f1c;
  /* Inbox v4: unread indicators only. */
  --color-unread: #6978FF;

  --border-thin: 0.5px;
  --border-default: 1px;

  --font-mono: "Cousine", ui-monospace, monospace;
  --font-sans: "Cantarell", system-ui, sans-serif;
  --font-name: "M PLUS 1", system-ui, sans-serif;
  --font-brand: "Archivo Black", system-ui, sans-serif;

  --header-height: 59px;
  --sidebar-width: 58px;
  /* Phones replace the side rail with a bottom bar; see shell/sidebar.css. */
  --bottom-nav-height: 0px;
  --directory-width: 465px;

  --z-map: 0;
  --z-panel: 10;
  --z-sidebar: 20;
  --z-header: 30;
  --z-popup: 40;
  --z-modal: 50;

  --duration-fast: 120ms;
  --duration-normal: 200ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);

  /* Feed — confirmed reusable values from the Feed v2 specification. */
  --color-status: var(--color-accent);
  --color-opportunity: #353535;
  --color-text-on-opportunity-muted: #D4D5D3;
  --color-on-opportunity-subtle: rgba(255, 255, 255, 0.12);
  --shadow-raised: 0 1px 2px rgba(28, 31, 28, 0.04), 0 24px 56px -20px rgba(28, 31, 28, 0.18);
  --shadow-floating: 0 2px 4px rgba(28, 31, 28, 0.08), 0 24px 48px -12px rgba(28, 31, 28, 0.40);
  --radius-card: 20px;
  --radius-inner: 14px;
  --radius-thumb: 10px;
  --radius-pill: 999px;
  --color-map-overlay-bg: rgba(255, 255, 255, 0.08);
  --color-map-overlay-border: rgba(255, 255, 255, 0.16);
  --color-map-feature-ring: rgba(255, 221, 0, 0.30);

  /* Add Work — Phase 1 component specification. */
  --work-editor-width: 620px;
  --work-editor-height: 640px;
  --work-editor-drop-height: 300px;
  --work-editor-empty-height: 168px;
  --work-editor-input-height: 44px;
  --work-editor-label-size: 11px;
  --work-editor-label-tracking: .8px;
  --color-work-field-border: #C9CAC8;
  --color-work-placeholder: #6B6D6B;

  /* Onboarding — confirmed Account Type Figma values; not global UI accents. */
  --color-onboarding-accent: #FBFF00;
  --color-onboarding-bg: #FCFAF1;
  --color-onboarding-black: #000000;
  --color-onboarding-logo: #1F1A14;
  --color-onboarding-title: #141312;
  --color-onboarding-subtitle: #5D5D5D;
  --color-onboarding-muted: #707070;
  --color-onboarding-link: #040404;
  --color-onboarding-progress-inactive: #CAC8C8;
  --color-onboarding-glow-center: rgb(148, 153, 6);
  --color-onboarding-glow-edge: rgb(247, 255, 9);
  --font-onboarding-title: "Coda Caption", system-ui, sans-serif;

  /* Onboarding Steps 2–5 — shared aliases and confirmed visual values. */
  --color-onboarding-ink: var(--color-onboarding-title);
  --color-onboarding-surface: var(--color-surface);
  --color-onboarding-subtle: var(--color-onboarding-subtitle);
  --color-onboarding-label: #3A3A3A;
  --color-onboarding-placeholder: #9B9B9B;
  --color-onboarding-helper: #898989;
  --color-onboarding-field-border: #C8C8C8;
  --color-onboarding-progress-off: var(--color-onboarding-progress-inactive);
  --color-onboarding-error: #B3261E;
  --font-onboarding-display: var(--font-onboarding-title);
  --font-onboarding-ui: var(--font-name);
  --font-onboarding-body: var(--font-sans);

  /* Retain the existing background of onboarding screens not yet refined. */
  --color-onboarding-legacy-bg: #F5F2E8;
}
