/* ════════════════════════════════════════════════════════════════ glean-ui v2 — shared design tokens Omarchy Lowlight (warm low-contrast dark, default) + Latte (light, via ) Served by each app at /static/ui/tokens.css ════════════════════════════════════════════════════════════════ */ @font-face { font-family: 'InterV'; src: url('/static/ui/fonts/InterVariable.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Space Mono'; src: url('/static/ui/fonts/space-mono-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Space Mono'; src: url('/static/ui/fonts/space-mono-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; } :root { /* ── Omarchy Lowlight palette (warm, low-contrast desaturated dark) ── */ --rosewater:#e9dfe4; --flamingo:#d8c4c4; --pink:#e5dbe5; --mauve:#bea7bd; --red:#c49a9a; --maroon:#ccb8b8; --peach:#bd9885; --yellow:#c2a37e; --green:#9fa882; --teal:#b0b7c5; --sky:#bcc2cf; --sapphire:#a39eb8; --blue:#a39eb8; --lavender:#d5d2df; --text:#dcd7d6; --subtext1:#c9c0bf; --subtext0:#b3a8a6; --overlay2:#978786; --overlay1:#80726f; --overlay0:#6a5d5d; --surface2:#544a4a; --surface1:#433a3a; --surface0:#352e2e; --base:#292323; --mantle:#221d1d; --crust:#1b1717; /* ── semantic ── */ --accent:var(--mauve); /* per-app override: chat=mauve dash=lavender glean=blue */ --accent-2:var(--lavender); --ok:var(--green); --warn:var(--yellow); --danger:var(--red); --info:var(--blue); /* ── typography ── */ --font-ui:'InterV','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; --font-mono:'Space Mono','SFMono-Regular',Consolas,'Courier New',monospace; /* ── shape ── */ --r-sm:8px; --r-md:12px; --r-lg:16px; --r-pill:999px; /* ── depth ── */ --shadow-1:0 1px 2px rgb(0 0 0/.25), 0 2px 10px rgb(0 0 0/.22); --shadow-2:0 4px 14px rgb(0 0 0/.30), 0 14px 38px rgb(0 0 0/.32); --glow-accent:0 0 0 1px color-mix(in srgb,var(--accent) 38%,transparent), 0 4px 22px color-mix(in srgb,var(--accent) 16%,transparent); --ring:0 0 0 3px color-mix(in srgb,var(--accent) 26%,transparent); /* ── glass chrome ── */ --glass-bg:color-mix(in srgb,var(--mantle) 76%,transparent); --glass-border:color-mix(in srgb,var(--surface1) 70%,transparent); --grad-accent:linear-gradient(135deg,var(--accent),var(--accent-2)); color-scheme:dark; } [data-theme="light"] { /* ── Lowlight Light — warm sepia (low-contrast light) ── */ --rosewater:#9a7d83; --flamingo:#9a6f6f; --pink:#9c6f96; --mauve:#856a83; --red:#a05f5f; --maroon:#9a6a6a; --peach:#9c6e54; --yellow:#937547; --green:#6c7649; --teal:#5f6878; --sky:#6b7486; --sapphire:#666280; --blue:#666280; --lavender:#736f8a; --text:#3a302a; --subtext1:#4d4138; --subtext0:#5f5248; --overlay2:#73655b; --overlay1:#8d7f74; --overlay0:#a89a8f; --surface2:#c3b6ab; --surface1:#d6cbc1; --surface0:#e6ded6; --base:#f4efe9; --mantle:#ece5de; --crust:#e1d9d0; --shadow-1:0 1px 2px rgb(58 48 42/.10), 0 2px 10px rgb(58 48 42/.08); --shadow-2:0 4px 14px rgb(58 48 42/.12), 0 14px 38px rgb(58 48 42/.14); --glass-bg:color-mix(in srgb,var(--mantle) 72%,transparent); color-scheme:light; } /* ── legacy variable aliases ─────────────────────────────────────── Older app CSS referenced these names; they now follow the tokens (and therefore switch with the theme) automatically. New code should use the canonical names above. */ :root, [data-theme="light"] { --font:var(--font-mono); --body:var(--font-ui); --radius:var(--r-md); --bg:var(--base); --fg:var(--text); --dim:var(--overlay1); --border:var(--surface1); --dark:var(--mantle); --muted:var(--overlay0); --surface:var(--surface0); --subtext:var(--subtext0); --overlay:var(--overlay1); --amber:var(--lavender); /* chat's historical accent */ --gold:var(--mauve); /* chat's historical heading color */ }