/* Visits: 4th header stat cell (owner only) + stats modal (see visits.js) */
.stats.has-v { grid-template-columns: repeat(4, auto); }
.stats .vs-cell { cursor: pointer; }
.stats .vs-cell:hover dd, .stats .vs-cell:focus-visible dd { color: var(--amber); }
.stats .vs-cell:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; border-radius: 6px; }
@media (max-width: 719px) {
  html.mh .stats.has-v { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html.mh .stats.has-v > div { padding: 8px 2px; }
  html.mh .stats.has-v dt { font-size: 8.5px; letter-spacing: .07em; }
  html.mh .stats.has-v dd { font-size: 17px; }
  html.mh .profile.shrunk .stats.has-v > div { padding: 4px 2px; gap: 3px; }
  html.mh .profile.shrunk .stats.has-v dd { font-size: 13px; }
  html.mh .profile.shrunk .stats.has-v dt { font-size: 7.5px; letter-spacing: .04em; }
  .stats.has-v > div { padding: 0 7px; }
}
@media (min-width: 720px) { html.mh .stats.has-v > div { padding: 0 6px; } html.mh .profile:has(.stats.has-v) { column-gap: 14px; } html.mh .profile:has(.stats.has-v) .since-line { font-size: 11.5px; } html.mh .stats.has-v dd { font-size: 19px; } html.mh .stats.has-v dt { letter-spacing: .07em; } }
@media (min-width: 720px) and (max-width: 899px) { html.mh .stats.has-v > div { padding: 0 6px; } }
.fm-backdrop.vs .fm-sheet { height: auto; max-height: calc(100dvh - 40px); }
@media (min-width: 720px) { .fm-backdrop.vs .fm-sheet { height: auto; } }
.vs-body { padding: 6px 18px 18px; }
.vs-row { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.vs-k { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); }
.vs-n b { font: 400 26px/1 var(--serif); font-variant-numeric: tabular-nums lining-nums; }
.vs-split { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--muted); }
.vs-split b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
.vs-dot { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 6px; vertical-align: 0; }
.vs-dot.a { background: var(--amber); } .vs-dot.m { background: #e9dcc6; }
.vs-chart { padding: 14px 0 4px; }
.vs-bars { display: grid; grid-template-columns: repeat(30, 1fr); gap: 2px; align-items: end; height: 70px; margin-top: 10px; }
.vs-bar { height: 100%; display: flex; align-items: flex-end; }
.vs-bar i { display: flex; flex-direction: column-reverse; width: 100%; background: var(--amber); border-radius: 2px 2px 0 0; overflow: hidden; min-height: 0; }
.vs-bar i u { display: block; width: 100%; background: #e9dcc6; text-decoration: none; }
.vs-bar:has(i[style="height:0%"])::after { content: ''; }
.vs-bars .vs-bar { border-bottom: 1px solid var(--line); }
.vs-legend { display: flex; gap: 16px; margin-top: 8px; font-size: 11.5px; color: var(--faint); }
.vs-note { margin: 12px 0 0; font-size: 12px; line-height: 1.45; color: var(--faint); }
