/* ============================================================
   Fraud analytics — page-scoped additions on top of the shared
   capability template (/styles/pages/capability.css, .p-capability).
   Scope: every rule starts with .p-capability--fraud-analytics so it
   never bleeds onto the sibling /platform/ routes that share the
   template sheet.

   This page's job (G2 round, 2026-07-31): the four walk-row visuals
   are BUILT wireframe mocks of the real Incode analytics dashboard
   views — a white product window, light-grey skeleton shapes, thin
   hairlines and a single blue accent, clearly readable as a mock.
   Vocabulary mirrors the site's own dashboard-window kit
   (products-hub .ph-dash). Tokens only (passes E5/E12). No invented
   numbers: the mocks carry labels and shapes only. Each keeps its
   data-ph id + a small "Mockup" corner chip so it stays greppable
   until final art lands.
   ============================================================ */

/* ---- the window frame (shared by every mock) ----
   Dashboard mocks are 16:9 at tablet+ (G11 — never a squashed dashboard),
   4/3 on phones so the chart body still breathes. */
.p-capability--fraud-analytics .fa-mock {
  position: relative;
  display: flex;
  flex-direction: column;
  aspect-ratio: 4 / 3;
  border: 1px solid var(--color-border-light);
  border-radius: 16px;
  background: var(--color-white);
  box-shadow: none; /* hard shadow, site rule */
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
@media (min-width: 768px) { .p-capability--fraud-analytics .fa-mock { aspect-ratio: 16 / 9; } }
.p-capability--fraud-analytics .cap-walk__row:hover .fa-mock {
  border-color: color-mix(in oklab, var(--color-blue) 25%, transparent);
  box-shadow: none; /* hard shadow, site rule */
}

/* alternate: even rows put the media on the left (the shared sheet
   only re-orders .cap-tile). */
@media (min-width: 768px) {
  .p-capability--fraud-analytics .cap-walk__row:nth-child(even) .fa-mock { order: 1; }
}

/* window chrome */
.p-capability--fraud-analytics .fa-mock__bar {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: none;
  padding: 12px 16px;
  border-bottom: 1px solid var(--color-border-light);
}
.p-capability--fraud-analytics .fa-mock__dot {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--color-grey-200);
}
.p-capability--fraud-analytics .fa-mock__crumb {
  margin-left: 10px;
  font-size: var(--fs-xs);
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-mock__live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  font-size: var(--fs-xs);
  letter-spacing: var(--track-wide);
  color: var(--color-blue);
}
.p-capability--fraud-analytics .fa-mock__live-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--color-blue);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--color-blue) 20%, transparent);
}

/* the discreet "Mockup" corner chip (keeps the built visuals greppable
   until final assets replace them) */
.p-capability--fraud-analytics .fa-mock__chip {
  position: absolute;
  top: 10px; right: 10px;
  z-index: 3;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--color-placeholder-yellow);
  color: var(--color-black);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: var(--track-wide);
}

.p-capability--fraud-analytics .fa-mock__body {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 18px 20px 20px;
}

/* ---- v1 · conversion funnel ---- */
.p-capability--fraud-analytics .fa-funnel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex: none;
  margin-bottom: 14px;
}
.p-capability--fraud-analytics .fa-funnel__view {
  font-size: var(--fs-xs);
  color: var(--color-grey-500);
}
.p-capability--fraud-analytics .fa-funnel__range {
  padding: 3px 10px;
  border: 1px solid var(--color-border-light);
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
  white-space: nowrap;
}
.p-capability--fraud-analytics .fa-funnel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
}
.p-capability--fraud-analytics .fa-funnel__step {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}
.p-capability--fraud-analytics .fa-funnel__label {
  font-size: var(--fs-xs);
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-funnel__track {
  position: relative;
  display: flex;
  justify-content: center;
}
.p-capability--fraud-analytics .fa-funnel__bar {
  width: var(--w, 100%);
  height: 15px;
  border-radius: 5px;
  background: var(--color-grey-100);
}
.p-capability--fraud-analytics .fa-funnel__bar--accent { background: var(--color-blue); }
.p-capability--fraud-analytics .fa-funnel__note {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  font-size: 11px;
  line-height: 1.4;
  color: var(--color-grey-400);
  white-space: nowrap;
}

/* ---- v2 · geo heat map ---- */
.p-capability--fraud-analytics .fa-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: none;
}
.p-capability--fraud-analytics .fa-filter {
  padding: 4px 11px;
  border: 1px solid var(--color-border-light);
  border-radius: 999px;
  font-size: var(--fs-xs);
  line-height: 1.4;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-filter--on {
  border-color: color-mix(in oklab, var(--color-blue) 45%, transparent);
  color: var(--color-blue);
}
.p-capability--fraud-analytics .fa-map {
  position: relative;
  flex: 1;
  min-height: 0;
  margin-top: 12px;
  border: 1px solid var(--color-border-light);
  border-radius: 10px;
  background: var(--color-grey-50);
  overflow: hidden;
}
.p-capability--fraud-analytics .fa-map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0.9;
}
.p-capability--fraud-analytics .fa-map__pin {
  position: absolute;
  left: 29%; top: 60%;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--color-blue);
  box-shadow: 0 0 0 6px color-mix(in oklab, var(--color-blue) 22%, transparent);
}
.p-capability--fraud-analytics .fa-map__note {
  position: absolute;
  left: 33%; top: calc(60% - 8px);
  transform: translateY(-100%);
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  font-size: 11px;
  line-height: 1.4;
  color: var(--color-grey-500);
  white-space: nowrap;
}
.p-capability--fraud-analytics .fa-map__legend {
  position: absolute;
  right: 12px; bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 8px 10px;
  border: 1px solid var(--color-border-light);
  border-radius: 8px;
  background: color-mix(in oklab, var(--color-white) 88%, transparent);
}
.p-capability--fraud-analytics .fa-map__legend-label {
  font-size: 11px;
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-map__legend-ramp {
  width: 92px; height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--color-grey-200), var(--color-blue));
}
.p-capability--fraud-analytics .fa-map__legend-ends {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--color-grey-400);
}

/* ---- v3 · fraud-vector trend (stacked area) ---- */
.p-capability--fraud-analytics .fa-area {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.p-capability--fraud-analytics .fa-area__svg {
  width: 100%;
  flex: 1;
  min-height: 0;
}
.p-capability--fraud-analytics .fa-area__grid {
  stroke: var(--color-grey-100);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.p-capability--fraud-analytics .fa-area__axis {
  stroke: var(--color-grey-200);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.p-capability--fraud-analytics .fa-band-1 { fill: var(--color-grey-100); }
.p-capability--fraud-analytics .fa-band-2 { fill: var(--color-grey-200); }
.p-capability--fraud-analytics .fa-band-3 { fill: color-mix(in oklab, var(--color-grey-300) 60%, var(--color-grey-200)); }
.p-capability--fraud-analytics .fa-band-4 { fill: var(--color-grey-300); }
.p-capability--fraud-analytics .fa-band-5 { fill: var(--color-blue); }
.p-capability--fraud-analytics .fa-area__x {
  margin-top: 6px;
  text-align: center;
  font-size: 11px;
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
}

/* legend (shared by v3) */
.p-capability--fraud-analytics .fa-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 12px;
  flex: none;
}
.p-capability--fraud-analytics .fa-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  color: var(--color-grey-500);
}
.p-capability--fraud-analytics .fa-legend__sw {
  width: 11px; height: 11px;
  border-radius: 3px;
}
.p-capability--fraud-analytics .fa-sw-1 { background: var(--color-grey-100); }
.p-capability--fraud-analytics .fa-sw-2 { background: var(--color-grey-200); }
.p-capability--fraud-analytics .fa-sw-3 { background: color-mix(in oklab, var(--color-grey-300) 60%, var(--color-grey-200)); }
.p-capability--fraud-analytics .fa-sw-4 { background: var(--color-grey-300); }
.p-capability--fraud-analytics .fa-sw-5 { background: var(--color-blue); }

/* ============================================================
   CONSOLE — the live dashboard showcase (section 2). The G14
   product moment: one 16:9 analytics window in the workflow-builder
   illustration language, with an interactive Web / SDK / API source
   toggle that morphs the summary cards + the session-volume line,
   and a scroll-in draw that brings the chart alive.
   ============================================================ */
.p-capability--fraud-analytics .fa-console {
  border-top: 1px solid var(--color-border-light);
  background: var(--color-background);
}

/* the window: full-width, true 16:9 (G11). On phones it grows to a
   fixed min-height so the rail / cards / chart never crush. */
.p-capability--fraud-analytics .fa-console__window {
  margin-top: 40px;
  aspect-ratio: auto;
  min-height: 452px;
}
@media (min-width: 640px) {
  .p-capability--fraud-analytics .fa-console__window { aspect-ratio: 16 / 9; min-height: 0; }
}

/* body: side rail + stage, both stretched to the window height */
.p-capability--fraud-analytics .fa-console__grid {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}
@media (min-width: 640px) {
  .p-capability--fraud-analytics .fa-console__grid { grid-template-columns: 168px minmax(0, 1fr); }
}

/* left rail — reads as the real dashboard nav */
.p-capability--fraud-analytics .fa-console__rail {
  display: none;
  flex-direction: column;
  gap: 4px;
  padding: 18px 14px;
  border-right: 1px solid var(--color-border-light);
  background: var(--color-grey-50);
}
@media (min-width: 640px) { .p-capability--fraud-analytics .fa-console__rail { display: flex; } }
.p-capability--fraud-analytics .fa-nav {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: var(--fs-xs);
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-nav__ico {
  width: 12px; height: 12px;
  flex: none;
  border-radius: 4px;
  background: var(--color-grey-200);
}
.p-capability--fraud-analytics .fa-nav--on {
  background: var(--color-white);
  color: var(--color-blue);
  box-shadow: inset 0 0 0 1px var(--color-border-light);
}
.p-capability--fraud-analytics .fa-nav--on .fa-nav__ico { background: var(--color-blue); }

/* stage */
.p-capability--fraud-analytics .fa-console__stage {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 18px 20px 20px;
}

/* ---- source toggle (real buttons, active via aria-selected) ---- */
.p-capability--fraud-analytics .fa-src {
  display: inline-flex;
  gap: 4px;
  flex: none;
  padding: 4px;
  border: 1px solid var(--color-border-light);
  border-radius: 999px;
  align-self: flex-start;
}
.p-capability--fraud-analytics .fa-src__tab {
  padding: 5px 16px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  font-family: inherit;
  font-size: var(--fs-xs);
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.p-capability--fraud-analytics .fa-src__tab:hover { color: var(--color-grey-500); }
.p-capability--fraud-analytics .fa-src__tab[aria-selected="true"] {
  background: var(--color-black);
  color: var(--color-white);
}

/* ---- summary KPI cards ---- */
.p-capability--fraud-analytics .fa-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
  flex: none;
}
.p-capability--fraud-analytics .fa-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--color-border-light);
  border-radius: 10px;
}
.p-capability--fraud-analytics .fa-card__label {
  font-size: 11px;
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-card__row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.p-capability--fraud-analytics .fa-card__val {
  height: 16px;
  border-radius: 5px;
  background: var(--color-grey-200);
  transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.p-capability--fraud-analytics .fa-card__val--accent { background: var(--color-blue); }
.p-capability--fraud-analytics .fa-card__delta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px; height: 16px;
  flex: none;
  border-radius: 4px;
  background: color-mix(in oklab, var(--color-blue) 12%, var(--color-grey-50));
  color: var(--color-blue);
}
.p-capability--fraud-analytics .fa-card__delta svg { width: 8px; height: 8px; fill: currentColor; }

/* per-source KPI widths — shapes only, no figures shown */
.p-capability--fraud-analytics [data-source="web"] { --fa-v1: 76%; --fa-v2: 88%; --fa-v3: 58%; }
.p-capability--fraud-analytics [data-source="sdk"] { --fa-v1: 60%; --fa-v2: 80%; --fa-v3: 70%; }
.p-capability--fraud-analytics [data-source="api"] { --fa-v1: 68%; --fa-v2: 92%; --fa-v3: 50%; }
.p-capability--fraud-analytics .fa-cards .fa-card:nth-child(1) .fa-card__val { width: var(--fa-v1, 72%); }
.p-capability--fraud-analytics .fa-cards .fa-card:nth-child(2) .fa-card__val { width: var(--fa-v2, 84%); }
.p-capability--fraud-analytics .fa-cards .fa-card:nth-child(3) .fa-card__val { width: var(--fa-v3, 60%); }

/* ---- session-volume line (total grey · approved blue) ---- */
.p-capability--fraud-analytics .fa-line {
  position: relative;
  flex: 1;
  min-height: 0;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--color-border-light);
  display: flex;
  flex-direction: column;
}
.p-capability--fraud-analytics .fa-line__cap {
  font-size: 11px;
  letter-spacing: var(--track-wide);
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fa-line__svg {
  width: 100%;
  flex: 1;
  min-height: 0;
  margin-top: 8px;
}
.p-capability--fraud-analytics .fa-line__total,
.p-capability--fraud-analytics .fa-line__appr {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  opacity: 0;
  transition: opacity 0.5s ease;
}
.p-capability--fraud-analytics .fa-line__total { stroke: var(--color-grey-300); }
.p-capability--fraud-analytics .fa-line__appr { stroke: var(--color-blue); }
/* only the active source's pair is visible */
.p-capability--fraud-analytics [data-source="web"] .fa-line--web,
.p-capability--fraud-analytics [data-source="sdk"] .fa-line--sdk,
.p-capability--fraud-analytics [data-source="api"] .fa-line--api { opacity: 1; }
.p-capability--fraud-analytics .fa-line__spike {
  fill: var(--color-white);
  stroke: var(--color-blue);
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.p-capability--fraud-analytics [data-source="web"] .fa-line__spike { opacity: 1; }
.p-capability--fraud-analytics .fa-line__flag {
  position: absolute;
  left: 60%; top: 26px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  font-size: 11px;
  line-height: 1.4;
  color: var(--color-grey-500);
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.p-capability--fraud-analytics [data-source="web"] .fa-line__flag { opacity: 1; }
.p-capability--fraud-analytics .fa-line__legend {
  display: flex;
  gap: 16px;
  margin-top: 8px;
  flex: none;
}
.p-capability--fraud-analytics .fa-line__key {
  width: 14px; height: 3px;
  border-radius: 999px;
}
.p-capability--fraud-analytics .fa-line__key--total { background: var(--color-grey-300); }
.p-capability--fraud-analytics .fa-line__key--appr { background: var(--color-blue); }

/* ---- entrance animation ---- JS adds .fa-anim on load (skipped under
   reduced motion / no JS → final state shows at once), then .is-live when
   the console scrolls into view, which fades the line in and grows the
   bars from zero. */
.p-capability--fraud-analytics .fa-anim:not(.is-live) .fa-card__val { width: 0 !important; }
.p-capability--fraud-analytics .fa-anim:not(.is-live) .fa-line__total,
.p-capability--fraud-analytics .fa-anim:not(.is-live) .fa-line__appr,
.p-capability--fraud-analytics .fa-anim:not(.is-live) .fa-line__spike,
.p-capability--fraud-analytics .fa-anim:not(.is-live) .fa-line__flag { opacity: 0 !important; }

@media (prefers-reduced-motion: reduce) {
  .p-capability--fraud-analytics .fa-card__val,
  .p-capability--fraud-analytics .fa-line__total,
  .p-capability--fraud-analytics .fa-line__appr,
  .p-capability--fraud-analytics .fa-line__spike,
  .p-capability--fraud-analytics .fa-line__flag { transition: none; }
}

/* ============================================================
   HERO · copy left, the Analytics console's Conversion funnel right
   (Mike 2026-08-10, from Nacim: "no hero visual"). Reproduces the
   product card — the ribbon narrows from Started to Completed and
   splits into Approved / Rejected with no seam between them — with
   floating observation chips around it, the /platform/accessibility/
   treatment. Footprint matches the ui-customization hero art.
   NOTE: capability.css loads AFTER this sheet, so the split carries
   .cap-hero__inner to outrank its flex-column base.
   ============================================================ */
.p-capability--fraud-analytics .cap-hero__inner.fah-hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: center;
}
@media (min-width: 1024px) {
  .p-capability--fraud-analytics .cap-hero__inner.fah-hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 64px;
  }
}
.p-capability--fraud-analytics .fah-copy { min-width: 0; }
.p-capability--fraud-analytics .fah-stage {
  position: relative;
  width: 100%;
  max-width: 500px;
  margin-inline: auto;
}
.p-capability--fraud-analytics .fah-card {
  position: relative;
  width: 100%;
  aspect-ratio: 500 / 443;
  display: flex;
  flex-direction: column;
  padding: 20px 22px 22px;
  border-radius: 16px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  box-shadow: none; /* hard shadow, site rule */
  overflow: hidden;
}
.p-capability--fraud-analytics .fah-card__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12px;
}
.p-capability--fraud-analytics .fah-card__title {
  font-size: 15px;
  font-weight: 600;
  color: var(--color-black);
}
.p-capability--fraud-analytics .fah-card__sub {
  grid-column: 1;
  font-size: 11px;
  line-height: 1.5;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fah-card__toggle {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: inline-flex;
  padding: 3px;
  border-radius: 8px;
  background: var(--color-grey-50);
  border: 1px solid var(--color-border-light);
}
.p-capability--fraud-analytics .fah-card__toggle i {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-style: normal;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fah-card__toggle i.is-on {
  background: var(--color-white);
  color: var(--color-grey-600);
  font-weight: 500;
}

.p-capability--fraud-analytics .fah-card__latest {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--color-grey-50);
  border: 1px solid var(--color-border-light);
  font-size: 11px;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fah-card__latest i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-green-500);
}
.p-capability--fraud-analytics .fah-card__latest b {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-black);
}
.p-capability--fraud-analytics .fah-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin-top: 14px;
}
.p-capability--fraud-analytics .fah-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fah-legend__key {
  width: 14px;
  height: 2px;
  border-radius: 2px;
}
.p-capability--fraud-analytics .fah-legend__key--conv {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-green-500);
}
.p-capability--fraud-analytics .fah-legend__key--peer {
  background: repeating-linear-gradient(to right, var(--color-blue-500) 0 4px, transparent 4px 7px);
}

/* the plot */
.p-capability--fraud-analytics .fah-chart {
  display: block;
  width: 100%;
  flex: 1;
  min-height: 0;
  margin-top: 6px;
}
.p-capability--fraud-analytics .fah-chart__grid line {
  stroke: var(--color-grey-100);
  stroke-width: 1;
  stroke-dasharray: 2 4;
}
.p-capability--fraud-analytics .fah-chart__ylab text,
.p-capability--fraud-analytics .fah-chart__xlab text {
  font-size: 11px;
  fill: var(--color-grey-300);
}
.p-capability--fraud-analytics .fah-chart__ylab text { text-anchor: end; }
.p-capability--fraud-analytics .fah-chart__xlab text { text-anchor: middle; }
.p-capability--fraud-analytics .fah-chart__conv {
  stroke: var(--color-green-500);
  stroke-width: 2.5;
  fill: none;
  stroke-linecap: round;
}
.p-capability--fraud-analytics .fah-chart__peer {
  stroke: var(--color-blue-500);
  stroke-width: 2;
  stroke-dasharray: 7 6;
  fill: none;
  stroke-linecap: round;
}
.p-capability--fraud-analytics .fah-chart__cross {
  stroke: var(--color-grey-200);
  stroke-width: 1;
  stroke-dasharray: 3 4;
}
.p-capability--fraud-analytics .fah-chart__pt {
  fill: var(--color-white);
  stroke: var(--color-green-500);
  stroke-width: 2.5;
}
/* the reading that hangs off the crosshair */
.p-capability--fraud-analytics .fah-tip {
  position: absolute;
  left: 56%;
  top: 44%;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--color-white);
  border: 1px solid var(--color-border-light);
  box-shadow: none; /* hard shadow, site rule */
}
.p-capability--fraud-analytics .fah-tip b {
  font-size: 11px;
  font-weight: 600;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fah-tip__conv {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-black);
}
.p-capability--fraud-analytics .fah-tip__peer {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-blue-500);
}
/* the lines draw on reveal */
.p-capability--fraud-analytics .fah-chart__conv,
.p-capability--fraud-analytics .fah-chart__peer {
  stroke-dashoffset: 0;
}
.p-capability--fraud-analytics .fah-chart__area {
  opacity: 0;
  animation: fah-flow 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.45s forwards;
}
@keyframes fah-flow {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

/* floating observation chips — the accessibility hero's chip recipe */
.p-capability--fraud-analytics .fah-chip {
  position: absolute;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 13px;
  border-radius: 999px;
  background: var(--color-white);
  border: 1px solid var(--color-grey-100);
  /* hard shadow, site rule (Sofia 2026-08-17: no soft drops anywhere;
     supersedes the soft-shadow exception Mike asked for on 2026-08-10) */
  box-shadow: none;
  font-size: var(--fs-xs);
  font-weight: 500;
  color: var(--color-black);
  white-space: nowrap;
}
.p-capability--fraud-analytics .fah-chip__ico {
  width: 14px;
  height: 14px;
  color: var(--color-blue-500);
}
/* the chips ride the funnel, never the readout containers */
.p-capability--fraud-analytics .fah-chip--a { left: -18px; top: calc(23% + 9px); }
.p-capability--fraud-analytics .fah-chip--b { right: -20px; top: calc(71% + 4px); }
.p-capability--fraud-analytics .fah-chip--c { left: calc(6% - 7px); bottom: calc(6% - 7px); }
@media (max-width: 767px) {
  .p-capability--fraud-analytics .fah-chip--a { left: 0; }
  .p-capability--fraud-analytics .fah-chip--b { right: 0; }
  .p-capability--fraud-analytics .fah-chip--c { left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .p-capability--fraud-analytics .fah-chart__area { animation: none; opacity: 1; }
}

/* ============================================================
   THE CONSOLE, r2 (Mike 2026-08-10) — the real Analytics overview:
   product wordmark + nav groups, range tabs, the confusion matrix,
   total value delivered on its grey panel, two KPI cards with
   gradient sparklines and tagged deltas, and the step funnel with
   its translucent tracks. The Web/SDK/API toggle swaps the WHOLE
   view (three datasets) and each one animates in.
   ============================================================ */
.p-capability--fraud-analytics .fa-nav__brand {
  width: 62px;
  height: auto;
  margin: 2px 0 10px 8px;
}
.p-capability--fraud-analytics .fa-nav__group {
  padding: 10px 8px 4px;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-grey-300);
}
.p-capability--fraud-analytics .fac-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.p-capability--fraud-analytics .fac-range {
  display: inline-flex;
  padding: 3px;
  border-radius: 8px;
  background: var(--color-grey-50);
  border: 1px solid var(--color-border-light);
}
.p-capability--fraud-analytics .fac-range i {
  padding: 4px 9px;
  border-radius: 6px;
  font-size: 10px;
  font-style: normal;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fac-range i.is-on {
  background: var(--color-white);
  color: var(--color-grey-600);
  font-weight: 500;
}

/* the three views the source toggle swaps */
.p-capability--fraud-analytics .fac-views { margin-top: 14px; }
.p-capability--fraud-analytics .fac-view { display: none; }
.p-capability--fraud-analytics [data-source="web"] .fac-view--web,
.p-capability--fraud-analytics [data-source="sdk"] .fac-view--sdk,
.p-capability--fraud-analytics [data-source="api"] .fac-view--api {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 12px;
  animation: fac-view-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes fac-view-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
/* the bars and sparklines grow as the view lands */
.p-capability--fraud-analytics .fac-step__bar,
.p-capability--fraud-analytics .fac-bar__fill {
  animation: fac-grow 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
  transform-origin: bottom center;
}
@keyframes fac-grow {
  from { transform: scaleY(0.15); opacity: 0.4; }
  to { transform: scaleY(1); opacity: 1; }
}
.p-capability--fraud-analytics .fac-spark__line {
  stroke-dasharray: 320;
  stroke-dashoffset: 320;
  animation: fac-draw 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.15s both;
}
@keyframes fac-draw { to { stroke-dashoffset: 0; } }
.p-capability--fraud-analytics .fac-spark__area {
  animation: fac-view-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.35s both;
}
@media (max-width: 767px) {
  .p-capability--fraud-analytics [data-source="web"] .fac-view--web,
  .p-capability--fraud-analytics [data-source="sdk"] .fac-view--sdk,
  .p-capability--fraud-analytics [data-source="api"] .fac-view--api {
    grid-template-columns: minmax(0, 1fr);
  }
}
.p-capability--fraud-analytics .fac-card {
  display: flex;
  flex-direction: column;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
}
.p-capability--fraud-analytics .fac-card__head {
  font-size: 12px;
  font-weight: 600;
  color: var(--color-black);
}
.p-capability--fraud-analytics .fac-card__head i {
  font-style: normal;
  font-weight: 400;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fac-card--matrix { grid-row: span 3; }
.p-capability--fraud-analytics .fac-matrix__score {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-black);
  margin-top: 4px;
}
.p-capability--fraud-analytics .fac-matrix {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
  flex: 1;
}
.p-capability--fraud-analytics .fac-cell {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 10px 12px;
  border-radius: 10px;
}
/* the tints stay faint so the copy carries (Mike 2026-08-10) */
.p-capability--fraud-analytics .fac-cell--ok { background: color-mix(in oklab, var(--color-green-100) 45%, var(--color-white)); }
.p-capability--fraud-analytics .fac-cell--bad { background: color-mix(in oklab, var(--color-red-100) 45%, var(--color-white)); }
.p-capability--fraud-analytics .fac-cell__tag {
  font-size: 9px;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.p-capability--fraud-analytics .fac-cell--ok .fac-cell__tag { color: var(--color-green-600); }
.p-capability--fraud-analytics .fac-cell--bad .fac-cell__tag { color: var(--color-red-600); }
.p-capability--fraud-analytics .fac-cell__sub {
  font-size: 9px;
  font-style: normal;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fac-cell b {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--color-black);
  margin-top: 2px;
}

/* total value delivered — the plot sits on its own grey panel */
/* the total reads on the left under the header, the same way the matrix
   card carries its score; the grey panel below holds only the bars */
.p-capability--fraud-analytics .fac-value__panel {
  position: relative;
  margin-top: 14px;
  padding: 14px 14px 10px;
  border-radius: 10px;
  background: color-mix(in oklab, var(--color-grey-50) 55%, var(--color-white));
}
.p-capability--fraud-analytics .fac-value__lbl {
  font-size: 10px;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .fac-value__total {
  display: block;
  margin-top: 4px;
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 600;
  color: var(--color-black);
}
.p-capability--fraud-analytics .fac-bars {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: 18px;
  height: 92px;
  margin-top: 8px;
}
.p-capability--fraud-analytics .fac-bar {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  justify-items: center;
  height: 100%;
  row-gap: 4px;
}
.p-capability--fraud-analytics .fac-bar__val {
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  color: var(--color-grey-500);
  align-self: end;
}
.p-capability--fraud-analytics .fac-bar__fill {
  grid-row: 2;
  align-self: end;
  width: 46px;
  height: var(--h);
  border-radius: 4px 4px 0 0;
  background: var(--color-blue-500);
}
.p-capability--fraud-analytics .fac-bar:last-child .fac-bar__fill {
  background: color-mix(in oklab, var(--color-blue-500) 45%, var(--color-white));
}
.p-capability--fraud-analytics .fac-bar__cap {
  font-size: 9px;
  font-style: normal;
  color: var(--color-grey-400);
  border-top: 1px solid var(--color-grey-200);
  padding-top: 5px;
  width: 100%;
  text-align: center;
}

/* the KPI pair — readout left, plot right, split by a hairline */
.p-capability--fraud-analytics .fac-kpi {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: stretch;
  padding: 0;
  overflow: hidden;
}
.p-capability--fraud-analytics .fac-kpi__box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 14px 16px;
  border-right: 1px solid var(--color-border-light);
}
.p-capability--fraud-analytics .fac-kpi__lbl {
  font-size: 11px;
  color: var(--color-grey-500);
}
.p-capability--fraud-analytics .fac-kpi__row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.p-capability--fraud-analytics .fac-kpi__val {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 600;
  color: var(--color-black);
}
.p-capability--fraud-analytics .fac-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--color-red-100) 70%, var(--color-white));
  color: var(--color-red-600);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}
.p-capability--fraud-analytics .fac-tag--up {
  background: color-mix(in oklab, var(--color-green-100) 70%, var(--color-white));
  color: var(--color-green-600);
}
.p-capability--fraud-analytics .fac-kpi__plot {
  position: relative;
  display: block;
  min-height: 76px;
}
.p-capability--fraud-analytics .fac-spark {
  display: block;
  width: 100%;
  height: 100%;
}
.p-capability--fraud-analytics .fac-spark__line { fill: none; stroke-width: 2; }
.p-capability--fraud-analytics .fac-spark__line--down { stroke: var(--color-red-brand); }
.p-capability--fraud-analytics .fac-spark__line--up { stroke: var(--color-green-500); }
.p-capability--fraud-analytics .fac-kpi__range {
  position: absolute;
  right: 12px;
  bottom: 8px;
  font-size: 9px;
  font-style: normal;
  color: var(--color-grey-400);
}

/* the step funnel — each step is a translucent track the fill sits in */
.p-capability--fraud-analytics .fac-card--funnel { grid-column: 1 / -1; }
.p-capability--fraud-analytics .fac-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: end;
  gap: 10px;
  height: 176px;
  margin-top: 12px;
}
.p-capability--fraud-analytics .fac-step {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  justify-items: center;
  height: 100%;
  row-gap: 6px;
}
.p-capability--fraud-analytics .fac-step__track {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background: color-mix(in oklab, var(--color-blue-500) 12%, var(--color-white));
}
.p-capability--fraud-analytics .fac-step--done .fac-step__track {
  background: color-mix(in oklab, var(--color-green-500) 12%, var(--color-white));
}
.p-capability--fraud-analytics .fac-step__bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--h);
  border-radius: 6px;
  background: var(--color-blue-500);
}
.p-capability--fraud-analytics .fac-step--done .fac-step__bar { background: var(--color-green-600); }
.p-capability--fraud-analytics .fac-step__chip {
  position: absolute;
  left: 50%;
  bottom: var(--h);
  transform: translate(-50%, 50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 3px 8px;
  border-radius: 6px;
  background: var(--color-white);
  border: 1px solid var(--color-grey-100); /* hairline carries elevation, no drop shadow */
  font-style: normal;
  font-size: 9px;
  color: var(--color-grey-400);
  white-space: nowrap;
}
.p-capability--fraud-analytics .fac-step__chip b {
  font-size: 10px;
  font-weight: 600;
  color: var(--color-grey-600);
}
.p-capability--fraud-analytics .fac-step__cap {
  font-size: 9px;
  font-style: normal;
  color: var(--color-grey-400);
  white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
  .p-capability--fraud-analytics .fac-step__bar,
  .p-capability--fraud-analytics .fac-bar__fill,
  .p-capability--fraud-analytics .fac-spark__line,
  .p-capability--fraud-analytics .fac-spark__area { animation: none; stroke-dashoffset: 0; opacity: 1; transform: none; }
}

/* ============================================================
   HOW IT WORKS · one console window per lens (Mike 2026-08-10) —
   the browser-mock language the other how-it-works sections use,
   carrying the views this section describes: the step funnel, the
   breakdown map, and the attack trend. Crossfaded on the same
   [data-sol-screen] mechanics as the phone deck it replaces.
   ============================================================ */
.p-capability--fraud-analytics .faw-win {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  /* narrowed per side in two passes: 560 → 540 → 510 (Mike 2026-08-10) */
  width: min(calc(100% - 32px), 510px);
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  overflow: hidden;
  box-shadow: none; /* hard shadow, site rule */
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0s linear 0.4s;
}
.p-capability--fraud-analytics .faw-win.is-active {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.7s ease;
}
/* the phone is not just hidden — it is removed, so the stage panel sizes
   to the window instead of keeping the phone's tall footprint. The panel
   itself runs wider and taller than the shared 80%/48px so the window has
   room to breathe (Mike 2026-08-10). solution.css loads AFTER this sheet,
   so the override carries .p-solution. */
.p-capability--fraud-analytics .p-solution .sol-how__stage:has(.faw-win) .sol-how__phone { display: none; }
.p-capability--fraud-analytics .p-solution .sol-how__stage:has(.faw-win) {
  position: relative;
  width: 96%;
  min-height: 400px;
  padding: 64px 34px;
}
.p-capability--fraud-analytics .faw-win__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 32px;
  padding: 0 12px;
  border-bottom: 1px solid var(--color-border-light);
  background: var(--color-grey-50);
}
.p-capability--fraud-analytics .faw-win__dots { display: inline-flex; gap: 6px; }
.p-capability--fraud-analytics .faw-win__dots i {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--color-grey-200);
}
.p-capability--fraud-analytics .faw-win__url {
  flex: 1;
  height: 16px;
  border-radius: 999px;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
}
/* every step's window is the same height (Mike 2026-08-10) */
.p-capability--fraud-analytics .faw-win__body { display: flex; align-items: stretch; height: 250px; }
.p-capability--fraud-analytics .faw-side {
  flex: 0 0 108px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 12px;
  border-right: 1px solid var(--color-border-light);
}
.p-capability--fraud-analytics .faw-side__brand { width: 58px; height: auto; margin-bottom: 4px; }
.p-capability--fraud-analytics .faw-side__line {
  height: 7px;
  border-radius: 999px;
  background: var(--color-grey-100);
}
.p-capability--fraud-analytics .faw-side__line--on { background: var(--color-blue-200); }
.p-capability--fraud-analytics .faw-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 14px 16px 16px;
}
.p-capability--fraud-analytics .faw-main__head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 12px;
}
.p-capability--fraud-analytics .faw-main__head b { font-size: 12px; font-weight: 600; color: var(--color-black); }
.p-capability--fraud-analytics .faw-main__head i { font-style: normal; font-size: 10px; color: var(--color-grey-400); }

/* 01 · the step funnel */
.p-capability--fraud-analytics .faw-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: end;
  gap: 8px;
  flex: 1;
}
.p-capability--fraud-analytics .faw-step {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto;
  justify-items: center;
  height: 100%;
  row-gap: 4px;
}
.p-capability--fraud-analytics .faw-step__track {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 5px;
  background: color-mix(in oklab, var(--color-blue-500) 12%, var(--color-white));
}
.p-capability--fraud-analytics .faw-step--done .faw-step__track { background: color-mix(in oklab, var(--color-green-500) 12%, var(--color-white)); }
.p-capability--fraud-analytics .faw-step__bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--h);
  border-radius: 5px;
  background: var(--color-blue-500);
}
.p-capability--fraud-analytics .faw-step--done .faw-step__bar { background: var(--color-green-600); }
.p-capability--fraud-analytics .faw-step__pct { font-style: normal; font-size: 9px; font-weight: 600; color: var(--color-grey-600); }
.p-capability--fraud-analytics .faw-step__cap { font-style: normal; font-size: 8px; color: var(--color-grey-400); white-space: nowrap; }

/* 02 · geographic distribution — the ranked list beside the map */
.p-capability--fraud-analytics .faw-geo {
  display: grid;
  grid-template-columns: minmax(0, 0.6fr) minmax(0, 1.4fr);
  gap: 16px;
  flex: 1;
  min-height: 0;
}
.p-capability--fraud-analytics .faw-geo__list {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-right: 4px;
}
.p-capability--fraud-analytics .faw-geo__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  column-gap: 8px;
  font-style: normal;
}
.p-capability--fraud-analytics .faw-geo__row b { font-size: 10px; font-weight: 500; color: var(--color-grey-600); }
.p-capability--fraud-analytics .faw-geo__row em { font-style: normal; font-size: 10px; font-weight: 600; color: var(--color-grey-500); }
.p-capability--fraud-analytics .faw-geo__bar {
  grid-column: 1 / -1;
  height: 3px;
  margin-top: 4px;
  border-radius: 999px;
  background: var(--color-grey-100);
  text-decoration: none;
  position: relative;
}
.p-capability--fraud-analytics .faw-geo__bar::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--w);
  border-radius: 999px;
  background: var(--color-blue-500);
}
.p-capability--fraud-analytics .faw-geo__bar--bad::after { background: var(--color-blue-500); }
.p-capability--fraud-analytics .faw-geo__bar--ok::after { background: color-mix(in oklab, var(--color-blue-500) 45%, var(--color-white)); }
.p-capability--fraud-analytics .faw-geo__map {
  position: relative;
  display: block;
  border-radius: 8px;
  background: var(--color-grey-50);
  overflow: hidden;
}
.p-capability--fraud-analytics .faw-geo__map img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 45%;
}
.p-capability--fraud-analytics .faw-geo__scale {
  position: absolute;
  right: 8px;
  top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-style: normal;
  font-size: 8px;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .faw-geo__scale em {
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(to right, color-mix(in oklab, var(--color-blue-500) 25%, var(--color-white)), var(--color-blue-500));
}

/* 03 · the trend */
.p-capability--fraud-analytics .faw-trend { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.p-capability--fraud-analytics .faw-legend { display: inline-flex; gap: 12px; }
.p-capability--fraud-analytics .faw-legend i {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-style: normal;
  font-size: 9px;
  color: var(--color-grey-400);
}
.p-capability--fraud-analytics .faw-key { width: 12px; height: 2px; border-radius: 2px; }
.p-capability--fraud-analytics .faw-key--a { background: var(--color-red-brand); }
.p-capability--fraud-analytics .faw-key--b { background: var(--color-blue-500); }
.p-capability--fraud-analytics .faw-key--c { background: var(--color-grey-300); }
.p-capability--fraud-analytics .faw-chart { display: block; width: 100%; flex: 1; min-height: 0; }
.p-capability--fraud-analytics .faw-chart__grid line { stroke: var(--color-grey-100); stroke-width: 1; stroke-dasharray: 2 4; }
.p-capability--fraud-analytics .faw-chart__l { fill: none; stroke-width: 2; }
.p-capability--fraud-analytics .faw-chart__l--a { stroke: var(--color-red-brand); }
.p-capability--fraud-analytics .faw-chart__l--b { stroke: var(--color-blue-500); }
.p-capability--fraud-analytics .faw-chart__l--c { stroke: var(--color-grey-300); }
.p-capability--fraud-analytics .faw-months { display: flex; justify-content: space-between; }
.p-capability--fraud-analytics .faw-months i { font-style: normal; font-size: 8px; color: var(--color-grey-400); }
