:root{
  --are-yellow:#ffc400;
  --are-yellow-soft:#fff4bf;
  --are-ink:#172033;
  --are-muted:#657086;
  --are-line:#dfe3ea;
  --are-bg:#f5f7fa;
  --are-white:#fff;
  --are-green:#168a5b;
  --are-amber:#a86000;
  --are-red:#bf2f3c;
  --are-blue:#2f6fc2;
  --are-focus:#111827;
  --are-radius:12px;
  --are-shadow:0 6px 24px rgba(23,32,51,.08);
  --are-font:Inter,"Segoe UI",Arial,sans-serif;
  --are-page-max:1500px;
  --are-control-h:44px;
}

/* ARE Design System v0.4 — extended semantic tokens */
:root{
  --are-header-bg:#ffffff;
  --are-soft:#f8fafc;
  --are-soft-blue:#eef5ff;
  --are-soft-green:#ecf8f1;
  --are-soft-amber:#fff7e5;
  --are-soft-red:#fff0f1;
  --are-sync:#246fe5;
  --are-purple:#7b5bd6;
  --are-space-1:4px;
  --are-space-2:8px;
  --are-space-3:12px;
  --are-space-4:16px;
  --are-space-5:20px;
  --are-space-6:24px;
  --are-space-8:32px;
  --are-radius-sm:8px;
  --are-radius-md:12px;
  --are-radius-lg:16px;
}