/* ============================================================
   Keystone Property — Design Tokens
   Sourced from the Keystone Property design system
   (colors, typography, spacing, effects, base).
   ============================================================ */

:root {
  /* --- Primary: Pine (deep eucalyptus) --- */
  --pine-900: #0c2a28;
  --pine-800: #103633;
  --pine-700: #13413f; /* primary brand */
  --pine-600: #1c5450;
  --pine-500: #2e6f69;
  --pine-400: #4f8b85;
  --pine-300: #7fa9a3;
  --pine-200: #aecbc6;
  --pine-100: #d5e3e0;
  --pine-50:  #eaf1ef;

  /* --- Accent: Clay (terracotta) --- */
  --clay-800: #8a3823;
  --clay-700: #a6452c;
  --clay-600: #c25b3f; /* accent brand */
  --clay-500: #d17354;
  --clay-300: #e0a48d;
  --clay-200: #eac2b3;
  --clay-100: #f3ddd2;
  --clay-50:  #f8eae3;

  /* --- Highlight: Wheat (gold) --- */
  --wheat-700: #b3791f;
  --wheat-600: #c68a33;
  --wheat-500: #d8a24a;
  --wheat-300: #e7c489;
  --wheat-100: #f3e2c2;
  --wheat-50:  #faf1de;

  /* --- Warm neutrals --- */
  --ink:        #1a2421; /* primary text */
  --slate-700:  #3d4742;
  --slate-600:  #525c56;
  --slate-500:  #6b756f; /* muted text */
  --slate-400:  #8c958f;
  --slate-300:  #b6bdb7;
  --line-strong:#cbc1ae;
  --line:       #d6cdbd; /* crisper warm hairline */
  --line-soft:  #e7e0d3;
  --paper:      #f6f1e8; /* page background */
  --paper-2:    #fbf7f0; /* raised paper */
  --card:       #ffffff;

  /* --- Semantic: status / RAG --- */
  --success:    #3f7a55;
  --success-bg: #e4efe7;
  --success-fg: #245138;
  --warning:    #b5852a;
  --warning-bg: #f6ebd2;
  --warning-fg: #7c5a16;
  --danger:     #b23b33;
  --danger-bg:  #f6e0dd;
  --danger-fg:  #7e261f;
  --info:       #2e6f69;
  --info-bg:    #e0ecea;
  --info-fg:    #163d39;

  /* --- Semantic aliases --- */
  --brand:            var(--pine-700);
  --brand-hover:      var(--pine-800);
  --brand-active:     var(--pine-900);
  --brand-subtle:     var(--pine-50);
  --accent:           var(--clay-600);
  --accent-hover:     var(--clay-700);
  --accent-subtle:    var(--clay-50);
  --highlight:        var(--wheat-500);

  --text-strong:      var(--ink);
  --text-body:        var(--slate-700);
  --text-muted:       var(--slate-500);
  --text-faint:       var(--slate-400);
  --text-on-brand:    #f3efe6;
  --text-on-accent:   #fdf6f2;
  --text-link:        var(--pine-600);

  --surface-page:     var(--paper);
  --surface-raised:   var(--paper-2);
  --surface-card:     var(--card);
  --surface-inset:    var(--pine-50);
  --surface-brand:    var(--pine-700);
  --surface-brand-deep: var(--pine-900);

  --border-default:   var(--line);
  --border-strong:    var(--line-strong);
  --border-soft:      var(--line-soft);
  --border-focus:     var(--clay-600);

  --ledger-credit:    var(--success);
  --ledger-debit:     var(--danger);
  --ledger-neutral:   var(--ink);

  /* --- Typography --- */
  --font-display: 'Space Grotesk', 'Archivo', system-ui, sans-serif;
  --font-sans: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;

  --text-2xs: 0.6875rem;
  --text-xs:  0.75rem;
  --text-sm:  0.875rem;
  --text-base:1rem;
  --text-md:  1.125rem;
  --text-lg:  1.375rem;
  --text-xl:  1.75rem;
  --text-2xl: 2.25rem;
  --text-3xl: 3rem;
  --text-4xl: 4rem;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --lh-tight: 1.04;
  --lh-snug: 1.2;
  --lh-normal: 1.45;
  --lh-relaxed: 1.6;

  --ls-tight: -0.035em;
  --ls-snug: -0.01em;
  --ls-normal: 0;
  --ls-wide: 0.04em;
  --ls-caps: 0.09em;

  /* --- Spacing & layout --- */
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  --container-max: 1200px;
  --container-narrow: 760px;
  --gutter: var(--space-6);
  --section-y: var(--space-20);

  --control-h-sm: 2rem;
  --control-h-md: 2.625rem;
  --control-h-lg: 3.25rem;
  --tap-min: 2.75rem;

  /* --- Effects --- */
  --radius-xs: 1px;
  --radius-sm: 2px;
  --radius-md: 3px;
  --radius-lg: 5px;
  --radius-xl: 8px;
  --radius-2xl: 12px;
  --radius-pill: 999px;

  --border-1: 1px;
  --border-2: 2px;
  --border-accent: 3px;

  --shadow-xs: 0 1px 0 rgba(26, 36, 33, 0.05);
  --shadow-sm: 0 1px 1px rgba(26, 36, 33, 0.05), 0 1px 0 rgba(26, 36, 33, 0.04);
  --shadow-md: 0 1px 2px rgba(26, 36, 33, 0.07), 0 3px 8px rgba(26, 36, 33, 0.07);
  --shadow-lg: 0 2px 4px rgba(26, 36, 33, 0.08), 0 12px 28px rgba(26, 36, 33, 0.13);
  --shadow-focus: 0 0 0 2px var(--surface-card), 0 0 0 4px rgba(194, 91, 63, 0.55);
  --shadow-inset: inset 0 1px 1px rgba(26, 36, 33, 0.05);

  --ease-standard: cubic-bezier(0.3, 0.1, 0.3, 1);
  --ease-out: cubic-bezier(0.16, 0.84, 0.44, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;

  --focus-ring: var(--shadow-focus);

  color-scheme: light;
}
