/* Analytics V2 — production-candidate styles (authenticated preview only).
 *
 * Scope: everything here lives under `.av2-preview` or the `.av2-*`
 * component prefix; nothing is added to tokens.css or base.css until the
 * founder approves integration (frontend handoff §10 step 1).
 *
 * `.av2-pulse` / `.av2-inst` / `.av2-detail` are copied unchanged from the
 * reference prototype `analytics-v2-operational-pulse.html` (component
 * section). They read the workstation tokens from operator-workstation.css,
 * so they follow body[data-theme] in both NightOps and DayOps.
 */

.av2-preview {
  /* The prototypes name the fonts --font-sans / --font-mono; the app does
     not define them globally, so they are scoped here. */
  --font-sans: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;

  /* NightOps chart tokens (from analytics-v2-case-indicators.html). */
  --av2-page: #060908;
  --av2-card: #0c1110;
  --av2-card-border: rgba(170, 220, 200, 0.07);
  --av2-grid: rgba(170, 220, 200, 0.07);
  --av2-gold-line: rgba(214, 181, 110, 0.62);
  --av2-fg: #e7efeb;
  --av2-fg-muted: rgba(231, 239, 235, 0.54);
  --av2-fg-faint: rgba(231, 239, 235, 0.34);
  --av2-ease-out: cubic-bezier(0.22, 1, 0.36, 1);

  /* Metallic Color Contract V1. Colour follows the metric everywhere. */
  --metric-incoming: #E6BE78;
  --metric-resolved: #D58F70;
  --metric-backlog: #B6A167;
  --metric-resolution: #C18B87;
  --metric-ttft: #B4C0C1;

  display: grid;
  gap: 20px;
  font-family: var(--font-sans);
}

/* TODO(DayOps): Metallic V1 has no contrast-checked light twins yet
   (frontend handoff F6). Until then the metric tokens keep their NightOps
   values on light surfaces; only marker dots use them in this preview. */

.av2-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.av2-preview__banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding: 10px 14px;
  border: 1px solid var(--border-soft);
  border-left: 2px solid var(--brand-amber);
  border-radius: var(--radius-sm);
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-secondary);
}
.av2-preview__banner strong { color: var(--text-strong); font-weight: 600; }
.av2-preview__tag {
  padding: 2px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--info);
}

/* ───────────── Operational Pulse (verbatim from the reference) ───────────── */
.av2-pulse {
  --av2-footer: var(--text-muted);
  container: av2-pulse / inline-size;
  font-family: var(--font-sans);
  color: var(--text-primary);
  background: linear-gradient(180deg, var(--surface-1), var(--surface-2));
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-panel);
  padding: 18px 20px 20px;
}

.av2-pulse__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 24px;
  margin-bottom: 14px;
}
.av2-pulse__title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text-strong);
}
.av2-pulse__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 11px;
  color: var(--text-muted);
}
.av2-pulse__legend li { display: flex; align-items: center; gap: 6px; }

.av2-pop {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border: 1px solid var(--border-strong);
  border-radius: 5px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
  color: var(--text-secondary);
}

.av2-pulse__error {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid var(--border-soft);
  border-left: 2px solid var(--warning);
  border-radius: var(--radius-sm);
  font-size: 13px;
  color: var(--text-primary);
}
.av2-pulse__error small { display: block; margin-top: 2px; font-size: 11px; color: var(--text-muted); }
.av2-btn {
  font: 500 12px/1 var(--font-sans);
  color: var(--text-strong);
  background: var(--surface-3);
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  padding: 8px 14px;
  cursor: pointer;
}
.av2-btn:hover { border-color: var(--border-active); }
.av2-btn:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; }

.av2-pulse__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

/* Instrument */
.av2-inst {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  /* The children name these areas; without the template every child lands
     in the same implicit cell and the instrument text overlaps. */
  grid-template-areas: "label" "value" "second" "foot";
  min-height: 148px;
  margin: 0;
  padding: 16px 20px 14px;
  text-align: left;
  font: inherit;
  color: inherit;
  background: var(--surface-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  transition: border-color 120ms ease-out, background-color 120ms ease-out;
}
button.av2-inst { cursor: pointer; }
.av2-inst::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 18px;
  right: 18px;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: var(--accent);
  box-shadow: 0 0 12px var(--accent-glow);
  opacity: 0;
  transition: opacity 120ms ease-out;
}
button.av2-inst:hover { border-color: var(--border-strong); background: var(--surface-3); }
button.av2-inst:hover::before,
button.av2-inst:focus-visible::before,
.av2-inst[aria-expanded="true"]::before { opacity: 1; }
button.av2-inst:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; }
.av2-inst[aria-expanded="true"] { border-color: var(--border-active); background: var(--surface-3); }

.av2-inst__label {
  grid-area: label;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.av2-inst__value {
  grid-area: value;
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-top: 12px;
  min-height: 34px;
  font-family: var(--font-mono);
  font-size: 34px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
}
.av2-inst__unit { font-size: 16px; font-weight: 500; color: var(--text-secondary); letter-spacing: 0; }
.av2-inst__value--dash { color: var(--text-muted); font-weight: 500; }
.av2-inst__value--text {
  align-items: center;
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--text-secondary);
}
.av2-inst__secondary {
  grid-area: second;
  margin-top: 8px;
  font-family: var(--font-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: var(--text-secondary);
}
.av2-inst__secondary b { font-weight: 500; color: var(--text-primary); }
.av2-inst__secondary .av2-warn { color: var(--warning); }
.av2-inst__secondary--note { font-family: var(--font-sans); }
.av2-inst__footer {
  grid-area: foot;
  align-self: end;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--border-subtle);
  font-size: 11px;
  line-height: 1.45;
  color: var(--av2-footer);
}
.av2-inst__more {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--text-muted);
}
.av2-inst__more svg { width: 10px; height: 10px; transition: transform 160ms ease-out; }
.av2-inst[aria-expanded="true"] .av2-inst__more svg { transform: rotate(180deg); }
button.av2-inst:hover .av2-inst__more,
.av2-inst[aria-expanded="true"] .av2-inst__more { color: var(--text-primary); }
.av2-chip {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 6px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--info);
  vertical-align: 1px;
}

/* Loading */
.av2-skel {
  display: block;
  height: 12px;
  border-radius: 6px;
  background:
    linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--text-strong) 6%, transparent) 50%, transparent 100%) 0 0 / 200% 100%,
    color-mix(in srgb, var(--text-strong) 5%, transparent);
  animation: av2-shimmer 1.4s linear infinite;
}
.av2-skel--value { height: 30px; width: 58%; border-radius: 8px; }
.av2-skel--second { width: 44%; }
@keyframes av2-shimmer { from { background-position: 100% 0, 0 0; } to { background-position: -100% 0, 0 0; } }

/* Detail strip */
.av2-detail {
  grid-column: 1 / -1;
  padding: 16px 20px 18px;
  background: var(--surface-1);
  border: 1px solid var(--border-active);
  border-radius: var(--radius-md);
  animation: av2-reveal 200ms ease-out;
}
.av2-detail[hidden] { display: none; }
@keyframes av2-reveal { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.av2-detail__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.av2-detail__title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-strong);
}
.av2-detail__close {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  cursor: pointer;
}
.av2-detail__close:hover { color: var(--text-strong); border-color: var(--border-strong); }
.av2-detail__close:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; }
.av2-detail__close svg { width: 12px; height: 12px; }
.av2-detail__body {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr 1fr;
  gap: 16px 24px;
  margin: 0;
}
.av2-detail__body > div { min-width: 0; }
.av2-detail dt {
  margin-bottom: 6px;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.av2-detail dd { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--text-primary); }
.av2-detail dd p { margin: 0 0 6px; }
.av2-calc {
  font-family: var(--font-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
}
.av2-calc span { display: block; color: var(--text-secondary); }
.av2-detail__sources {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border-subtle);
  font-size: 11px;
  color: var(--text-muted);
}
.av2-detail__sources code {
  padding: 2px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-secondary);
  background: color-mix(in srgb, var(--text-strong) 3%, transparent);
}

/* Tablet: 2 × 2 */
@container av2-pulse (max-width: 979px) {
  .av2-pulse__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .av2-inst__value { font-size: 30px; }
  .av2-detail__body { grid-template-columns: 1fr 1fr; }
}

/* Mobile: one compact row per instrument */
@container av2-pulse (max-width: 599px) {
  .av2-pulse__grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .av2-pulse__legend { flex-direction: column; gap: 4px; }
  .av2-inst {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    grid-template-areas: "label value" "foot second";
    column-gap: 14px;
    min-height: 0;
    padding: 12px 14px;
  }
  .av2-inst__label { justify-content: flex-start; }
  .av2-inst__value { margin-top: 0; min-height: 0; justify-content: flex-end; font-size: 26px; }
  .av2-inst__value--text { font-size: 14px; text-align: right; }
  .av2-inst__unit { font-size: 13px; }
  .av2-inst__secondary { margin-top: 6px; text-align: right; align-self: start; font-size: 11.5px; }
  .av2-inst__footer {
    margin-top: 6px;
    padding-top: 0;
    border-top: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .av2-inst::before { left: 14px; right: 14px; }
  .av2-skel--value { width: 72px; height: 24px; margin-left: auto; }
  .av2-skel--second { width: 84px; margin-left: auto; }
  .av2-detail { padding: 14px; }
  .av2-detail__body { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .av2-inst, .av2-inst::before, .av2-inst__more svg { transition: none; }
  .av2-skel { animation: none; }
  .av2-detail { animation: none; }
}

/* ───────────── Approved components awaiting data ───────────── */
.av2-pending {
  display: grid;
  gap: 12px;
}
.av2-pending__head h2 {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text-strong);
}
.av2-pending__head p {
  margin: 0;
  max-width: 820px;
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--text-secondary);
}
.av2-pending__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr));
  gap: 12px;
}
.av2-na {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  padding: 16px 18px;
  background: var(--surface-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
}
.av2-na__title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-strong);
}
.av2-na__keys {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  font-size: 11px;
  font-weight: 400;
  color: var(--text-muted);
}
.av2-na__key { display: inline-flex; align-items: center; gap: 5px; }
.av2-mk {
  width: 8px;
  height: 8px;
  flex: none;
  background: var(--mk, var(--text-muted));
}
.av2-mk--circle { border-radius: 50%; }
.av2-mk--diamond { transform: rotate(45deg) scale(0.85); }
.av2-mk--square { border-radius: 2px; }
.av2-na__state {
  display: grid;
  place-items: center;
  min-height: 72px;
  padding: 10px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
  background-image: repeating-linear-gradient(
    45deg,
    color-mix(in srgb, var(--text-strong) 6%, transparent) 0 1.2px,
    transparent 1.2px 5px
  );
  font-size: 12.5px;
  font-weight: 500;
  color: var(--text-secondary);
  text-align: center;
}
.av2-na dl { display: grid; gap: 8px; margin: 0; }
.av2-na dt {
  margin-bottom: 2px;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.av2-na dd { margin: 0; font-size: 12px; line-height: 1.5; color: var(--text-primary); overflow-wrap: anywhere; }
.av2-na code {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-secondary);
}

/* ───────────── Live charts (timeseries + cohort) ───────────── */
.av2-live-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: 12px;
}
.av2-live-grid__wide { grid-column: 1 / -1; min-width: 0; }
.av2-live {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  padding: 16px 18px;
  background: var(--av2-card);
  border: 1px solid var(--av2-card-border);
  border-radius: 16px;
  color: var(--av2-fg);
}
.av2-live__head { display: grid; gap: 2px; }
.av2-live__title { margin: 0; font-size: 13px; font-weight: 600; color: var(--av2-fg); }
.av2-live__sub, .av2-live__note { margin: 0; font-size: 12px; line-height: 1.5; color: var(--av2-fg-muted); }
.av2-live__note { font-size: 11.5px; color: var(--av2-fg-faint); }
.av2-live__state {
  display: grid;
  place-items: center;
  min-height: 96px;
  font-size: 12.5px;
  color: var(--av2-fg-muted);
  text-align: center;
}
.av2-live__retry {
  margin-left: 6px;
  padding: 3px 10px;
  font: inherit;
  color: var(--av2-fg);
  background: transparent;
  border: 1px solid var(--av2-card-border);
  border-radius: 6px;
  cursor: pointer;
}
.av2-live__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 12px;
  color: var(--av2-fg-muted);
}
.av2-live__legend li { display: inline-flex; align-items: center; gap: 6px; }
.av2-live__legend strong { color: var(--av2-fg); font-weight: 600; font-variant-numeric: tabular-nums; }
.av2-live__chart { width: 100%; height: auto; display: block; outline: none; }
.av2-live__chart:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; border-radius: 6px; }
.av2-live__grid { stroke: var(--av2-grid); stroke-width: 1; }
.av2-live__axis { fill: var(--av2-fg-faint); font-size: 10px; font-family: var(--font-mono); }
.av2-live__hatch { fill: url(#av2-live-hatch); }
.av2-live__hatch-line { stroke: rgba(231, 239, 235, 0.12); stroke-width: 1.2; }
.av2-live__hit { fill: transparent; cursor: crosshair; }
.av2-live__hit--on { fill: rgba(231, 239, 235, 0.04); }
.av2-live__cross { stroke: var(--av2-fg-faint); stroke-dasharray: 2 3; pointer-events: none; }
.av2-live__line { fill: none; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; pointer-events: none; }
.av2-live__line--incoming { stroke: var(--metric-incoming); }
.av2-live__line--resolved { stroke: var(--metric-resolved); }
.av2-live__mk { pointer-events: none; }
.av2-live__mk--incoming { fill: var(--metric-incoming); }
.av2-live__mk--resolved { fill: var(--metric-resolved); }
.av2-live__mk--hollow { fill: var(--av2-card); stroke: var(--metric-incoming); stroke-width: 1.4; }
.av2-live__readout { margin: 0; min-height: 1.5em; font-size: 12.5px; color: var(--av2-fg); font-variant-numeric: tabular-nums; }

.av2-flow { display: grid; gap: 14px; }
.av2-flow__stage { display: grid; gap: 6px; outline: none; }
.av2-flow__stage:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; border-radius: 6px; }
.av2-flow__label { display: flex; align-items: baseline; gap: 10px; font-size: 12px; color: var(--av2-fg-muted); }
.av2-flow__label strong { font-size: 20px; font-weight: 600; color: var(--av2-fg); font-variant-numeric: tabular-nums; }
.av2-flow__share { margin-left: auto; font-variant-numeric: tabular-nums; }
.av2-flow__track { height: 14px; border-radius: 7px; background: var(--av2-grid); overflow: hidden; }
.av2-flow__bar { height: 100%; border-radius: 7px; background: var(--av2-gold-line); }
.av2-flow__bar--resolved { background: var(--metric-resolved); }

.av2-ind { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: end; }
.av2-ind__col { display: grid; justify-items: center; gap: 3px; min-width: 0; text-align: center; outline: none; }
.av2-ind__col:focus-visible, .av2-ind__col:hover { outline: 1px solid var(--av2-gold-line); border-radius: 6px; }
.av2-ind__track { display: flex; align-items: flex-end; width: 100%; max-width: 44px; height: 96px; border-radius: 6px; background: var(--av2-grid); overflow: hidden; }
.av2-ind__bar { width: 100%; background: var(--av2-gold-line); }
.av2-ind__value { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.av2-ind__share { font-size: 11px; color: var(--av2-fg-muted); font-variant-numeric: tabular-nums; }
.av2-ind__label { font-size: 11px; line-height: 1.3; color: var(--av2-fg-muted); overflow-wrap: anywhere; }
.av2-ind__aside { margin: 0; font-size: 12px; color: var(--av2-fg-muted); }
.av2-ind__aside strong { color: var(--av2-fg); }

/* ── Operational Calendar (analytics-v2-operational-calendar.html) ── */
.av2-cal { --m: var(--metric-incoming); --av2-zero: rgba(207, 238, 224, 0.07); }
.av2-cal__metrics { display: flex; flex-wrap: wrap; gap: 4px; }
.av2-cal__metric {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border: 1px solid transparent;
  border-radius: 999px;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  color: var(--av2-fg-muted);
  background: none;
  cursor: pointer;
  transition: color 220ms ease, background 220ms ease, border-color 220ms ease;
}
.av2-cal__metric:hover { color: var(--av2-fg); }
.av2-cal__metric[aria-checked="true"] {
  color: var(--av2-fg);
  background: color-mix(in srgb, var(--mk) 9%, transparent);
  border-color: color-mix(in srgb, var(--mk) 34%, transparent);
}
.av2-cal__metric:focus-visible { outline: 1px solid var(--av2-gold-line); outline-offset: 2px; }
.av2-cal__dot { width: 7px; height: 7px; border-radius: 2px; background: var(--mk, var(--m)); flex: none; }
.av2-cal__body { display: flex; min-width: 0; }
.av2-cal__days { flex: none; display: block; overflow: visible; }
.av2-cal__scroll { flex: 1; min-width: 0; overflow-x: auto; overflow-y: hidden; padding-bottom: 2px; scrollbar-width: thin; }
/* Native cell size; the year scrolls rather than shrinking (overrides the
 * global `svg { max-width: 100% }` in operator-workstation.css). */
.av2-cal__days, .av2-cal__grid { max-width: none; }
.av2-cal__grid { display: block; overflow: visible; outline: none; }
.av2-cal__grid:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; border-radius: 4px; }
.av2-cal__axis { font-size: 10.5px; fill: var(--av2-fg-faint); }
.av2-cal__month { font-size: 10.5px; fill: var(--av2-fg-muted); }
.av2-cal__quarter { font-size: 10px; letter-spacing: 0.06em; fill: var(--av2-fg-faint); }
.av2-cal__sep { fill: none; stroke: url(#av2-cal-sep); stroke-width: 1; }
.av2-cal__cell {
  fill: var(--m);
  fill-opacity: 0;
  stroke: transparent;
  stroke-width: 1;
  cursor: pointer;
  transition: fill 280ms ease, fill-opacity 280ms ease, stroke 280ms ease;
}
.av2-cal__cell.lv-0 { fill: var(--av2-zero); fill-opacity: 1; }
.av2-cal__cell.lv-1 { fill-opacity: 0.28; }
.av2-cal__cell.lv-2 { fill-opacity: 0.48; }
.av2-cal__cell.lv-3 { fill-opacity: 0.70; }
.av2-cal__cell.lv-4 { fill-opacity: 0.94; }
.av2-cal__cell.st-nr { fill: url(#av2-cal-hatch); fill-opacity: 1; }
.av2-cal__cell.st-no { fill-opacity: 0; stroke: rgba(231, 239, 235, 0.24); }
.av2-cal__cell.is-pinned { stroke: color-mix(in srgb, var(--m) 60%, transparent); stroke-width: 1.5; }
.av2-cal__cell.is-on { stroke: var(--m); stroke-width: 1.5; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--m) 55%, transparent)); }
.av2-cal__legend { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; justify-content: space-between; font-size: 11.5px; color: var(--av2-fg-muted); }
.av2-cal__scale { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; margin: 0; padding: 0; list-style: none; }
.av2-cal__scale li { display: flex; align-items: center; gap: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.av2-cal__sw { width: 11px; height: 11px; border-radius: 2px; flex: none; background: var(--m); }
.av2-cal__sw.lv-0 { background: var(--av2-zero); }
.av2-cal__sw.lv-1 { opacity: 0.28; } .av2-cal__sw.lv-2 { opacity: 0.48; } .av2-cal__sw.lv-3 { opacity: 0.70; } .av2-cal__sw.lv-4 { opacity: 0.94; }
.av2-cal__sw.st-nr { background: repeating-linear-gradient(45deg, rgba(231, 239, 235, 0.16) 0 1.2px, transparent 1.2px 3.5px); }
/* Borders and outlines, never box-shadow, for state: operator-workstation.css
 * resets box-shadow on every element with !important. */
.av2-cal__sw.st-no { box-sizing: border-box; background: none; border: 1px solid rgba(231, 239, 235, 0.24); }
.av2-cal__unit { color: var(--av2-fg-faint); }
.av2-cal__tip {
  display: inline-grid;
  min-width: 196px;
  min-height: 54px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(12, 17, 16, 0.94);
  border: 1px solid rgba(207, 238, 224, 0.12);
  font-size: 12px;
  line-height: 1.35;
}
.av2-cal__tip--idle { color: var(--av2-fg-faint); border-style: dashed; align-content: center; }
.av2-cal__tip-date { font-weight: 500; color: var(--av2-fg); white-space: nowrap; }
.av2-cal__tip-row { display: flex; align-items: center; gap: 7px; margin-top: 5px; color: var(--av2-fg-muted); white-space: nowrap; }
.av2-cal__tip-val { margin-left: auto; padding-left: 16px; font-weight: 600; color: var(--av2-fg); font-variant-numeric: tabular-nums; }
.av2-cal__tip-na { margin-left: auto; padding-left: 16px; color: var(--av2-fg-faint); }
.av2-cal__tip-note { margin-top: 4px; font-size: 11px; color: var(--av2-fg-faint); }

/* ── Execution Paths Sankey (analytics-v2-execution-sankey.html) ── */
.av2-sk {
  --sk-ring: #4f7e6c;
  --sk-ring-inner: #6a9c88;
  --sk-node: rgba(207, 238, 224, 0.62);
  --sk-glow: rgba(150, 205, 182, 0.20);
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
  outline: none;
  user-select: none;
}
.av2-sk:focus-visible { outline: 2px solid var(--av2-gold-line); outline-offset: 2px; border-radius: 6px; }
.av2-sk__head { font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; fill: var(--av2-fg-faint); }
@media (max-width: 560px) { .av2-sk__head { font-size: 9.5px; } }
.av2-sk__link {
  fill: var(--sk-ring);
  fill-opacity: 0.38;
  cursor: pointer;
  transition: fill 220ms ease, fill-opacity 220ms ease, filter 220ms var(--av2-ease-out);
}
.av2-sk__link--thin { stroke: transparent; }
.av2-sk.is-active .av2-sk__link { fill-opacity: 0.16; }
.av2-sk .av2-sk__link.is-locked { fill: var(--sk-ring-inner); fill-opacity: 0.5; }
.av2-sk .av2-sk__link.is-on { fill: var(--sk-ring-inner); fill-opacity: 0.86; filter: drop-shadow(0 0 14px var(--sk-glow)); stroke: var(--av2-gold-line); stroke-width: 1px; }
.av2-sk__node { fill: var(--sk-node); transition: opacity 240ms ease, fill 240ms ease; }
.av2-sk__node--uncertain { fill: none; stroke: rgba(150, 205, 182, 0.50); stroke-width: 1; stroke-dasharray: 2 3; }
.av2-sk.is-active .av2-sk__node:not(.is-on),
.av2-sk.is-active .av2-sk__label:not(.is-on) { opacity: 0.4; }
.av2-sk .av2-sk__node.is-on:not(.av2-sk__node--uncertain) { fill: var(--av2-fg); }
.av2-sk__label { paint-order: stroke; stroke: var(--av2-card); stroke-width: 3px; stroke-linejoin: round; transition: opacity 240ms ease; }
.av2-sk__name { font-weight: 500; fill: var(--av2-fg-muted); }
.av2-sk__count { font-weight: 600; fill: var(--av2-fg); font-variant-numeric: tabular-nums; }
.av2-sk__label--uncertain .av2-sk__name { fill: var(--av2-fg-faint); }
.av2-sk__label.is-on .av2-sk__name { fill: var(--av2-fg); }
.av2-sk__tip { pointer-events: none; }
.av2-sk__tip rect { fill: rgba(12, 17, 16, 0.94); stroke: rgba(207, 238, 224, 0.12); }
.av2-sk__tip-route { font-size: 12px; font-weight: 500; fill: var(--av2-fg); }
.av2-sk__tip-label { font-size: 12px; fill: var(--av2-fg-muted); }
.av2-sk__tip-val { font-size: 12px; font-weight: 600; fill: var(--av2-fg); font-variant-numeric: tabular-nums; }
.av2-sk__tip-dot { fill: var(--sk-ring-inner); }

.av2-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
  .av2-cal__cell, .av2-cal__metric, .av2-sk__link, .av2-sk__node, .av2-sk__label { transition: none !important; }
}