/* Loaded before either application bundle, including on slow sign-in requests. */
/* The one type scale for both bundles (legacy styles.css and admin.css). Every
   font-size in src uses one of these; test/type-scale.test.ts keeps it that way. */
:root {
  --t-title: 20px;   /* page titles */
  --t-heading: 16px; /* section headings */
  --t-body: 14px;    /* paragraphs and reading text */
  --t-ui: 13px;      /* rows, buttons, inputs, default controls */
  --t-small: 12px;   /* meta, captions, timestamps */
  --t-micro: 11px;   /* labels, badges, eyebrow caps */
  color-scheme: light;
  background: #fafaf8;
  --theme-bg: #fafaf8;
  --theme-surface: #ffffff;
  --theme-raised: #f1eff6;
  --theme-line: #e2e3dc;
  --theme-line-strong: #918c97;
  --theme-text: #25262a;
  --theme-muted: #72766c;
  --theme-accent: #6350b7;
  --theme-accent-wash: #eeebf6;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  background: #17161a;
  color: #e8e5ed;
  --theme-bg: #17161a;
  --theme-surface: #1e1d22;
  --theme-raised: #25242b;
  --theme-line: #37343f;
  --theme-line-strong: #81798e;
  --theme-text: #e8e5ed;
  --theme-muted: #a29bad;
  --theme-accent: #bda0ee;
  --theme-accent-wash: #2d263a;
}
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  flex: none; min-height: 32px; padding: 6px 10px;
  border: 1px solid var(--theme-line); border-radius: 7px;
  background: var(--theme-surface); color: var(--theme-muted);
  font: 500 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  white-space: nowrap; cursor: pointer;
}
.theme-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.theme-toggle:hover { border-color: var(--theme-line-strong); background: var(--theme-raised); color: var(--theme-text); }
.theme-toggle[aria-pressed="true"] { color: var(--theme-accent); background: var(--theme-accent-wash); border-color: color-mix(in srgb, var(--theme-accent) 35%, var(--theme-line)); }
.theme-toggle:focus-visible { outline: 2px solid var(--theme-accent); outline-offset: 3px; }
@media (max-width: 840px) {
  .theme-toggle { min-width: 44px; min-height: 44px; }
  .theme-toggle.desktop-theme { display: none; }
}