/* OverWatch — surfaces, radii, shadows, glows (values verbatim from hud.css) */
:root{
  /* radii */
  --r-card:13px;          /* .card */
  --r-panel:14px;         /* .panel, map canvases */
  --r-modal:18px;         /* owModal panel */
  --r-item:11px;          /* hcard, feed items, lanes */
  --r-btn:9px;            /* buttons, inputs, selects */
  --r-chip:20px;          /* pills + chips (fully round) */
  --r-tag:5px;            /* tagx level tags */

  /* the app background — cyan bloom top + magenta bloom low-right + vignette, fixed.
     The second (magenta) bloom is what makes the stage feel ALIVE (2026-07-06 retheme). */
  --bg-hud:
    radial-gradient(1100px 680px at 50% 2%,color-mix(in srgb,var(--accent) 22%,var(--bg)) 0%,transparent 50%),
    radial-gradient(900px 620px at 82% 88%,color-mix(in srgb,var(--magenta) 14%,transparent) 0%,transparent 55%),
    radial-gradient(1700px 1200px at 50% 46%,transparent 42%,rgba(0,0,0,.55) 100%),
    var(--bg);

  /* the card surface — inner accent bloom over a vertical panel gradient */
  --surface-card-full:
    radial-gradient(135% 95% at 50% -12%,color-mix(in srgb,var(--accent) 14%,transparent) 0%,transparent 55%),
    linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);

  /* card shadow stack: top accent hairline + deep bottom inner shade + drop */
  --shadow-card:inset 0 1px 0 color-mix(in srgb,var(--accent) 22%,transparent),
    inset 0 -34px 46px rgba(0,0,0,.40),
    0 14px 32px rgba(0,0,0,.44);
  --shadow-modal:0 34px 100px rgba(0,0,0,.66),
    0 30px 90px -50px color-mix(in srgb,var(--accent) 55%,transparent),
    inset 0 0 0 1px rgba(255,255,255,.025);

  /* LED glows — dot color always echoes as its own glow */
  --glow-green:0 0 9px var(--green);
  --glow-amber:0 0 9px var(--amber);
  --glow-red:0 0 9px var(--red);
  --glow-accent:0 0 8px var(--accent);
  --glow-magenta:0 0 9px var(--magenta);

  /* tinted-fill recipes (color-mix over panel) */
  --fill-item:color-mix(in srgb,var(--accent) 4%,var(--panel));    /* list rows, feed items */
  --fill-btn:color-mix(in srgb,var(--accent) 8%,var(--panel));     /* ghost buttons */
  --fill-btn-on:color-mix(in srgb,var(--accent) 24%,var(--panel)); /* active/primary buttons */
  --fill-msg-you:color-mix(in srgb,var(--accent) 22%,var(--panel));
  --fill-msg-jv:color-mix(in srgb,var(--accent) 5%,var(--panel));

  /* spacing rhythm (the HUD is compact: 13/14px gutters, 7–9px inner gaps) */
  --sp-1:4px; --sp-2:7px; --sp-3:9px; --sp-4:13px; --sp-5:14px; --sp-6:18px; --sp-7:22px;
  --gap-grid:13px;        /* cc-grid gap */
  --pad-card:13px;        /* .card padding */
}
