/* ========================================================================== VERSYR · Campaign-Setting Themes Drop-in [data-preset="..."] overrides. Mirrors the existing light / hc pattern in platform/assets/app.css. Import after app.css. Lock contract (constant in every theme): --ember = #C8923A (wordmark italic, primary accent) --parchment = #F2EDE4 --parchment-body = #C8C0AE --muted = #7A7068 Cormorant / Outfit / DM Mono families 1 / 2 / 3 / 50% radii Themed levers (ONLY these): --ink, --deep, --surface, --panel atmosphere --blood, --border, --border-2, --border-3 heat + texture --img-filter scene/portrait tone --divider-style border-style for hr.div ========================================================================== */ /* ── default ───────────────────────────────────────────────────────────── */ :root, html[data-preset="dark-fantasy"]{ --ink:#0A090C; --deep:#0A090C; --surface:#151217; --panel:#1C1520; --blood:#7A1414; --border:rgba(122,20,20,0.25); --border-2:rgba(122,20,20,0.45); --border-3:rgba(200,146,58,0.20); --border-soft:rgba(122,20,20,0.08); --img-filter:brightness(.85) sepia(.15); --divider-style:solid; } /* ── cheliax / Hell's Vengeance — legacy bundled ──────────────────────── */ html[data-preset="cheliax-dark-fantasy"]{ --ink:#0A0608; --deep:#0A0608; --surface:#150B0F; --panel:#1C1015; --blood:#5C0F0F; --border:rgba(92,15,15,0.28); --border-2:rgba(92,15,15,0.50); --border-3:rgba(200,146,58,0.20); --border-soft:rgba(92,15,15,0.10); --img-filter:brightness(.82) sepia(.20) saturate(1.05); --divider-style:solid; } /* ── heroic high fantasy — bronze ember warmth ────────────────────────── */ html[data-preset="heroic-high-fantasy"]{ --ink:#0C0A07; --deep:#0C0A07; --surface:#171410; --panel:#1E1A14; --blood:#6E4A1A; --border:rgba(110,74,26,0.30); --border-2:rgba(110,74,26,0.50); --border-3:rgba(200,146,58,0.22); --border-soft:rgba(110,74,26,0.10); --img-filter:brightness(.92) sepia(.10); --divider-style:solid; } /* ── low fantasy — earth + parish ink ─────────────────────────────────── */ html[data-preset="low-fantasy"]{ --ink:#0E0C09; --deep:#0E0C09; --surface:#181612; --panel:#1F1B16; --blood:#5A3F1E; --border:rgba(90,63,30,0.28); --border-2:rgba(90,63,30,0.50); --border-3:rgba(200,146,58,0.18); --border-soft:rgba(90,63,30,0.10); --img-filter:brightness(.80) sepia(.18); --divider-style:solid; } /* ── cyberpunk — cool ink, dusk-cyan heat ─────────────────────────────── */ html[data-preset="cyberpunk"]{ --ink:#070A10; --deep:#070A10; --surface:#0E1320; --panel:#121828; --blood:#1F4F7A; --border:rgba(31,79,122,0.32); --border-2:rgba(31,79,122,0.55); --border-3:rgba(200,146,58,0.22); --border-soft:rgba(31,79,122,0.12); --img-filter:brightness(.78) saturate(.7) hue-rotate(-12deg); --divider-style:solid; } /* ── cosmic horror — sea-cathedral verdigris ──────────────────────────── */ html[data-preset="cosmic-horror"]{ --ink:#070A0A; --deep:#070A0A; --surface:#0F1414; --panel:#141A1A; --blood:#3D5A4F; --border:rgba(61,90,79,0.32); --border-2:rgba(61,90,79,0.55); --border-3:rgba(200,146,58,0.18); --border-soft:rgba(61,90,79,0.10); --img-filter:brightness(.70) sepia(.05) contrast(1.15); --divider-style:dotted; } /* ── urban fantasy / occult — bruised violet ──────────────────────────── */ html[data-preset="urban-fantasy-occult"]{ --ink:#0A0810; --deep:#0A0810; --surface:#15111C; --panel:#1B1624; --blood:#42276A; --border:rgba(66,39,106,0.32); --border-2:rgba(66,39,106,0.55); --border-3:rgba(200,146,58,0.20); --border-soft:rgba(66,39,106,0.10); --img-filter:brightness(.85) saturate(.9); --divider-style:solid; } /* ── noir — graphite + dashed dividers ────────────────────────────────── */ html[data-preset="noir-mystery"]{ --ink:#0B0B0C; --deep:#0B0B0C; --surface:#141416; --panel:#1A1A1C; --blood:#5E5E62; --border:rgba(94,94,98,0.34); --border-2:rgba(94,94,98,0.55); --border-3:rgba(200,146,58,0.20); --border-soft:rgba(94,94,98,0.12); --img-filter:grayscale(1) brightness(.85) contrast(1.1); --divider-style:dashed; } /* ── sci-fi space opera — cooled steel ────────────────────────────────── */ html[data-preset="sci-fi-space-opera"]{ --ink:#080A0F; --deep:#080A0F; --surface:#10131C; --panel:#161A26; --blood:#3A4470; --border:rgba(58,68,112,0.32); --border-2:rgba(58,68,112,0.55); --border-3:rgba(200,146,58,0.20); --border-soft:rgba(58,68,112,0.10); --img-filter:brightness(.88) saturate(.85) hue-rotate(8deg); --divider-style:solid; } /* ── post-apocalyptic wasteland — rust + groove dividers ──────────────── */ html[data-preset="post-apocalyptic-wasteland"]{ --ink:#0E0B07; --deep:#0E0B07; --surface:#1A1611; --panel:#221C16; --blood:#6B3A1F; --border:rgba(107,58,31,0.32); --border-2:rgba(107,58,31,0.55); --border-3:rgba(200,146,58,0.22); --border-soft:rgba(107,58,31,0.12); --img-filter:brightness(.85) sepia(.30) saturate(.85); --divider-style:groove; } /* ── contemporary realism — neutral graphite ──────────────────────────── */ html[data-preset="contemporary-realism"]{ --ink:#0F0F10; --deep:#0F0F10; --surface:#191919; --panel:#1F1F20; --blood:#3A3A3C; --border:rgba(58,58,60,0.34); --border-2:rgba(58,58,60,0.55); --border-3:rgba(200,146,58,0.18); --border-soft:rgba(58,58,60,0.12); --img-filter:brightness(.95) saturate(.95); --divider-style:solid; } /* ────────────────────────────────────────────────────────────────────── Hooks for components that consume the levers. These rules apply once globally and pick up whatever the theme block sets. ────────────────────────────────────────────────────────────────────── */ /* Image filter — scene/portrait/header imagery */ .post-card-img, .post-header-img, .gallery-card img, .pub-gallery-card img, .post-gallery-card img, .composer-attach-card img, .post-body img, .post-view img, .chron-body img{ filter: var(--img-filter, brightness(.85) sepia(.15)); } /* Divider style — section rules use the themed border-style */ hr.div{ border-top-style: var(--divider-style, solid); } /* Loot controls + session-room dashed-by-default rule keeps its dashed look even in cyberpunk; only hr.div theme-tracks. */