/* Hairline design tokens — the whole visual system in one block.
 *
 * Every other stylesheet composes these. Change a token here and the change
 * propagates to any page that adopts the system, which is the point: this file
 * is meant to carry the redesign of the rest of the site, not just the landing.
 *
 * Two things are deliberate rather than incidental:
 *
 *   - The neutrals are not grey. Every ink and ground carries a slight teal
 *     bias pulled from the brand colour, so the palette reads as chosen.
 *
 *   - --leading-display is 1.2 and must never go lower. Stacked Vietnamese
 *     diacritics (the ẫ in "cổ phần", the ợ in "Đẳng Cấp") reach ~0.92em above
 *     the baseline; a Latin-only 1.05 clips them.
 *
 * There are no shadow or elevation tokens. Both exist to make boxes float, and
 * this system has almost no boxes — structure comes from rules and space.
 */
:root {
    /* ink */
    --hl-ink:        #0d1f24;
    --hl-ink-2:      #3e595e;
    --hl-ink-3:      #6e878b;
    --hl-ink-invert: #f7fafa;

    /* ground */
    --hl-paper:      #fbfcfc;
    --hl-paper-2:    #f1f5f5;
    --hl-paper-3:    #e7eded;

    /* rules — the primary structural device */
    --hl-line:       #dce5e5;
    --hl-line-2:     #bfcfd0;
    --hl-line-3:     #0d1f24;

    /* accent — gold appears at most once per screen */
    --hl-accent:     #14535f;
    --hl-accent-2:   #0d3d47;
    --hl-gold:       #96650f;
    --hl-gold-wash:  #f7efdd;

    /* provenance */
    --hl-confirmed:  #126044;
    --hl-ai:         #96650f;
    --hl-translated: #45409a;
    --hl-absent:     #6e878b;

    /* type */
    --hl-font-display: ui-serif, Georgia, "Times New Roman", serif;
    --hl-font-text:    ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --hl-font-mono:    ui-monospace, SFMono-Regular, Menlo, monospace;

    --hl-size-2xs: 11.5px;
    --hl-size-xs:  12.5px;
    --hl-size-sm:  14px;
    --hl-size-md:  15.5px;
    --hl-size-lg:  18px;
    --hl-size-xl:  23px;
    --hl-size-2xl: 31px;
    --hl-size-3xl: 44px;

    --hl-leading-display: 1.2;   /* Vietnamese floor — never lower */
    --hl-leading-snug:    1.42;
    --hl-leading-text:    1.62;

    --hl-tracking-label: .1em;
    --hl-tracking-tight: -.015em;

    --hl-weight-text:  400;
    --hl-weight-med:   550;
    --hl-weight-bold:  700;
    --hl-weight-heavy: 800;

    /* space — 4px base */
    --hl-space-1: 4px;
    --hl-space-2: 8px;
    --hl-space-3: 12px;
    --hl-space-4: 16px;
    --hl-space-5: 24px;
    --hl-space-6: 32px;
    --hl-space-7: 48px;
    --hl-space-8: 72px;
    --hl-space-9: 112px;

    /* form — radius is nearly absent; rounded corners are a card signal */
    --hl-radius-0:    0;
    --hl-radius-1:    4px;
    --hl-radius-pill: 100px;
    --hl-rule:        1px solid var(--hl-line);
    --hl-rule-strong: 1px solid var(--hl-line-2);

    /* motion */
    --hl-dur-fast: 120ms;
    --hl-dur:      200ms;
    --hl-ease:     cubic-bezier(.2, .7, .3, 1);
}