/* Semantic roles. Dark is the default theme — it is the only theme the source
   file defines. The light scope below is DERIVED (see readme.md → Caveats):
   it re-uses source values only, but no light artboard existed to check against. */
:root,
[data-theme='dark']{
  color-scheme:dark;

  --bg-page:var(--grey-000);
  --bg-raised:var(--grey-110);
  --bg-card:var(--grey-000);
  --bg-card-hover:var(--grey-050);
  --bg-inset:var(--grey-1e0);
  --bg-control:var(--grey-240);
  --bg-control-hover:var(--grey-300);
  --bg-field:var(--white-a07);
  --bg-subtle:var(--white-a10);
  --bg-subtle-hover:var(--white-a15);
  --bg-popover:var(--grey-000);
  --bg-scrim:var(--black-a72);
  --bg-solid:var(--grey-fff);
  --bg-solid-hover:var(--grey-ee0);

  --border-subtle:var(--grey-1a0);
  --border-default:var(--grey-210);
  --border-strong:var(--grey-330);
  --border-control:var(--white-a10);
  --border-emphasis:var(--white-a20);

  --text-primary:var(--grey-fff);
  --text-secondary:var(--white-a60);
  --text-tertiary:var(--grey-990);
  --text-muted:var(--white-a40);
  --text-disabled:var(--grey-660);
  --text-inverse:var(--grey-000);
  --text-link:var(--azure-500);

  --accent:var(--azure-500);
  --accent-quiet:var(--azure-a12);
  --accent-ring:var(--azure-a38);

  --positive:var(--green-500);
  --positive-quiet:var(--green-a10);

  --focus-ring:var(--azure-a38);
}

[data-theme='light']{
  color-scheme:light;

  --bg-page:var(--grey-fff);
  --bg-raised:var(--grey-fe0);
  --bg-card:var(--grey-fff);
  --bg-card-hover:var(--grey-fe0);
  --bg-inset:var(--grey-ee0);
  --bg-control:var(--grey-ee0);
  --bg-control-hover:var(--grey-cc0);
  --bg-field:var(--black-a08);
  --bg-subtle:var(--black-a08);
  --bg-subtle-hover:var(--black-a15);
  --bg-popover:var(--grey-fff);
  --bg-scrim:var(--black-a28);
  --bg-solid:var(--grey-000);
  --bg-solid-hover:var(--grey-220);

  --border-subtle:var(--grey-ee0);
  --border-default:var(--grey-cc0);
  --border-strong:var(--grey-a20);
  --border-control:var(--black-a10);
  --border-emphasis:var(--black-a20);

  --text-primary:var(--grey-000);
  --text-secondary:var(--black-a70);
  --text-tertiary:var(--grey-660);
  --text-muted:var(--grey-880);
  --text-disabled:var(--grey-a20);
  --text-inverse:var(--grey-fff);
  --text-link:var(--azure-600);

  --accent:var(--azure-600);
  --accent-quiet:var(--azure-a09);
  --accent-ring:var(--azure-a29);

  --positive:var(--green-600);
  --positive-quiet:var(--green-a10);

  --focus-ring:var(--azure-a29);
}
