/* tokens.css: fonts + :root tokens (unlayered, wins over every layer).
   Ported from the source theme (RECON/assets/pretty/style.css), selectors and values kept 1:1. */
@layer reset, primitives, tokens, base, layout, components, utilities, custom;

/* Zimula: 700 renders the 500 cut and 900 the 600 cut, exactly like the source theme. */
@font-face { font-family: Zimula; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/zimula-400.woff2") format("woff2"); }
@font-face { font-family: Zimula; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/zimula-500.woff2") format("woff2"); }
@font-face { font-family: Zimula; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/zimula-600.woff2") format("woff2"); }
@font-face { font-family: Zimula; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/zimula-500.woff2") format("woff2"); }
@font-face { font-family: Zimula; font-weight: 900; font-style: normal; font-display: swap; src: url("../fonts/zimula-600.woff2") format("woff2"); }
/* IcoFont subset (arrow-right, long-arrow-left, thin-down, search), same file as the source. */
@font-face { font-family: IcoFont; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/icofont-subset.woff2") format("woff2"), url("../fonts/icofont-subset.woff") format("woff"); }

:root {
  color-scheme: dark;
  --font-sans: "Zimula", system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, "Cascadia Code", "Source Code Pro", monospace;
  --clr-dark: #0d0d0d;
  --clr-page-nav-bg: #18181a;
  --clr-page-nav-bg: color-mix(in srgb, var(--clr-dark) 90%, black 10%);
  --clr-dark-60: rgba(25, 27, 29, 0.6);
  --clr-dark-40: rgba(25, 27, 29, 0.4);
  --clr-dark-30: rgba(25, 27, 29, 0.3);
  --clr-dark-20: rgba(25, 27, 29, 0.2);
  --clr-dark-05: rgba(25, 27, 29, 0.05);
  --clr-dark-02: rgba(25, 27, 29, 0.02);
  --clr-deep: #131313;
  --clr-page-dark: #101010;
  --clr-black: #000;
  --clr-white: #fff;
  --clr-white-60: hsla(0, 0%, 100%, 0.6);
  --clr-white-50: hsla(0, 0%, 100%, 0.5);
  --clr-white-40: hsla(0, 0%, 100%, 0.46);
  --clr-white-20: hsla(0, 0%, 100%, 0.2);
  --clr-white-r40: rgba(255, 255, 255, 0.4);
  --clr-border: #ebebeb;
  --clr-muted: #8f8d8d;
  --clr-off-white: #f1f1f1;
  --cll-plyr-100vh-16-9: calc(100vh * 1.77777778);
  --cll-plyr-75vh-16-9: calc(75vh * 1.77777778);
  --cll-plyr-carousel-16-9: calc((75vh - 2rem) * 1.77777778);
}
