/*! /assets/nav-standard.css — THE sitewide top-nav tile standard (rev 2026-10-14r2). Loaded by every page
   (direct <link> + re-ensured by /assets/nav/home-l-lock.js). Do not restyle tiles per page.
   Tile: 52x52 box, radius 12, 12px one-line label. Inactive: 1px rgba(255,255,255,.35), no shadow.
   Active (the /pool look, used everywhere incl. Admin + Home): 2px #5ee7ff + glow. No outlines, no pseudo-element frames.
   Up to 5 page tiles + Admin + Home. Gap shrinks (never the tiles): 7x52 + 6 gaps + 2x6 padding fits 412px with 6px gaps.
   No "More:" lines anywhere: extra pages go in the page body as icon tiles. */
:root{--nav-tile:52px;--nav-gap:clamp(4px,calc((100vw - 376px) / 6),10px);--nav-border:1px solid rgba(255,255,255,.35);--nav-on:2px solid #5ee7ff;--nav-glow:0 0 0 1px rgba(94,231,255,.35),0 0 10px rgba(94,231,255,.75)}

/* rows: one line, fixed gap, never scroll sideways */
html body:not(#nf_) .home-nav,html body:not(#nf_) .home-chrome .nav-group,html body:not(#nf_) .home-chrome .tabs,html body:not(#nf_) .chrome-marks,
html body:not(#nf_) .topnav .nav-icons,html body:not(#nf_) .home-chrome-home{
  display:flex!important;flex-wrap:nowrap!important;gap:var(--nav-gap)!important;column-gap:var(--nav-gap)!important;
  overflow:visible!important;min-width:0!important;flex-shrink:0!important}
html body:not(#nf_) .home-chrome-inner,html body:not(#nf_) .topnav .nav-row,html body:not(#nf_) nav.topnav{flex-wrap:nowrap!important;column-gap:var(--nav-gap)!important;gap:var(--nav-gap)!important;align-items:flex-start!important}
html body:not(#nf_) .topnav .nav-spacer{flex:1 1 0!important;min-width:0!important;width:0!important;margin:0 calc(var(--nav-gap) * -1) 0 0!important}
html body:not(#nf_) .home-chrome-inner,html body:not(#nf_) .topnav .nav-row{padding-left:6px!important;padding-right:6px!important;box-sizing:border-box!important}
html body:not(#nf_) nav.topnav:not(:has(.nav-row)){padding-left:0!important;padding-right:0!important;box-sizing:border-box!important}
html body:not(#nf_) .wrap>nav.topnav:not(:has(.nav-row)){margin-left:-6px!important;margin-right:-6px!important}

/* tile anchors: fixed 52px column, never shrink */
html body:not(#nf_) .home-chrome a.nav-pill-icon,html body:not(#nf_) a.home-mark,html body:not(#nf_) .home-nav>a,html body:not(#nf_) .chrome-marks>a,
html body:not(#nf_) .topnav .nav-icons>a,html body:not(#nf_) .topnav a.home,html body:not(#nf_) a[data-admin-tile],html body:not(#nf_) .home-chrome button.nav-pill-icon{
  flex:0 0 var(--nav-tile)!important;width:var(--nav-tile)!important;min-width:var(--nav-tile)!important;max-width:var(--nav-tile)!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;gap:2px!important;height:auto!important;min-height:0!important;max-height:none!important;justify-content:flex-start!important;
  padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
  overflow:visible!important;text-decoration:none!important;opacity:1!important;transform:none!important}
/* Admin keeps a clear 10px gap before Home whatever the parent's layout */
html body:not(#nf_) a[data-admin-tile]{margin-left:auto!important;margin-right:var(--nav-gap)!important}
html body:not(#nf_) .home-chrome-home a[data-admin-tile],html body:not(#nf_) .chrome-marks a[data-admin-tile]{margin-right:0!important}
html body:not(#nf_) a[data-admin-tile]+a{margin-left:0!important}

/* the tile box */
html body:not(#nf_) .home-chrome a.nav-pill-icon>.nav-ico,html body:not(#nf_) a.home-mark>.nav-ico,html body:not(#nf_) .home-nav>a>.nav-ico,html body:not(#nf_) .chrome-marks>a>.nav-ico,
html body:not(#nf_) .topnav .nav-icons>a>.nav-ico,html body:not(#nf_) .topnav a.home>.nav-ico,html body:not(#nf_) a[data-admin-tile]>.nav-ico,html body:not(#nf_) .home-chrome button.nav-pill-icon>.nav-ico,
html body:not(#nf_) .topnav .nav-icons>a>img,html body:not(#nf_) .home-nav>a>img,html body:not(#nf_) .home-chrome a.nav-pill-icon>img{
  display:block!important;flex:0 0 var(--nav-tile)!important;box-sizing:border-box!important;
  width:var(--nav-tile)!important;height:var(--nav-tile)!important;min-width:var(--nav-tile)!important;min-height:var(--nav-tile)!important;
  max-width:var(--nav-tile)!important;max-height:var(--nav-tile)!important;
  border:var(--nav-border)!important;border-radius:12px!important;box-shadow:none!important;overflow:hidden!important;
  background:#0a1018!important;padding:0!important;margin:0!important;line-height:0!important;opacity:1!important;filter:none!important;object-fit:cover!important}
html body:not(#nf_) .nav-ico>img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;display:block!important;
  border:0!important;border-radius:0!important;margin:0!important;padding:0!important;object-fit:cover!important}
html body:not(#nf_) .nav-ico.nav-ico-l>img{object-fit:contain!important}

/* active = current page */
html body:not(#nf_):not(#nf2_) a.on>.nav-ico,html body:not(#nf_):not(#nf2_) a.active>.nav-ico,html body:not(#nf_):not(#nf2_) a.is-active>.nav-ico,html body:not(#nf_):not(#nf2_) a[aria-current="page"]>.nav-ico,
html body:not(#nf_):not(#nf2_) .topnav .nav-icons>a.on>img,html body:not(#nf_):not(#nf2_) a.nav-pill-icon.on>img,html body:not(#nf_):not(#nf2_) .home-nav>a.on>img,html body:not(#nf_):not(#nf2_) .topnav .nav-icons>a[aria-current="page"]>img,html body:not(#nf_):not(#nf2_) .topnav .nav-icons>a.active>img{
  border:var(--nav-on)!important;box-shadow:var(--nav-glow)!important}

/* labels: 12px, one line */
html body:not(#nf_) .home-chrome .nav-word,html body:not(#nf_) a.home-mark .nav-word,html body:not(#nf_) .home-nav .nav-word,html body:not(#nf_) a[data-admin-tile] .nav-word,
html body:not(#nf_) .topnav .nav-label{
  display:block!important;font-size:12px!important;line-height:1.15!important;white-space:nowrap!important;
  overflow:visible!important;text-overflow:clip!important;letter-spacing:-.02em!important;text-align:center!important;
  width:auto!important;max-width:none!important;margin:2px 0 0!important}

/* page tiles left, Admin + Home right */
html body:not(#nf_) .home-chrome-inner{justify-content:flex-start!important}
html body:not(#nf_) .home-chrome-inner>a.home-mark,html body:not(#nf_) .topnav a.home,html body:not(#nf_) .chrome-marks{margin-left:auto!important}
html body:not(#nf_) .home-chrome .tabs{margin:0!important}

/* the old "More:" line is retired sitewide */
html body .nav-more{display:none!important}

/* rows size to their tiles; the Admin+Home group grows to fit both */
html body:not(#nf_) .home-nav,html body:not(#nf_) .topnav .nav-icons,html body:not(#nf_) .home-chrome .tabs,html body:not(#nf_) .home-chrome .nav-group{flex:0 1 auto!important;width:auto!important;max-width:none!important}
html body:not(#nf_) .chrome-marks{flex:0 0 auto!important;width:auto!important;min-width:0!important;max-width:none!important}

html body:not(#nf_) .home-nav,html body:not(#nf_) .chrome-marks,html body:not(#nf_) .topnav .nav-icons{padding-top:0!important;padding-bottom:0!important;padding-left:0!important;padding-right:0!important;margin-top:0!important;margin-bottom:0!important;margin-left:0!important;align-items:flex-start!important;min-height:0!important}
html body:not(#nf_) .chrome-marks{margin-left:auto!important}

/* kill every page-local frame: outlines, pseudo-element rings, filters, shadows on anchors and inner images */
html body:not(#nf_) .home-chrome a.nav-pill-icon,html body:not(#nf_) a.home-mark,html body:not(#nf_) .home-nav>a,html body:not(#nf_) .chrome-marks>a,
html body:not(#nf_) .topnav .nav-icons>a,html body:not(#nf_) .topnav a.home,html body:not(#nf_) a[data-admin-tile],
html body:not(#nf_) .home-chrome a.nav-pill-icon>.nav-ico,html body:not(#nf_) a.home-mark>.nav-ico,html body:not(#nf_) .home-nav>a>.nav-ico,html body:not(#nf_) .chrome-marks>a>.nav-ico,
html body:not(#nf_) .topnav .nav-icons>a>.nav-ico,html body:not(#nf_) .topnav a.home>.nav-ico,html body:not(#nf_) a[data-admin-tile]>.nav-ico,
html body:not(#nf_) .topnav .nav-icons>a>img,html body:not(#nf_) .home-nav>a>img,html body:not(#nf_) .home-chrome a.nav-pill-icon>img,html body:not(#nf_) .nav-ico>img{
  outline:0!important;outline-offset:0!important}
html body:not(#nf_) .home-nav>a::before,html body:not(#nf_) .home-nav>a::after,html body:not(#nf_) .topnav .nav-icons>a::before,html body:not(#nf_) .topnav .nav-icons>a::after,
html body:not(#nf_) .chrome-marks>a::before,html body:not(#nf_) .chrome-marks>a::after,html body:not(#nf_) a.home-mark::before,html body:not(#nf_) a.home-mark::after,
html body:not(#nf_) .topnav a.home::before,html body:not(#nf_) .topnav a.home::after,html body:not(#nf_) a[data-admin-tile]::before,html body:not(#nf_) a[data-admin-tile]::after,
html body:not(#nf_) .home-chrome a.nav-pill-icon::before,html body:not(#nf_) .home-chrome a.nav-pill-icon::after,html body:not(#nf_) .nav-ico::before,html body:not(#nf_) .nav-ico::after{
  content:none!important;display:none!important}
html body:not(#nf_) .nav-ico>img{box-shadow:none!important;filter:none!important;opacity:1!important}
/* active state wins over everything above (same specificity bump as the active block) */
html body:not(#nf_):not(#nf2_):not(#nf3_) a.on>.nav-ico,html body:not(#nf_):not(#nf2_):not(#nf3_) a.active>.nav-ico,html body:not(#nf_):not(#nf2_):not(#nf3_) a.is-active>.nav-ico,html body:not(#nf_):not(#nf2_):not(#nf3_) a[aria-current="page"]>.nav-ico,
html body:not(#nf_):not(#nf2_):not(#nf3_) .topnav .nav-icons>a.on>img,html body:not(#nf_):not(#nf2_):not(#nf3_) a.nav-pill-icon.on>img,html body:not(#nf_):not(#nf2_):not(#nf3_) .home-nav>a.on>img,html body:not(#nf_):not(#nf2_):not(#nf3_) .topnav .nav-icons>a[aria-current="page"]>img,html body:not(#nf_):not(#nf2_):not(#nf3_) .topnav .nav-icons>a.active>img{
  border:var(--nav-on)!important;box-shadow:var(--nav-glow)!important;outline:0!important}
/* body icon tiles that replaced the old "More:" links */
.nav-body-tiles{display:flex;flex-wrap:wrap;gap:14px;max-width:720px;margin:12px auto 4px;padding:0 14px;box-sizing:border-box}
.nav-body-tiles a{display:flex;flex-direction:column;align-items:center;width:64px;text-decoration:none;color:inherit;font:600 12px/1.15 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.nav-body-tiles a img{width:64px;height:64px;border-radius:12px;border:1px solid rgba(255,255,255,.35);object-fit:cover;display:block;background:#0a1018}
.nav-body-tiles a span{margin-top:4px;white-space:nowrap}

/* ==== 2026-10-14r2 FINAL: fixed 7-slot grid on every page ====
   Slots 1-5 = section tiles (DOM order), slot 6 = Admin (logged-in only, blank otherwise), slot 7 = Home.
   7 equal 52px columns spread evenly across the bar (same container width + padding everywhere), so every slot
   sits at identical pixel positions on every page. Fewer than 5 section tiles leaves blank slots. */
html body:not(#nf_):not(#nf2_) .home-chrome-inner,html body:not(#nf_):not(#nf2_) .topnav .nav-row,html body:not(#nf_):not(#nf2_) nav.topnav:not(:has(.nav-row)):not(.home-nav){
  display:grid!important;grid-template-columns:repeat(7,var(--nav-tile))!important;grid-auto-flow:column!important;justify-content:space-between!important;
  align-items:start!important;column-gap:0!important;row-gap:0!important;gap:0!important;
  width:min(100vw,720px)!important;max-width:none!important;min-width:0!important;margin-left:calc(50% - min(50vw,360px))!important;margin-right:0!important;
  padding-left:6px!important;padding-right:6px!important;box-sizing:border-box!important}
/* inner groups dissolve so their tiles become grid items */
html body:not(#nf_):not(#nf2_) .home-chrome-inner .home-nav,html body:not(#nf_):not(#nf2_) .home-chrome-inner .nav-group,html body:not(#nf_):not(#nf2_) .home-chrome-inner .tabs,
html body:not(#nf_):not(#nf2_) .home-chrome-inner .chrome-marks,html body:not(#nf_):not(#nf2_) .home-chrome-inner .home-chrome-home,
html body:not(#nf_):not(#nf2_) .topnav .nav-icons,html body:not(#nf_):not(#nf2_) .topnav .chrome-marks{display:contents!important}
html body:not(#nf_):not(#nf2_) .home-chrome-inner .nav-spacer,html body:not(#nf_):not(#nf2_) .topnav .nav-spacer{display:none!important}
/* tiles: section tiles auto-fill slots 1-5; Admin pinned to 6; Home pinned to 7 */
html body:not(#nf_):not(#nf2_) .home-chrome-inner a,html body:not(#nf_):not(#nf2_) .home-chrome-inner button.nav-pill-icon,html body:not(#nf_):not(#nf2_) .topnav a{
  grid-row:1!important;margin:0!important;justify-self:center!important}
html body:not(#nf_):not(#nf2_) a[data-admin-tile]{grid-column:6!important;margin:0!important}
html body:not(#nf_):not(#nf2_) .home-chrome-inner a.home-mark,html body:not(#nf_):not(#nf2_) .home-chrome-inner a:has(>.nav-ico-l),
html body:not(#nf_):not(#nf2_) .topnav a.home,html body:not(#nf_):not(#nf2_) .topnav a:has(>.nav-ico-l){grid-column:7!important;margin:0!important}
/* non-tile text in the bar (e.g. the "Lathom Pages" script on /, "Texts" on /texts/) uses the free middle slots */
html body:not(#nf_):not(#nf2_) .home-chrome-inner>:not(a):not(button):not(.home-nav):not(.nav-group):not(.tabs):not(.chrome-marks):not(.home-chrome-home):not(.nav-spacer),
html body:not(#nf_):not(#nf2_) .topnav .nav-row>:not(a):not(.nav-icons):not(.nav-spacer):not(.chrome-marks){
  grid-row:1!important;grid-column:3/6!important;justify-self:center!important;align-self:center!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;margin:0!important}
