/* Iseola — Work of Wealth SaaS Design Tokens */
:root {
  --brand-50:  #EEF0FB;
  --brand-100: #DDE0F7;
  --brand-200: #B9C0EF;
  --brand-500: #7B85DC;
  --brand-600: #5E6AD2;
  --brand-700: #4A56C0;
  --brand-800: #3A45A8;
  --brand-900: #2A3284;
  --brand-fg:  var(--brand-600);

  --neutral-0:   #FFFFFF;
  --neutral-50:  #F8FAFC;
  --neutral-100: #F1F5F9;
  --neutral-200: #E2E8F0;
  --neutral-300: #CBD5E1;
  --neutral-400: #94A3B8;
  --neutral-500: #64748B;
  --neutral-600: #475569;
  --neutral-700: #334155;
  --neutral-800: #1E293B;
  --neutral-900: #0F172A;

  --bg-canvas:   var(--neutral-50);
  --bg-surface:  var(--neutral-0);
  --bg-hover:    var(--neutral-100);

  --text-primary: var(--neutral-900);
  --text-muted:   var(--neutral-600);
  --text-subtle:  var(--neutral-400);

  --border-default: var(--neutral-200);
  --border-strong:  var(--neutral-300);

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", "Menlo", monospace;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;

  --shadow-xs: 0 1px 2px 0 rgba(15, 23, 42, 0.04);
  --shadow-sm: 0 1px 3px 0 rgba(15, 23, 42, 0.06);
  --shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.10);
  --shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.12);
}

.dark {
  --bg-canvas:   #0A0E1A;
  --bg-surface:  #111827;
  --bg-hover:    #1F2937;

  --text-primary: #F1F5F9;
  --text-muted:   #94A3B8;
  --text-subtle:  #64748B;

  --border-default: #1F2937;
  --border-strong:  #374151;

  --brand-fg: #A5B4FC;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-sans);
  background-color: var(--bg-canvas);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

code, pre, .font-mono {
  font-family: var(--font-mono);
}

.numeric {
  font-variant-numeric: tabular-nums;
}

/* Scrollbar styling */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 3px;
}

/* Provenance Status Badges */
.badge-confirmed {
  background-color: rgba(22, 163, 74, 0.12);
  color: #15803d;
  border: 1px solid rgba(22, 163, 74, 0.25);
}
.dark .badge-confirmed {
  color: #4ade80;
}

.badge-provisional {
  background-color: rgba(202, 138, 4, 0.12);
  color: #a16207;
  border: 1px solid rgba(202, 138, 4, 0.25);
}
.dark .badge-provisional {
  color: #facc15;
}

.badge-suggestion {
  background-color: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
  border: 1px solid rgba(37, 99, 235, 0.25);
}
.dark .badge-suggestion {
  color: #60a5fa;
}

.badge-missing {
  background-color: rgba(148, 163, 184, 0.12);
  color: #64748b;
  border: 1px solid rgba(148, 163, 184, 0.25);
}

.badge-attention {
  background-color: rgba(220, 38, 38, 0.12);
  color: #b91c1c;
  border: 1px solid rgba(220, 38, 38, 0.25);
}
.dark .badge-attention {
  color: #f87171;
}

/* Markdown prose rendering */
.prose h1, .prose h2, .prose h3 {
  font-weight: 600;
  letter-spacing: -0.01em;
  margin-top: 1.2em;
  margin-bottom: 0.6em;
}
.prose h1 { font-size: 1.35rem; }
.prose h2 { font-size: 1.15rem; }
.prose h3 { font-size: 1rem; }
.prose p { margin-bottom: 0.8em; line-height: 1.55; }
.prose ul, .prose ol { padding-left: 1.25rem; margin-bottom: 0.8em; }
.prose li { margin-bottom: 0.3em; }
.prose blockquote {
  border-left: 3px solid var(--brand-fg);
  padding-left: 0.75rem;
  margin: 0.8em 0;
  color: var(--text-muted);
  font-style: italic;
}