/* design/system/tokens.css kopyası. Elle düzenleme: node scripts/sync-design.js */

@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-latin-ext-wght-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  color-scheme: light;
  --color-bg: #F7F8FA;
  --color-surface: #FFFFFF;
  --color-sunken: #F1F3F7;
  --color-tint: #EEF4FF;
  --color-ink: #102A43;
  --color-secondary: #4F5D73;
  --color-muted: #626E83;
  --color-border: #E8EBF0;
  --color-border-strong: #8A94A6;
  --color-primary: #17365D;
  --color-primary-hover: #0F2743;
  --color-on-primary: #FFFFFF;
  --color-accent: #748FBD;
  --color-accent-soft: #BACAE8;
  --color-link: #3A5A95;
  --color-focus: #3A5A95;
  --color-success: #0E7A4F;
  --color-success-bg: #ECFDF5;
  --color-success-border: #A7F3D0;
  --color-warning: #8A5300;
  --color-warning-bg: #FFFBEB;
  --color-warning-border: #FDE68A;
  --color-danger: #B42318;
  --color-danger-bg: #FEF2F2;
  --color-danger-border: #FECACA;
  --color-danger-solid: #A3402F;
  --color-danger-solid-hover: #8A3527;
  --color-on-danger: #FFFFFF;
  --color-wa: #25D366;
  --color-wa-text: #11743A;
  --color-wa-bg: #EEF9F3;
  --color-glass: rgba(255, 255, 255, 0.85);
  --color-glass-border: rgba(255, 255, 255, 0.6);
  --color-overlay: rgba(15, 39, 67, 0.40);
  --color-shadow: 16, 42, 67;
  --color-logo-plate: #FFFFFF;

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Consolas, "Liberation Mono", monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --text-display-size: 40px;
  --text-display-line: 44px;
  --text-display-weight: 700;
  --text-display-tracking: -0.02em;
  --text-title-1-size: 28px;
  --text-title-1-line: 34px;
  --text-title-1-weight: 700;
  --text-title-1-tracking: -0.015em;
  --text-title-2-size: 22px;
  --text-title-2-line: 28px;
  --text-title-2-weight: 600;
  --text-title-2-tracking: -0.01em;
  --text-title-3-size: 18px;
  --text-title-3-line: 24px;
  --text-title-3-weight: 600;
  --text-title-3-tracking: -0.005em;
  --text-body-size: 16px;
  --text-body-line: 24px;
  --text-body-weight: 400;
  --text-body-tracking: 0;
  --text-callout-size: 15px;
  --text-callout-line: 22px;
  --text-callout-weight: 500;
  --text-callout-tracking: 0;
  --text-small-size: 14px;
  --text-small-line: 20px;
  --text-small-weight: 400;
  --text-small-tracking: 0;
  --text-caption-size: 12px;
  --text-caption-line: 16px;
  --text-caption-weight: 500;
  --text-caption-tracking: 0.01em;

  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 22px;
  --radius-2xl: 28px;
  --radius-pill: 999px;

  --shadow-xs: 0 1px 2px rgba(var(--color-shadow), 0.06);
  --shadow-sm: 0 4px 20px rgba(var(--color-shadow), 0.04);
  --shadow-md: 0 8px 28px rgba(var(--color-shadow), 0.08);
  --shadow-float: 0 10px 34px rgba(var(--color-shadow), 0.12);
  --shadow-lg: 0 20px 50px rgba(var(--color-shadow), 0.20);
  --blur-glass: blur(10px) saturate(160%);
  --blur-glass-strong: blur(18px) saturate(160%);

  --duration-instant: 80ms;
  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 280ms;
  --duration-slower: 400ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);

  --layout-topbar-height: 56px;
  --layout-content-max: 720px;
  --layout-content-max-desktop: 920px;
  --layout-message-max: 620px;
  --layout-composer-max: 760px;
  --layout-panel-width: 320px;
  --layout-panel-width-desktop: 360px;
  --layout-gutter: 24px;
  --layout-gutter-mobile: 16px;
  --layout-tap-target: 44px;
  --z-base: 1;
  --z-dock: 3;
  --z-fab: 4;
  --z-topbar: 50;
  --z-panel-backdrop: 140;
  --z-panel: 150;
  --z-toast: 180;
  --z-modal: 200;
}

@media (max-width: 480px) {
  :root {
    --text-display-size: 30px;
    --text-display-line: 34px;
    --layout-gutter: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-instant: 0ms;
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
    --duration-slower: 0ms;
  }
}