/*
 * OxChief design tokens — the web sibling of ox_tokens.dart (Flutter app).
 *
 * One token sheet, one design language across phone and web
 * (docs/web_ultra_review_2026-06-10.md §5). Values are canonical — change
 * them in lockstep with ox_tokens.dart or not at all.
 *
 * Doctrine:
 *   - go means "capable of motion now" only
 *   - brand-green is brand / Start / mower-marker only
 *   - accent is interaction, never health
 *   - semantic colors always ship icon + word
 *   - elevation by surface step (ink-0..ink-3); shadows banned
 */
:root {
    /* ink ladder — elevation by surface step */
    --ink-0: #0D1013;
    --ink-1: #16191D;
    --ink-2: #21262C;
    --ink-3: #2B313A;
    --hairline: rgba(255, 255, 255, .08);

    /* text */
    --text-hi: #FFFFFF;
    --text-mid: #B9C0C8;
    --text-low: #8A929B;

    /* interaction */
    --accent: #1565C0;
    --accent-bright: #58A6FF;

    /* semantics */
    --go: #30D158;
    --warn: #FFB300;
    --stop: #C62828;
    --danger-text: #FF8A80;

    /* brand */
    --brand-green: #2E7D32;

    /* shared map layers — a mission renders identically on phone and web */
    --plan-cyan: #00E5FF;
    --plan-casing: rgba(0, 38, 46, .60);
    --boundary-yellow: #FFEB3B;
    --boundary-casing: rgba(0, 0, 0, .55);
    --nogo: #D32F2F;
    --nogo-fill: rgba(211, 47, 47, .20);
    --active-leg: #FF2D78;
    --coverage: rgba(57, 217, 138, .60);
    --next-wp: #FF8C00;

    /* surfaces + chrome */
    --glass: rgba(13, 16, 19, .86);
    --focus-ring: 0 0 0 2px var(--ink-0), 0 0 0 4px var(--accent-bright);
    --radius-card: 12px;
    --radius-control: 8px;
    --target-min: 24px;
    --shadow: none;
}

/* marketing ONLY — never inside the console */
[data-theme=paper] {
    --bg: #FAFAF7;
    --ink: #14181C;
    --rule: rgba(20, 24, 28, .12);
}