/* Generated by scripts/docs-build.php; the colours come from resources/css/app.css. */
@font-face {
  font-family: "Geist Variable";
  src: url("geist-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Geist Mono Variable";
  src: url("geist-mono-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --color-gulf-50:  #EDFAF9;
  --color-gulf-100: #D2F2F0;
  --color-gulf-200: #A6E4E1;
  --color-gulf-300: #6FCFCB;
  --color-gulf-400: #36B3AF;
  --color-gulf-500: #0F8F8C;
  --color-gulf-600: #0C7673;
  --color-gulf-700: #0B5F5D;
  --color-gulf-800: #0B4B4A;
  --color-gulf-900: #0A3D3D;
  --color-gulf-950: #062626;
  --color-smoke-50:  #F2F6F6;
  --color-smoke-100: #E4ECED;
  --color-smoke-200: #CBD8DA;
  --color-smoke-300: #A9BCBF;
  --color-smoke-400: #7C9AA0;
  --color-smoke-500: #5E7C82;
  --color-smoke-600: #476268;
  --color-smoke-700: #344B51;
  --color-smoke-800: #1E3A42;
  --color-smoke-900: #0B2A33;
  --color-smoke-950: #071D24;
  --color-coral-100: #FFE7DF;
  --color-coral-400: #FF7A59;
  --color-coral-600: #E0583A;
  --color-coral-800: #7A2614;
  --color-ok-100:   #DDF4E4;
  --color-ok-600:   #1E9E50;
  --color-ok-800:   #0F5A2C;
  --color-warn-100: #FFF0D6;
  --color-warn-600: #D98A1C;
  --color-warn-800: #7A4A08;
  --color-bad-100:  #FDE1E4;
  --color-bad-600:  #D7263D;
  --color-bad-800:  #7D1422;
  --color-info-100: #DCE8FF;
  --color-info-600: #2F6BFF;
  --color-info-800: #183A8C;
  --background: var(--color-smoke-50);
  --surface: #FFFFFF;
  --border: var(--color-smoke-200);
  --border-strong: var(--color-smoke-300);
  --control: var(--color-smoke-400); /* checkbox borders, switch tracks: 3:1 against the page */
  --hover: var(--color-smoke-100);
  --text: var(--color-smoke-900);
  --text-muted: var(--color-smoke-600);

  --primary: var(--color-gulf-600);
  --primary-hover: var(--color-gulf-700);
  --primary-text: #FFFFFF;

  --secondary: var(--color-smoke-900);
  --secondary-hover: var(--color-smoke-800);
  --secondary-text: var(--color-smoke-50);

  --accent: var(--color-coral-400);
  --accent-hover: var(--color-coral-600);
  --accent-text: var(--color-smoke-900);

  --danger: var(--color-bad-600);
  --danger-hover: var(--color-bad-800);
  --danger-text: #FFFFFF;
  --danger-fg: var(--color-bad-600);
  /* Readable text on tinted backgrounds (badges, notes) */
  --ok-fg: var(--color-ok-800);
  --warn-fg: var(--color-warn-800);
  --info-fg: var(--color-info-800);
  --primary-fg: var(--color-gulf-700);

  --sidebar: var(--color-smoke-900);
  --sidebar-text: var(--color-smoke-50);
  --ring: var(--color-gulf-500);
}
@media (prefers-color-scheme: dark) {
  :root {
  --background: var(--color-smoke-950);
  --surface: var(--color-smoke-900);
  --border: var(--color-smoke-800);
  --border-strong: var(--color-smoke-700);
  --control: var(--color-smoke-500);
  --hover: var(--color-smoke-800);
  --text: var(--color-smoke-50);
  --text-muted: var(--color-smoke-400);

  --primary: var(--color-gulf-400);
  --primary-hover: var(--color-gulf-300);
  --primary-text: var(--color-smoke-950);

  --secondary: var(--color-smoke-100);
  --secondary-hover: var(--color-smoke-200);
  --secondary-text: var(--color-smoke-900);

  --accent: var(--color-coral-400);
  --accent-hover: var(--color-coral-600);
  --accent-text: var(--color-smoke-950);

  --danger: var(--color-bad-600);
  --danger-hover: var(--color-bad-800);
  --danger-text: #FFFFFF;
  --danger-fg: #FF6B7E;
  --ok-fg: #6FD49A;
  --warn-fg: #F2B45A;
  --info-fg: #8FB0FF;
  --primary-fg: var(--color-gulf-300);

  --sidebar: var(--color-smoke-950);
  --sidebar-text: var(--color-smoke-100);
  --ring: var(--color-gulf-300);
  }
}
* { box-sizing: border-box; }
html { color-scheme: light dark; }
body {
  margin: 0;
  background: var(--background);
  color: var(--text);
  font-family: "Geist Variable", ui-sans-serif, system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
}
a { color: var(--primary-fg); text-underline-offset: 0.15em; }
a:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; border-radius: 0.325rem; }
.skip { position: absolute; left: -100rem; }
.skip:focus { left: 1rem; top: 1rem; background: var(--surface); padding: 0.5rem 0.75rem; border: 1px solid var(--border); border-radius: 0.325rem; }
.top { background: var(--sidebar); padding: 0.875rem 1rem; }
.brand { color: var(--sidebar-text); font-weight: 600; text-decoration: none; }
.layout { max-width: 72rem; margin: 0 auto; padding: 1.5rem 1rem; display: grid; gap: 2rem; }
nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; }
nav a { color: var(--text-muted); text-decoration: none; }
nav a:hover, nav a[aria-current="page"] { color: var(--text); text-decoration: underline; }
main { min-width: 0; max-width: 46rem; }
h1 { font-size: 1.875rem; line-height: 1.25; margin: 0 0 1rem; }
h2 { font-size: 1.375rem; margin: 2rem 0 0.75rem; padding-top: 1rem; border-top: 1px solid var(--border); }
h3 { font-size: 1.125rem; margin: 1.5rem 0 0.5rem; }
code, pre { font-family: "Geist Mono Variable", ui-monospace, monospace; font-size: 0.875em; }
code { background: var(--hover); padding: 0.1em 0.3em; border-radius: 0.325rem; overflow-wrap: anywhere; }
pre { background: var(--surface); border: 1px solid var(--border); border-radius: 0.325rem; padding: 0.875rem 1rem; overflow-x: auto; }
pre code { background: none; padding: 0; overflow-wrap: normal; }
.table { overflow-x: auto; margin: 1rem 0; border: 1px solid var(--border); border-radius: 0.325rem; }
table { border-collapse: collapse; width: 100%; background: var(--surface); }
th, td { text-align: left; vertical-align: top; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--border); }
th { color: var(--text-muted); font-weight: 600; }
tr:last-child td { border-bottom: 0; }
footer { max-width: 72rem; margin: 0 auto; padding: 1.5rem 1rem 2.5rem; color: var(--text-muted); font-size: 0.875rem; border-top: 1px solid var(--border); }
@media (min-width: 56rem) {
  .layout { grid-template-columns: 12rem 1fr; }
  nav ul { flex-direction: column; position: sticky; top: 1.5rem; }
}
