/* ── Reset & Base ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --font: 'Consolas', 'Courier New', monospace;
  --nav-h: 48px;
  --radius: 4px;
  --radius-lg: 8px;
  --transition: 0.12s ease;

  /* Light theme */
  --bg:           #f6f8fa;
  --surface:      #ffffff;
  --surface-2:    #f6f8fa;
  --border:       #d0d7de;
  --border-muted: #eaeef2;
  --text:         #1f2328;
  --text-muted:   #636c76;
  --text-subtle:  #9ca3af;
  --accent:       #0969da;
  --accent-hover: #0550ae;
  --accent-sub:   #ddf4ff;
  --green:        #1a7f37;
  --green-sub:    #dafbe1;
  --red:          #cf222e;
  --red-sub:      #ffebe9;
  --yellow:       #9a6700;
  --yellow-sub:   #fff8c5;
  --purple:       #8250df;
  --purple-sub:   #fbefff;
  --shadow:       0 1px 3px rgba(0,0,0,0.10);
}

[data-theme="dark"] {
  --bg:           #0d1117;
  --surface:      #161b22;
  --surface-2:    #21262d;
  --border:       #30363d;
  --border-muted: #21262d;
  --text:         #e6edf3;
  --text-muted:   #8b949e;
  --text-subtle:  #6e7681;
  --accent:       #58a6ff;
  --accent-hover: #79c0ff;
  --accent-sub:   #0d2136;
  --green:        #3fb950;
  --green-sub:    #0d2a13;
  --red:          #f85149;
  --red-sub:      #2b1117;
  --yellow:       #d29922;
  --yellow-sub:   #2b1e00;
  --purple:       #bc8cff;
  --purple-sub:   #1e0e38;
  --shadow:       0 1px 3px rgba(0,0,0,0.40);
}

html, body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  font-size: 13px;
  line-height: 1.6;
  min-height: 100vh;
}

a { color: var(--accent); cursor: pointer; text-decoration: none; }
a:hover { text-decoration: underline; }
code { font-family: var(--font); background: var(--surface-2); padding: 1px 5px; border-radius: 3px; font-size: 12px; }