/* Design tokens — the single source of truth for the app's :root custom
   properties (brand palette, semantic colours, fonts, and sidebar geometry).

   Every shell stylesheet and base template consumes these variables, so this
   file must be <link>ed before any stylesheet that references var(--...).
   Do not redefine these tokens inline in a template or duplicate them in
   another stylesheet — add or change them here. */

:root {
    --nstx-paper: #f9f8f5;
    --nstx-paper-2: #f2f0eb;
    --nstx-paper-3: #e8e5de;
    --nstx-paper-4: #e0ddd5;
    --nstx-ink: #0d0d0c;
    --nstx-ink-2: #3a3a36;
    --nstx-ink-3: #8a8880;
    --nstx-border: #d8d5ce;
    --nstx-red: #b5281e;
    --color-bg: var(--nstx-paper);
    --color-surface: var(--nstx-paper-2);
    --color-surface-alt: #ffffff;
    --color-border: var(--nstx-border);
    --color-text: var(--nstx-ink);
    --color-text-muted: var(--nstx-ink-3);
    --color-danger: var(--nstx-red);
    --color-success: #167a3a;
    --color-primary: var(--nstx-ink);
    --color-primary-hover: var(--nstx-ink-2);
    --color-primary-light: var(--nstx-paper-3);
    --color-primary-light-hover: var(--nstx-paper-4);
    --font-display: "Anybody", "Arial Black", sans-serif;
    --font-body: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    --sidebar-width-expanded: 240px;
    --sidebar-width-collapsed: 60px;
    --app-chrome-height: 3.25rem;
    --sidebar-bg: var(--nstx-paper-2);
    --sidebar-bg-hover: var(--nstx-paper-3);
    --sidebar-fg: var(--nstx-ink);
    --sidebar-fg-muted: var(--nstx-ink-3);
    --sidebar-active-bg: var(--nstx-ink);
    --sidebar-active-bg-hover: var(--nstx-ink-2);
    --sidebar-active-fg: var(--nstx-paper);
    --sidebar-transition: 200ms ease;
}