/* Lokniti design tokens — mirrors docs/design-system.md. Never hardcode values outside this file. */

:root {
  /* brand */
  --lok-red: #C40000;
  --lok-red-dark: #9E0000;
  --lok-red-soft: rgba(196, 0, 0, .08);
  --lok-gold: #FFD700;

  /* surfaces + ink */
  --lok-ink: #111111;
  --lok-ink-2: #4A4A4A;
  --lok-ink-3: #767676;
  --lok-bg: #F6F6F6;
  --lok-surface: #FFFFFF;
  --lok-surface-2: #FAFAFA;
  --lok-border: #E4E4E4;
  --lok-header: #FFFFFF;
  --lok-topbar: #111111;
  --lok-topbar-ink: #E8E8E8;

  /* category accents */
  --cat-uttar-pradesh: #C40000;
  --cat-bihar: #C40000;
  --cat-jharkhand: #C40000;
  --cat-bharat: #C40000;
  --cat-politics: #1D4ED8;
  --cat-crime: #111111;
  --cat-education: #047857;
  --cat-jobs: #047857;
  --cat-business: #B45309;
  --cat-sports: #0E7490;
  --cat-entertainment: #BE185D;
  --cat-videos: #7C3AED;
  --cat-photo-gallery: #0E7490;
  --cat-trending: #C40000;

  /* type */
  --font-head: 'Mukta', system-ui, sans-serif;
  --font-body: 'Noto Sans Devanagari', system-ui, sans-serif;

  --fs-h1: clamp(1.75rem, 1.15rem + 2.6vw, 3rem);
  --fs-h2: clamp(1.4rem, 1.1rem + 1.3vw, 2.25rem);
  --fs-h3: clamp(1.25rem, 1.05rem + .85vw, 1.75rem);
  --fs-h4: clamp(1.05rem, .98rem + .35vw, 1.375rem);
  --fs-body: 1rem;
  --fs-meta: .8125rem;

  /* space — 4px scale */
  --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;

  /* layout */
  --container: 1280px;
  --gutter: 24px;
  --sidebar: 320px;
  --radius: 10px;
  --radius-sm: 4px;

  --shadow-1: 0 1px 3px rgba(0, 0, 0, .08);
  --shadow-2: 0 6px 20px rgba(0, 0, 0, .12);
  --ring: 0 0 0 3px rgba(196, 0, 0, .35);

  --header-h: 64px;
  --ease: cubic-bezier(.4, 0, .2, 1);
}

@media (max-width: 640px) {
  :root { --gutter: 16px; }
}

/* Dark mode: follows the OS, and the header toggle stamps data-theme to override. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --lok-ink: #F2F2F2;
    --lok-ink-2: #A8A8A8;
    --lok-ink-3: #8A8A8A;
    --lok-bg: #0E0E0E;
    --lok-surface: #1A1A1A;
    --lok-surface-2: #212121;
    --lok-border: #2E2E2E;
    --lok-header: #161616;
    --lok-topbar: #000000;
    --lok-red: #FF4444;
    --lok-red-dark: #FF6B6B;
    --lok-red-soft: rgba(255, 68, 68, .12);
    --cat-crime: #E5E5E5;
    --cat-politics: #6C9BFF;
    --cat-education: #34D399;
    --cat-jobs: #34D399;
    --cat-business: #FBBF24;
    --cat-sports: #22D3EE;
    --cat-entertainment: #F472B6;
    --cat-videos: #A78BFA;
    --shadow-1: 0 1px 3px rgba(0, 0, 0, .5);
    --shadow-2: 0 6px 20px rgba(0, 0, 0, .6);
  }
}

:root[data-theme="dark"] {
  --lok-ink: #F2F2F2;
  --lok-ink-2: #A8A8A8;
  --lok-ink-3: #8A8A8A;
  --lok-bg: #0E0E0E;
  --lok-surface: #1A1A1A;
  --lok-surface-2: #212121;
  --lok-border: #2E2E2E;
  --lok-header: #161616;
  --lok-topbar: #000000;
  --lok-red: #FF4444;
  --lok-red-dark: #FF6B6B;
  --lok-red-soft: rgba(255, 68, 68, .12);
  --cat-crime: #E5E5E5;
  --cat-politics: #6C9BFF;
  --cat-education: #34D399;
  --cat-jobs: #34D399;
  --cat-business: #FBBF24;
  --cat-sports: #22D3EE;
  --cat-entertainment: #F472B6;
  --cat-videos: #A78BFA;
  --shadow-1: 0 1px 3px rgba(0, 0, 0, .5);
  --shadow-2: 0 6px 20px rgba(0, 0, 0, .6);
}