/* The public site's own pieces: the 18+ mark in the nav, the footer on every page, the legal pages.
   Everything else is the console's Courtside skin. */

.site-18 { align-self: center; display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 26px; padding: 0 7px; border-radius: 7px;
  box-shadow: inset 0 0 0 1.5px var(--px-ink-3); font: 800 12.5px var(--f-sans); color: var(--px-ink-2); text-decoration: none; }
.site-18:hover { color: #fff; box-shadow: inset 0 0 0 1.5px #fff; }

.site-foot { max-width: 1376px; margin: 56px auto 0; padding: 22px 16px 40px; border-top: 1px solid var(--cs-line, rgba(255, 255, 255, .08)); font: 400 13px/1.55 var(--f-sans); color: var(--px-ink-3); }
.site-foot p { margin: 0 0 8px; }
.site-foot a { color: var(--px-ink-2); }
.site-foot-rg { color: var(--px-ink-2); }
.site-foot-rg b { color: #fff; }
.site-foot-links { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 14px 0 10px; }
.site-foot-links a { color: var(--px-ink-2); text-decoration: none; }
.site-foot-links a:hover { color: #fff; text-decoration: underline; }
.site-foot-c { font-size: 12px; }

.site-about { max-width: 68ch; margin: 0 auto; padding: 40px 16px 8px; font: 400 15.5px/1.65 var(--f-sans); color: var(--px-ink-2); }
.site-about h1 { margin: 0 0 18px; font: 900 40px/1 var(--f-disp); color: #fff; text-transform: uppercase; }
.site-about p, .site-about ul { margin: 0 0 14px; }
.site-about li { margin: 0 0 8px; }
.site-about a { color: #fff; }
.site-about b { color: #fff; }

/* A phone: the console hides the wordmark to fit System; the site has no System, so the name
   shows and the single sport's pill goes. */
@media (max-width: 760px) {
  .site .nav .brand { display: flex; }
  .site .nav > span.nav-sport, .site .nav .nav-sep { display: none; }
}