/* A published docs site: pages on the left, the text in the middle, "On this page" on the right. Mojobase's fonts and
   colours; light and dark follow the reader's device. Works without JavaScript (search needs it). */
@font-face { font-family: 'Fraunces Soft'; src: url('fonts/fraunces-soft.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face {
  font-family: 'Figtree'; src: url('fonts/figtree.woff2') format('woff2'); font-weight: 300 900; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree'; src: url('fonts/figtree-ext.woff2') format('woff2'); font-weight: 300 900; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root {
  color-scheme: light;
  --docs-plane: #f7f3f1; --docs-paper: #fffdfc; --docs-surface: #fbf8f6; --docs-ink: #1b1240; --docs-ink-2: #4f4770; --docs-muted: #6d6589;
  --docs-grid: #e5dfe8; --docs-accent: #2e129e; --docs-accent-wash: rgba(46, 18, 158, 0.08); --docs-good: #3f6b0a;
  --docs-info: rgba(45, 127, 249, 0.10); --docs-tip: rgba(143, 191, 31, 0.18); --docs-warn: rgba(255, 149, 0, 0.14);
  --docs-font: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif; --docs-title: "Fraunces Soft", Georgia, serif;
  --docs-mono: ui-monospace, "SF Mono", Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not(.matched) {
    color-scheme: dark;
    --docs-plane: #100c1e; --docs-paper: #1a152c; --docs-surface: #221c38; --docs-ink: #f7f3f1; --docs-ink-2: #cfc9e0; --docs-muted: #9a93b5;
    --docs-grid: #2f2848; --docs-accent: #b0a3ff; --docs-accent-wash: rgba(176, 163, 255, 0.14); --docs-good: #a7d13a;
    --docs-info: rgba(45, 127, 249, 0.16); --docs-tip: rgba(143, 191, 31, 0.16); --docs-warn: rgba(255, 149, 0, 0.13);
  }
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
:root { --docs-bar: 60px; --docs-offset: calc(var(--docs-header, 0px) + var(--docs-bar)); }
html.matched { --docs-bar: 52px; --docs-width: 1248px; --docs-columns: 220px minmax(0, 1fr) 200px; }  /* search.js measures the website's header; 1248px lines up with a 1200px website */
html { scroll-padding-top: calc(var(--docs-offset) + 16px); }
body { margin: 0; }
html:not(.matched) body { background: var(--docs-plane); color: var(--docs-ink); font: 16px/1.65 var(--docs-font); -webkit-font-smoothing: antialiased; }
:where(.docs-layout, .docs-top, .docs-missing) a { color: var(--docs-accent); }
.docs-skip { position: absolute; left: -999px; top: 8px; background: var(--docs-paper); padding: 8px 12px; border-radius: 8px; z-index: 30; }
.docs-skip:focus { left: 8px; }

.docs-top {
  position: sticky; top: var(--docs-header, 0px); z-index: 20; display: flex; align-items: center; gap: 16px; height: var(--docs-bar); padding: 0 24px;
  background: var(--docs-plane); border-bottom: 1px solid var(--docs-grid);
}
html.matched .docs-top { padding-inline: max(24px, calc((100% - var(--docs-width)) / 2 + 24px)); }
.docs-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--docs-ink); font-weight: 700; font-size: 17px; }
.docs-search { position: relative; margin-left: auto; width: min(340px, 40vw); min-width: 0; }
.docs-search input { width: 100%; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--docs-grid); background: var(--docs-paper); color: var(--docs-ink); font: inherit; font-size: 15px; }
.docs-search input:focus { outline: 2px solid var(--docs-accent-wash); border-color: var(--docs-accent); }
.docs-results { position: absolute; top: calc(100% + 6px); right: 0; width: min(440px, 92vw); max-height: min(70vh, var(--docs-results-height, calc(100vh - var(--docs-offset) - 16px))); overflow-y: auto; overscroll-behavior: contain; overflow-wrap: anywhere; background: var(--docs-paper); border: 1px solid var(--docs-grid); border-radius: 12px; box-shadow: 0 12px 40px rgba(27, 18, 64, 0.2); padding: 6px; }
.docs-results a { display: grid; gap: 2px; padding: 8px 10px; border-radius: 8px; text-decoration: none; color: var(--docs-ink); }
.docs-results a:hover, .docs-results a:focus { background: var(--docs-accent-wash); outline: none; }
.docs-results span { color: var(--docs-muted); font-size: 13.5px; }
.docs-results .docs-none { margin: 8px 10px; color: var(--docs-muted); }
.docs-menu-button, .docs-menu-toggle { display: none; }

.docs-layout { display: grid; grid-template-columns: var(--docs-columns, 260px minmax(0, 760px) 220px); gap: 40px; max-width: var(--docs-width, 1360px); margin: 0 auto; padding: 0 24px; justify-content: center; }
.docs-nav { position: sticky; top: var(--docs-offset); align-self: start; max-height: calc(100vh - var(--docs-offset)); overflow-y: auto; padding: 24px 0; font-size: 15px; }
.docs-nav ul { list-style: none; margin: 0; padding: 0; }
.docs-nav ul ul { padding-left: 14px; border-left: 1px solid var(--docs-grid); margin: 2px 0 6px 10px; }
.docs-nav a { display: block; padding: 5px 10px; border-radius: 8px; text-decoration: none; color: var(--docs-ink-2); }
.docs-nav a:hover { background: var(--docs-accent-wash); color: var(--docs-ink); }
.docs-nav a[aria-current="page"] { background: var(--docs-accent-wash); color: var(--docs-accent); font-weight: 650; }
.docs-main { padding: 36px 0 96px; min-width: 0; }
.docs-toc { position: sticky; top: var(--docs-offset); align-self: start; padding: 36px 0; font-size: 14px; }
.docs-toc p { margin: 0 0 8px; font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--docs-muted); }
.docs-toc ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--docs-grid); }
.docs-toc li a { display: block; padding: 3px 12px; color: var(--docs-ink-2); text-decoration: none; }
.docs-toc li.l3 a { padding-left: 24px; font-size: 13.5px; }
.docs-toc a:hover { color: var(--docs-accent); }

.docs-crumbs { display: flex; flex-wrap: wrap; gap: 6px; font-size: 14px; color: var(--docs-muted); margin-bottom: 8px; }
.docs-crumbs a { color: var(--docs-muted); text-decoration: none; }
.docs-crumbs a:hover { color: var(--docs-accent); }
article h1 { font-size: 40px; font-weight: 600; line-height: 1.15; letter-spacing: -0.01em; margin: 0 0 20px; }
html:not(.matched) article h1, .docs-missing h1 { font-family: var(--docs-title); }
article h2 { font-size: 1.5em; margin: 1.8em 0 0.5em; line-height: 1.25; }
article h3 { font-size: 1.2em; margin: 1.5em 0 0.4em; line-height: 1.3; }
article p, article ul, article ol, article blockquote, article pre, article .table, article .callout { margin: 0 0 1em; }
article ul, article ol { padding-left: 1.5em; }
article ul { list-style: disc; }
article ol { list-style: decimal; }
article ul ul { list-style: circle; }
article li { display: list-item; margin: 0.2em 0; }  /* a website's own styles (Match your website) can't take the bullets away */
article ul.tasks { list-style: none; padding-left: 0.2em; }
article li.task .box { color: var(--docs-muted); margin-right: 4px; }
article li.task.done { color: var(--docs-muted); }
article blockquote { padding-left: 16px; border-left: 3px solid var(--docs-grid); color: var(--docs-ink-2); }
article code { font: 0.88em var(--docs-mono); background: var(--docs-accent-wash); padding: 1px 5px; border-radius: 5px; }
article pre { background: var(--docs-surface); border: 1px solid var(--docs-grid); border-radius: 10px; padding: 14px 16px; overflow-x: auto; font: 14px/1.5 var(--docs-mono); }
article pre code { background: none; padding: 0; }
article hr { border: 0; border-top: 1px solid var(--docs-grid); margin: 2em 0; }
article img { max-width: 100%; border-radius: 8px; }
.table { overflow-x: auto; }
article table { border-collapse: collapse; width: 100%; font-size: 15px; }
article th, article td { border: 1px solid var(--docs-grid); padding: 8px 12px; text-align: left; vertical-align: top; }
article th { background: var(--docs-surface); }
.callout { padding: 12px 16px 12px 46px; border-radius: 10px; position: relative; background: var(--docs-info); }
.callout::before { content: "ℹ"; position: absolute; left: 18px; top: 12px; font-weight: 700; color: #2d7ff9; }
.callout.tip { background: var(--docs-tip); }
.callout.tip::before { content: "✓"; color: var(--docs-good); }
.callout.warning { background: var(--docs-warn); }
.callout.warning::before { content: "!"; color: #c57a00; }
.callout > :last-child { margin-bottom: 0; }
.fill-in { background: var(--docs-warn); border-radius: 4px; padding: 0 4px; }
.docs-foot { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; margin-top: 48px; padding-top: 16px; border-top: 1px solid var(--docs-grid); color: var(--docs-muted); font-size: 14px; }
.docs-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }
.docs-pager a { display: grid; padding: 14px 16px; border: 1px solid var(--docs-grid); border-radius: 12px; text-decoration: none; color: var(--docs-ink); font-weight: 600; background: var(--docs-paper); }
.docs-pager a:hover { border-color: var(--docs-accent); }
.docs-pager small { color: var(--docs-muted); font-weight: 400; }
.docs-pager .next { text-align: right; grid-column: 2; }
.docs-missing { max-width: 560px; margin: 20vh auto; padding: 0 24px; }
.docs-missing h1 { font-size: 34px; font-weight: 600; }

@media (max-width: 1100px) {
  .docs-layout { grid-template-columns: 240px minmax(0, 1fr); }
  .docs-toc { display: none; }
}
@media (max-width: 800px) {
  .docs-top, html.matched .docs-top { padding: 0 14px; gap: 10px; }
  .docs-brand { min-width: 0; max-width: 32%; gap: 6px; flex-shrink: 0; }
  .docs-brand span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .docs-brand img { flex-shrink: 0; }
  .docs-search { position: static; width: auto; flex: 1; }
  .docs-search input { font-size: 16px; }
  .docs-results { right: 14px; width: min(440px, calc(100% - 28px)); }
  .docs-menu-button { display: block; flex-shrink: 0; cursor: pointer; padding: 6px 10px; border: 1px solid var(--docs-grid); border-radius: 9px; font-weight: 600; font-size: 14px; }
  .docs-layout { grid-template-columns: minmax(0, 1fr); padding: 0 18px; gap: 0; }
  .docs-nav { display: none; position: static; max-height: none; padding: 12px 0; border-bottom: 1px solid var(--docs-grid); }
  .docs-menu-toggle:checked + .docs-layout .docs-nav { display: block; }
  .docs-main { padding-top: 20px; }
  article h1 { font-size: 32px; }
}
