/* ══════════════════════════════════════════════════════════════════════════
   LEESHARKS.COM — SITE LAYER

   The site had EIGHTEEN PAGES AND 134 KB OF INLINE CSS, none of it shared, six
   different navigation bars, and TEN PAGES WITH NO NAVIGATION AT ALL — including
   the homepage. Every page set its own measure: 540px, 600px, 640px, 660px,
   800px, 900px, 30rem, 44rem, 46rem, 60rem. Piecemeal accumulation, exactly.

   AND assets/type.css EXISTED AND NOT ONE PAGE LINKED IT. The type layer was
   written, committed, and served to nobody — the same failure as the surfacemap
   links that lived only inside <noscript>. A file that is present and unreferenced
   is not a fix.

   This is the shared layer: one shell, one nav, one measure. It does NOT override
   page-specific colour or bespoke components — those stay where they are. It sets
   the frame they all sit in.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  --ls-measure:44rem;
  --ls-rule:rgba(120,110,95,.22);
  --ls-ink:#241f1a;
  --ls-dim:#6e6a62;
  --ls-accent:#9b1b1b;
  --ls-serif:'Source Serif 4',Palatino,'Book Antiqua',Georgia,serif;
  --ls-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ── the shell ─────────────────────────────────────────────────────── */
.ls-wrap{max-width:var(--ls-measure);margin:0 auto;padding:0 1.4rem 5rem}

/* ── one navigation, on every page ─────────────────────────────────── */
.ls-nav{
  max-width:var(--ls-measure);margin:0 auto;padding:.9rem 1.4rem .8rem;
  display:flex;flex-wrap:wrap;gap:0 1.1rem;align-items:baseline;
  font-family:var(--ls-mono);font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;line-height:2.1;
  border-bottom:1px solid var(--ls-rule);margin-bottom:1.6rem
}
.ls-nav a{color:var(--ls-dim);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:1px}
.ls-nav a:hover{color:var(--ls-ink);border-bottom-color:currentColor}
.ls-nav a.here{color:var(--ls-accent);border-bottom-color:currentColor}
.ls-nav .ls-home{color:var(--ls-ink);font-weight:600;letter-spacing:.06em;text-transform:none;font-size:12px}
.ls-nav .ls-sp{flex:1}
@media (max-width:640px){
  .ls-nav{font-size:9.5px;gap:0 .8rem;line-height:1.95}
  .ls-nav .ls-home{font-size:11px;flex-basis:100%}
}

/* ── a card grid, for the hubs that had none ───────────────────────── */
.ls-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(13.5rem,1fr));gap:.9rem;margin:1.2rem 0}
.ls-card{border:1px solid var(--ls-rule);border-radius:3px;padding:.85rem .95rem}
.ls-card a{text-decoration:none;font-weight:600;color:var(--ls-ink)}
.ls-card a:hover{color:var(--ls-accent)}
.ls-card p{margin:.35rem 0 0;font-size:.86rem;line-height:1.5;color:var(--ls-dim)}
.ls-card .ls-meta{font-family:var(--ls-mono);font-size:9px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ls-dim);margin-top:.45rem;opacity:.85}

/* ── colophon ──────────────────────────────────────────────────────── */
.ls-colophon{max-width:var(--ls-measure);margin:3rem auto 0;padding:1.1rem 1.4rem 3rem;
  border-top:1px solid var(--ls-rule);font-family:var(--ls-mono);font-size:9.5px;
  letter-spacing:.08em;line-height:2;color:var(--ls-dim)}
.ls-colophon a{color:var(--ls-dim)}