/* ═══════════════════════════════════════════════════════════════════════ palettes.css — 6 network palettes × { dark | light } Activation: Default key: red-editorial · Default theme: dark Token contract: --bg, --bg-card, --bg-card-2, --bg-elev, --accent, --accent-2, --accent-soft, --accent-ring, --text, --text-muted, --text-faint, --heading, --border, --border-strong, --up, --down, --header-bg ═══════════════════════════════════════════════════════════════════════ */ /* ───── 1 · red-editorial · #E51F26 · Stripe-doc utility (default · AU pilot) */ body[data-palette="red-editorial"][data-theme="dark"], body[data-palette="red-editorial"]:not([data-theme="light"]) { --bg: #0E1014; --bg-card: #15181E; --bg-card-2: #1B1F26; --bg-elev: #1F2530; --accent: #E51F26; --accent-2: #A51016; --accent-soft: rgba(229,31,38,.10); --accent-ring: rgba(229,31,38,.32); --text: #D8E0EA; --text-muted: #7A8AA0; --text-faint: #4F5A6E; --heading: #FFFFFF; --border: #1F2530; --border-strong: #2C3340; --up: #16C784; --down: #F04438; --header-bg: rgba(14,16,20,.85); } body[data-palette="red-editorial"][data-theme="light"] { --bg: #FFFFFF; --bg-card: #F8F9FB; --bg-card-2: #EFF1F4; --bg-elev: #FFFFFF; --accent: #E51F26; --accent-2: #A51016; --accent-soft: rgba(229,31,38,.08); --accent-ring: rgba(229,31,38,.25); --text: #2E3540; --text-muted: #6A7785; --text-faint: #A1AAB8; --heading: #0E1014; --border: #E1E5EB; --border-strong: #C8CFD9; --up: #038A4C; --down: #C0322B; --header-bg: rgba(255,255,255,.85); } /* ───── 2 · cobalt-architect · #1E40AF · architectural B&W base */ body[data-palette="cobalt-architect"][data-theme="dark"] { --bg: #0B0D10; --bg-card: #131619; --bg-card-2: #1A1E22; --bg-elev: #1F2429; --accent: #2A6FDB; --accent-2: #1E40AF; --accent-soft: rgba(42,111,219,.12); --accent-ring: rgba(42,111,219,.35); --text: #D6DBE0; --text-muted: #7B8590; --text-faint: #4D5560; --heading: #FFFFFF; --border: #1F2429; --border-strong: #2D343C; --up: #15B97A; --down: #E5484D; --header-bg: rgba(11,13,16,.85); } body[data-palette="cobalt-architect"][data-theme="light"] { --bg: #FAFBFC; --bg-card: #FFFFFF; --bg-card-2: #F1F3F6; --bg-elev: #FFFFFF; --accent: #1E40AF; --accent-2: #15327F; --accent-soft: rgba(30,64,175,.08); --accent-ring: rgba(30,64,175,.25); --text: #1E232A; --text-muted: #5A6470; --text-faint: #97A0AB; --heading: #0B0D10; --border: #DDE2E8; --border-strong: #BFC7D1; --up: #0A8049; --down: #B8302E; --header-bg: rgba(250,251,252,.88); } /* ───── 3 · forest-tactical · #14532D · radar-pro deep moody */ body[data-palette="forest-tactical"][data-theme="dark"] { --bg: #0A100D; --bg-card: #111814; --bg-card-2: #161F1A; --bg-elev: #1B2620; --accent: #2EAC68; --accent-2: #14532D; --accent-soft: rgba(46,172,104,.12); --accent-ring: rgba(46,172,104,.32); --text: #CDD7D0; --text-muted: #7A8A80; --text-faint: #4D5A52; --heading: #F1F5F2; --border: #1B2620; --border-strong: #2A372F; --up: #2EAC68; --down: #E05656; --header-bg: rgba(10,16,13,.85); } body[data-palette="forest-tactical"][data-theme="light"] { --bg: #F4F7F4; --bg-card: #FFFFFF; --bg-card-2: #E9EFEA; --bg-elev: #FFFFFF; --accent: #14532D; --accent-2: #0E3D20; --accent-soft: rgba(20,83,45,.08); --accent-ring: rgba(20,83,45,.22); --text: #1F2A23; --text-muted: #5C6A60; --text-faint: #97A39B; --heading: #0A1B11; --border: #D7DFD9; --border-strong: #B7C2BB; --up: #14532D; --down: #B0312E; --header-bg: rgba(244,247,244,.88); } /* ───── 4 · cyan-magazine · #06B6D4 · carnival-warm bright */ body[data-palette="cyan-magazine"][data-theme="dark"] { --bg: #0A1316; --bg-card: #122027; --bg-card-2: #182A33; --bg-elev: #1E343F; --accent: #22D3EE; --accent-2: #06B6D4; --accent-soft: rgba(34,211,238,.12); --accent-ring: rgba(34,211,238,.32); --text: #D1DEE5; --text-muted: #7A8E9B; --text-faint: #4F5F6C; --heading: #FFFFFF; --border: #1E3540; --border-strong: #2C4452; --up: #14E08A; --down: #FF6B6B; --header-bg: rgba(10,19,22,.85); } body[data-palette="cyan-magazine"][data-theme="light"] { --bg: #FFFFFF; --bg-card: #F0FBFE; --bg-card-2: #E0F4F9; --bg-elev: #FFFFFF; --accent: #0891B2; --accent-2: #036A86; --accent-soft: rgba(8,145,178,.10); --accent-ring: rgba(8,145,178,.28); --text: #1B3038; --text-muted: #547280; --text-faint: #92A8B4; --heading: #062028; --border: #C9E5EE; --border-strong: #A2CDDA; --up: #058561; --down: #BF3030; --header-bg: rgba(255,255,255,.88); } /* ───── 5 · mango-soft · #FF8A4C · soft-modern dashboard */ body[data-palette="mango-soft"][data-theme="dark"] { --bg: #14110E; --bg-card: #1D1813; --bg-card-2: #251E18; --bg-elev: #2D251D; --accent: #FF8A4C; --accent-2: #E1681F; --accent-soft: rgba(255,138,76,.12); --accent-ring: rgba(255,138,76,.32); --text: #E1D7CB; --text-muted: #9C8E7E; --text-faint: #685D52; --heading: #FFF7EE; --border: #2A2218; --border-strong: #3C3024; --up: #4FCB7E; --down: #E5605C; --header-bg: rgba(20,17,14,.85); } body[data-palette="mango-soft"][data-theme="light"] { --bg: #FFF9F2; --bg-card: #FFFFFF; --bg-card-2: #FFEFE0; --bg-elev: #FFFFFF; --accent: #E1681F; --accent-2: #B14F12; --accent-soft: rgba(225,104,31,.10); --accent-ring: rgba(225,104,31,.28); --text: #2D2418; --text-muted: #786A55; --text-faint: #B5A38B; --heading: #1C1408; --border: #F0E0CB; --border-strong: #D8C2A6; --up: #2E8C58; --down: #B53A35; --header-bg: rgba(255,249,242,.88); } /* ───── 6 · indigo-brutal · #4338CA · brutalist heavy borders */ body[data-palette="indigo-brutal"][data-theme="dark"] { --bg: #0C0D14; --bg-card: #15161F; --bg-card-2: #1B1D28; --bg-elev: #20232F; --accent: #6366F1; --accent-2: #4338CA; --accent-soft: rgba(99,102,241,.12); --accent-ring: rgba(99,102,241,.32); --text: #D5D7E2; --text-muted: #7C81A0; --text-faint: #4F5470; --heading: #FFFFFF; --border: #232639; --border-strong: #353A54; --up: #25D195; --down: #F26464; --header-bg: rgba(12,13,20,.85); } body[data-palette="indigo-brutal"][data-theme="light"] { --bg: #FCFCFE; --bg-card: #FFFFFF; --bg-card-2: #F1F1F8; --bg-elev: #FFFFFF; --accent: #4338CA; --accent-2: #2E2599; --accent-soft: rgba(67,56,202,.08); --accent-ring: rgba(67,56,202,.25); --text: #1F2030; --text-muted: #5C6080; --text-faint: #95A0BB; --heading: #0C0D14; --border: #232639; /* brutal: dark borders even in light mode */ --border-strong: #0C0D14; --up: #15833D; --down: #B5302E; --header-bg: rgba(252,252,254,.92); } /* ───── Palette-specific signature touches ───── */ /* cobalt-architect: monospaced eyebrow accent + flatter shadows */ body[data-palette="cobalt-architect"] .eyebrow { color: var(--accent); text-transform: uppercase; letter-spacing: .12em; } /* forest-tactical: grid lines on cards (radar feel) */ body[data-palette="forest-tactical"] .card, body[data-palette="forest-tactical"] .feature-card { background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 24px 24px, 24px 24px; background-position: -1px -1px; } /* cyan-magazine: warmer round-corner accents */ body[data-palette="cyan-magazine"] .btn, body[data-palette="cyan-magazine"] .header-cta { border-radius: 999px; } body[data-palette="cyan-magazine"] .feature-card { border-radius: 18px; } /* mango-soft: slightly larger radii + softer shadows */ body[data-palette="mango-soft"] .feature-card, body[data-palette="mango-soft"] .card { border-radius: 16px; } /* indigo-brutal: brutalist heavy borders, square corners, hard shadow */ body[data-palette="indigo-brutal"] .feature-card, body[data-palette="indigo-brutal"] .card, body[data-palette="indigo-brutal"] .hero-search, body[data-palette="indigo-brutal"] .compliance-plate, body[data-palette="indigo-brutal"] .btn { border-radius: 4px; border-width: 2px; border-color: var(--border-strong); } body[data-palette="indigo-brutal"] .feature-card, body[data-palette="indigo-brutal"] .card { box-shadow: 4px 4px 0 0 var(--border-strong); } body[data-palette="indigo-brutal"] .feature-card:hover, body[data-palette="indigo-brutal"] .card:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 0 var(--accent); }