.visit-history-dialog {
  width: min(780px, calc(100vw - 28px));
  max-height: min(760px, calc(100dvh - 28px));
  padding: 0;
  border: 1px solid #b78a4f;
  border-radius: 20px;
  color: #26353c;
  background: #fffaf0;
  box-shadow: 0 24px 70px #132a34a8;
  overflow: auto;
}
.visit-history-dialog::backdrop { background: #071b2bb8; }
.visit-history-dialog, .visit-history-dialog * { box-sizing: border-box; }
.visit-history-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 22px 24px 8px; }
.visit-history-kicker { display: block; color: #9b6a36; font-size: 12px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.visit-history-head h2 { margin: 3px 0 0; font-size: 27px; line-height: 1.15; }
.visit-history-close { flex: none; width: 34px; height: 34px; border: 0; border-radius: 10px; background: #eadcc8; color: #30424a; font-size: 26px; line-height: 1; cursor: pointer; }
.visit-history-intro { margin: 2px 24px 14px; color: #5b6767; font-size: 13px; line-height: 1.4; }
.visit-history-message { margin: 0 24px 8px; color: #a04235; font-size: 13px; }
.visit-history-message:empty { display: none; }
.visit-history-content { padding: 0 24px 24px; }
.visit-history-content[hidden] { display: none; }
.visit-history-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid #dfd3bb; font-size: 13px; font-weight: 800; }
.visit-history-refresh { border: 0; border-radius: 9px; background: #2e5563; color: #fff; font: inherit; font-weight: 800; padding: 7px 10px; cursor: pointer; min-height: 32px; font-size: 12px; }
.visit-history-month-bar { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; gap: 8px; margin: 9px 0 8px; }
.visit-history-month-picker { position: relative; justify-self: center; display: inline-flex; align-items: center; max-width: 100%; }
.visit-history-month { appearance: none; max-width: 100%; padding: 5px 22px 5px 8px; border: 0; border-bottom: 1px dashed #b6936b; border-radius: 0; background: transparent; color: #26353c; font: 800 18px/1.2 Arial,sans-serif; text-align: center; text-align-last: center; cursor: pointer; }
.visit-history-month-picker span { position: absolute; right: 5px; color: #8b653c; font-size: 12px; pointer-events: none; }
.visit-history-prev, .visit-history-next { width: 38px; height: 38px; border: 1px solid #dfd3bb; border-radius: 9px; background: #f5ead6; color: #594533; font: 800 26px/1 Arial,sans-serif; cursor: pointer; }
.visit-history-prev:disabled, .visit-history-next:disabled { opacity: .35; cursor: default; }
.visit-history-chart-head { display: flex; justify-content: space-between; gap: 12px; color: #78654c; font-size: 11px; font-weight: 800; }
.visit-history-chart-scale { font-variant-numeric: tabular-nums; }
.visit-history-chart-scroller { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #b78a4f #f3ead9; margin-top: 5px; }
.visit-history-calendar { position: relative; display: grid; grid-template-columns: repeat(var(--visit-days),minmax(0,1fr)); gap: 2px; width: 100%; min-width: 650px; height: 215px; border-bottom: 1px solid #bba98f; }
.visit-history-calendar::before { content: ""; position: absolute; inset: 0 0 24px; pointer-events: none; background: linear-gradient(to bottom,transparent 24.7%,#e8dece 25%,transparent 25.3%,transparent 49.7%,#e8dece 50%,transparent 50.3%,transparent 74.7%,#e8dece 75%,transparent 75.3%); }
.visit-history-date { position: relative; z-index: 1; display: flex; flex-direction: column; min-width: 0; height: 100%; padding: 0; border: 0; border-radius: 5px 5px 0 0; background: transparent; color: #5f544b; cursor: pointer; font: 800 10px/1 Arial,sans-serif; }
.visit-history-date:hover { background: #edddc766; }
.visit-history-date.is-selected { background: #ead3ad8c; }
.visit-history-date:focus-visible, .visit-history-month-bar button:focus-visible, .visit-history-month:focus-visible, .visit-history-close:focus-visible, .visit-history-refresh:focus-visible { outline: 3px solid #237c98; outline-offset: 2px; }
.visit-history-date-plot { position: relative; display: block; flex: 1; min-height: 0; border-bottom: 1px solid #bba98f; }
.visit-history-date-bar { position: absolute; left: 12%; bottom: 0; width: 76%; height: var(--visit-bar-height,0%); border-radius: 4px 4px 0 0; background: var(--visit-bar-color,#ca6662); }
.visit-history-date:not(.has-visits) .visit-history-date-bar { display: none; }
.visit-history-date-count { position: absolute; left: 0; right: 0; bottom: calc(var(--visit-bar-height,0%) + 3px); color: #79292e; text-align: center; font-size: 10px; font-variant-numeric: tabular-nums; }
.visit-history-date-number { display: grid; place-items: center; flex: 0 0 24px; font-variant-numeric: tabular-nums; }
.visit-history-date.is-selected .visit-history-date-number { color: #8b3b25; }
.visit-history-detail { margin-top: 15px; padding-top: 13px; border-top: 1px solid #dfd3bb; }
.visit-history-detail h3 { margin: 0; font-size: 16px; line-height: 1.25; text-transform: capitalize; }
.visit-history-day-summary { margin: 5px 0 8px; color: #6d5345; font-size: 12px; font-weight: 800; }
.visit-history-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 3px; border-bottom: 1px solid #e9e2d5; font-size: 14px; }
.visit-history-row:last-child { border-bottom: 0; }
.visit-history-row strong { overflow-wrap: anywhere; }
.visit-history-row span { color: #54686b; text-align: right; font-variant-numeric: tabular-nums; font-size: 12px; line-height: 1.35; }
.visit-history-empty { margin: 10px 0 0; color: #5d6c6c; font-size: 13px; }
.panel .mark[role="button"] { cursor: default; }
.panel .mark[role="button"]:focus-visible { outline: 3px solid #346f83; outline-offset: 3px; }
@media (max-width: 480px) {
  .visit-history-head { padding: 18px 18px 8px; }
  .visit-history-intro, .visit-history-message { margin-left: 18px; margin-right: 18px; }
  .visit-history-content { padding-left: 18px; padding-right: 18px; }
  .visit-history-row { display: block; }
  .visit-history-row span { display: block; margin-top: 4px; text-align: left; }
}