/* Shared design tokens — a plain-CSS mirror of the SPA's @theme block (frontend/src/index.css; see documentation/UI.md). Kept in sync by hand: colors change rarely, and this keeps the landing page framework-free while looking identical to the app. If you retheme the app, mirror the values here. (Both the Tailwind app and this page ultimately consume the same custom properties via var(--color-…).) */ /* Self-hosted fonts (fonts/) — mirrors the app's @fontsource setup. No Google Fonts request: faster first paint + no visitor IP sent to a third party, which matters most on the public + legal pages (GDPR; see documentation/Legal.md §4, UI.md). Latin + latin-ext subsets only — the copy is English/German. */ @font-face { font-family: "Inter Variable"; font-style: normal; font-display: swap; font-weight: 100 900; src: url(fonts/inter-latin-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @font-face { font-family: "Inter Variable"; font-style: normal; font-display: swap; font-weight: 100 900; src: url(fonts/inter-latin-ext-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } @font-face { font-family: "Lora Variable"; font-style: normal; font-display: swap; font-weight: 400 700; src: url(fonts/lora-latin-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @font-face { font-family: "Lora Variable"; font-style: normal; font-display: swap; font-weight: 400 700; src: url(fonts/lora-latin-ext-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } @font-face { font-family: "Lora Variable"; font-style: italic; font-display: swap; font-weight: 400 700; src: url(fonts/lora-latin-wght-italic.woff2) format("woff2-variations"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @font-face { font-family: "Lora Variable"; font-style: italic; font-display: swap; font-weight: 400 700; src: url(fonts/lora-latin-ext-wght-italic.woff2) format("woff2-variations"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } :root { --font-sans: "Inter Variable", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --font-serif: "Lora Variable", Georgia, "Times New Roman", serif; /* Light — paper + deep-blue ink */ --color-background: #fbfafc; --color-surface: #faf9f5; --color-surface-hover: #e4e2d6; --color-foreground: #1b2a3c; --color-muted: #6e7682; --color-border: #d9d7cd; --color-primary: #1f3a5f; --color-primary-foreground: #f6f4ee; --color-highlight: #f7f45a7d; --color-highlight-foreground: #1b2a3c; --color-danger: #b3261e; --color-success: #3f7d57; color-scheme: light; } /* Dark — ink page. Applied when . */ :root[data-theme="dark"] { --color-background: #11161f; --color-surface: #19202b; --color-surface-hover: #232c39; --color-foreground: #e7e9ec; --color-muted: #95a0ad; --color-border: #2a3340; --color-primary: #6fa3d6; --color-primary-foreground: #11161f; --color-highlight: #b7ba21b9; --color-highlight-foreground: #e7e9ec; --color-danger: #e06a60; --color-success: #6cba86; color-scheme: dark; }