/* ==========================================================================
   service-fraud-monitoring.html — page-specific styles
   Only tokens from css/style.css; no new colours, no radius, no shadows.
   ========================================================================== */

/* Score bands: one continuous 0–100 bar split into approve / challenge / decline */
.score-scale { display: grid; grid-template-columns: 39fr 30fr 31fr; }
.score-scale__zone { display: flex; flex-direction: column; gap: 20px; }
.score-scale__bar { height: 14px; border: 1px solid var(--black); border-left: 0; }
.score-scale__zone:first-child .score-scale__bar { border-left: 1px solid var(--black); }
.score-scale__zone--challenge .score-scale__bar { background: repeating-linear-gradient(135deg, var(--black) 0 1px, transparent 1px 8px); }
.score-scale__zone--decline .score-scale__bar { background: var(--black); }
.score-scale__body { display: flex; flex-direction: column; gap: 12px; padding-right: var(--gap); }
.score-scale__range { font-family: var(--font-display); font-size: clamp(24px, 2.5vw, 36px); line-height: 1; }
.score-scale__action { font-size: 16px; font-weight: 700; line-height: 1.3; text-transform: uppercase; }
.score-scale__text { font-size: 14px; line-height: 1.3; color: var(--ink-70); max-width: 275px; }

/* Note under the rules.json block: inline .kbd chips are ~24px tall, so open up the line box */
.rules-note { line-height: 1.8; }
.rules-note .kbd { white-space: nowrap; }

/* Signal list under the dashboard placeholder */
.signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gap); border-top: 1px solid var(--line); }
.signals > li { padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.3; color: var(--ink); }

@media (max-width: 1023px) {
  .signals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 639px) {
  .score-scale { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
  .score-scale__bar { border-left: 1px solid var(--black); }
  .score-scale__body { padding-right: 0; }
  .score-scale__text { max-width: none; }
  .signals { grid-template-columns: minmax(0, 1fr); }
}
