/* Shared vocabulary. Existing screens keep their styles until wrapped in ds-scope. */
:root{
  --bg-app:var(--bg);
  --bg-panel:#dce9f8;
  --bg-panel-end:#d3e3f5;
  --bg-card:#edf5fe;
  --bg-card-end:#e5effc;
  --bg-info:#fbfdff;
  --bg-info-soft:#f4f8ff;
  --bg-suggestion:#e4eefb;
  --ink:#173259;
  --ink-secondary:#4b6486;
  --ink-placeholder:#536986;
  --color-primary:#1768d7;
  --color-primary-end:#0847ad;
  --color-primary-hover:#1c6edf;
  --color-primary-text:#fff;
  --color-focus:var(--accent);
  --border-soft:#bacde5;
  --border-primary:#80a8dc;
  --border-active:var(--accent);
  --border-width:1px;
  --border-action-width:2px;
  --radius-small:12px;
  --radius-medium:18px;
  --radius-large:24px;
  --radius-pill:999px;
  --depth-color:#8eadd6;
  --shadow-color:rgba(30,66,116,.16);
  --highlight-color:rgba(255,255,255,.82);
  --shadow-panel:0 2px 0 var(--depth-color),0 7px 16px -8px var(--shadow-color),inset 0 1px 0 var(--highlight-color);
  --shadow-card:0 4px 0 -1px var(--depth-color),0 12px 22px -10px var(--shadow-color),inset 0 1px 0 var(--highlight-color);
  --shadow-action:0 3px 0 #07377f,0 9px 16px -5px rgba(10,77,174,.35),inset 0 1px 0 rgba(255,255,255,.4);
  --shadow-control:0 2px 0 -1px var(--depth-color),inset 0 1px 0 var(--highlight-color);
  --shadow-selected:0 0 0 2px color-mix(in srgb,var(--border-active) 16%,transparent),var(--shadow-card);
  --gradient-panel:linear-gradient(145deg,var(--bg-panel),var(--bg-panel-end));
  --gradient-card:linear-gradient(145deg,var(--bg-card),var(--bg-card-end));
  --gradient-action:linear-gradient(130deg,var(--color-primary),var(--color-primary-end));
  --gradient-secondary:linear-gradient(135deg,color-mix(in srgb,var(--accent) 20%,var(--bg-card)),color-mix(in srgb,var(--accent) 30%,var(--bg-card)));
  --gradient-secondary-hover:linear-gradient(135deg,color-mix(in srgb,var(--accent) 30%,var(--bg-card)),color-mix(in srgb,var(--accent) 40%,var(--bg-card)));
  --border-secondary:color-mix(in srgb,var(--accent) 55%,var(--border-primary));
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --control-height:42px;
  --control-height-small:36px;
  --font-page:22px;
  --font-panel:18px;
  --font-card:17px;
  --font-label:12px;
  --font-body:13px;
  --font-small:11px;
  --font-number:24px;
  --weight-heading:800;
  --weight-label:700;
  --line-body:1.65;
  --motion-fast:140ms;
  --color-info:#1768d7;
  --color-info-soft:#e2edfc;
  --color-success:#176b44;
  --color-success-soft:#e4f2e9;
  --color-attention:#8b5b08;
  --color-attention-soft:#faf0d8;
  --color-special:#7041af;
  --color-special-soft:#eee6f8;
  --color-danger:#b12d3e;
  --color-danger-soft:#fbe8ec;
  --color-linkedin:#0a66c2;
  --color-linkedin-soft:#e0edfa;
}
[data-theme="light"]{
  /* The violet theme retains its selected border/focus accent on blue surfaces. */
  --border-primary:#94a4da;
  --depth-color:#a0afd4;
}
[data-theme="dark-blue"],[data-theme="dark-green"]{
  --bg-panel:#192f4c;
  --bg-panel-end:#142841;
  --bg-card:#25415f;
  --bg-card-end:#203954;
  --bg-info:#2d4968;
  --bg-info-soft:#294360;
  --bg-suggestion:#223c58;
  --ink:#f1f6ff;
  --ink-secondary:#c0d0e5;
  --ink-placeholder:#b6c8df;
  --color-primary:#166bdc;
  --color-primary-end:#06489f;
  --border-soft:#536d90;
  --border-primary:#608abd;
  --depth-color:#081c34;
  --shadow-color:rgba(0,7,20,.38);
  --highlight-color:rgba(176,210,248,.15);
  --color-info:#82b8ff;
  --color-info-soft:#233f62;
  --color-success:#8adeab;
  --color-success-soft:#244a3c;
  --color-attention:#f0ce83;
  --color-attention-soft:#4b432e;
  --color-special:#d2afff;
  --color-special-soft:#413654;
  --color-danger:#ffafb9;
  --color-danger-soft:#52313e;
  --color-linkedin:#8ac8ff;
  --color-linkedin-soft:#244362;
}
[data-theme="dark-green"]{
  --bg-panel:#202d48;
  --bg-panel-end:#1b263d;
  --bg-card:#2b3b58;
  --bg-card-end:#263550;
  --bg-info:#334564;
  --bg-info-soft:#2f405c;
  --border-primary:#808abe;
}

/* Functional accents: independent of channel/status tokens and button colors. */
:root{
 --accent-turquoise:#25bd9f;--accent-turquoise-ink:#087567;--accent-turquoise-soft:#e1f9f1;--accent-turquoise-avatar:#087567;
 --accent-amber:#efbb4d;--accent-amber-ink:#795509;--accent-amber-soft:#fff2d5;--accent-amber-avatar:#94621a;
 --accent-orange:#f08b3e;--accent-orange-ink:#a34f13;--accent-orange-soft:#ffecdc;--accent-orange-avatar:#b35211;
 --accent-coral:#ef5b98;--accent-coral-ink:#b52966;--accent-coral-soft:#ffeaf4;--accent-coral-avatar:#b52966;
 --accent-pink:#da76c0;--accent-pink-ink:#923877;--accent-pink-soft:#fbe8f6;--accent-pink-avatar:#923877;
 --accent-violet:#a363e3;--accent-violet-ink:#753dc1;--accent-violet-soft:#f1e7fd;--accent-violet-avatar:#753dc1;
 --accent-blue:#4287dc;--accent-blue-ink:#245fab;--accent-blue-soft:#e5f0ff;--accent-blue-avatar:#245fab;
 --accent-terracotta:#cc8261;--accent-terracotta-ink:#8b4c31;--accent-terracotta-soft:#fcebe2;--accent-terracotta-avatar:#8b4c31;
 --accent-graphite:#6c87a1;--accent-graphite-ink:#405b73;--accent-graphite-soft:#e9f1f8;--accent-graphite-avatar:#405b73;
 --accent-cyan:#28a7cb;--accent-cyan-ink:#156f89;--accent-cyan-soft:#e2f7fc;--accent-cyan-avatar:#156f89;
 --accent-petrol:#4e91a4;--accent-petrol-ink:#326879;--accent-petrol-soft:#e6f3f7;--accent-petrol-avatar:#326879;
 --accent-avatar-text:#fff;
 --accent-stripe-width:6px;
 --bg-content-card:#fbfdff;--bg-content-card-end:#f2f7fe;
 --border-content-card:#b4c9e3;
 --content-depth-color:#a4bbd9;--content-shadow-color:rgba(30,61,106,.25);
 --shadow-content-card:0 5px 0 -2px var(--content-depth-color),0 13px 24px -9px var(--content-shadow-color),inset 0 1px 0 var(--highlight-color);
 --shadow-content-card-hover:0 6px 0 -2px var(--content-depth-color),0 18px 30px -10px var(--content-shadow-color),inset 0 1px 0 var(--highlight-color);
}
[data-theme="dark-blue"],[data-theme="dark-green"]{
 --accent-turquoise:#46c9b0;--accent-turquoise-ink:#a9e2d7;--accent-turquoise-soft:#284a4d;
 --accent-amber:#e6ba59;--accent-amber-ink:#f2d799;--accent-amber-soft:#454338;
 --accent-orange:#ef9c57;--accent-orange-ink:#f5c99f;--accent-orange-soft:#4c4039;
 --accent-coral:#ed78ab;--accent-coral-ink:#f2bfd1;--accent-coral-soft:#4b3a50;
 --accent-pink:#df89c7;--accent-pink-ink:#edc0e2;--accent-pink-soft:#493c56;
 --accent-violet:#b481ed;--accent-violet-ink:#dbcafa;--accent-violet-soft:#403e5e;
 --accent-blue:#7eaeee;--accent-blue-ink:#c0ddff;--accent-blue-soft:#314d6d;
 --accent-terracotta:#d69b7c;--accent-terracotta-ink:#edcbb8;--accent-terracotta-soft:#48413d;
 --accent-graphite:#91abc5;--accent-graphite-ink:#cfdfec;--accent-graphite-soft:#35485c;
 --accent-cyan:#5bc0df;--accent-cyan-ink:#b4e0ee;--accent-cyan-soft:#2a4b5c;
 --accent-petrol:#7cb2c3;--accent-petrol-ink:#c0dce5;--accent-petrol-soft:#314b5a;
 --bg-content-card:#304a68;--bg-content-card-end:#293f5c;
 --border-content-card:#65809f;
 --content-depth-color:#101f36;--content-shadow-color:rgba(0,8,22,.5);
}
[data-theme="dark-green"]{
 --bg-content-card:#344661;--bg-content-card-end:#2b3b55;
 --border-content-card:#7883a9;
}