/* ============================================================
   TA Desk — shared design tokens
   One palette for every TA job on this site. Derived from the
   Rock Your Baby stress scale: calm (indigo) -> panic (amber-red).

   Every page loads this file FIRST, then its own stylesheet.
   The per-job stylesheets define no colours of their own; they
   alias these tokens, so re-theming the whole site is one edit here.
   ============================================================ */

:root{
  --ground:#F3F4FA;
  --surface:#FFFFFF;
  --surface-2:#EAECF6;
  --surface-3:#DFE2F0;
  --ink:#14172A;
  --ink-mid:#3C4157;
  --ink-soft:#5D6379;
  --ink-faint:#868CA3;
  --rule:#DADEEC;
  --rule-strong:#BFC5DD;
  --calm:#3A4BB8;
  --calm-bright:#4E60D6;
  --calm-soft:#E5E8FA;
  --panic:#B93F21;
  --panic-soft:#FAE7E1;
  --warn:#8F6209;
  --warn-soft:#F9F0D9;
  --good:#1F7A54;
  --good-soft:#E0F2E9;
  --shadow-sm:0 1px 2px rgba(20,23,42,.06);
  --shadow:0 2px 4px rgba(20,23,42,.05),0 12px 28px -14px rgba(20,23,42,.18);
  --shadow-lg:0 4px 8px rgba(20,23,42,.07),0 24px 48px -20px rgba(20,23,42,.30);
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"IBM Plex Serif",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,"Cascadia Mono","Consolas",monospace;
  --calm-glow:rgba(58,75,184,.10);
  --on-calm:#FFFFFF;
  --on-panic:#FFFFFF;
  --on-good:#FFFFFF;
  --radius:10px;
  --rail:250px;
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#0E1020;
    --surface:#171A2B;
    --surface-2:#1F2335;
    --surface-3:#2A2F45;
    --ink:#E8EAF4;
    --ink-mid:#BEC3D8;
    --ink-soft:#939AB5;
    --ink-faint:#6E7591;
    --rule:#292E44;
    --rule-strong:#3A4060;
    --calm:#8E9BF2;
    --calm-bright:#A3AEFF;
    --calm-soft:#212743;
    --panic:#EC8B6E;
    --panic-soft:#33221C;
    --warn:#DCA83F;
    --warn-soft:#2D2616;
    --good:#5FCB9B;
    --good-soft:#152B22;
    --shadow-sm:0 1px 2px rgba(0,0,0,.35);
    --shadow:0 2px 4px rgba(0,0,0,.3),0 12px 28px -14px rgba(0,0,0,.7);
    --shadow-lg:0 4px 8px rgba(0,0,0,.4),0 24px 48px -20px rgba(0,0,0,.8);
    --calm-glow:rgba(142,155,242,.16);
    --on-calm:#0E1020;
    --on-panic:#0E1020;
    --on-good:#0E1020;
  }
}
:root[data-theme="dark"]{
  --ground:#0E1020;
  --surface:#171A2B;
  --surface-2:#1F2335;
  --surface-3:#2A2F45;
  --ink:#E8EAF4;
  --ink-mid:#BEC3D8;
  --ink-soft:#939AB5;
  --ink-faint:#6E7591;
  --rule:#292E44;
  --rule-strong:#3A4060;
  --calm:#8E9BF2;
  --calm-bright:#A3AEFF;
  --calm-soft:#212743;
  --panic:#EC8B6E;
  --panic-soft:#33221C;
  --warn:#DCA83F;
  --warn-soft:#2D2616;
  --good:#5FCB9B;
  --good-soft:#152B22;
  --shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --shadow:0 2px 4px rgba(0,0,0,.3),0 12px 28px -14px rgba(0,0,0,.7);
  --shadow-lg:0 4px 8px rgba(0,0,0,.4),0 24px 48px -20px rgba(0,0,0,.8);
  --calm-glow:rgba(142,155,242,.16);
  --on-calm:#0E1020;
  --on-panic:#0E1020;
  --on-good:#0E1020;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--calm)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
[tabindex]:focus-visible,summary:focus-visible{
  outline:2px solid var(--calm-bright);outline-offset:2px;border-radius:3px;
}

