/* Kin OS — workspace brand tokens.
 *
 * THIS IS THE ONLY FILE IN KIN OS THAT CONTAINS A BRAND COLOUR VALUE.
 *
 * Every hex below is quoted from `tc-brand-identity`, the group brand authority. Nothing is
 * sampled by eye, matched from a screenshot, or invented. Where a brand does not publish a
 * value for something an operational interface needs — a hairline, a hover ground, a soft
 * accent wash — the token is DERIVED from that brand's own verified colours with color-mix(),
 * never borrowed from a sibling brand and never made up.
 *
 * THE P7.1 MODEL: the application surface is the shared Kin OS pearl (tokens.css) in every
 * workspace. The brand personalises that surface through five channels, and only these:
 *
 *   ink         its own dark, as the structural colour — headings, body, borders-by-mix
 *   accent      its accent, spent deliberately: active states, key actions, small details
 *   highlight   its documented ground+ink pairing, used as a highlighter on display text
 *   rail        the one intentional dark surface — the brand spine down the left edge
 *   deep        the entry-page gradient and the globe's ocean — the brand's dark environment
 *
 * ACCENT DISCIPLINE (P7.1 §3): an accent is never used as text on a light surface unless it
 * clears WCAG AA there. Each workspace therefore declares BOTH the raw accent and an
 * `--brand-accent-ink` that is safe as text on pearl. HelloKindred is the reason this
 * distinction exists — Fresh Lime on a light ground is unreadable, so on light surfaces
 * HelloKindred is represented by its Basalt identity, and the lime appears only against dark
 * grounds, in its documented highlighter role, and on its own action colour. A test computes
 * the ratios rather than trusting this comment.
 *
 * The four palettes are closed. A CapacityCo screen never sees Fresh Lime; a TalentCorp screen
 * never sees Magenta. Because every component reads --brand-*, and --brand-* is only ever set
 * inside one [data-workspace] block, mixing brands is not something a component *could* do by
 * accident — there is no mechanism for it.
 */

/* =========================================================================================
   Shared LITERAL defaults — declared BEFORE the brand blocks, so a brand block can override
   them (equal specificity: the later rule wins). They are also set directly on every branded
   element, which matters because a wordmark carries its own data-workspace: without these, a
   mark rendered inside another brand's page would INHERIT that page's treatment — lowercase
   from a HelloKindred root turned TalentSmith into "talentsmith" until this block existed.
   Derived tokens (color-mix over var()) are order-independent and live at the END of the file.
   ========================================================================================= */

[data-workspace] {
    --brand-wordmark-font: var(--brand-font);
    --brand-wordmark-style-a: normal;
    --brand-wordmark-transform: none;
    --brand-wordmark-tracking: 0;

    /* Optical balance between marks of very different proportions (P7.4 §6). A multiplier on
       the wordmark's height, never on one axis, so artwork is never distorted. 1 is the
       reference; a brand whose mark is squatter than the others needs more height to carry
       the same visual weight beside them. */
    --brand-wordmark-optical: 1;

    /* The display face — hero greeting and other set-piece type. Defaults to the interface
       face; HelloKindred overrides it with its licensed Gilroy Display web kit (P7.3). */
    --brand-font-display: var(--brand-font);

    /* The selector's identifying bar. Defaults to the raw accent — Jakes's explicit P7.2
       direction, matching the reference (lime for HelloKindred included, as an intentional
       decorative identity mark, never as text). CapacityCo overrides it with a ramp gradient. */
    --brand-bar: var(--brand-accent);
}

/* =========================================================================================
   Neutral / group ground — the workspace selector.
   Anchored by the TalentCorp Group identity, which P7 §8 permits, on the shared pearl.
   ========================================================================================= */

[data-workspace="group"] {
    --brand-ink: #1d2d44;              /* TalentCorp Deep Navy */
    --brand-muted: #3e5c76;            /* TalentCorp Mid Blue */
    --brand-accent: #748aa9;           /* TalentCorp Slate Blue */
    --brand-accent-ink: #3e5c76;
    --brand-hi-bg: #ede8d5;            /* Warm Sand */
    --brand-hi-ink: #1d2d44;

    --brand-action: #1d2d44;
    --brand-action-ink: #ffffff;
    --brand-action-hover: #3e5c76;

    --brand-rail: #1d2d44;
    --brand-rail-ink: #ffffff;
    --brand-rail-accent: #748aa9;

    --brand-deep-from: #1d2d44;
    --brand-deep-to: #3e5c76;
    --brand-deep-bloom: #748aa9;
    --brand-deep-ink: #ffffff;

    --globe-ocean-hi: #3e5c76;
    --globe-ocean-lo: #1d2d44;
    --globe-land: #ede8d5;
    --globe-office: #ede8d5;

    --brand-font: Poppins, "Century Gothic", Verdana, system-ui, sans-serif;
    --brand-font-accent: var(--brand-font);
    --brand-wordmark-weight-a: 700;
    --brand-wordmark-weight-b: 300;
}

/* =========================================================================================
   TalentCorp — group and shared services. Internal use only.
   Source: 230425_TalentCorp_Brand guidelines.pdf. A THREE-step blue ramp plus Warm Sand —
   four colours total; the brand has no bright accent, and its absence is the point: none is
   introduced. Slate Blue is the accent for surfaces and details (~3.5:1 on white — clears AA
   for large text and UI strokes, fails 4.5:1 for body); Mid Blue (7.0:1) is the
   accent-as-text. The highlight pairing is the brand's own: Deep Navy on Warm Sand.
   ========================================================================================= */

[data-workspace="talentcorp"] {
    --brand-ink: #1d2d44;              /* Deep Navy */
    --brand-muted: #3e5c76;            /* Mid Blue */
    --brand-accent: #748aa9;           /* Slate Blue — the only accent this brand has */
    --brand-accent-ink: #3e5c76;       /* Mid Blue, the ramp's text-safe step on pearl */
    --brand-hi-bg: #ede8d5;            /* Warm Sand */
    --brand-hi-ink: #1d2d44;

    --brand-action: #1d2d44;
    --brand-action-ink: #ffffff;
    --brand-action-hover: #3e5c76;

    --brand-rail: #1d2d44;
    --brand-rail-ink: #ffffff;
    --brand-rail-accent: #748aa9;

    --brand-deep-from: #1d2d44;
    --brand-deep-to: #3e5c76;
    --brand-deep-bloom: #748aa9;       /* the guideline's signature radial bloom */
    --brand-deep-ink: #ffffff;

    --globe-ocean-hi: #3e5c76;
    --globe-ocean-lo: #1d2d44;
    --globe-land: #ede8d5;             /* Warm Sand continents on Deep Navy ocean */
    --globe-office: #ede8d5;

    /* Poppins IS packaged (P7.3): the four guideline weights ship as @font-face under SIL
       OFL (fonts.css + wwwroot/fonts/poppins/, OFL.txt alongside). The Bold/Light contrast
       is the wordmark itself, so this is what makes the mark render truthfully on machines
       without Poppins installed. The brand's own stated fallback follows. */
    --brand-font: Poppins, "Century Gothic", Verdana, system-ui, sans-serif;
    --brand-font-accent: var(--brand-font);
    --brand-wordmark-weight-a: 700;    /* Talent — Poppins Bold */
    --brand-wordmark-weight-b: 300;    /* Corp   — Poppins Light */
    --brand-wordmark-tracking: -0.005em; /* derived by eye against the placed artwork; the
                                            guideline documents no tracking */

    /* The placed artwork is ~4.3:1 where the other marks run 7:1 and wider, so at a shared
       height it reads noticeably smaller beside them. Scaled up to match their presence on
       the selector; the aspect ratio is untouched (P7.4 §6). Nudged one step further on
       review (P7.5) — 1.34 was still fractionally light against the other three. */
    --brand-wordmark-optical: 1.42;
}

/* =========================================================================================
   HelloKindred — client and candidate facing.
   Source: HelloKindred_CI_Guideline_2024_1.5.pdf §1.6, §1.8. Basalt Blue + Fresh Lime is the
   signature pairing. THE LIME RULE (P7.1 §3): lime is never text or fine detail on a light
   surface. On pearl, HelloKindred is its Basalt identity; the lime appears as the documented
   headline highlighter (Basalt text on lime), on dark grounds, and as the action colour
   (Basalt on lime — the brand's own button pairing, 13.4:1).
   ========================================================================================= */

[data-workspace="hellokindred"] {
    --brand-ink: #09262d;              /* Basalt Blue */
    --brand-muted: #3b5257;            /* Basalt 80% */
    --brand-accent: #cbff02;           /* Fresh Lime — dark grounds and highlight duty only */
    --brand-accent-ink: #3b5257;       /* the brand on light surfaces is its Basalt identity */
    --brand-hi-bg: #cbff02;            /* the guideline's highlighter strip on headline text */
    --brand-hi-ink: #09262d;

    --brand-action: #cbff02;
    --brand-action-ink: #09262d;
    --brand-action-hover: #d6ff36;     /* Lime 80% */

    --brand-rail: #09262d;
    --brand-rail-ink: #ffffff;
    --brand-rail-accent: #cbff02;

    --brand-deep-from: #09262d;
    --brand-deep-to: #3b5257;
    --brand-deep-bloom: #6b7d82;       /* Basalt 60% */
    --brand-deep-ink: #ffffff;

    --globe-ocean-hi: #3b5257;
    --globe-ocean-lo: #09262d;
    --globe-land: #9ea8ab;             /* Basalt 40% */
    --globe-office: #cbff02;           /* lime markers on a Basalt ocean — its natural home */

    /* The brand's two documented type systems, mapped to what each licence allows (P7.3).
       "Gilroy Display" is the group's PURCHASED Monotype web kit (fonts.css) — its EULA
       covers websites but excludes Editing (text typed into fields), so it serves DISPLAY
       chrome only: the hero greeting and wordmark contexts. Everything interactive stays on
       Aptos, the brand's own documented electronic face (an installed desktop Gilroy still
       wins where present). The stack's tail follows the pack's documented stack — Segoe UI,
       then Arial — Arial here is a generic last resort, not CapacityCo's voice. Georgia
       Bold Italic is the documented accent, used only alongside a heading. */
    --brand-font: Gilroy, Aptos, "Segoe UI", Arial, sans-serif;
    --brand-font-display: "Gilroy Display", Gilroy, Aptos, "Segoe UI", Arial, sans-serif;
    --brand-font-accent: Georgia, "Times New Roman", serif;
    --brand-hi-slant: italic;         /* Georgia Bold Italic — the documented emphasis cut */
    --brand-wordmark-weight-a: 300;    /* hello   — "a light weight" (Identity §4.1) */
    --brand-wordmark-weight-b: 800;    /* kindred — Extra Bold */
    --brand-wordmark-tracking: -0.02em; /* derived by eye; no tracking is documented anywhere */
    --brand-wordmark-transform: lowercase;
}

/* =========================================================================================
   CapacityCo — client facing, a peer of HelloKindred and not a sub-brand of it.
   Source: CapacityCo Brand Guideline 2026 V1.0, [verified] values. Magenta is the habitual
   accent and clears AA on pearl, so it serves as both accent and accent-ink. The highlight
   pairing is verified on the template: solid Navy on Signal Yellow.
   ========================================================================================= */

[data-workspace="capacityco"] {
    --brand-ink: #012B54;              /* Capacity Navy */
    /* Warm Grey is the brand's annotation colour but is too light for secondary text on
       pearl. Deepened toward Capacity Navy rather than toward black, so it stays warm. */
    --brand-muted: color-mix(in srgb, #96968C 50%, #012B54);
    --brand-accent: #BA0D68;           /* Capacity Magenta — the habitual accent */
    --brand-accent-ink: #BA0D68;       /* 5.7:1 on pearl — usable as text directly */
    --brand-hi-bg: #FECD04;            /* Signal Yellow ground */
    --brand-hi-ink: #012B54;           /* → solid Navy, the verified pairing */

    --brand-action: #BA0D68;
    --brand-action-ink: #ffffff;
    /* NOT Plum: the guideline restricts the mid-ramp (Plum included) to chart series and the
       gradient, and a button hover is a general use. Derived from the brand's own verified
       ends of the ramp instead — Magenta deepened toward Navy (P7.3 audit). */
    --brand-action-hover: color-mix(in srgb, #BA0D68 78%, #012B54);

    --brand-rail: #012B54;
    --brand-rail-ink: #ffffff;
    --brand-rail-accent: #FECD04;      /* titles reverse out of Navy in Yellow on the template */

    --brand-deep-from: #012B54;
    --brand-deep-to: #3F215B;          /* Deep Violet */
    --brand-deep-bloom: #BA0D68;
    --brand-deep-ink: #ffffff;

    --globe-ocean-hi: #3F215B;
    --globe-ocean-lo: #012B54;
    --globe-land: #E6E6DC;             /* Sand continents */
    --globe-office: #FECD04;

    /* The selector bar reads as the brand's red — a short run of the ramp itself, coral red
       into magenta, echoing the mark's gradient. Both values are verified ramp colours. */
    --brand-bar: linear-gradient(180deg, #D14D47, #BA0D68);

    /* Arial, two weights, everywhere. The guideline forbids substituting Calibri, Aptos or
       Poppins — the last two belong to other group brands. */
    --brand-font: Arial, Helvetica, sans-serif;
    --brand-font-accent: var(--brand-font);

    /* The FALLBACK typeset wordmark. The real artwork ships (P7.3): exact wordmark PNGs,
       generated from the vector master by fill substitution, live at
       wwwroot/brand/capacityco/wordmark(.png|-light.png) and always win. This construction
       renders only if those files disappear — lowercase `capacity co` in a rounded geometric
       face, per the P7.2-approved interim. A true SVG still needs a designer to convert
       Logo/capacityco-logo-vector.pdf (KO-020, narrowed). */
    --brand-wordmark-font: "Century Gothic", "Trebuchet MS", Verdana, sans-serif;
    --brand-wordmark-weight-a: 700;
    --brand-wordmark-weight-b: 700;
    --brand-wordmark-transform: lowercase;
    --brand-wordmark-tracking: 0.01em;
}

/* =========================================================================================
   TalentSmith — dormant. Present for reference and legacy work.
   Source: 230424_Guideline_TalentSmith.pdf §02. Sunset Coral is the accent but sits near 3:1
   on pearl, so Slate Grey is the accent-as-text. The highlight pairing is an approved §02
   combination: Midnight Blue on a Sunset Coral ground.
   ========================================================================================= */

[data-workspace="talentsmith"] {
    --brand-ink: #141629;              /* Midnight Blue */
    --brand-muted: #2e4659;            /* Slate Grey */
    --brand-accent: #f45747;           /* Sunset Coral */
    --brand-accent-ink: #2e4659;       /* Slate Grey — coral is kept for grounds and details */
    --brand-hi-bg: #f45747;            /* Sunset Coral ground */
    --brand-hi-ink: #141629;           /* → Midnight Blue, an approved combination */

    --brand-action: #f45747;
    --brand-action-ink: #141629;
    /* The guideline's only stated extension mechanism is 70%/40% tints of the palette
       (§05), so the hover is the 70% Sunset Coral tint — not Burnt Sienna, whose hex is
       sampled-from-artwork and whose set is for charts and section accents (P7.3 audit). */
    --brand-action-hover: color-mix(in srgb, #f45747 70%, #ffffff);

    --brand-rail: #141629;
    --brand-rail-ink: #e7dfd8;         /* Sandstone reversed out of Midnight */
    --brand-rail-accent: #f45747;

    --brand-deep-from: #141629;
    --brand-deep-to: #2e4659;
    --brand-deep-bloom: #f45747;
    --brand-deep-ink: #e7dfd8;

    --globe-ocean-hi: #2e4659;
    --globe-ocean-lo: #141629;
    --globe-land: #e7dfd8;             /* Sandstone continents */
    --globe-office: #f45747;

    /* System 2 — general use. IvyPresto is a commercial licence and is not packaged, so the
       guideline's stated general-use pairing is used instead. Georgia is permitted only with
       a Tahoma headline, which is exactly how it is used here. */
    --brand-font: Tahoma, Verdana, sans-serif;
    --brand-font-accent: Georgia, "Times New Roman", serif;
    --brand-hi-slant: italic;         /* Georgia Bold Italic, only ever beside a Tahoma headline */

    /* The FALLBACK typeset wordmark. The real artwork ships (P7.3): the brand's own TWO-TONE
       RGB masters — coral `Talent` + midnight `Smith` for light grounds, coral + sandstone
       for dark — live at wwwroot/brand/talentsmith/wordmark(.png|-light.png) and always win.
       This single-colour Georgia construction (same italic+upright shape as the IvyPresto
       original) renders only if those files disappear. Vector remains .ai-only (KO-020). */
    --brand-wordmark-font: Georgia, "Times New Roman", serif;
    --brand-wordmark-style-a: italic;
    --brand-wordmark-weight-a: 700;
    --brand-wordmark-weight-b: 700;
}

/* =========================================================================================
   Shared and derived tokens.
   Applied to every workspace including the neutral ground. The surfaces are the platform's
   papers; every mixed value blends a workspace's own colours, so nothing here can leak a
   colour across brands.
   ========================================================================================= */

[data-workspace] {
    /* The common ground. One Kin OS in all four workspaces, and since the final close-out
       §19 the page and the work surfaces are NO LONGER THE SAME COLOUR.

       They were both --paper-0. White cards on a white ground, separated by a hairline and a
       1px shadow — which is a real separation and, as Jakes put it after using the product,
       not enough of one: the eye had to find a 13%-ink hairline to know where a card began.
       So the page steps back to the softest grey on the scale and the cards stay white.

       WHY THE SOFTEST STEP. --paper-1 is #f7f8fa: about a 2% step off white, enough to read
       as a ground behind a white card and not enough to read as a colour. Kin OS does not
       become dark and no brand styling changes — this is one token, and every brand still
       personalises through ink, accent, highlighter and rail (KD-089/090).

       --brand-soft is the same grey, deliberately. A card foot and a panel are recessed
       strips INSIDE a bounded white card, so sharing the page's grey makes them read as cut
       into the card rather than as a third surface competing with it.

       The entry screens keep the cooler --paper-2 directly and are untouched. */
    --brand-canvas: var(--paper-1);
    --brand-surface: var(--paper-0);
    --brand-sunken: var(--paper-3);
    --brand-soft: var(--paper-1);

    /* THE CHROME: the Home hero, the module tiles and the entry pages. It is the RAIL's dark,
       not a deeper one (P7.5, second pass). The hero and the rail meet along a full-height
       edge, and any difference between them reads as a seam rather than as depth — Jakes
       marked the rail, the hero and the tiles as one colour, with only the top bar separated.
       So this is the rail exactly, and the whole left-and-top structure is one surface.

       Everything below derives from it, which is why the change is one line. */
    --brand-chrome: var(--brand-rail);
    --brand-chrome-ink: var(--brand-rail-ink);
    --brand-chrome-muted: color-mix(in srgb, var(--brand-rail-ink) 55%, var(--brand-chrome));
    --brand-chrome-line: color-mix(in srgb, var(--brand-rail-ink) 12%, var(--brand-chrome));
    --brand-chrome-hover: color-mix(in srgb, var(--brand-rail-ink) 10%, var(--brand-chrome));

    /* Structure by mix of the workspace's own ink over the shared papers. */
    --brand-line: color-mix(in srgb, var(--brand-ink) 13%, var(--paper-0));
    --brand-line-strong: color-mix(in srgb, var(--brand-ink) 26%, var(--paper-0));

    /* THE HIERARCHY, AS COLOUR ROLES (P40-107/108, Jakes 13 Oct 2026: "Colour should communicate
       STRUCTURE, not decorate the page"). Each role is one token so a surface cannot invent its
       own shade of it, and each is the workspace's own ink, so no brand's colour leaks.

       --brand-head: the band a section title sits on. A title bar that was white on a white card
       separated from its contents by a hairline alone; a tinted band makes the title own what is
       under it. Light enough that the title keeps the ink's full contrast (BrandContrastTests).

       --brand-band / --brand-band-ink: the column-header band of a table. The ink itself, with
       the surface as its text, so the header anchors the rows it belongs to instead of reading as
       a slightly different grey from the card around it.

       --brand-signal: what marks "this one" - the active record tab, the row in force. It was the
       accent ink, which in three of the four workspaces is the same colour as a label and so
       signalled nothing. */
    --brand-head: color-mix(in srgb, var(--brand-ink) 6%, var(--paper-0));
    --brand-band: var(--brand-ink);
    --brand-band-ink: var(--brand-surface);
    --brand-signal: var(--brand-ink);

    /* THE EDGE OF A CONTROL, which is a different job from the edge of a table (§8.2.19).
       A rule between rows only has to be findable while somebody reads down a column, and 26%
       ink is plenty for that. The boundary of an empty checkbox is the only thing saying the
       control is there at all, and WCAG 1.4.11 asks for 3:1 against its own surface.
       --brand-line-strong measured 1.72:1 on white, which is why Jakes reported the Registered
       Address checkbox as invisible when unchecked: not a bug in the markup, a token doing a job
       it was never sized for.

       60% lands just over 3:1 in all four workspaces and near where the browsers put their own
       default checkbox border, so an empty control looks like an empty control rather than like
       a Kin OS flourish. BrandContrastTests holds it to the ratio. */
    --brand-control-line: color-mix(in srgb, var(--brand-ink) 60%, var(--paper-0));
    --brand-hover: color-mix(in srgb, var(--brand-ink) 5%, var(--paper-0));
    --brand-selected: color-mix(in srgb, var(--brand-accent) 15%, var(--paper-0));
    --brand-wash: color-mix(in srgb, var(--brand-accent) 10%, var(--paper-0));
    --brand-focus: color-mix(in srgb, var(--brand-accent-ink) 70%, var(--brand-ink));

    /* The top bar sits two shades under the rail (P7.5): related enough to read as one frame,
       separated enough that the header is its own band rather than the rail's ceiling. The
       Home hero stays deeper still, so the three read rail -> header -> hero -> white. */
    --brand-topbar: color-mix(in srgb, var(--brand-rail) 82%, black);
    --brand-topbar-line: color-mix(in srgb, var(--brand-rail-ink) 14%, var(--brand-topbar));
    --brand-topbar-hover: color-mix(in srgb, var(--brand-rail-ink) 11%, var(--brand-topbar));

    /* Rail derivations. Secondary rail text was too dim against the brand dark to read
       comfortably, so it is brighter than the 62% it started at (P7.5). */
    --brand-rail-muted: color-mix(in srgb, var(--brand-rail-ink) 78%, var(--brand-rail));
    --brand-rail-hover: color-mix(in srgb, var(--brand-rail-ink) 9%, var(--brand-rail));
    --brand-rail-active: color-mix(in srgb, var(--brand-rail-ink) 15%, var(--brand-rail));
    --brand-rail-line: color-mix(in srgb, var(--brand-rail-ink) 14%, var(--brand-rail));

    /* Deep-environment derivations (entry page, doors reveal). */
    --brand-deep-ink-muted: color-mix(in srgb, var(--brand-deep-ink) 72%, var(--brand-deep-from));

    /* Globe derivations — graticule, land line, marker halo. The P7.1 atmosphere halo is
       gone (P7.2 §26): dimensionality comes from the sphere itself. */
    --globe-grat: color-mix(in srgb, var(--globe-land) 14%, transparent);
    --globe-land-line: color-mix(in srgb, var(--globe-land) 55%, transparent);
    --globe-rim: color-mix(in srgb, var(--globe-land) 32%, transparent);
    --globe-office-halo: color-mix(in srgb, var(--globe-office) 45%, transparent);

    /* The supporting tier: a city where a client trades and the group has no office
       (DEC-GLOBE-001, Q-P3-50, Bugs 3265274437). It had no colour of its own and borrowed the
       halo's, which is a ONE-PIXEL RING colour around a dot that is already glowing - correct in
       that job and far too faint as a solid 2px disc with no glow at all. Measured on the hosted
       data: Boston reads 191 against New York's 231 FOUR PIXELS AWAY, inside that office's halo
       ring, so the supporting marker was there and could not be told from the office beside it.
       80% rather than 45%: it has to register on a dark ocean AND on top of an office's glow,
       and it stays visibly softer than the office's solid fill. */
    --globe-client: color-mix(in srgb, var(--globe-office) 80%, transparent);
}