.article-analytics,
.site-stats-widget strong {
  font-variant-numeric: tabular-nums;
}

.site-stats-widget {
  position: relative;
  overflow: hidden;
  padding: 1rem;
  border: 1px solid rgba(128, 128, 128, .14);
  border-radius: 16px;
  background:
    radial-gradient(circle at 100% 0, rgba(194, 74, 44, .11), transparent 42%),
    linear-gradient(145deg, rgba(255, 255, 255, .82), rgba(245, 243, 239, .72));
  box-shadow: 0 12px 32px rgba(40, 34, 28, .07);
  backdrop-filter: blur(16px);
}

.site-stats-widget__header,
.site-stats-widget__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.site-stats-widget__header strong {
  display: block;
  margin-top: .18rem;
  color: var(--text-p1, #222);
  font-size: .94rem;
  font-weight: 600;
}

.site-stats-widget__eyebrow {
  display: block;
  color: #b34b32;
  font: 700 .58rem/1.1 Menlo, Monaco, Consolas, monospace;
  letter-spacing: .14em;
}

.site-stats-widget__metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: .9rem;
  border-top: 1px solid rgba(128, 128, 128, .13);
  border-bottom: 1px solid rgba(128, 128, 128, .13);
}

.site-stats-widget__metric {
  min-width: 0;
  padding: .8rem .65rem .72rem 0;
}

.site-stats-widget__metric + .site-stats-widget__metric {
  padding-left: .7rem;
  border-left: 1px solid var(--block-border, rgba(128, 128, 128, .18));
}

.site-stats-widget__metric span,
.site-stats-widget__footer span {
  display: block;
  color: var(--text-p3, #777);
  font-size: .68rem;
}

.site-stats-widget__metric strong {
  display: block;
  margin-top: .2rem;
  overflow: hidden;
  color: var(--text-p1, #222);
  font: 600 1.26rem/1.2 Menlo, Monaco, Consolas, monospace;
  letter-spacing: -.05em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-stats-widget__footer {
  gap: .75rem;
  padding-top: .72rem;
}

.site-stats-widget__footer a {
  flex: none;
  color: var(--text-p1, #222);
  border-bottom: 0 !important;
  font-size: .7rem;
  font-weight: 600;
  text-decoration: none;
}

.site-stats-widget__footer b {
  display: inline-block;
  margin-left: .18rem;
  color: #b34b32;
  font-size: .78rem;
  transition: transform .2s ease;
}

.site-stats-widget__footer a:hover {
  color: #c24a2c;
}

.site-stats-widget__footer a:hover b {
  transform: translate(2px, -2px);
}

.l_right .widget-wrapper.markdown:has([data-analytics-sidebar]) {
  padding-bottom: 0;
}

.l_right .widget-wrapper.markdown:has([data-analytics-sidebar]) .widget-body {
  padding: 0;
  background: transparent;
}

@media screen and (min-width: 1181px) {
  .l_body.index > .l_right {
    position: relative;
    top: auto;
    align-self: stretch;
    height: auto;
    max-height: none;
  }

  .l_body.index > .l_right > .widgets {
    position: sticky;
    top: 20px;
    height: fit-content;
  }
}

@media (prefers-color-scheme: dark) {
  .site-stats-widget {
    background:
      radial-gradient(circle at 100% 0, rgba(194, 74, 44, .15), transparent 42%),
      linear-gradient(145deg, rgba(40, 40, 42, .9), rgba(28, 28, 30, .84));
  }
}

.article-analytics {
  margin: 0;
  color: var(--text-p3, #777);
  font-size: .8rem;
}

.article-analytics a {
  color: var(--text-p2, #555);
}

.article-analytics a:hover {
  color: #c24a2c;
}

.site-stats {
  --stats-ink: var(--text-p1, #222);
  --stats-muted: var(--text-p3, #777);
  --stats-line: var(--block-border, #e7e7e7);
  --stats-accent: #c24a2c;
  max-width: 920px;
  margin: 0 auto;
  color: var(--stats-ink);
}

.site-stats__intro {
  padding: 1rem 0 2.4rem;
  border-bottom: 1px solid var(--stats-line);
}

.site-stats__eyebrow,
.site-stats__heading p {
  margin: 0 0 .55rem;
  color: var(--stats-accent);
  font: 700 .7rem/1.2 Menlo, Monaco, Consolas, monospace;
  letter-spacing: .12em;
}

.site-stats__intro h1 {
  margin: 0 0 .8rem;
  font-size: clamp(2.2rem, 7vw, 4rem);
  line-height: .95;
  letter-spacing: -.055em;
}

.site-stats__intro > p:not(.site-stats__eyebrow):not(.site-stats__status) {
  max-width: 38rem;
  margin: 0;
  color: var(--stats-muted);
}

.site-stats__status {
  margin: 1rem 0 0;
  color: var(--stats-muted);
  font-size: .8rem;
}

.site-stats__metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--stats-line);
}

.site-stats__metrics article {
  min-width: 0;
  padding: 1.5rem 1rem 1.4rem 0;
}

.site-stats__metrics article + article {
  padding-left: 1rem;
  border-left: 1px solid var(--stats-line);
}

.site-stats__metrics span,
.site-stats__metrics small {
  display: block;
  color: var(--stats-muted);
  font-size: .75rem;
}

.site-stats__metrics strong {
  display: block;
  margin: .25rem 0 .15rem;
  font: 500 clamp(1.45rem, 3vw, 2.15rem)/1.1 Menlo, Monaco, Consolas, monospace;
  letter-spacing: -.06em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.site-stats__section {
  padding: 2.5rem 0;
  border-bottom: 1px solid var(--stats-line);
}

.site-stats__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.4rem;
}

.site-stats__heading h2 {
  margin: 0;
  font-size: 1.35rem;
}

.site-stats__heading > span {
  color: var(--stats-muted);
  font: .72rem/1.2 Menlo, Monaco, Consolas, monospace;
}

.site-stats__chart {
  position: relative;
  height: 230px;
  padding: .25rem 0;
}

.site-stats__chart-hint {
  margin: -.75rem 0 .9rem;
  color: var(--stats-muted);
  font-size: .72rem;
}

.site-stats__chart svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.site-stats__chart polygon {
  fill: color-mix(in srgb, var(--stats-accent) 10%, transparent);
}

.site-stats__chart polyline {
  fill: none;
  stroke: var(--stats-accent);
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
}

.site-stats__point circle {
  fill: var(--card, #fff);
  stroke: var(--stats-accent);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  transition: r .16s ease, fill .16s ease;
  pointer-events: none;
}

.site-stats__hit {
  fill: transparent;
  cursor: crosshair;
}

.site-stats__guide {
  opacity: 0;
  stroke: color-mix(in srgb, var(--stats-accent) 48%, transparent);
  stroke-width: 1;
  stroke-dasharray: 4 4;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
  transition: opacity .16s ease;
}

.site-stats__point.is-active .site-stats__guide,
.site-stats__point:focus-visible .site-stats__guide {
  opacity: 1;
}

.site-stats__point.is-active circle {
  r: 7px;
  fill: var(--stats-accent);
}

.site-stats__point:focus-visible {
  outline: none;
}

.site-stats__tooltip {
  position: absolute;
  z-index: 2;
  top: clamp(6px, calc(var(--tooltip-y) - 72px), 148px);
  left: var(--tooltip-x);
  min-width: 118px;
  padding: .65rem .72rem;
  border: 1px solid color-mix(in srgb, var(--stats-accent) 22%, var(--stats-line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--card, #fff) 94%, transparent);
  box-shadow: 0 10px 28px rgba(40, 34, 28, .12);
  backdrop-filter: blur(12px);
  transform: translateX(-18%);
  pointer-events: none;
}

.site-stats__tooltip.is-right {
  transform: translateX(-82%);
}

.site-stats__tooltip span,
.site-stats__tooltip small {
  display: block;
  color: var(--stats-muted);
  font: .64rem/1.35 Menlo, Monaco, Consolas, monospace;
}

.site-stats__tooltip strong {
  display: block;
  margin: .18rem 0;
  color: var(--stats-ink);
  font-size: .76rem;
}

.site-stats__tooltip strong b {
  color: var(--stats-accent);
  font: 700 1.05rem/1 Menlo, Monaco, Consolas, monospace;
}

.site-stats__tooltip small {
  font-size: .58rem;
}

.site-stats__pages {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-stats__pages li {
  display: grid;
  grid-template-columns: 2.2rem minmax(0, 1fr) auto;
  align-items: baseline;
  gap: .85rem;
  padding: .82rem 0;
  border-top: 1px solid var(--stats-line);
}

.site-stats__pages span,
.site-stats__pages strong {
  color: var(--stats-muted);
  font: .75rem/1.4 Menlo, Monaco, Consolas, monospace;
  font-variant-numeric: tabular-nums;
}

.site-stats__pages a {
  min-width: 0;
  color: var(--stats-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-stats__pages a:hover {
  color: var(--stats-accent);
}

.site-stats__empty {
  display: block !important;
  color: var(--stats-muted);
}

@media (max-width: 720px) {
  .site-stats__metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-stats__metrics article:nth-child(3) {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--stats-line);
  }

  .site-stats__metrics article:nth-child(4) {
    border-top: 1px solid var(--stats-line);
  }

  .site-stats__chart {
    height: 170px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-stats *, .site-stats *::before, .site-stats *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
