/* Open Market light theme for facet.llc's content pages (2026-10-07).
   The homepage's thesis (assets/om-home.css) on every subpage: a light page on a quiet dotted ground,
   Sora, one purple accent. It works by overriding the design tokens the pages already read (each page's
   own token block, tokens.css and site-chrome.css), then a few element rules. Loaded last in <head>,
   with class="om-theme" on <html>; assets/om-theme.js adds the mask rise to headings. tokens.css and
   design-tokens.json are unchanged. */

html.om-theme:root,
html.om-theme:root[data-theme] {
  color-scheme: light;
  /* cool neutrals, Open Market's */
  --shale-0: #f4f4f6;
  --shale-1: #e3e3e8;
  --shale-2: #c9c9d1;
  --shale-3: #9a9aa3;
  --shale-4: #6c6c74;
  --shale-5: #5e5e66;
  --shale-6: #3a3a40;
  --shale-7: #26262b;
  --shale-8: #18181b;
  --shale-9: #121214;
  --ink: #121214;
  --paper: #ffffff;
  /* Facet's green primitives map onto the Open Market purple; success keeps its green below */
  --green-50: #f6f2fd;
  --green-100: #efe9fb;
  --green-200: #cdbbea;
  --green-300: #b39de4;
  --green-400: #8a6fd8;
  --green-500: #6d4fc2;
  --green-600: #5b3fae;
  --green-700: #4e3596;
  --green-800: #4e3596;
  --green-900: #2f1f63;
  /* semantic */
  --bg: #f4f4f6;
  --bg-subtle: #efeff2;
  --bg-elevated: #ffffff;
  --surface: #ffffff;
  --surface-2: #efeff2;
  --elevated: #ffffff;
  --fg: #121214;
  --fg-muted: #5e5e66;
  --fg-subtle: #6c6c74;
  --text-1: #121214;
  --text-2: #5e5e66;
  --text-3: #6c6c74;
  --text-4: #6c6c74;
  --border: #e3e3e8;
  --border-hi: #cfcfd6;
  --border-strong: #cfcfd6;
  --accent: #6d4fc2;
  --accent-dim: #5b3fae;
  --accent-hover: #5b3fae;
  --accent-fg: #ffffff;
  --accent-text: #6d4fc2;
  --accent-wash: rgba(109, 79, 194, 0.1);
  --danger: #d12f41;
  --danger-fg: #ffffff;
  --danger-text: #c0283a;
  --success: #178a4e;
  --success-text: #178a4e;
  --warning: #b26a00;
  --warning-text: #9a5c00;
  --focus-ring: #6d4fc2;
  --font-ui: "Sora", system-ui, -apple-system, sans-serif;
  /* the small mono caps labels (eyebrows, meta lines, form labels) read in Sora, as on the homepage;
     real code keeps JetBrains Mono below */
  --font-mono: "Sora", system-ui, -apple-system, sans-serif;
  --font-ed: "Sora", system-ui, -apple-system, sans-serif;
  --font-editorial: "Sora", system-ui, -apple-system, sans-serif;
  --chrome-ui: "Sora", system-ui, -apple-system, sans-serif;
  --chrome-accent: #6d4fc2;
  --chrome-accent-dim: #5b3fae;
  --radius-btn: 999px;
}

/* the ground: the homepage's dot grid, quieter under long text */
html.om-theme body {
  background-color: var(--bg);
  background-image: radial-gradient(circle, rgba(18, 18, 20, 0.07) 1.15px, rgba(18, 18, 20, 0) 1.75px);
  background-size: 34px 34px;
  color: var(--text-1);
  font-family: var(--font-ui);
}
html.om-theme ::selection {
  background: #e3d9f8;
  color: #121214;
}

/* headings: Sora SemiBold, tight; they rise through a mask as they come into view (om-theme.js) */
html.om-theme h1,
html.om-theme h2,
html.om-theme h3,
html.om-theme h4 {
  font-family: var(--font-ui);
  letter-spacing: -0.025em;
  font-style: normal;
}
html.om-theme h1 {
  font-weight: 600;
}
html.om-theme h2 {
  font-weight: 600;
}
html.om-theme .w {
  display: inline-block;
}

/* buttons: the Open Market pill, the accent with white text */
html.om-theme .btn,
html.om-theme button.btn,
html.om-theme a.btn {
  font-family: var(--font-ui);
  font-weight: 600;
  text-transform: none;
  letter-spacing: -0.005em;
  border-radius: 999px;
}
html.om-theme .btn.primary,
html.om-theme .btn-primary,
html.om-theme a.btn.primary,
html.om-theme button.primary {
  background: #6d4fc2;
  border-color: #6d4fc2;
  color: #ffffff;
  box-shadow: 0 10px 22px -12px rgba(109, 79, 194, 0.7);
}
html.om-theme .btn.primary:hover,
html.om-theme .btn-primary:hover,
html.om-theme button.primary:hover {
  background: #5b3fae;
  border-color: #5b3fae;
  color: #ffffff;
}

/* forms: soft fields, the accent on focus */
html.om-theme input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
html.om-theme textarea,
html.om-theme select {
  font-family: var(--font-ui);
}
html.om-theme input:focus-visible,
html.om-theme textarea:focus-visible,
html.om-theme select:focus-visible {
  outline: 3px solid rgba(109, 79, 194, 0.35);
  outline-offset: 1px;
}

/* code stays in JetBrains Mono */
html.om-theme pre,
html.om-theme pre *,
html.om-theme code,
html.om-theme kbd,
html.om-theme samp {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* the theme is light only: the per-page light/dark toggles have nothing to switch */
html.om-theme .theme-toggle {
  display: none !important;
}

@media print {
  html.om-theme body {
    background: #ffffff;
  }
}
