/* Design tokens — verbatim from design/Margin.dc.html.
   --acc / --acc-soft / --acc-sel are overwritten at runtime from the accent setting. */

body {
  color-scheme: dark;
  --acc: #3ec9b4;
  --acc-soft: rgba(62, 201, 180, 0.15);
  --acc-sel: rgba(62, 201, 180, 0.32);

  --efont:
    -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  --sans:
    -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  --serif: "Newsreader", Georgia, serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;

  --dk1: #2b323c;
  --dk2: #111318;
  --win: #1d1f24;
  --sb: #17191d;
  --rl: #0f1114;
  --ls: #1a1c20;
  --bd: rgba(255, 255, 255, 0.07);
  --tx: #d7dae0;
  --dim: #9096a0;
  --fnt: #63666e;
  --link: #7aa7e8;
  --hv: rgba(255, 255, 255, 0.05);
  --selbg: rgba(255, 255, 255, 0.08);
  --mod: #212429;
  --cd: rgba(255, 255, 255, 0.09);
  --ov: rgba(0, 0, 0, 0.5);
  --inp: rgba(255, 255, 255, 0.06);
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.55);

  --add: #58b088;
  --add-soft: rgba(88, 176, 136, 0.15);
  --del: #e0655f;
  --del-soft: rgba(224, 101, 95, 0.13);

  --ok: #4fb571;
  --danger: #c4453c;
  --danger-soft: #d47a72;
  --swipe-del: #b3564e;
  --swipe-del-trash: #8e3d36;
  --confirm-primary: #3478f6;
  --on-acc: #0e1a14;
  --on-solid: #ffffff;
  --mark: #e6c14d;
  --callout-note: #4a8fd6;
  --callout-tip: #3fa06a;
  --callout-important: #9a6fd0;
  --callout-warning: #d1902c;
  --callout-caution: #d15c5c;
}

body[data-mtheme="light"] {
  color-scheme: light;
  --dk1: #e6e1d6;
  --dk2: #b7c0c8;
  --win: #ffffff;
  --sb: #f1efeb;
  --rl: #e9e5de;
  --ls: #faf9f6;
  --bd: rgba(0, 0, 0, 0.08);
  --tx: #2c2e33;
  --dim: #71747b;
  --fnt: #a8a9a4;
  --link: #3a6fc4;
  --hv: rgba(0, 0, 0, 0.05);
  --selbg: rgba(0, 0, 0, 0.07);
  --mod: #ffffff;
  --cd: rgba(0, 0, 0, 0.06);
  --ov: rgba(0, 0, 0, 0.3);
  --inp: rgba(0, 0, 0, 0.05);
  --shadow: 0 24px 70px rgba(40, 45, 55, 0.35);
  --add-soft: rgba(60, 140, 100, 0.16);
  --del-soft: rgba(200, 70, 64, 0.12);
}

@keyframes mpop {
  from {
    opacity: 0;
    transform: scale(0.97);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes mfade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes mup {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes mspin {
  to {
    transform: rotate(360deg);
  }
}