/* ============================================================
   HAB EMPIRE — hab-shell.css (V14.1)
   Companion stylesheet for hab-shell.js, which injects the
   canonical pillar nav + footer on every page.

     <link rel="stylesheet" href="assets/hab-shell.css">

   NOTE: the nav / footer / dropdown VISUAL styles already live —
   centralized, not per-page — in hab-hive.css (.hv-nav, .hv-dd,
   .hv-foot, …). They were never duplicated in page <head>s, so
   there is nothing to strip there. This file owns only what the
   shell newly introduces: the skip link (an a11y upgrade the old
   static markup lacked) and injection hygiene. All colours come
   from the shared theme vars so every theme follows automatically.
   ============================================================ */

/* ---------- Skip link (new a11y affordance) ---------- */
.hv-skip {
  position: fixed;
  left: -9999px;
  top: 0;
  z-index: 200;
  padding: 10px 18px;
  background: var(--void, #060504);
  color: var(--gold-bright, #f0c463);
  font-family: var(--mono, 'Share Tech Mono', monospace);
  font-size: 0.62rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid var(--gold, #e0a83c);
}
.hv-skip:focus {
  left: 12px;
  top: 12px;
}
.hv-skip:focus-visible {
  outline: 2px solid var(--gold, #e0a83c);
  outline-offset: 3px;
}

/* ---------- Injection hygiene ----------
   The shell is written to <body> by JS at readyState=interactive,
   before first paint of the fixed nav. Keep the injected header on
   its own compositor layer so it can't cause layout shift as it
   mounts, and make sure it never collapses if JS is slow. */
.hv-nav {
  will-change: transform;
}