/* Z50 theme for the shared app pages: the landing's black, ice white and one blue. */
@import url("https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600&family=Space+Mono&display=swap");
:root {
  --pad-bg: #020411;
  --pad-surface: #0a0d22;
  --pad-ink: #d2e0ff;
  --pad-ink-dim: #8b97b8;
  --pad-rule: #1d2344;
  --pad-accent: #0004eb;
  --pad-accent-ink: #d2e0ff;
  --pad-accent-text: #8f9bff;
  --pad-good: #5fe0a4;
  --pad-bad: #ff6b81;
  --pad-font: "Instrument Sans", system-ui, sans-serif;
  --pad-font-display: "Instrument Sans", system-ui, sans-serif;
  --pad-mono: "Space Mono", ui-monospace, Consolas, monospace;
  --pad-radius: 2px;
  --pad-max-width: 1120px;
}
html { background: var(--pad-bg); color-scheme: dark; }
/* header + footer from _chrome.html */
.hl-head { display: flex; align-items: center; gap: 28px; padding: 15px 16px; font: 14px/1 var(--pad-mono); color: var(--pad-ink); }
.hl-head img { height: 32px; display: block; }
.hl-head nav { display: flex; gap: 28px; margin-left: 12vw; flex: 1; }
.hl-head a { color: inherit; text-decoration: none; }
.hl-head nav a:hover { color: #fff; }
.hl-head .hl-cta { background: var(--pad-ink); color: var(--pad-accent); padding: 8px 8px 8px 10px; border-radius: 2px; white-space: nowrap; }
.hl-head .hl-cta::after { content: "→"; display: inline-block; margin-left: 10px; padding: 1px 4px; background: var(--pad-accent); color: var(--pad-ink); }
.hl-foot { margin-top: 96px; padding: 40px 16px 33px; border-top: 1px solid var(--pad-rule); text-align: center; font: 13px/1.8 var(--pad-mono); color: var(--pad-ink-dim); }
.hl-foot strong { display: block; margin-bottom: 14px; font: 600 28px/1 var(--pad-font); letter-spacing: -.02em; text-transform: uppercase; color: var(--pad-ink); }
.hl-foot a { color: var(--pad-ink); text-decoration: none; margin: 0 8px; text-transform: uppercase; }
.hl-foot a:hover { color: #fff; }
.hl-legal { max-width: 640px; margin: 12vh auto; padding: 0 16px; font: 17px/1.6 var(--pad-font); color: var(--pad-ink); }
.hl-legal h1 { font: 600 44px/1 var(--pad-font); letter-spacing: -.03em; text-transform: uppercase; margin-bottom: 24px; }
@media (max-width: 767px) { .hl-head nav { margin-left: 0; gap: 16px; } .hl-head .hl-cta { display: none; } .hl-head img { height: 26px; } }