/*
 * siren review — design tokens.
 *
 * Colours are sydon's night/day roles (R5 §4.2) mapped onto app surfaces:
 * night is the default, day follows prefers-color-scheme or data-theme="light".
 * Accent (Sydon Cyan at night, Sydon Blue by day) is reserved for the primary
 * action, the active nav item and focus, so it keeps meaning something. Status
 * colours are always paired with a word, never colour alone.
 *
 * Previews of platform posts do NOT use these: they will use the platform's
 * own colours whatever the app theme (spec §6.5), in their own stylesheet.
 */
:root {
  color-scheme: dark;
  /* surfaces */
  --bg-0: #0A0E1A;   /* canvas (Sydon Black) */
  --bg-1: #131A2C;   /* panel */
  --bg-2: #1A2035;   /* raised / input (Navy900) */
  --bg-3: #222A43;   /* hover */
  --line: #2A3350;   /* hairline (Navy700) */
  --line-2: #3A4560; /* strong line, control borders */
  /* text */
  --fg-1: #F2F4F8;   /* 17.5:1 on canvas */
  --fg-2: #C9D0DE;   /* secondary body */
  --fg-3: #9AA4BA;   /* meta, 7.7:1 */
  --fg-4: #66728E;   /* disabled / decorative only */
  /* brand */
  --accent: #00E5FF;
  --accent-ink: #0A0E1A;
  --accent-soft: rgb(0 229 255 / .12);
  --accent-line: rgb(0 229 255 / .45);
  --link: #7FEFFF;
  /* semantic (each with a soft fill) */
  --ok: #3DDC97;    --ok-soft: rgb(61 220 151 / .12);
  --warn: #FFB547;  --warn-soft: rgb(255 181 71 / .12);
  --bad: #FF7A7A;   --bad-soft: rgb(255 122 122 / .12);
  --info: #8F91FF;  --info-soft: rgb(143 145 255 / .14);
  --mark: rgb(255 181 71 / .28);
  /* type */
  --font-ui: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Segoe UI Mono", Menlo, Consolas, monospace;
  --fs-12: 12px; --fs-13: 13px; --fs-14: 14px; --fs-16: 16px;
  --fs-18: 18px; --fs-22: 22px; --fs-28: 28px; --fs-34: 34px;
  --lh-ui: 1.45; --lh-prose: 1.65; --measure: 68ch;
  --w-regular: 400; --w-medium: 500; --w-strong: 600;
  /* space */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-7: 32px; --s-8: 48px; --s-9: 64px;
  /* shape */
  --r-control: 8px; --r-card: 12px; --r-sheet: 16px; --r-pill: 999px;
  --shadow-pop: 0 8px 24px rgb(0 0 0 / .4);
  /* motion */
  --t-fast: 120ms ease-out;
  /* layout */
  --rail-w: 232px;
  --topbar-h: 52px;
  --tabbar-h: 0px;
  --content-max: 1080px;
}

/* Day: explicit choice, or the system preference when no choice was made. */
:root[data-theme="light"] {
  color-scheme: light;
  --bg-0: #FFFFFF; --bg-1: #F7F8FB; --bg-2: #F2F4F8; --bg-3: #E9EDF3;
  --line: #E2E6ED; --line-2: #C9D0DC;
  --fg-1: #0A0E1A; --fg-2: #2A3350; --fg-3: #4B5568; --fg-4: #7A8499;
  --accent: #2D5BFF; --accent-ink: #FFFFFF;
  --accent-soft: rgb(45 91 255 / .08); --accent-line: rgb(45 91 255 / .4);
  --link: #2D5BFF;
  --ok: #067647;   --ok-soft: rgb(6 118 71 / .08);
  --warn: #B54708; --warn-soft: rgb(194 65 12 / .08);
  --bad: #B42318;  --bad-soft: rgb(180 35 24 / .07);
  --info: #4F52E0; --info-soft: rgb(91 94 245 / .08);
  --mark: rgb(255 181 71 / .35);
  --shadow-pop: 0 8px 24px rgb(10 14 26 / .14);
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;
    --bg-0: #FFFFFF; --bg-1: #F7F8FB; --bg-2: #F2F4F8; --bg-3: #E9EDF3;
    --line: #E2E6ED; --line-2: #C9D0DC;
    --fg-1: #0A0E1A; --fg-2: #2A3350; --fg-3: #4B5568; --fg-4: #7A8499;
    --accent: #2D5BFF; --accent-ink: #FFFFFF;
    --accent-soft: rgb(45 91 255 / .08); --accent-line: rgb(45 91 255 / .4);
    --link: #2D5BFF;
    --ok: #067647;   --ok-soft: rgb(6 118 71 / .08);
    --warn: #B54708; --warn-soft: rgb(194 65 12 / .08);
    --bad: #B42318;  --bad-soft: rgb(180 35 24 / .07);
    --info: #4F52E0; --info-soft: rgb(91 94 245 / .08);
    --mark: rgb(255 181 71 / .35);
    --shadow-pop: 0 8px 24px rgb(10 14 26 / .14);
  }
}