/**
 * Tir Day Kala — code design system
 * Browser-ready, mobile-first tokens. No build process required.
 */
:root {
  --color-primary-50: #e5f4f5;
  --color-primary-100: #cce8ea;
  --color-primary-200: #99d1d5;
  --color-primary-300: #66bbc1;
  --color-primary-400: #33a4ac;
  --color-primary-500: #007179;
  --color-primary-600: #00555b;
  --color-primary-700: #00383c;
  --color-primary-800: #001c1e;
  --color-primary-900: #001e14;
  --color-brand-navy: #22407a;
  --color-secondary-50: #fffaf2;
  --color-secondary-100: #fbf6ed;
  --color-secondary-200: #f6eedb;
  --color-secondary-300: #eedcb7;
  --color-secondary-400: #ddba6e;
  --color-secondary-500: #d4a84a;
  --color-secondary-600: #aa873b;
  --color-secondary-700: #7f652c;
  --color-secondary-800: #55431e;
  --color-secondary-900: #2a220f;
  --color-success-50: #eaf6f0;
  --color-success-100: #d5eee1;
  --color-success-200: #acddc3;
  --color-success-300: #82cba4;
  --color-success-400: #59ba86;
  --color-success-500: #2fa968;
  --color-success-600: #268753;
  --color-success-700: #1c653e;
  --color-success-800: #13442a;
  --color-success-900: #092215;
  --color-warning-50: #fcf6ec;
  --color-warning-100: #f9ecd8;
  --color-warning-200: #f4dab1;
  --color-warning-300: #eec78b;
  --color-warning-400: #e9b564;
  --color-warning-500: #e3a23d;
  --color-warning-600: #b68231;
  --color-warning-700: #886125;
  --color-warning-800: #5b4118;
  --color-warning-900: #2d200c;
  --color-error-50: #fcecec;
  --color-error-100: #f8d9d9;
  --color-error-200: #f1b3b3;
  --color-error-300: #ea8d8d;
  --color-error-400: #e36767;
  --color-error-500: #dc4141;
  --color-error-600: #b03434;
  --color-error-700: #842727;
  --color-error-800: #581a1a;
  --color-error-900: #2c0d0d;
  --color-info-50: #eaf2fd;
  --color-info-100: #d5e6fb;
  --color-info-200: #acccf8;
  --color-info-300: #82b3f4;
  --color-info-400: #5999f1;
  --color-info-500: #2f80ed;
  --color-info-600: #2666be;
  --color-info-700: #1c4d8e;
  --color-info-800: #13335f;
  --color-info-900: #091a2f;
  --color-neutral-0: #fff;
  --color-neutral-50: #f3f3f3;
  --color-neutral-100: #e7e7e7;
  --color-neutral-200: #cfcfcf;
  --color-neutral-300: #b7b7b7;
  --color-neutral-400: #9f9f9f;
  --color-neutral-500: #878787;
  --color-neutral-600: #6c6c6c;
  --color-neutral-700: #515151;
  --color-neutral-800: #363636;
  --color-neutral-900: #1b1b1b;

  /* Semantic colors */
  --color-brand: var(--color-primary-500);
  --color-brand-hover: var(--color-primary-600);
  --color-brand-active: var(--color-primary-700);
  --color-brand-subtle: var(--color-primary-50);
  --color-brand-border: var(--color-primary-200);
  --color-accent: var(--color-secondary-500);
  --color-accent-subtle: var(--color-secondary-50);
  --color-text-primary: var(--color-neutral-900);
  --color-text-secondary: var(--color-neutral-700);
  --color-text-tertiary: var(--color-neutral-400);
  --color-text-disabled: var(--color-neutral-200);
  --color-text-inverse: var(--color-neutral-0);
  --color-text-link: var(--color-primary-600);
  --color-text-link-hover: var(--color-primary-700);
  --color-surface-page: #fafafa;
  --color-surface-primary: var(--color-neutral-0);
  --color-surface-secondary: var(--color-neutral-50);
  --color-surface-disabled: var(--color-neutral-100);
  --color-surface-overlay: rgb(27 27 27 / 60%);
  --color-border-subtle: var(--color-neutral-100);
  --color-border-default: var(--color-neutral-200);
  --color-border-strong: var(--color-neutral-400);
  --color-border-focus: var(--color-primary-500);
  --color-status-success: var(--color-success-700);
  --color-status-success-surface: var(--color-success-50);
  --color-status-warning: var(--color-warning-700);
  --color-status-warning-surface: var(--color-warning-50);
  --color-status-error: var(--color-error-600);
  --color-status-error-surface: var(--color-error-50);
  --color-status-info: var(--color-info-700);
  --color-status-info-surface: var(--color-info-50);

  /* Typography */
  --font-family-title: "Yekan Bakh FaNum", Tahoma, Arial, sans-serif;
  --font-family-body: "Yekan Bakh FaNum", Tahoma, Arial, sans-serif;
  --font-family-label: "Yekan Bakh FaNum", Tahoma, Arial, sans-serif;
  --font-family-caption: "Yekan Bakh FaNum", Tahoma, Arial, sans-serif;
  --font-weight-thin: 100;
  --font-weight-extra-light: 200;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semi-bold: 600;
  --font-weight-bold: 700;
  --font-weight-extra-bold: 800;
  --font-weight-black: 900;
  --letter-spacing-tighter: -0.05rem;
  --letter-spacing-tight: -0.025rem;
  --letter-spacing-normal: 0;
  --letter-spacing-wide: 0.025rem;
  --letter-spacing-wider: 0.05rem;
  --letter-spacing-widest: 0.1rem;

  /* Mobile-first semantic type */
  --type-display-2xl-size: 2.5rem;
  --type-display-2xl-line-height: 3.25rem;
  --type-display-xl-size: 2rem;
  --type-display-xl-line-height: 2.75rem;
  --type-display-lg-size: 1.5rem;
  --type-display-lg-line-height: 2.25rem;
  --type-heading-lg-size: 1.25rem;
  --type-heading-lg-line-height: 2rem;
  --type-heading-md-size: 1.125rem;
  --type-heading-md-line-height: 1.75rem;
  --type-heading-sm-size: 1rem;
  --type-heading-sm-line-height: 1.625rem;
  --type-heading-xs-size: 0.875rem;
  --type-heading-xs-line-height: 1.375rem;
  --type-body-xl-size: 1rem;
  --type-body-xl-line-height: 1.625rem;
  --type-body-lg-size: 0.875rem;
  --type-body-lg-line-height: 1.5rem;
  --type-body-md-size: 0.875rem;
  --type-body-md-line-height: 1.375rem;
  --type-body-sm-size: 0.75rem;
  --type-body-sm-line-height: 1.125rem;
  --type-label-lg-size: 0.875rem;
  --type-label-lg-line-height: 1.5rem;
  --type-label-md-size: 0.75rem;
  --type-label-md-line-height: 1.125rem;
  --type-caption-md-size: 0.75rem;
  --type-caption-md-line-height: 1.125rem;
  --type-caption-sm-size: 0.75rem;
  --type-caption-sm-line-height: 1.125rem;

  /* Spacing and layout */
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --spacing-container-inline: var(--space-4);
  --spacing-page-start: var(--space-8);
  --spacing-section-block: var(--space-8);
  --spacing-card-padding: var(--space-4);
  --spacing-element-gap: var(--space-3);
  --spacing-micro-gap: var(--space-1);
  --container-max: 90rem;
  --content-max: 75rem;
  --reading-max: 45rem;
  --breakpoint-sm: 36rem;
  --breakpoint-md: 48rem;
  --breakpoint-lg: 64rem;
  --breakpoint-xl: 80rem;
  --breakpoint-2xl: 90rem;

  /* Borders and radii from the supplied Figma references */
  --border-width-none: 0;
  --border-width-default: 1px;
  --radius-none: 0;
  --radius-control: 0.25rem;
  --radius-control-lg: 0.375rem;
  --radius-pagination: 0.5625rem;
  --radius-card: 0.75rem;
  --radius-pill: 9999px;
  --radius-circle: 50%;

  /* Elevation */
  --shadow-none: none;
  --shadow-sm: 0 1px 2px rgb(27 27 27 / 6%);
  --shadow-md: 0 4px 12px rgb(27 27 27 / 8%);
  --shadow-lg: 0 12px 32px rgb(27 27 27 / 12%);
  --shadow-overlay: 0 20px 48px rgb(27 27 27 / 18%);

  /* Sizing, interaction, motion, and layering */
  --size-icon-sm: 1rem;
  --size-icon-md: 1.25rem;
  --size-icon-lg: 1.5rem;
  --size-control-sm: 2rem;
  --size-control-md: 2.5rem;
  --size-control-lg: 3rem;
  --size-target-min: 2.75rem;
  --focus-ring-width: 3px;
  --focus-ring-offset: 2px;
  --focus-ring-color: rgb(0 113 121 / 35%);
  --duration-instant: 0ms;
  --duration-fast: 120ms;
  --duration-normal: 200ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized: cubic-bezier(0.2, 0, 0, 1.2);
  --z-base: 0;
  --z-raised: 10;
  --z-sticky: 100;
  /* The header outranks every sticky page element so its menus open over them. */
  --z-header: 150;
  --z-dropdown: 200;
  --z-overlay: 300;
  --z-modal: 400;
  --z-toast: 500;
}

@media (min-width: 48rem) {
  :root {
    --type-display-2xl-size: 4.5rem;
    --type-display-2xl-line-height: 5.25rem;
    --type-display-xl-size: 3.5rem;
    --type-display-xl-line-height: 4.25rem;
    --type-display-lg-size: 3rem;
    --type-display-lg-line-height: 3.75rem;
    --type-heading-lg-size: 2.5rem;
    --type-heading-lg-line-height: 3.25rem;
    --type-heading-md-size: 2rem;
    --type-heading-md-line-height: 2.75rem;
    --type-heading-sm-size: 1.5rem;
    --type-heading-sm-line-height: 2.25rem;
    --type-heading-xs-size: 1.25rem;
    --type-heading-xs-line-height: 2rem;
    --type-body-xl-size: 1.125rem;
    --type-body-xl-line-height: 1.75rem;
    --type-body-lg-size: 1rem;
    --type-body-lg-line-height: 1.625rem;
    --type-label-lg-size: 1rem;
    --type-label-lg-line-height: 1.625rem;
    --type-label-md-size: 0.875rem;
    --type-label-md-line-height: 1.375rem;
    --type-caption-md-size: 0.875rem;
    --type-caption-md-line-height: 1.375rem;
    --spacing-container-inline: var(--space-8);
    --spacing-page-start: var(--space-12);
    --spacing-section-block: var(--space-12);
    --spacing-card-padding: var(--space-6);
    --spacing-element-gap: var(--space-4);
    --spacing-micro-gap: var(--space-2);
  }
}

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