/* ============================================================
   eelkir Design System — root stylesheet
   The compiler reads this file and its @import closure.
   ============================================================ */
@import url("colors_and_type.css");

/* Base reset / app defaults */
* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
}

body {
  background: var(--bg-base);
  color: var(--fg-1);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection {
  background: var(--accent-dim);
  color: var(--fg-1);
}

a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); }

/* Custom scrollbar — restrained, dark */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: var(--radius-pill);
  border: 2px solid transparent;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover { background: var(--fg-3); background-clip: padding-box; }