/* ============================================================ Theme: Mono · Minimal Grays + Accent Notion / Stripe Atlas vibe. Pure neutrals, single saturated accent (lime green), tight typography, mono-styled data, sharp radii. Activate with `data-template="mono"` on or . ============================================================ */ [data-template="mono"] { /* Tipografía — más densa, mono para datos */ --font-display: "Inter", system-ui, -apple-system, sans-serif; --font-sans: "Inter", system-ui, -apple-system, sans-serif; --tracking-display: -0.025em; --text-md: 13px; --text-base: 13.5px; /* Acento vivo en un sea de grises */ --brand: #84CC16; /* lime-500 */ --brand-2: #65A30D; --brand-3: #A3E635; --brand-fg: #1A1A1A; /* contraste sobre lime */ --brand-soft: color-mix(in oklch, var(--brand) 16%, transparent); /* Estados — desaturados */ --leaf: #84CC16; /* mismo que brand */ --warn: #EAB308; --danger: #DC2626; --info: #6B7280; /* gray-500 — neutral info */ /* Radios sharp — minimal */ --radius-xs: 2px; --radius-sm: 3px; --radius-md: 4px; --radius-lg: 6px; --radius-xl: 8px; --radius-2xl: 12px; /* Sombras casi inexistentes */ --shadow-xs: 0 0 0 1px rgba(0,0,0,0.04); --shadow-sm: 0 1px 2px rgba(0,0,0,0.04); --shadow-md: 0 2px 8px rgba(0,0,0,0.06); --shadow-lg: 0 8px 24px rgba(0,0,0,0.08); --page-pad: 24px; --topbar-h: 48px; /* Strengthen topbar separator: --line is too low contrast in Mono. */ --topbar-border: var(--line-2); } /* Mono · light */ [data-template="mono"][data-theme="erplora-light"] { --bg: #FFFFFF; --bg-1: #FAFAFA; /* gray-50 */ --bg-2: #FFFFFF; --bg-3: #F5F5F5; /* gray-100 */ --bg-4: #E5E5E5; /* gray-200 */ --line: #E5E5E5; --line-2: #D4D4D4; --line-3: #A3A3A3; --ink: #171717; /* gray-900 */ --ink-2: #404040; --ink-3: #737373; --ink-4: #A3A3A3; color-scheme: light; } /* Mono · dark */ [data-template="mono"][data-theme="erplora"] { --bg: #0A0A0A; /* gray-950 */ --bg-1: #171717; /* gray-900 */ --bg-2: #1F1F1F; --bg-3: #262626; /* gray-800 */ --bg-4: #404040; /* gray-700 */ --line: rgba(229, 229, 229, 0.06); --line-2: rgba(229, 229, 229, 0.12); --line-3: rgba(229, 229, 229, 0.22); --ink: #FAFAFA; --ink-2: #D4D4D4; --ink-3: #A3A3A3; --ink-4: #525252; color-scheme: dark; }