/* GENERATED by bvc-controls sync.sh, edit in ~/Desktop/Code/bvc-controls */
/* bvc-controls · tokens
   Structural layer is shared by every app and never overridden.
   Palette layer ships defaults; each app overrides it in its own theme.css
   loaded AFTER this file and BEFORE controls.css. */
:root {
  /* ── structure: row ─────────────────────────────────────── */
  /* The label column carries the longest names both apps ship ("Size Random",
     "Loop seconds"), so it takes the wider share and the value column gives
     back the 4px it does not need for a six-character readout. */
  --cs-row-cols: minmax(0, 1.3fr) minmax(80px, 1.4fr) 52px minmax(20px, auto);
  --cs-row-gap: 8px;
  --cs-row-h: 22px;
  --cs-row-my: 5px;

  /* ── structure: card ────────────────────────────────────── */
  /* Every setting in an open group is a card. The compact row grammar above
     survives for the rows inside a track card and a list. */
  --cs-card-pad: 10px 12px;
  --cs-card-gap: 8px;
  --cs-card-r: 8px;
  --cs-card-bg: rgba(255, 255, 255, 0.035);
  --cs-card-line: rgba(255, 255, 255, 0.06);

  /* ── structure: shell ───────────────────────────────────── */
  --cs-shell-inset: 12px;
  /* An app whose own chrome sits across the top (EMITR's header pill) lowers
     the column's top edge with this; the rail block still centres in what is
     left and the panel still follows it. */
  --cs-shell-top: var(--cs-shell-inset);
  --cs-shell-gap: 8px;
  --cs-panel-w: 320px;
  --cs-panel-pad: 14px 16px;
  --cs-panel-r: 16px;
  --cs-blur: blur(16px) saturate(180%);
  --cs-glass: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0)), var(--cs-bg-panel);
  --cs-glass-hi: inset 0 1px 0 rgba(255, 255, 255, 0.06);

  /* ── structure: rail ────────────────────────────────────── */
  --cs-rail-btn: 44px;
  --cs-rail-gap: 8px;
  --cs-rail-r: 10px;
  --cs-rail-glyph: 24px;

  /* ── structure: type ───────────────────────────────────── */
  --cs-font-ui: "DM Sans", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --cs-font-head: "Figtree", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --cs-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --cs-fs-row: 12px;
  --cs-fs-value: 10px;
  --cs-fs-head: 10px;
  --cs-fs-section: 10px;

  /* ── structure: radii, motion ───────────────────────────── */
  --cs-r-sm: 4px;
  --cs-r-pill: 999px;
  --cs-dur: 120ms;
  --cs-ease: cubic-bezier(0.4, 0, 0.2, 1);

  /* ── palette defaults (override per app) ────────────────── */
  --cs-bg-panel: rgba(10, 15, 20, 0.74);
  --cs-bg-field: #141a1c;
  --cs-bg-menu: #141a1c; /* pull-down menus float over other settings, so this one is opaque */
  --cs-bg-hover: rgba(255, 255, 255, 0.08);
  --cs-text: rgba(255, 255, 255, 0.92);
  --cs-text-strong: rgba(255, 255, 255, 0.96);
  --cs-muted: rgba(255, 255, 255, 0.64);
  --cs-muted-2: rgba(255, 255, 255, 0.44);
  --cs-line: rgba(255, 255, 255, 0.10);
  --cs-line-hi: rgba(255, 255, 255, 0.18);
  --cs-accent: #0ea5e9;
  --cs-accent-rgb: 14, 165, 233;
  --cs-danger: #f87171;
  --cs-danger-rgb: 248, 113, 113;
  --cs-shadow-panel: 0 12px 40px rgba(0, 0, 0, 0.5);
}

@media (max-width: 900px) {
  :root { --cs-rail-btn: 36px; }
}