/* Design tokens: "The Logic Room Notebook" */

@font-face { font-family: "Bricolage Grotesque"; src: url("../assets/fonts/bricolage-grotesque-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Bricolage Grotesque"; src: url("../assets/fonts/bricolage-grotesque-latin-800-normal.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../assets/fonts/jetbrains-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url("../assets/fonts/hanken-grotesk-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url("../assets/fonts/hanken-grotesk-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  /* colour */
  --paper: #f6f5f1;
  --paper-2: #efeee8;
  --ink: #121212;
  --muted: #5e5e58;
  --hairline: rgba(18, 18, 18, 0.12);
  --hairline-strong: rgba(18, 18, 18, 0.28);
  --accent: #2f6f5e;
  --accent-ink: #ffffff;
  --field: #ffffff;
  --danger: #a12a2a;
  color-scheme: light;

  /* type: system fallbacks include Bengali-capable fonts */
  --font-ui: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans Bengali", "Nirmala UI", sans-serif;
  --font-display: "Bricolage Grotesque", "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans Bengali", "Nirmala UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-hero: clamp(2.5rem, 1.2rem + 6.5vw, 6.25rem);
  --fs-h2: clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem);
  --fs-h3: clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
  --fs-body: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  --fs-small: 0.9375rem;
  --fs-mono: 0.9375rem;

  /* layout */
  --space: 8px;
  --gutter: clamp(20px, 5vw, 48px);
  --col-text: 760px;
  --col-wide: 1100px;
  --radius: 4px;
}

/* Dark theme. <html data-theme="dark"> is set by the small script in each page's head: the saved
   choice first, otherwise the visitor's system setting. Same notebook, same single green accent. */
:root[data-theme="dark"] {
  --paper: #131512;
  --paper-2: #1b1e1a;
  --ink: #ecebe4;
  --muted: #a2a29a;
  --hairline: rgba(236, 235, 228, 0.13);
  --hairline-strong: rgba(236, 235, 228, 0.3);
  --accent: #62ab95;
  --accent-ink: #0d1713;
  --field: #1b1e1a;
  --danger: #ef8f8f;
  color-scheme: dark;
}
