:root{
  /* base palette — exact values from the brand board */
  --bb-lime:#C6FF00;
  --bb-coral:#FF5A3C;
  --bb-blue:#3366FF;
  --bb-off-white:#F2F2F2;
  --bb-charcoal:#1A1A1A;
  --bb-black:#000000;
  --bb-white:#FFFFFF;

  /* neutrals derived from charcoal/off-white for UI chrome */
  --bb-grey-900:#0D0D0D;
  --bb-grey-800:#141414;
  --bb-grey-700:#242424;
  --bb-grey-600:#3A3A3A;
  --bb-grey-500:#6B6B6B;
  --bb-grey-400:#9A9A9A;
  --bb-grey-300:#C4C4C4;
  --bb-grey-200:#E0E0E0;

  /* surfaces */
  --surface-base:var(--bb-black);
  --surface-raised:var(--bb-charcoal);
  --surface-sunken:var(--bb-grey-900);
  --surface-inverse:var(--bb-off-white);
  --surface-blue:var(--bb-blue);
  --surface-coral:var(--bb-coral);
  --surface-lime:var(--bb-lime);
  --surface-card:var(--bb-charcoal);
  --surface-overlay:rgba(0,0,0,.72);

  /* text */
  --text-primary:var(--bb-off-white);
  --text-secondary:var(--bb-grey-400);
  --text-muted:var(--bb-grey-500);
  --text-on-light:var(--bb-charcoal);
  --text-on-lime:var(--bb-black);
  --text-on-blue:var(--bb-white);
  --text-on-coral:var(--bb-black);
  --text-accent:var(--bb-lime);
  --text-link:var(--bb-lime);
  --text-link-hover:var(--bb-white);

  /* borders */
  --border-hairline:rgba(242,242,242,.16);
  --border-strong:var(--bb-off-white);
  --border-on-light:rgba(26,26,26,.14);
  --border-focus:var(--bb-lime);

  /* emphasis / marker highlights */
  --highlight-lime:var(--bb-lime);
  --highlight-coral:var(--bb-coral);
  --highlight-blue:var(--bb-blue);
  --underline-marker:var(--bb-lime);

  /* semantic status — built from the brand palette, no new hues */
  --status-positive:var(--bb-lime);
  --status-critical:var(--bb-coral);
  --status-info:var(--bb-blue);
}
