/* ============================================================================
   sitefooter.css — the footer bar (in the app) and the static legal pages.
   [OLY-99, Atlas 2026-08-28]

   Palette is taken from style.css :root so the pages and the app cannot drift
   apart; the legal pages redeclare it because they do NOT load style.css (that
   file styles a full-screen globe and would fight a text page).
   ============================================================================ */

/* ---------- the bar itself (used in both places) ---------- */
#sitefooter {
  font-size: 10.5px;
  line-height: 1.5;
  color: var(--mut, #94a3b8);
  padding: 2px 2px 4px;
  text-align: right;
  opacity: .85;
  overflow-wrap: anywhere;
}
#sitefooter a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
#sitefooter a:hover, #sitefooter a:focus-visible { color: var(--fg, #e2e8f0); }
#sitefooter .sf-sep { padding: 0 .35em; opacity: .6; }
#sitefooter .sf-copy { white-space: nowrap; }

/* Touch targets: the bar is small type by design (it sits under a map credit
   line), so give the links room without making the bar taller on desktop. */
@media (pointer: coarse) {
  #sitefooter a { display: inline-block; padding: 4px 0; }
}

/* ---------- the DRAFT band ---------- */
#sf-draft {
  background: #7f1d1d;
  color: #fee2e2;
  font: 600 12px/1.45 -apple-system, Segoe UI, Roboto, sans-serif;
  padding: 10px 16px;
  text-align: center;
  letter-spacing: .02em;
}

/* ---------- the static legal pages ---------- */
body.legalpage {
  --bg: #05080f; --panel: #0f172a; --line: #243449; --fg: #e2e8f0;
  --mut: #94a3b8; --acc: #c8a24a;
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 15px/1.65 -apple-system, Segoe UI, Roboto, sans-serif;
  -webkit-text-size-adjust: 100%;
}
body.legalpage .wrap { max-width: 760px; margin-inline: auto; padding: 26px 18px 40px; }
body.legalpage .home { font-size: 12.5px; color: var(--mut); text-decoration: none; }
body.legalpage .home:hover { color: var(--fg); }
body.legalpage h1 {
  color: var(--acc); font-size: 20px; letter-spacing: .12em; text-transform: uppercase;
  margin: 18px 0 6px;
}
body.legalpage .lead { color: var(--mut); font-size: 13px; margin: 0 0 22px; }
body.legalpage h2 {
  font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--fg);
  margin: 28px 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--line);
}
body.legalpage p, body.legalpage li { color: var(--fg); }
body.legalpage a { color: var(--acc); }
body.legalpage code {
  background: var(--panel); border: 1px solid var(--line); border-radius: 4px;
  padding: 1px 5px; font-size: .9em;
}
body.legalpage table { border-collapse: collapse; width: 100%; font-size: 13.5px; margin: 10px 0 6px; }
body.legalpage th, body.legalpage td {
  border: 1px solid var(--line); padding: 7px 10px; text-align: left; vertical-align: top;
}
body.legalpage th { color: var(--mut); font-weight: 600; background: var(--panel); }
/* Wide tables must scroll inside their own box — the page body never scrolls sideways. */
body.legalpage .tablewrap { overflow-x: auto; }
body.legalpage footer.sitefoot {
  margin-top: 34px; padding-top: 14px; border-top: 1px solid var(--line);
}
body.legalpage footer.sitefoot #sitefooter { text-align: left; font-size: 12px; opacity: 1; }

/* ---------- the contact form ---------- */
body.legalpage form.contact { display: grid; gap: 14px; max-width: 560px; margin-top: 6px; }
body.legalpage form.contact label { display: grid; gap: 5px; font-size: 13px; color: var(--mut); }
body.legalpage form.contact input,
body.legalpage form.contact textarea {
  background: var(--panel); color: var(--fg); border: 1px solid var(--line);
  border-radius: 6px; padding: 9px 11px; font: inherit; font-size: 14px; width: 100%;
}
body.legalpage form.contact textarea { min-height: 150px; resize: vertical; }
body.legalpage form.contact button {
  justify-self: start; background: var(--acc); color: #0b1220; border: 0; border-radius: 999px;
  padding: 10px 22px; font: inherit; font-weight: 600; cursor: pointer; min-height: 40px;
}
body.legalpage form.contact button[disabled] {
  background: var(--panel); color: var(--mut); border: 1px solid var(--line); cursor: not-allowed;
}
/* The honeypot: off-screen, never display:none — a bot that reads styles skips
   hidden fields, and a real user must never be able to focus it either. */
body.legalpage .hp {
  position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;
}
body.legalpage .formstate {
  border-left: 3px solid var(--acc); background: var(--panel);
  padding: 10px 14px; border-radius: 0 8px 8px 0; font-size: 13.5px; color: var(--mut);
}
body.legalpage .formstate strong { color: var(--fg); }