/* SellYourDomain design tokens — see SPEC.md §3. Import first on every page. */
@font-face {
  font-family: "Vazirmatn";
  src: url("/assets/fonts/Vazirmatn-var.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --sd-brand: #F26B1D;
  --sd-brand-deep: #B84A0B;
  --sd-brand-2: #FF8A3D;
  --sd-brand-soft: #FFF1E7;
  --sd-on-brand: #FFFFFF;
  --sd-btn: #C74E0A;
  --sd-btn-hover: #A23E05;

  --sd-ink: #14212B;
  --sd-ink-2: #33465A;
  --sd-muted: #566679;
  --sd-line: #E3E8EE;
  --sd-line-strong: #B4BFCB;
  --sd-bg: #FFFFFF;
  --sd-bg-soft: #F6F7F9;
  --sd-card: #FFFFFF;
  --sd-night: #0E1A22;
  --sd-night-2: #15242E;

  --sd-excellent: #12A05C;
  --sd-good: #7BBF2A;
  --sd-fair: #E69A12;
  --sd-weak: #E5484D;
  --sd-info: #3E7BFA;
  --sd-air: #0A7F8B;
  --sd-excellent-t: #0B7A45;
  --sd-weak-t: #C42B31;
  --sd-sb-excellent: #0E7F49;
  --sd-sb-good: #4B7B0C;
  --sd-sb-fair: #8F5C00;
  --sd-sb-weak: #C42B31;

  --sd-radius: 14px;
  --sd-radius-sm: 10px;
  --sd-radius-pill: 999px;
  --sd-shadow: 0 1px 2px rgba(20, 33, 43, .06), 0 8px 24px rgba(20, 33, 43, .06);
  --sd-shadow-lg: 0 2px 4px rgba(20, 33, 43, .06), 0 18px 48px rgba(20, 33, 43, .12);

  --sd-font: "Vazirmatn", system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;
  --sd-mono: ui-monospace, "SFMono-Regular", Consolas, monospace;
  --sd-max: 1200px;
  color-scheme: light;
}

[data-theme="dark"] {
  --sd-brand: #FF7A2E;
  --sd-brand-deep: #FF9A5C;
  --sd-brand-soft: #3A2414;
  --sd-ink: #ECF1F5;
  --sd-ink-2: #C3CFD9;
  --sd-muted: #9AABBB;
  --sd-line: #24343F;
  --sd-bg: #0E1A22;
  --sd-bg-soft: #15242E;
  --sd-card: #15242E;
  --sd-on-brand: #14212B;
  --sd-btn: #FF7A2E;
  --sd-btn-hover: #FF9A5C;
  --sd-line-strong: #3E5363;
  --sd-air: #2CC4D2;
  --sd-excellent-t: #4BDB97;
  --sd-weak-t: #FF8A8E;
  --sd-sb-excellent: #0E7F49;
  --sd-sb-good: #4B7B0C;
  --sd-sb-fair: #8F5C00;
  --sd-sb-weak: #C42B31;
  --sd-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .25);
  --sd-shadow-lg: 0 2px 4px rgba(0, 0, 0, .3), 0 18px 48px rgba(0, 0, 0, .4);
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sd-brand: #FF7A2E;
    --sd-brand-deep: #FF9A5C;
    --sd-brand-soft: #3A2414;
    --sd-ink: #ECF1F5;
    --sd-ink-2: #C3CFD9;
    --sd-muted: #9AABBB;
    --sd-line: #24343F;
    --sd-bg: #0E1A22;
    --sd-bg-soft: #15242E;
    --sd-card: #15242E;
    --sd-on-brand: #14212B;
    --sd-btn: #FF7A2E;
    --sd-btn-hover: #FF9A5C;
    --sd-line-strong: #3E5363;
    --sd-air: #2CC4D2;
    --sd-excellent-t: #4BDB97;
    --sd-weak-t: #FF8A8E;
    --sd-sb-excellent: #0E7F49;
    --sd-sb-good: #4B7B0C;
    --sd-sb-fair: #8F5C00;
    --sd-sb-weak: #C42B31;
    --sd-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .25);
    --sd-shadow-lg: 0 2px 4px rgba(0, 0, 0, .3), 0 18px 48px rgba(0, 0, 0, .4);
    color-scheme: dark;
  }
}