/* Slistr brand tokens. Served from https://www.slistr.com/slistr-brand.css and loaded by every Slistr app after its
   own styles, so a change here reaches all of them. Source of truth: BRAND-TOKENS.md and the Slistr Brand Guide.
   White page first: Slistr lives on white and sand; charcoal is for type and the mark, never for page backgrounds.
   `html:root` outranks each app's own `:root` block. */
html:root {
  --page: #FFFFFF;
  --paper: #F6F4F1;
  --card: #FFFFFF;
  --ink: #231F20;
  --charcoal: #231F20;
  --text: #3A3536;
  --slate: #6E6767;
  --stone: #8F8885;
  --silver: #E7E3E0;
  --brand: #F05A28;
  --brand-strong: #F05A28;
  --brand-ink: #F05A28;
  --brand-soft: #FDEEE7;
  --brand-deep: #9C3514;
  --btn: #F05A28;
  --btn-fg: #FFFFFF;
  --cta: #F05A28;
  --cta-fg: #FFFFFF;
  --danger: #C02B1E;
  --success: #1E7A46;
  --warning: #9A6200;
  --info: #1F5FA8;
  color-scheme: light;
}
/* Dark mode is a user choice inside an app, never the default. The orange stays the same on dark. */
html[data-theme="dark"]:root {
  --page: #151314;
  --paper: #221F20;
  --card: #1C1A1B;
  --ink: #F4F1EF;
  --charcoal: #121011;
  --text: #E6E1DE;
  --slate: #A8A09C;
  --stone: #8A8380;
  --silver: #34302F;
  --brand-ink: #F05A28;
  --brand-soft: #3A2219;
  --btn: #F05A28;
  --btn-fg: #FFFFFF;
  --cta: #F05A28;
  --cta-fg: #FFFFFF;
  --danger: #F97066;
  --success: #47CD89;
  --warning: #F5B94A;
  --info: #7DB3F0;
  color-scheme: dark;
}
:focus-visible { outline-color: #F05A28; }
