/* Navigering som läggs på alla sidor, även visualiseringarna.
   Använder visualiseringarnas egna färgvariabler. */

.site-inner{max-width:1040px;margin:0 auto;padding:0 20px}

.site-crumbs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;
  gap:2px 0;font-size:.92rem;line-height:1.4;color:var(--muted)}
.site-crumbs li{display:flex;align-items:center;min-width:0}
.site-crumbs li+li::before{content:"/";margin:0 .55em;color:var(--line)}
.site-crumbs a{color:var(--muted);text-decoration:none;border-radius:4px;padding:2px 0}
.site-crumbs a:hover{color:var(--ink);text-decoration:underline}
.site-crumbs [aria-current]{color:var(--ink);font-weight:700}
.site-crumbs a:focus-visible,.site-pager a:focus-visible,.site-card:focus-visible{
  outline:3px solid var(--focus);outline-offset:2px}

.site-topbar{background:var(--surface);border-bottom:1px solid var(--line);padding:12px 0}
.site-topbar .site-inner{display:flex;align-items:center;justify-content:space-between;gap:12px}
.site-pos{flex:none;font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}

.site-pager{padding:28px 0;border-top:1px solid var(--line)}
.site-pager .site-inner{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.site-pager a{display:block;background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:14px 18px;color:var(--ink);text-decoration:none;transition:border-color .15s}
.site-pager a:hover{border-color:var(--muted)}
.site-pager small{display:block;color:var(--muted);font-size:.85rem}
.site-pager b{font-family:Archivo,"Arial Narrow",system-ui,sans-serif;font-weight:600;font-size:1.1rem}
.site-next{text-align:right;grid-column:2}
@media (max-width:560px){
  .site-pager .site-inner{grid-template-columns:1fr}
  .site-next{grid-column:1}
  .site-pos{display:none}
}

.site-credit{margin:0;padding:18px 20px 32px;text-align:center;font-size:.9rem;color:var(--muted)}