@font-face {
  font-family: "DOT Plex Sans";
  src: url("./fonts/plex-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "DOT Plex Sans";
  src: url("./fonts/plex-bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
:root {
  --dot-red: #ff0000;
  --dot-black: #000000;
  --dot-white: #ffffff;
  --dot-bg: #f8f8f7;
  --dot-surface: #ffffff;
  --dot-text: #151618;
  --dot-text-muted: #6d7177;
  --dot-border: #e3e4e4;
  --dot-control-border: #85898d;
  --dot-accent-tint: #fff1f1;
  --dot-accent-hover: #ff2626;
  --dot-radius-control: 11px;
  --dot-radius-card: 17px;
  --dot-radius-shell: 28px;
  --dot-motion-fast: 180ms;
  --dot-motion-logo: 500ms;
  --dot-font-ui: "DOT Plex Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-family: var(--dot-font-ui);
}
[data-dot-theme="dark"] {
  --dot-bg: #17181a;
  --dot-surface: #222427;
  --dot-text: #f6f6f5;
  --dot-text-muted: #a9adb3;
  --dot-border: #383b3e;
  --dot-control-border: #777d82;
  --dot-accent-tint: #3a2526;
}
@media (prefers-reduced-motion: reduce) {
  :root { --dot-motion-fast: 0ms; --dot-motion-logo: 0ms; }
}