/* Public shell only. Game and handbook retain their own navigation/layout CSS. */
.sq-public-header,.sq-public-footer,.sq-public-main {
  width:min(calc(100% - 2 * var(--sq-public-gutter)),var(--sq-public-max-width));
  margin-inline:auto;
}
.sq-public-header,.sq-public-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1.5rem;
}
.sq-public-header { padding-block:2rem; border-bottom:1px solid var(--sq-border); }
.sq-site-context { margin-left:auto; color:var(--sq-muted); font:.8rem/1.6 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.16em; }
.sq-public-header .wordmark {
  display:flex; align-items:center; gap:.65rem; flex:none;
  color:var(--sq-text); text-decoration:none;
  font:2.1rem/1 var(--sq-serif); letter-spacing:-.025em;
}
.sq-public-header .wordmark-emblem { width:48px; height:48px; flex:none; color:var(--sq-brand-emblem); }
.sq-public-header .wordmark-type { color:var(--sq-text); }
.sq-public-header .wordmark-type>span { color:var(--sq-brand-accent); }
.sq-public-nav,.sq-public-footer nav { display:flex; align-items:center; flex-wrap:wrap; gap:1.25rem; font:1rem/1.6 system-ui,sans-serif; }
.sq-public-nav a,.sq-public-footer a {
  display:inline-flex; align-items:center; min-height:44px;
  color:var(--sq-muted); text-decoration:none; text-underline-offset:.25em;
}
.sq-public-nav a { padding:.6rem .25rem; }
.sq-public-nav a[aria-current],.sq-public-footer a[aria-current] { color:var(--sq-gold); box-shadow:inset 0 -2px var(--sq-red); }
.sq-public-header a:hover,.sq-public-footer a:hover { color:var(--sq-gold); }
.sq-public-header a:focus-visible,.sq-public-footer a:focus-visible { outline:3px solid var(--sq-gold); outline-offset:4px; }
.sq-public-footer { max-width:none; margin-block:0; padding:1.5rem 0; border-top:1px solid var(--sq-border); font:.85rem/1.6 system-ui,sans-serif; }
.sq-public-footer .footer-brand { color:var(--sq-gold); font:1rem/1.3 var(--sq-serif); letter-spacing:.1em; }
.sq-public-footer p { margin:.25rem 0 0; color:var(--sq-muted); font-size:.8rem; }
@media(max-width:1000px) { :root { --sq-public-gutter:2.25rem; } }
@media(max-width:680px) {
  :root { --sq-public-gutter:1.5rem; }
  .sq-public-header,.sq-public-footer { gap:1rem; }
  .sq-site-context { display:none; }
  .sq-public-header { padding-block:1.25rem; }
  .sq-public-header .wordmark { font-size:1.8rem; }
  .sq-public-header .wordmark-emblem { width:36px; height:36px; }
  .sq-public-nav { gap:1.25rem; font-size:.9rem; }
  .sq-public-footer { align-items:flex-start; flex-direction:column; }
}
