/* Under > Analytics (public/un-analytics.js; matriz only). Everything is namespaced una-.
   Reused from styles.css (read only): .as-card, .fi-name, .as-sub, .un-stub, .un-acts, .un-sec, .un-sec-h, .un-muted, .fi, .btn.primary/.ghost.sm.un-btn.
   Theme: the --v-* variables (light and dark). Tap targets of 44 px. Nothing here scrolls sideways at 360, 375, 390 and 430 px. */

/* the period button at the top */
.una-top { margin: 0 0 10px; }
.una-range { display: flex; width: 100%; min-width: 0; min-height: 52px; align-items: center; gap: 10px; margin: 0; padding: 8px 12px; box-sizing: border-box;
  border: 1px solid var(--v-cardbd, var(--line)); border-radius: 14px; background: var(--v-card, var(--card)); color: var(--v-strong, var(--text));
  font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.una-range:focus-visible { outline: 2px solid var(--v-blue, var(--dv-blue)); outline-offset: 2px; }
.una-range:active { transform: scale(.99); }
.una-range-ic { flex: none; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 11px;
  background: color-mix(in srgb, var(--v-blue, var(--dv-blue)) 14%, transparent); color: var(--v-blue, var(--dv-blue)); }
.una-range-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.una-range-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.una-range-l { font-size: 15px; font-weight: 600; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.una-range-s { font-size: 12px; line-height: 1.3; color: var(--v-muted, var(--muted)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
.una-range-c { flex: none; font-size: 14px; color: var(--v-muted, var(--muted)); }

/* the twelve numbers, two per row */
.una-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.una-grid .as-card.una-card { min-width: 0; margin: 0; padding: 11px 12px 12px; }
.una-k { font-size: 12px; line-height: 1.3; color: var(--v-muted, var(--muted)); overflow-wrap: anywhere; }
.una-v { margin-top: 5px; font-size: clamp(16px, 4.9vw, 20px); font-weight: 600; line-height: 1.2; letter-spacing: -.2px; color: var(--v-strong, var(--text));
  font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.una-v.una-neg { color: var(--v-err, var(--err)); }
.una-v.una-wait { color: var(--v-muted, var(--muted)); font-weight: 400; }

/* the small print under the numbers */
.una-notes { margin: 12px 2px 0; }
.una-note { margin: 0 0 6px; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.una-note:last-child { margin-bottom: 0; }

/* no numbers to show */
.una-stub { margin-bottom: 0; }
.una-acts { justify-content: center; }
.una-acts .btn.sm.un-btn { flex: 0 1 200px; min-height: 44px; justify-content: center; }

/* the period sheet */
.una-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.una-opt { min-width: 0; min-height: 46px; margin: 0; padding: 8px 10px; box-sizing: border-box; border: 1px solid var(--v-line, var(--line)); border-radius: 14px;
  background: var(--v-gray-bg, rgba(255,255,255,.05)); color: var(--v-strong, var(--text)); font: inherit; font-size: 14px; text-align: center; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-tap-highlight-color: transparent; }
.una-opt:active { transform: scale(.98); }
.una-opt:focus-visible { outline: 2px solid var(--v-blue, var(--dv-blue)); outline-offset: 2px; }
.una-opt.una-on { border-color: var(--v-blue, var(--dv-blue)); background: color-mix(in srgb, var(--v-blue, var(--dv-blue)) 12%, transparent); font-weight: 600; }
.una-dates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.una-f { display: block; min-width: 0; }
.una-f-l { display: block; margin: 0 0 4px 2px; font-size: 12px; color: var(--v-muted, var(--muted)); }
.una-sheet input.fi.una-in { display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 46px; margin: 0; padding: 10px; box-sizing: border-box;
  -webkit-appearance: none; appearance: none; font-family: inherit; font-size: 16px; line-height: 1.2; color-scheme: dark; }   /* 16 px: iOS does not zoom the page on focus */
html.v2:not([data-theme="dark"]) .una-sheet input.fi.una-in { color-scheme: light; }
.una-warn { margin-top: 8px; font-size: 12.5px; line-height: 1.4; color: var(--v-err, var(--err)); }
.una-warn[hidden] { display: none; }
.una-sheet .un-acts .btn.sm.una-apply { flex: 1; min-height: 46px; justify-content: center; }
@media (prefers-reduced-motion: reduce) { .una-range, .una-opt { transition: none; transform: none; } }