/* Kartoteka × Urząd — tokeny. Motyw ciemny: <html data-theme="dark"> */
:root {
  --bg: #f3f2f1;
  --paper: #ffffff;
  --ink: #0b0c0c;
  --ink-2: #505a5f;
  --rule: #b1b4b6;
  --rule-2: #e3e4e5;
  --accent: var(--ink);
  --accent-bg: #f3f2f1;
  --mark: #ffdd00;
  --focus: #ffdd00;
  --row-hover: #fff7c2;
  --hdr: #0b0c0c;
  --hdr-ink: #ffffff;
  --hdr-line: #6f777b;
  --th-bg: #0b0c0c;
  --th-ink: #ffffff;
  --field: #ffffff;
  --field-ink: #0b0c0c;
  --overlay: rgba(12, 10, 6, .45);

  --cat-1: #1d70b8;
  --cat-2: #d4351c;
  --cat-3: #00703c;
  --cat-4: #b55a1a;
  --cat-5: #4c2c92;
  --cat-6: #28a197;
  --ok: var(--cat-3);
  --warn: var(--cat-4);
  --err: var(--cat-2);
  --info: var(--cat-1);

  --font-sans: 'Public Sans', Arial, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  --fs-label: 10.5px;
  --fs-meta: 11.5px;
  --fs-small: 12.5px;
  --fs-table: 13.5px;
  --fs-ui: 14px;
  --fs-body: 17.5px;
  --fs-h3: 19px;
  --fs-h2: 36px;
  --fs-h1: clamp(30px, 4vw, 46px);

  --s-4: 4px; --s-6: 6px; --s-8: 8px; --s-10: 10px; --s-12: 12px; --s-14: 14px;
  --s-16: 16px; --s-18: 18px; --s-20: 20px; --s-22: 22px; --s-24: 24px; --s-28: 28px;
  --s-32: 32px; --s-36: 36px; --s-40: 40px; --s-44: 44px;

  --radius: 0;
  --radius-pill: 999px;
  --radius-id: 3px;
  --outline: 0 0 0 1px var(--ink);

  --header-h: 58px;
  --col-nav: minmax(150px, 232px);
  --col-aside: minmax(220px, 316px);
  --col-facets: 270px;
  --content-max: 980px;

  --ease-drawer: cubic-bezier(.2, .8, .2, 1);
  --t-modal: .18s;
  --t-drawer: .24s;
}

:root[data-theme="dark"] {
  --bg: #0b0c0c;
  --paper: #141515;
  --ink: #f3f2f1;
  --ink-2: #b1b4b6;
  --rule: #505a5f;
  --rule-2: #2a2d2e;
  --accent-bg: #2a2d2e;
  --mark: #6b5c00;
  --row-hover: #2e2a10;
  --hdr: #000000;
  --hdr-line: #505a5f;
  --th-bg: #f3f2f1;
  --th-ink: #0b0c0c;
  --field: #f3f2f1;
  --overlay: rgba(0, 0, 0, .6);
  --outline: 0 0 0 1px #6f777b;

  --cat-1: #5694ca;
  --cat-2: #f08a76;
  --cat-3: #4fb07a;
  --cat-4: #f0a060;
  --cat-5: #9a85d6;
  --cat-6: #5cc2b8;
}

html { background: var(--bg); color: var(--ink); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
a { color: var(--ink); text-decoration: underline; text-underline-offset: .15em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 3px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 0; box-shadow: inset 0 -4px 0 #0b0c0c; }
mark { background: var(--mark); color: #0b0c0c; border-radius: 2px; padding: 0 1px; }
:root[data-theme="dark"] mark { color: var(--ink); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }