/* ── BASE ──
   Variables, reset and typography. Change brand colours here.
*/

*,*::before,*::after {
  box-sizing:border-box;
  margin:0;
  padding:0
}
:root {
  --page:#0c0d12;
  --sidebar:#14161d;
  --card:#1b1d26;
  --card-hi:#22242f;
  --field:#24262f;
  --line:rgba(255,255,255,0.055);
  --line-hi:rgba(255,255,255,0.11);
  --text:#ecedf1;
  --muted:#9a9db1;
  --dim:#6c7293;
  --green:#00d25b;
  --green-hi:#17e06f;
  --blue:#0090e7;
  --orange:#ffab00;
  --red:#fc424a;
  --purple:#8f5fe8;
  --pink:#e5477f;
  --discord:#5865f2;
  --radius:10px;
  --ease:cubic-bezier(0.2,0.7,0.2,1);
  --font:'Ubuntu',system-ui,-apple-system,'Segoe UI',sans-serif;
  --side-w:252px
}
html {
  color-scheme:dark;
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%
}
body {
  min-height:100dvh;
  background:var(--page);
  color:var(--text);
  font-family:var(--font);
  font-size:15px;
  line-height:1.6;
  font-weight:400;
  display:flex;
  align-items:flex-start;
  -webkit-font-smoothing:antialiased
}
::selection {
  background:rgba(0,210,91,0.3);
  color:#fff
}
:focus-visible {
  outline:2px solid var(--green);
  outline-offset:2px;
  border-radius:4px
}