/*
 * The press kit's interface tokens (10 Nov 2026): one set of colours, radii,
 * focus rings and timings for every page of the EPK tool that sits in the
 * site's chrome -- the tool page and the pages around it (epk_tool.css), the
 * editor and the link page designer that shares it (epk_editor.css), the
 * one-sheet maker (epk_sheet.css) and My press kits.
 *
 * Linked before each of those stylesheets. A kit itself does not use these:
 * its colours are the band's (epk.css, --epk-*).
 *
 * The numbers behind the choices:
 * - text on the site's black (#0a0a0a) and on a card (#111) is at least
 *   4.5:1: --eu-faint is the dimmest words may go (#8c8c8c, 5.4:1 on #111);
 *   the #777 and #6f6f6f this replaces were under 4.5:1;
 * - a filled button is --eu-accent-fill, not the brand's #ff0000: white on
 *   #ff0000 is 4.0:1, on #e10600 it is 5.0:1. Rules, icons and borders keep
 *   the brand red;
 * - red written as text is --eu-accent-text (6:1 on a card).
 */

:root {
    --eu-bg: #0a0a0a;
    --eu-surface: #111;
    --eu-surface-2: #171717;
    --eu-surface-3: #1f1f1f;
    --eu-well: #060606;
    --eu-line: #262626;
    --eu-line-2: #383838;

    --eu-text: #d4d4d4;
    --eu-strong: #fff;
    --eu-muted: #a8a8a8;
    --eu-faint: #8c8c8c;

    --eu-accent: #ff0000;
    --eu-accent-fill: #e10600;
    --eu-accent-fill-hover: #c20500;
    --eu-accent-text: #ff5c5c;
    --eu-accent-wash: rgba(255, 0, 0, .09);
    --eu-accent-ring: rgba(255, 60, 60, .32);

    --eu-ok: #1db954;
    --eu-ok-text: #7fe0a7;
    --eu-ok-wash: rgba(29, 185, 84, .1);
    --eu-warn: #f2c14e;
    --eu-warn-wash: rgba(242, 193, 78, .09);
    --eu-danger: #ff7a7a;
    --eu-info-wash: rgba(96, 165, 250, .09);

    --eu-r-s: 6px;
    --eu-r: 10px;
    --eu-r-l: 16px;

    --eu-focus: #fff;
    --eu-shadow: 0 12px 32px rgba(0, 0, 0, .5);
    --eu-shadow-l: 0 30px 70px rgba(0, 0, 0, .6);

    /* A press, a hover; a fold or a slide. Leaving is quicker than arriving. */
    --eu-fast: .12s;
    --eu-med: .2s;
    --eu-ease: cubic-bezier(.2, .7, .2, 1);

    /* A fingertip, and a mouse. */
    --eu-tap: 44px;
    --eu-control: 40px;
}