/* Shared five-destination navigation, including the existing timeline article. */
body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav { display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px;padding:8px;background:#fbf8f6;border:1px solid #e2e5df;border-radius:12px; }
body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav a { flex:1 1 auto;display:block;padding:13px 18px;text-align:center;line-height:1.5;color:#355f52;border-radius:7px;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap; }
body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav a[aria-current] { background:#efebe6;color:#2c3333;box-shadow:inset 0 -2px #b54365; }
body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav a:hover { background:#eaf0eb;color:#2c3333; }
body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav a:focus-visible { outline:2px solid #b54365;outline-offset:2px; }
@media(max-width:600px) {
  body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav { gap:2px;padding:5px; }
  body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav a { flex:1 1 auto;min-width:44px;min-height:44px;padding:12px 5px;font-size:12px; }
  /* Penlight's article frame reaches the edge; align only its nav with the other directories. */
  body.szpl-page .szal-nav { margin-inline:10px; }
}
@media(max-width:360px) {
  body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav { padding:3px;gap:1px; }
  body:is(.szc-archive-layout,.szc-live-index-page,.szpl-page,.szal-timeline) .szal-nav a { padding-inline:2px; }
}
