/* converter.love — design tokens. Prefix: --cv-. Light theme only (v1).
   Contrast (WCAG 2.x, measured on --cv-surface #FFF unless noted):
   text 15.4:1 · text-muted 5.6:1 (5.3:1 on --cv-bg) · accent 6.3:1 · accent-strong 8.1:1
   success 6.0:1 · warning 6.1:1 · error 6.0:1 · white on --cv-cta 15.4:1 · white on cta-hover 12.9:1 */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/Inter-Regular.woff") format("woff"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/Inter-Medium.woff") format("woff"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/Inter-SemiBold.woff") format("woff"); }
/* Metric-matched fallback keeps layout steady while Inter loads (no CLS). */
@font-face { font-family: "Inter Fallback"; src: local("Arial"), local("Helvetica Neue"), local("Roboto"); size-adjust: 107%; ascent-override: 90%; descent-override: 22%; line-gap-override: 0%; }

:root {
  /* Color */
  --cv-bg: #FAF9F7;
  --cv-surface: #FFFFFF;
  --cv-surface-muted: #F2F2EF;
  --cv-surface-sunk: #ECECE8;
  --cv-text: #20252E;
  --cv-text-muted: #5E646F;
  --cv-text-faint: #8A8F98;          /* decorative/placeholder only — never body copy */
  --cv-border: #E2E4E3;
  --cv-border-strong: #C9CCCB;
  --cv-accent: #B4325D;
  --cv-accent-strong: #93244A;
  --cv-accent-soft: #FBEAF0;
  --cv-accent-tint: #F49AB8;          /* on dark only (mark) */
  --cv-cta: #20252E;
  --cv-cta-hover: #343B47;
  --cv-cta-ink: #FFFFFF;
  --cv-success: #187153;
  --cv-success-soft: #E5F3EC;
  --cv-warning: #87560B;
  --cv-warning-soft: #FBF1DE;
  --cv-error: #AF3039;
  --cv-error-soft: #FBE9EA;
  --cv-focus: var(--cv-accent);
  --cv-selection: #F6D4E0;

  /* Type */
  --cv-font: "Inter", "Inter Fallback", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --cv-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace;
  --cv-fs-12: .75rem;
  --cv-fs-13: .8125rem;
  --cv-fs-14: .875rem;
  --cv-fs-16: 1rem;
  --cv-fs-18: 1.125rem;
  --cv-fs-20: 1.25rem;
  --cv-fs-24: 1.5rem;
  --cv-fs-h2: clamp(1.375rem, 1.1rem + 1vw, 1.75rem);
  --cv-fs-h1: clamp(2rem, 1.35rem + 2.6vw, 3.25rem);
  --cv-fs-picker: clamp(1.375rem, 1rem + 1.6vw, 2rem);
  --cv-lh-tight: 1.12;
  --cv-lh: 1.55;
  --cv-tracking-tight: -0.022em;

  /* Space (4/8 grid) */
  --cv-s1: 4px;  --cv-s2: 8px;  --cv-s3: 12px; --cv-s4: 16px;
  --cv-s5: 20px; --cv-s6: 24px; --cv-s8: 32px; --cv-s10: 40px;
  --cv-s12: 48px; --cv-s16: 64px; --cv-s20: 80px; --cv-s24: 96px;

  /* Layout */
  --cv-container: 1200px;
  --cv-work: 860px;
  --cv-gutter: clamp(16px, 4vw, 32px);
  --cv-header-h: 64px;
  --cv-tap: 44px;

  /* Shape — hierarchy by radius: control < card < studio */
  --cv-r-xs: 6px;
  --cv-r-sm: 10px;
  --cv-r-md: 14px;
  --cv-r-lg: 22px;
  --cv-r-pill: 999px;

  /* Elevation (almost invisible; hierarchy comes from space + borders) */
  --cv-shadow-1: 0 1px 0 rgba(32, 37, 46, .04);
  --cv-shadow-2: 0 1px 2px rgba(32, 37, 46, .05), 0 8px 24px -12px rgba(32, 37, 46, .12);
  --cv-shadow-pop: 0 2px 6px rgba(32, 37, 46, .06), 0 18px 48px -16px rgba(32, 37, 46, .22);

  /* Motion */
  --cv-dur-1: 140ms;   /* hover / focus */
  --cv-dur-2: 220ms;   /* small state changes */
  --cv-dur-3: 360ms;   /* panels, enter */
  --cv-dur-love: 560ms;/* the one signature moment */
  --cv-ease: cubic-bezier(.2, .7, .2, 1);
  --cv-ease-in: cubic-bezier(.4, 0, 1, 1);
  --cv-ease-spring: cubic-bezier(.3, 1.45, .55, 1);

  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root { --cv-dur-1: 1ms; --cv-dur-2: 1ms; --cv-dur-3: 1ms; --cv-dur-love: 1ms; }
}
