/* LPD V2 — kleuren. ÉÉN KNOP: zet --brand en alles kleurt mee (competitie-thema's onderaan). */ :root{--brand:#ff662b} :root,.theme-ldl,.theme-tdl,.theme-dcm,.theme-hdv,.theme-dtl,.mode-dark{ --c-accent:var(--brand); --c-accent-strong:color-mix(in oklab,var(--brand),black 14%); --c-accent-deep:color-mix(in oklab,var(--brand),black 32%); --c-on-accent:#ffffff; --c-tint:color-mix(in oklab,var(--brand),white 87%); --c-tint-soft:color-mix(in oklab,var(--brand),white 93%); --c-tint-border:color-mix(in oklab,var(--brand),white 72%); --c-glow:color-mix(in oklab,var(--brand),transparent 70%); /* Semantische aliassen — MOETEN hier staan, niet in het :root-blok hieronder. Op :root is --brand nog de standaardkleur, dus daar berekend blijven ze voor elke competitie oranje: een custom property erft zijn berekende waarde. */ --link-color:var(--c-accent-deep);--link-hover:var(--c-accent); --rank-cell-bg:var(--c-tint-soft);--rank-cell-border:var(--c-accent); } :root{ /* Neutrale warme lichtmodus */ --s-page:#faf9f6;--s-card:#ffffff;--s-muted:#f4f1ea;--s-head:#241d1a; --t-strong:#241d1a;--t-body:#3d3733;--t-secondary:#6b615c;--t-muted:#8a7f78;--t-subtle:#b9aea6; --b-1:#eee7db;--b-2:#e5e0d6;--b-hairline:#f3efe7;--row-alt:#faf7f2; --ok:#2e9e44;--err:#d64545; } /* Donkere modus: zet .mode-dark op (of koppel aan prefers-color-scheme) */ .mode-dark{ --s-page:#17130f;--s-card:#1f1a15;--s-muted:#2c251e;--s-head:#0f0c09; --t-strong:#f2ede7;--t-body:#e2dad2;--t-secondary:#c9beb3;--t-muted:#a3988e;--t-subtle:#7d7167; --b-1:#2c251e;--b-2:#332b23;--b-hairline:#262019;--row-alt:#1b1611; --c-accent:color-mix(in oklab,var(--brand),white 10%); --c-on-accent:#17130f; --c-accent-deep:color-mix(in oklab,var(--brand),white 38%); --c-tint:color-mix(in oklab,var(--brand) 24%,#1f1a15); --c-tint-soft:color-mix(in oklab,var(--brand) 13%,#1f1a15); --c-tint-border:color-mix(in oklab,var(--brand) 36%,#1f1a15); --c-glow:color-mix(in oklab,var(--brand),transparent 62%); } /* Competitie-thema's — klasse op of een scope */ .theme-ldl{--brand:#ff662b} .theme-tdl{--brand:#ed0000} .theme-dcm{--brand:#00aef0} .theme-hdv{--brand:#161e2f} .theme-dtl{--brand:#5c06ca}