lernschiff/resources/css/app.css

102 lines
2.9 KiB
CSS

@import "tailwindcss";
@theme {
/* === Background-Layers === */
--color-bg-base: #f5f3ee;
--color-bg-soft: #ffffff;
--color-bg-elev: #fafaf7;
--color-bg-tint: #f0eee9;
/* === Ink-Hierarchie === */
--color-ink-1: oklch(0.22 0.015 270);
--color-ink-2: oklch(0.42 0.012 270);
--color-ink-3: oklch(0.58 0.01 270);
--color-ink-4: oklch(0.72 0.008 270);
/* === Lines / Borders === */
--color-line: oklch(0.92 0.006 85);
--color-line-strong: oklch(0.85 0.008 85);
/* === Brand / Primary === */
--color-primary: oklch(0.50 0.18 255);
--color-primary-soft: oklch(0.95 0.04 255);
--color-primary-ink: oklch(0.42 0.22 255);
--color-primary-hover: oklch(0.45 0.20 255);
/* === Subject-Color-Tokens === */
--color-rose-soft: oklch(0.95 0.04 25);
--color-rose-ink: oklch(0.50 0.16 25);
--color-violet-soft: oklch(0.95 0.04 295);
--color-violet-ink: oklch(0.50 0.16 295);
--color-green-soft: oklch(0.95 0.04 155);
--color-green-ink: oklch(0.50 0.14 155);
--color-amber-soft: oklch(0.95 0.05 75);
--color-amber-ink: oklch(0.55 0.14 75);
/* === Feedback === */
--color-success: oklch(0.55 0.16 155);
--color-warning: oklch(0.65 0.16 75);
--color-danger: oklch(0.55 0.20 25);
/* === Legacy-Tokens (Auth-Pages) === */
--color-text-primary: oklch(0.22 0.015 270);
--color-text-secondary: oklch(0.42 0.012 270);
--color-text-muted: oklch(0.58 0.01 270);
--color-border-subtle: oklch(0.92 0.006 85);
--color-surface: #ffffff;
--color-accent: oklch(0.42 0.22 255);
--color-accent-hover: oklch(0.36 0.24 255);
--color-accent-muted: oklch(0.96 0.04 255);
/* === Fonts === */
--font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
--font-mono: 'JetBrains Mono', monospace;
/* === Radii === */
--radius-sm: 6px;
--radius-md: 10px;
--radius-lg: 14px;
--radius-xl: 18px;
/* === Shadows === */
--shadow-sm: 0 1px 2px rgba(20, 20, 30, 0.04);
--shadow-md: 0 4px 12px rgba(20, 20, 30, 0.06);
/* === Layout-Spacing === */
--spacing-sb: 240px;
--spacing-tb: 56px;
}
@font-face {
font-family: 'Plus Jakarta Sans';
src: url('/fonts/PlusJakartaSans-VariableFont_wght.woff2') format('woff2');
font-weight: 100 900;
font-style: normal;
font-display: block;
}
@font-face {
font-family: 'JetBrains Mono';
src: url('/fonts/JetBrainsMono-Regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: block;
}
body {
background-color: var(--color-bg-base);
color: var(--color-ink-1);
font-family: var(--font-display);
font-feature-settings: 'cv11','ss01';
}
.font-mono, .mono {
font-family: var(--font-mono);
font-feature-settings: 'tnum','zero';
}
[x-cloak] { display: none !important; }