@font-face { font-family: "Montserrat"; src: url("fonts/montserrat-var.woff2") format("woff2");
  font-weight: 200 700; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("fonts/dmmono-400.woff2") format("woff2");
  font-weight: 400; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("fonts/dmmono-500.woff2") format("woff2");
  font-weight: 500; font-display: swap; }

@font-face { font-family: "Montserrat Fallback"; src: local("Arial");
  size-adjust: 113%; ascent-override: 85%; descent-override: 22%; line-gap-override: 0%; }

:root {
  
  --gece: #170F10; --kemik: #F7EEE8; --bordo: #8E1520; --alarm: #E8392C; --kor: #FF8A4C;
  --murekkep: #6B5F5C; --tas: #CFC5BF; --seftali: #F4C3A6; --beyaz: #FFFFFF;

}

:root, [data-tema="acik"] {
  --zemin: var(--kemik); --zemin-2: #EFE4DD; 
  --metin: var(--gece); --metin-2: var(--murekkep); --cizgi: var(--tas); --desen: var(--tas);
  --vurgu: var(--alarm); --vurgu-metin: var(--gece); 
  --logo-metin: var(--gece); --logo-ai: var(--bordo);
  --sev-critical: var(--bordo); --sev-critical-kontur: transparent;
  --sev-high: var(--alarm); --sev-medium: var(--kor); --sev-low: var(--seftali); --sev-info: var(--tas);
  --kod-zemin: #EFE4DD; --redaksiyon: var(--murekkep);
  color-scheme: light;
}

:root {

  
  --font: "Montserrat", "Montserrat Fallback", system-ui, sans-serif;
  --mono: "DM Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --fs-12: 0.75rem; --fs-14: 0.875rem; --fs-16: 1rem; --fs-18: 1.125rem; --fs-20: 1.25rem;
  --fs-24: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --fs-32: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --fs-48: clamp(2rem, 1.4rem + 2.6vw, 3rem);
  --fs-64: clamp(2.5rem, 1.6rem + 4vw, 4rem);
  --fs-display: clamp(2.75rem, 1.2rem + 7vw, 7.5rem);
  --lh-text: 1.5; --lh-head: 1.1; --ls-large: -0.03em; --ls-label: 0.02em;

  
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px;
  --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px; --s-11: 160px; --s-12: 224px;
  --gutter: clamp(16px, 4vw, 48px); --max: 1280px; --max-text: 68ch;

  
  --r-12: 4px; --r-16: 6px; --r-24: 9px; --r-32: 12px; --r-48: 17px; --r-64: 23px;

  
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --d-fast: 160ms; --d-base: 240ms; --d-slow: 480ms; --d-story: 900ms;
}

[data-tema="koyu"] {
  --zemin: var(--gece); --zemin-2: #21181A; 
  --metin: var(--kemik); --metin-2: var(--tas); --cizgi: var(--murekkep); --desen: var(--bordo);
  --vurgu: var(--alarm); --vurgu-metin: var(--gece);
  --logo-metin: var(--kemik); --logo-ai: var(--kor);
  --sev-critical-kontur: var(--kemik); 
  --kod-zemin: #21181A;
  color-scheme: dark;
}