/* css/embed-tokens.css — the dark design-system palette, for standalone embed pages.
 *
 * WHY THIS FILE EXISTS
 * css/third-country.css consumes tokens (--bg-card, --border, --text-primary, …) that are
 * declared in css/main.css's :root block. index.html loads both stylesheets, so on the site
 * they always resolve. A standalone embed page CANNOT load main.css — its `.section {
 * display: none }` tab-panel rule would hide the embed's own <section id="third-country">
 * wrapper entirely (verified: display:none, scrollHeight 0). So the embed loaded only
 * third-country.css and every one of these tokens resolved to nothing.
 *
 * Light mode hid the bug: #third-country.tcd-theme-light re-declares the whole palette
 * locally, so only DARK mode was affected — invisible control/search/dossier borders, a
 * transparent tooltip and dossier, and unreadable country labels.
 *
 * These values are copied verbatim from css/main.css:3. `scripts/run-tests.cjs` (§35) parses
 * both files and fails if they drift, so update main.css and re-run the suite — do not edit
 * one side alone.
 *
 * Load this BEFORE third-country.css so the light-theme block can still override it.
 */
:root {
    --bg-primary: #1A1819;
    --bg-secondary: #222021;
    --bg-card: #2a2728;
    --bg-card-hover: #333031;
    --bg-accent: #3a3738;
    --text-primary: #F6F3EA;
    --text-secondary: #d9d6cd;
    --text-tertiary: #a09d94;
    --text-caption: #7a776e;
    --accent: #4460D8;
    --accent-hover: #6680f0;
    --border: #3a3738;
    --border-strong: #4a4748;
    --danger: #D9EF56;
    --danger-bg: #2a2b1a;
    --warning: #D9EF56;
    --success: #568B55;
    --rule: #F6F3EA;
    --rule-light: #3a3738;
    --text-muted: #7a776e;
    --bg-tertiary: #2a2728;
    --shadow: rgba(0,0,0,0.4);
    --shadow-strong: rgba(0,0,0,0.6);
}
