/* STOA staff access guide. Tokens: website/DESIGN.md (as stock-db/keycloak/themes/stoa/login).
   No web font and no remote image: the page asks nothing from another site. */
:root {
  --stoa-ink: #002858;
  --stoa-bronze: #ba8450;
  --stoa-bronze-deep: #8f5f33;
  --stoa-paper: #f7f4ef;
  --stoa-chalk: #ffffff;
  --stoa-stone: #e4e4e4;
  --stoa-muted: #5c6b7a;
  --stoa-font-sans: "Quicksand", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --stoa-font-display: "Fraunces", "Libre Baskerville", Georgia, serif;
  --stoa-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--stoa-paper);
  color: var(--stoa-ink);
  font-family: var(--stoa-font-sans);
  font-size: 1.0625rem;
  line-height: 1.6;
}
.skip { position: absolute; left: -999px; top: 0; }
.skip:focus { left: 1rem; top: 1rem; background: var(--stoa-chalk); padding: 0.5rem 1rem; z-index: 1; }
.wrap { max-width: 44rem; margin: 0 auto; padding: 0 1rem; }
header { border-bottom: 3px solid var(--stoa-bronze); background: var(--stoa-chalk); }
header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1rem; padding-bottom: 1rem; }
.brand { display: flex; align-items: center; gap: 0.75rem; color: var(--stoa-ink); text-decoration: none; }
.brand img { width: 2.25rem; height: 2.25rem; border-radius: 4px; }
.brand span { font-family: var(--stoa-font-display); font-weight: 700; letter-spacing: 0.4em; font-size: 1.25rem; }
main { padding: 2rem 0 3rem; }
h1, h2 { font-family: var(--stoa-font-display); font-weight: 600; line-height: 1.25; }
h1 { font-size: 2rem; margin: 0 0 1rem; }
h2 { font-size: 1.375rem; margin: 2.5rem 0 0.75rem; padding-top: 1.5rem; border-top: 1px solid var(--stoa-stone); }
p, ul, ol { margin: 0 0 1rem; }
ul, ol { padding-left: 1.5rem; }
li { margin-bottom: 0.5rem; }
a { color: var(--stoa-ink); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--stoa-bronze-deep); }
a:focus-visible { outline: 3px solid var(--stoa-bronze-deep); outline-offset: 2px; }
code { font-family: var(--stoa-font-mono); font-size: 0.9em; background: var(--stoa-chalk); border: 1px solid var(--stoa-stone); border-radius: 4px; padding: 0.05em 0.3em; }
pre {
  margin: 0 0 1.25rem;
  padding: 0.875rem 1rem;
  background: var(--stoa-chalk);
  border: 1px solid var(--stoa-stone);
  border-left: 3px solid var(--stoa-bronze);
  border-radius: 4px;
  overflow-x: auto;
}
/* One click selects the whole address or command, ready to copy (no script needed). */
pre code { border: 0; padding: 0; background: none; font-size: 1rem; -webkit-user-select: all; user-select: all; white-space: pre-wrap; word-break: break-all; }
footer { border-top: 1px solid var(--stoa-stone); color: var(--stoa-muted); font-size: 0.9375rem; }
footer .wrap { padding-top: 1.25rem; padding-bottom: 2rem; }
@media (max-width: 30rem) {
  body { font-size: 1rem; }
  h1 { font-size: 1.625rem; }
  .brand span { letter-spacing: 0.25em; }
}
