/* PSC header v2 (Claude, 14 Nov 2026; v2: no menu wrapping at tablet and landscape widths): the same top bar as the forum (PSC Home · Forums · Videos and the
   light/dark switch), and the header row under it laid out like the forum's: logo, name and account on one
   line, the page menu as one row. Loaded after the page styles. */

/* The PSC bar: a copy of the forum's (theme 3 custom header), so the three sites open the same way. */
.psc-network {
  --psc-deep-teal: #0c3037;
  --psc-mint: #c5e9d1;
  --psc-gold: #f4d0a2;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: .5rem;
  min-block-size: 2.875rem;
  padding: .25rem max(.75rem, env(safe-area-inset-right)) .25rem max(.75rem, env(safe-area-inset-left));
  background: #0a2125;
  border-block-end: 1px solid #354c4c;
  color: #e6f4ed;
  font: 650 .875rem/1.2 system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  position: relative;
  z-index: 3;
}
html[data-theme="light"] .psc-network { background: var(--psc-deep-teal); border-block-end-color: transparent; }
.psc-network svg {
  inline-size: 1.1rem;
  block-size: 1.1rem;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.psc-network__brand {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  justify-self: start;
  color: #e6f4ed;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -.01em;
  white-space: nowrap;
}
.psc-network__brand svg { inline-size: 1.3rem; block-size: 1.3rem; color: var(--psc-mint); }
.psc-network__sites { display: flex; align-items: center; gap: .3rem; }
.psc-network__tools { display: flex; align-items: center; justify-content: flex-end; gap: .15rem; }
.psc-network a,
.psc-network button {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-block-size: 2.375rem;
  padding: 0 .95rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgba(230, 244, 237, .9);
  font: inherit;
  font-weight: 650;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.psc-network a:hover,
.psc-network button:hover { background: rgba(197, 233, 209, .14); color: #fff; text-decoration: none; }
.psc-network a[aria-current="true"] { background: var(--psc-mint); color: var(--psc-deep-teal); }
.psc-network a:focus-visible,
.psc-network button:focus-visible { outline: 2px solid var(--psc-gold); outline-offset: 2px; }
.psc-network .psc-network__tool { position: relative; justify-content: center; min-inline-size: 2.5rem; padding: 0 .6rem; }
.psc-network__label {
  position: absolute !important;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.psc-network [hidden] { display: none !important; }
/* Dark (the default) offers the sun; light offers the moon. */
.psc-network__moon,
html[data-theme="light"] .psc-network__sun { display: none; }
html[data-theme="light"] .psc-network__moon { display: block; }
@media (max-width: 56rem) {
  .psc-network { grid-template-columns: minmax(0, 1fr) auto; }
  .psc-network__brand { display: none; }
  .psc-network__sites { overflow-x: auto; scrollbar-width: none; justify-self: start; max-inline-size: 100%; }
  .psc-network__sites::-webkit-scrollbar { display: none; }
}
@media (max-width: 26rem) {
  .psc-network a,
  .psc-network button { padding: 0 .7rem; }
  .psc-network__sites svg { display: none; }
}
@media print { .psc-network { display: none; } }

/* The switch now lives in the bar: an older page script's own switch never shows. */
.site-header .psc-theme-toggle { display: none !important; }

/* The header row: the name on one line, as on the forum. */
.site-header .brand span br { display: none; }
.site-header .brand span { white-space: nowrap; }
.site-header .psc-account-status { white-space: nowrap; }

/* The page menu never wraps onto a second row. */
.site-header .nav,
.site-header .primary-nav { flex-wrap: nowrap; }
.site-header .psc-account-status { max-width: 14rem; overflow: hidden; text-overflow: ellipsis; }

/* Tablets, phones in landscape and narrow windows: logo, name and account on the first line; the whole
   page menu on one line under it, with the current page marked. */
@media (max-width: 67.99rem) {
  .site-header .header-row,
  .site-header .header-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .55rem .75rem;
    min-height: 0;
    padding-top: .65rem;
  }
  .site-header .brand { grid-column: 1; grid-row: 1; min-width: 0; max-width: 100%; }
  .site-header .brand span { overflow: hidden; text-overflow: ellipsis; line-height: 1.2; }
  .site-header .account,
  .site-header .account-nav { grid-column: 2; grid-row: 1; justify-content: flex-end; gap: .7rem; min-width: 0; }
  .site-header .nav,
  .site-header .primary-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: .25rem;
    margin: 0;
    padding: .3rem 0 .45rem;
    overflow-x: auto;
    scrollbar-width: none;
    border-top: 1px solid var(--line, var(--border, #d9e1dc));
  }
  .site-header .nav::-webkit-scrollbar,
  .site-header .primary-nav::-webkit-scrollbar { display: none; }
  .site-header .nav a,
  .site-header .primary-nav a {
    flex: none;
    display: inline-flex;
    align-items: center;
    min-height: 2.4rem;
    padding: 0 .75rem;
    border-radius: 999px;
    font-size: .88rem;
    text-decoration: none;
  }
  .site-header .nav a[aria-current],
  .site-header .primary-nav a[aria-current] { background: rgba(23, 83, 88, .1); text-decoration: none; }
  html[data-theme="dark"] .site-header .nav a[aria-current],
  html[data-theme="dark"] .site-header .primary-nav a[aria-current] { background: rgba(197, 233, 209, .14); }
}

/* Phones: a smaller menu that fits one line, starting at the left edge. */
@media (max-width: 47.99rem) {
  .site-header .brand span { font-size: .95rem; }
  .site-header .account,
  .site-header .account-nav { gap: .55rem; }
  .site-header .account .button-small,
  .site-header .account-nav .button-small { min-height: 2.35rem; padding-inline: .8rem; font-size: .82rem; }
  .site-header .psc-account-status { max-width: 9rem; font-size: .85rem; text-align: end; }
  .site-header .psc-account-prefix { display: none; }
  .site-header .nav,
  .site-header .primary-nav { justify-content: flex-start; gap: 0; margin-inline: -.4rem; padding: .3rem .4rem .45rem; }
  .site-header .nav a,
  .site-header .primary-nav a { padding: 0 .44rem; font-size: .8rem; }
}
@media (max-width: 24rem) {
  .site-header .brand img { width: 2.1rem; height: 2.1rem; }
  .site-header .brand span { font-size: .88rem; }
  .site-header .account .sign-in { font-size: .8rem; }
}
