/* The radar is a vector illustration; mobile uses a readable numbered legend. */
.fpc-radar { padding: clamp(32px, 5vw, 80px) 0; background: var(--fpc-wash, #f4f6f9); }
.fpc-radar .fpc-intro { max-width: 760px; margin-bottom: 20px; }
.fpc-radar-graphic { width: 100%; max-width: 1200px; margin: 0 auto; container-type: inline-size; container-name: fpc-radar; }
.fpc-radar-chart { width: 100%; position: relative; aspect-ratio: 3 / 2; }
.fpc-radar-svg { display: block; width: 100%; height: 100%; overflow: visible; font-family: var(--fpc-sans, Arial, Helvetica, sans-serif); }
.fpc-radar-label { fill: var(--fpc-muted, #66758b); font-size: 20px; font-weight: 500; }
.fpc-radar-index { display: none; fill: var(--fpc-muted, #66758b); font-size: 25px; font-weight: 600; }
.fpc-radar-legend,
.fpc-radar-status,
.fpc-radar-description { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.fpc-radar-actions { display: flex; justify-content: center; margin-top: 8px; }
.fpc-radar-toggle { color: var(--fpc-muted, #66758b); background: transparent; border: 1px solid var(--fpc-line, #d8e0eb); border-radius: 2px; min-height: 44px; padding: 8px 18px; cursor: pointer; font-size: 13px; line-height: 1.4; }
.fpc-radar-toggle:hover { color: var(--fpc-blue, #2864ff); border-color: currentColor; }
.fpc-radar-toggle[hidden] { display: none; }
.fpc-radar-caption { margin: 22px 0 0; color: var(--fpc-muted, #66758b); font-size: 13px; text-align: center; }
@container fpc-radar (max-width: 700px) {
    .fpc-radar-chart { aspect-ratio: 1; overflow: hidden; }
    .fpc-radar-svg { position: absolute; width: 150%; max-width: none; left: -25%; }
    .fpc-radar-label { display: none; }
    .fpc-radar-index { display: block; }
    .fpc-radar-legend { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; width: auto; height: auto; margin: 0 0 24px; padding: 0 0 0 24px; overflow: visible; clip: auto; clip-path: none; white-space: normal; color: var(--fpc-muted, #66758b); font-size: 14px; line-height: 1.5; }
    .fpc-radar-legend li { padding-left: 2px; overflow-wrap: anywhere; }
    .fpc-radar-legend li::marker { color: var(--fpc-blue, #2864ff); font-size: 12px; }
}
@container fpc-radar (max-width: 340px) {
    .fpc-radar-legend { grid-template-columns: 1fr; gap: 7px; }
}
@media print {
    .fpc-radar-actions { display: none; }
}
.fpc-radar-legend-index { display: none; }
.fpc-radar-graphic .screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; border: 0; }