@import "/pkg/jp-ui/css/themes/thalyn.css";

:root {
  --thalyn-ink: oklch(0.12 0.03 250);
  --thalyn-bg: oklch(0.18 0.04 250);
  --thalyn-panel: color-mix(in oklab, var(--thalyn-ink) 80%, white);
  --thalyn-panel-strong: color-mix(in oklab, var(--thalyn-panel) 70%, black);
  --thalyn-surface: color-mix(in oklab, var(--thalyn-bg) 70%, var(--thalyn-panel));
  --thalyn-border: color-mix(in oklab, var(--thalyn-ink) 65%, white);
  --thalyn-text: oklch(0.9 0.02 250);
  --thalyn-text-strong: oklch(0.96 0.01 250);
  --thalyn-muted: color-mix(in oklab, var(--thalyn-text) 65%, var(--thalyn-ink));
  --thalyn-muted-strong: color-mix(in oklab, var(--thalyn-text) 78%, var(--thalyn-ink));
  --thalyn-white: oklch(0.97 0.01 255);
  --thalyn-accent: oklch(0.6 0.2 240);
  --thalyn-accent-2: oklch(0.72 0.16 330);
  --thalyn-accent-soft: color-mix(in oklab, var(--thalyn-accent) 25%, white);
  --thalyn-accent-glow: color-mix(in oklab, var(--thalyn-accent) 55%, white);
  --thalyn-accent-2-soft: color-mix(in oklab, var(--thalyn-accent-2) 25%, white);
  --thalyn-accent-2-glow: color-mix(in oklab, var(--thalyn-accent-2) 55%, white);
  --thalyn-shadow: 0 18px 40px color-mix(in oklab, black 70%, transparent);
  --thalyn-focus-ring: color-mix(in oklab, var(--thalyn-accent) 65%, var(--thalyn-white));
  --thalyn-danger: #ef4444;
  --thalyn-font-sans: 'InterVariable', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --thalyn-font-serif: 'Georgia', 'Times New Roman', serif;
  --thalyn-page-pad-top: 48px;
  --thalyn-page-pad-bottom: 56px;

  --bg: var(--thalyn-bg);
  --surface: var(--thalyn-surface);
  --panel: var(--thalyn-panel);
  --panel-strong: var(--thalyn-panel-strong);
  --border: var(--thalyn-border);
  --text: var(--thalyn-text);
  --text-strong: var(--thalyn-text-strong);
  --muted: var(--thalyn-muted);
  --muted-strong: var(--thalyn-muted-strong);
  --white: var(--thalyn-white);
  --accent: var(--thalyn-accent);
  --accent-soft: var(--thalyn-accent-soft);
  --accent-2: var(--thalyn-accent-2);
  --accent-2-soft: var(--thalyn-accent-2-soft);
  --accent-glow: var(--thalyn-accent-glow);
  --accent-2-glow: var(--thalyn-accent-2-glow);
  --focus-ring: var(--thalyn-focus-ring);
  --ink: var(--thalyn-ink);
  --danger: var(--thalyn-danger);
  --shadow: var(--thalyn-shadow);
  --font-sans: var(--thalyn-font-sans);
  --font-serif: var(--thalyn-font-serif);
  --page-pad-top: var(--thalyn-page-pad-top);
  --page-pad-bottom: var(--thalyn-page-pad-bottom);

  --jp-ui-bg: var(--thalyn-bg);
  --jp-ui-surface: var(--thalyn-surface);
  --jp-ui-panel: var(--thalyn-panel);
  --jp-ui-panel-strong: var(--thalyn-panel-strong);
  --jp-ui-border: var(--thalyn-border);
  --jp-ui-text: var(--thalyn-text);
  --jp-ui-text-strong: var(--thalyn-text-strong);
  --jp-ui-text-muted: var(--thalyn-muted);
  --jp-ui-text-muted-strong: var(--thalyn-muted-strong);
  --jp-ui-accent: var(--thalyn-accent);
  --jp-ui-accent-soft: var(--thalyn-accent-soft);
  --jp-ui-accent-secondary: var(--thalyn-accent-2);
  --jp-ui-accent-secondary-soft: var(--thalyn-accent-2-soft);
  --jp-ui-accent-glow: var(--thalyn-accent-glow);
  --jp-ui-accent-secondary-glow: var(--thalyn-accent-2-glow);
  --jp-ui-focus-ring: var(--thalyn-focus-ring);
  --jp-ui-ink: var(--thalyn-ink);
  --jp-ui-danger: var(--thalyn-danger);
  --jp-ui-white: var(--thalyn-white);
  --jp-ui-shadow: var(--thalyn-shadow);
  --jp-ui-font-sans: var(--thalyn-font-sans);
  --jp-ui-font-serif: var(--thalyn-font-serif);
  --jp-ui-page-pad-top: var(--thalyn-page-pad-top);
  --jp-ui-page-pad-bottom: var(--thalyn-page-pad-bottom);
  --jp-ui-tab-gap: 8px;
  --jp-ui-tab-pad: 8px;
  --jp-ui-tab-radius: 12px;
  --jp-ui-chip-gap: 8px;
  --jp-ui-chip-pad-x: 10px;
  --jp-ui-chip-pad-y: 5px;
  --jp-ui-chip-radius: 999px;
  --jp-ui-btn-primary-glow: 16px;
  --jp-ui-sticky-top: 64px;
  --jp-ui-sticky-z: 20;
}