/* joe-b.com's look for what the CMS draws on every page: the banner, the notice (message of the day), the poster and
 * the picture viewer (the CMS's published embed.js, lightbox.js and cms.css). Colours from the site's own palette
 * and the live release's CMS parts styles (b3b5a81 cms-parts.css). Nothing here shows until the client turns the
 * tool on in the portal. */
:root {
  --content-banner-bg: #5a1722;
  --content-banner-ink: #f7f6f4;
  --content-poster-card: #11131a;
  --content-poster-ink: #f7f6f4;
  --content-poster-border: rgba(255, 255, 255, .08);
  --content-poster-radius: 8px;
  --content-poster-font: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --content-poster-scrim: rgba(5, 5, 8, .8);
  --cms-lb-backdrop: rgba(5, 5, 8, .92);
  --cms-lb-ink: #f7f6f4;
  --cms-lb-control: rgba(10, 10, 14, .8);
  --cms-lb-control-ink: #f7f6f4;
  --cms-lb-radius: 8px;
}
.content-motd {
  position: relative;
  z-index: 60;
  padding: .42rem 1.25rem;
  background: #0a0a0e;
  color: #f7f6f4;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Helvetica Neue', sans-serif;
  font-size: .84rem;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.content-motd[hidden] { display: none; }
.content-motd a { color: inherit; text-decoration: none; }
.content-motd a:hover { color: #D14A5B; }
.content-motd::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #D14A5B;
  margin-right: .65rem;
  vertical-align: middle;
}