80 lines
2.5 KiB
CSS
80 lines
2.5 KiB
CSS
@import 'tailwindcss';
|
|
|
|
/* Tailwind v4 scans these for utility usage (Blade + compiled views). */
|
|
@source '../views';
|
|
@source '../../app/Livewire';
|
|
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
|
|
@source '../../storage/framework/views/*.php';
|
|
|
|
/* ── Clusev design tokens — "Tactical Terminal" (handoff §6) ───────────── */
|
|
@theme {
|
|
/* surfaces */
|
|
--color-void: #06080A;
|
|
--color-base: #0A0D10;
|
|
--color-surface: #0F1318;
|
|
--color-raised: #141A20;
|
|
--color-inset: #0B0E12;
|
|
|
|
/* brand — use opacity utilities for tints (bg-accent/10, border-accent/25) */
|
|
--color-accent: #FF6B2C;
|
|
--color-accent-bright: #FF8A4D;
|
|
--color-accent-deep: #E25617;
|
|
--color-accent-text: #FF9259;
|
|
|
|
/* cyan counter-accent */
|
|
--color-cyan: #43C1D8;
|
|
--color-cyan-bright: #74D7E8;
|
|
|
|
/* status triad */
|
|
--color-online: #35D07F;
|
|
--color-warning: #E8B931;
|
|
--color-offline: #FF5247;
|
|
|
|
/* text ramp → text-ink / text-ink-2 ... */
|
|
--color-ink: #E9EEF3;
|
|
--color-ink-2: #9DAAB6;
|
|
--color-ink-3: #69757F;
|
|
--color-ink-4: #495159;
|
|
|
|
/* hairline borders → border-line ... */
|
|
--color-line: rgba(255, 255, 255, 0.10);
|
|
--color-line-soft: rgba(255, 255, 255, 0.055);
|
|
--color-line-strong: rgba(255, 255, 255, 0.17);
|
|
|
|
/* fonts — TODO(§12): self-host the .woff2; falls back until then */
|
|
--font-display: 'Chakra Petch', ui-sans-serif, system-ui, sans-serif;
|
|
--font-sans: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
|
|
--font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', monospace;
|
|
|
|
/* radii → rounded-* */
|
|
--radius-xs: 3px;
|
|
--radius-sm: 6px;
|
|
--radius-md: 8px;
|
|
--radius-lg: 10px;
|
|
}
|
|
|
|
/* ── base layer ───────────────────────────────────────────────────────── */
|
|
@layer base {
|
|
/* Alpine: keep x-cloak elements hidden until Alpine inits (prevents drawer/backdrop flash). */
|
|
[x-cloak] {
|
|
display: none !important;
|
|
}
|
|
|
|
html {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--color-base);
|
|
color: var(--color-ink);
|
|
font-family: var(--font-sans);
|
|
-webkit-font-smoothing: antialiased;
|
|
text-rendering: optimizeLegibility;
|
|
}
|
|
|
|
/* numbers/IPs/paths render mono */
|
|
.tabular {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
}
|