/* ruthie-page.css — the dashboard's look on every Ruthie page: the same dark
   green background, IBM Plex Sans for text, Chakra Petch for page titles and
   JetBrains Mono for numbers. Loaded last in each page's <head> so it wins over
   the page's own older styles. Screen only, so print layouts stay as they are. */
@media screen {
  html { background-color: #0a110e; }
  body {
    background: radial-gradient(1100px 700px at 50% 0%, #12241b 0%, #0a110e 70%) fixed !important;
    background-color: #0a110e !important;
    color: #e6efe9;
    font-family: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
    -webkit-font-smoothing: antialiased;
  }
  h1 {
    font-family: 'Chakra Petch', 'IBM Plex Sans', sans-serif !important;
    letter-spacing: 0.04em;
    color: #7fe0a6;
  }
  h2, h3 { font-family: 'IBM Plex Sans', system-ui, sans-serif; }
  input, select, textarea, button { font-family: inherit; }
  input, select, textarea { color-scheme: dark; }
  input:focus, select:focus, textarea:focus { outline: 2px solid rgba(127, 224, 166, 0.45); outline-offset: 1px; }
  code, pre, .mono, .num, .value, .stat .value, .stat-card .value { font-variant-numeric: tabular-nums; }
  ::selection { background: rgba(127, 224, 166, 0.28); }
  a { color: #7fe0a6; }
}