/* LE Design System Tokens — shared across all 4 directions */
:root {
  --le-blue: #0052CC;
  --le-blue-dark: #003D99;
  --le-blue-light: #1A66DD;
  --le-blue-soft: #E6F0FF;
  --gray-50: #F8F9FA;
  --gray-100: #E9ECEF;
  --gray-200: #DEE2E6;
  --gray-300: #CED4DA;
  --gray-400: #ADB5BD;
  --gray-500: #6C757D;
  --gray-600: #495057;
  --gray-700: #343A40;
  --gray-800: #212529;
  --white: #FFFFFF;
  --success: #28A745;
  --warn: #FFC107;
  --error: #DC3545;
  
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'SF Mono', Monaco, 'JetBrains Mono', Consolas, monospace;
  --font-serif: Georgia, 'Times New Roman', serif;
  
  /* Semantic — light */
  --bg: var(--white);
  --paper: var(--gray-50);
  --surface: var(--gray-100);
  --ink: var(--gray-800);
  --ink2: var(--gray-600);
  --ink3: var(--gray-500);
  --rule: var(--gray-300);
  --rule2: var(--gray-200);
  --accent: var(--le-blue);
  --accent-soft: var(--le-blue-soft);
  --on-accent: var(--white);
}

[data-theme="dark"] {
  --bg: #11161D;
  --paper: #1A2029;
  --surface: #232B36;
  --ink: #E6EDF3;
  --ink2: #B1BAC4;
  --ink3: #7D8794;
  --rule: rgba(177,186,196,0.16);
  --rule2: rgba(177,186,196,0.08);
  --accent: #4D88E8;
  --accent-soft: rgba(77,136,232,0.16);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: var(--bg); color: var(--ink); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
body { min-height: 100vh; }
button { font-family: inherit; cursor: pointer; }
img { display: block; max-width: 100%; }