.site-views {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  gap: 18px 40px;
  padding: 24px 0;
  margin-top: 22px;
  border-top: 1px solid #ffffff20;
  color: #e5e8ef;
}
.site-views-heading { display: flex; align-items: center; gap: 12px; }
.site-views-moon { color: #c8af7c; font-size: 26px; }
.site-views-title { margin: 0; font-size: 13px; font-weight: 500; letter-spacing: .06em; }
.site-views-started { display: block; margin-top: 4px; font-size: 11px; color: #b6bfce; }
.site-views-numbers { display: flex; gap: 36px; margin: 0; align-items: center; }
.site-views-numbers > div { min-width: 72px; }
.site-views-numbers dt { font-size: 11px; color: #b6bfce; margin: 0 0 3px; }
.site-views-numbers dd { margin: 0; font-size: 25px; font-weight: 400; line-height: 1.4; font-variant-numeric: tabular-nums; color: #e2cfaa; }
.site-views-numbers small { font-size: 11px; margin-left: 5px; color: #b6bfce; }
.site-views-method { grid-column: 1 / -1; font-size: 11px; color: #b6bfce; }
.site-views-method summary { cursor: pointer; width: fit-content; }
.site-views-method p { max-width: 680px; margin: 8px 0 0; font-size: 12px; line-height: 1.9; }
.site-views-method summary:focus-visible { outline: 2px solid #c8af7c; outline-offset: 5px; }
@media (max-width: 480px) {
  .site-views { grid-template-columns: 1fr; gap: 18px; }
  .site-views-numbers { gap: 48px; padding-left: 32px; }
}