/* Webleb design tokens, loaded on every page (index.php) before the page styles.
   Use these instead of hard-coded colors so the public pages, dashboard and chat stay in sync. */
:root {
    /* brand */
    --pr: #10b3a4;              /* teal: buttons, links, highlights */
    --prd: #0d9e90;             /* teal hover */
    --pr-rgb: 16, 179, 164;     /* for tints: rgba(var(--pr-rgb), .1) */
    --pr-ink: #04221f;          /* text on a teal background */
    --prglow: rgba(16, 179, 164, .18);

    /* surfaces, darkest to lightest */
    --bg: #121212;
    --s1: #181818;
    --s2: #1e1e1e;
    --s3: #272727;
    --s4: #2f2f2f;

    /* borders */
    --bd: rgba(255, 255, 255, .07);
    --bdh: rgba(255, 255, 255, .14);

    /* text: main, muted, faint */
    --t: #f0f0f0;
    --tm: #9ca3af;
    --tf: #6b7280;

    /* status */
    --ok: #34d399;
    --bad: #f87171;
    --warn: #fbbf24;

    /* corner radius: cards, controls, small */
    --r: 14px;
    --rm: 10px;
    --rs: 8px;
}