/**
 * BYOViral Signal Design System
 * Production release 2026-10-15
 */
:root{
  --font-display:'Bricolage Grotesque',system-ui,sans-serif;
  --font-ui:'IBM Plex Sans',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;

  --bg:#F6F5F1;          /* page */
  --surface:#FFFFFF;     /* cards, tables */
  --surface-2:#EFEEE8;   /* headers, hover, ad placeholders */
  --line:#E2E0D8;        /* borders, decorative only */
  --ink:#15161C;         /* 18.5:1 on --surface */
  --ink-2:#3D404C;       /* 10.3:1 on --surface */
  --muted:#5E6270;       /* 6.1:1 on --surface, 5.6:1 on --bg */
  --accent:#3730A3;      /* 9.9:1 on --surface; white text on it 9.9:1 */
  --accent-soft:#ECEBFB;
  --link:#2F28A0;
  --live:#0D7A3E;  --live-bg:#E3F4EA;    /* 4.7:1 */
  --warn:#9A5A00;  --warn-bg:#FDF0D9;    /* 4.9:1 */
  --danger:#B42318;--danger-bg:#FDECEA;  /* 5.7:1 */
  --chip:#EFEEE8;

  --r-chip:6px; --r-control:10px; --r-card:16px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px; --space-14:56px; --space-18:72px;

  /* Aliases for legacy bvx and design system tokens */
  --byo-bg: var(--bg);
  --byo-surface: var(--surface);
  --byo-surface-2: var(--surface-2);
  --byo-border: var(--line);
  --byo-text: var(--ink);
  --byo-text-muted: var(--muted);
  --byo-primary: var(--accent);
  --byo-primary-soft: var(--accent-soft);
  --byo-success: var(--live);
  --byo-success-soft: var(--live-bg);
  --byo-warning: var(--warn);
  --byo-warning-soft: var(--warn-bg);
  --byo-danger: var(--danger);
  --byo-danger-soft: var(--danger-bg);
}
html.dark{
  --bg:#0E0F14; --surface:#171920; --surface-2:#20232C; --line:#2C303B;
  --ink:#F1F1F4;   /* 15.5:1 on --surface */
  --ink-2:#C9CBD3;
  --muted:#9A9EAB; /* 6.6:1 */
  --accent:#A5A1FF;/* 7.6:1 */
  --accent-soft:#26244A; --link:#B9B6FF;
  --live:#4ADE80;  --live-bg:#123222;    /* 10.1:1 on --surface */
  --warn:#F5B94A;  --warn-bg:#33270F;
  --danger:#FF8A80;--danger-bg:#3A1714;
  --chip:#262935;

  /* Aliases for legacy bvx tokens in dark mode */
  --byo-bg: var(--bg);
  --byo-surface: var(--surface);
  --byo-surface-2: var(--surface-2);
  --byo-border: var(--line);
  --byo-text: var(--ink);
  --byo-text-muted: var(--muted);
  --byo-primary: var(--accent);
  --byo-primary-soft: var(--accent-soft);
  --byo-success: var(--live);
  --byo-success-soft: var(--live-bg);
  --byo-warning: var(--warn);
  --byo-warning-soft: var(--warn-bg);
  --byo-danger: var(--danger);
  --byo-danger-soft: var(--danger-bg);
}
@media (prefers-color-scheme:dark){html:not(.light){color-scheme:dark}}

body{background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--font-ui)}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-.01em}
a{color:var(--link)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* The full-text rule */
.byo-full{overflow-wrap:anywhere;word-break:normal;white-space:normal}
.byo-ip{font-family:var(--font-mono);word-break:break-all}

/* AdSense responsive slot component CSS (Audit §3.4) */
.byo-ad{margin-block:2rem;width:100%}
.byo-ad__label{margin:0 0 .5rem;font:500 .6875rem/1.4 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:center}
.byo-ad__surface{display:grid;place-items:center;background:var(--surface-2);border-radius:12px;overflow:hidden}
.byo-ad--rail{position:sticky;top:88px;width:300px}
@media (max-width:1023px){.byo-ad--rail{display:none}}