/* ==========================================================================
 * skin.css — the SITE SKIN SEAM. v1.0 (2026-07-22)
 * ==========================================================================
 * Joe's ruling 2026-07-22: the global skin colors are THEME OPTIONS, not
 * hardcodes. This file is the switchboard: it re-points the CAE token layer
 * (vocab.css §9.0 neutral defaults) at the five brand tokens the theme
 * already emits from Appearance → citAEOtion Options via
 * fcs_inline_brand_tokens() (:root{--brand-*}, wp_head priority 99).
 *
 * Resolution chain per color: Admin form → wp-config FCS_* constant →
 * site-config default → (if brand token somehow absent) the vocab fallback
 * baked into each var() below.
 *
 * MAPPING (same five toggles the legal sites re-brand on):
 *   --brand-primary → --teal    (lead accent: kicks, borders, glows, buttons)
 *   --brand-accent  → --orange  (secondary pop: highlights, markup boxes)
 *   --brand-dark    → --navy    (deep panel / dark canvas family)
 *   --brand-text    → --ink     (body ink)
 *   --brand-bg      → --bg      (page canvas — for body/landing rules)
 *
 *   IML:        primary #7c3aed (violet) · accent #14c7e6 (teal) · bg #62c1ea
 *   citAEOtion: primary #00b0d0 (teal)   · accent #fa903e (orange) · bg #081320
 *
 * Loads AFTER vocab.css (enqueue dep) — same (0,1,0) specificity, later
 * source wins, so these derivations override §9.0's literals without
 * touching the canonical vocabulary file. Dress STRUCTURE (gradient pill vs
 * solid pulse button, etc.) stays per-site/per-page; this file moves COLOR
 * only. Bright variants (--tealb/--orangeb) keep vocab defaults until a
 * site overrides them here.
 *
 * A page's own scoped token block (declared in content, printed after this
 * sheet) still wins by source order — staged pages carrying a foreign skin
 * (e.g. citAEOtion pages on this IML sandbox) render their own brand. That
 * is by design: site skin from options, page skin only where a page says so.
 * ========================================================================== */

.cae {
	--navy:   var(--brand-dark,    #081320);
	--ink:    var(--brand-text,    #0c1c2e);
	--teal:   var(--brand-primary, #0098b5);
	--orange: var(--brand-accent,  #fa903e);
	--bg:     var(--brand-bg,      #ffffff);
}