/* eCSS → CSS Score. Sections are shown one at a time; printing shows all. */
.score-period{margin:-8px 0 14px;font-size:13px;font-weight:600;color:var(--muted)}
.score-period:empty{display:none}
.score-tabs{position:relative;display:flex;gap:6px;margin-bottom:20px;padding:4px;border-radius:14px;background:var(--blue-lt);width:fit-content;max-width:100%;overflow-x:auto;scrollbar-width:none}
.score-tabs::-webkit-scrollbar{display:none}
.score-tab{flex:0 0 auto;border:0;border-radius:10px;padding:9px 18px;background:transparent;color:var(--slate);font:700 13.5px var(--font);cursor:pointer;white-space:nowrap}
.score-tab:hover{color:var(--blue)}
.score-tab[aria-selected="true"]{background:var(--card);color:var(--blue);box-shadow:0 2px 8px rgba(15,23,42,.12)}
.score-tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(79,107,246,.35)}
.score-section[hidden]{display:none}
.score-print-head{display:none}
.card-note{font-size:12px;font-weight:500;color:var(--muted)}
.score-subhead{margin:0 0 12px;font-size:13.5px;font-weight:700;color:var(--slate)}

/* Overview */
.score-overview-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:20px;margin-bottom:24px}
.score-overview-grid>.card{margin-bottom:0}
.score-radar{position:relative;height:300px}
#criteria-bars .bar-label{width:190px}

/* Rankings */
.score-basis{align-items:center;flex-wrap:wrap;gap:10px 12px;margin-bottom:18px}
.score-basis label{font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.4px}
.score-basis-note{flex:1 1 320px;margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.score-basis-note b{color:var(--slate)}
.rank-table abbr{text-decoration:none;cursor:help}
.score-legend{margin:12px 0 0;font-size:12px;line-height:1.7;color:var(--muted)}
.score-legend b{color:var(--slate)}
.score-row-link{cursor:pointer}
.score-row-link:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.score-row-link td:nth-child(2) b{color:var(--blue)}
.score-chip{display:inline-block;margin:4px 4px 0 0;padding:1px 8px;border-radius:999px;background:var(--bg);border:1px solid var(--border);font-size:11px;font-weight:600;color:var(--muted)}

/* Clients */
.score-cc{gap:28px;margin-bottom:0}
.score-cc .bar-label{width:auto;flex:1 1 0;min-width:0}
.score-cc .bar-track{flex:0 0 38%}

/* Trends */
.trend-controls{align-items:flex-start;gap:16px}
.trend-offices{flex:1 1 360px;min-width:0}
.trend-offices .trend-check-list{flex-direction:row;flex-wrap:wrap;gap:6px;max-height:none;min-width:0;padding:0;border:0;background:none}
.trend-offices .trend-check-item{padding:6px 12px;border:1.5px solid var(--border);border-radius:999px;background:var(--card);max-width:100%}
.trend-offices .trend-check-item:has(input:checked){border-color:var(--blue);background:var(--blue-lt);color:var(--blue);font-weight:600}

/* Office details */
.score-office-select{min-width:min(360px,100%);max-width:100%;border:1.5px solid var(--border);border-radius:10px;padding:9px 12px;font-size:14px;color:var(--slate);background:var(--card)}
.score-office-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:18px 0 20px}
.score-stat{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-radius:12px;background:var(--bg);border:1px solid var(--border)}
.score-stat span{font-size:11.5px;font-weight:700;letter-spacing:.3px;color:var(--muted);text-transform:uppercase}
.score-stat b{font-size:20px;font-weight:800;color:var(--slate)}
.score-office-grid{gap:28px;margin-bottom:0}

@media (max-width:900px){
  .score-overview-grid{grid-template-columns:minmax(0,1fr)}
  #criteria-bars .bar-label{width:140px}
}
@media print{
  .score-tabs,.score-basis{display:none!important}
  .score-section[hidden]{display:block!important}
  .score-print-head{display:block;margin:18px 0 10px;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
  .score-legend{font-size:10px}
}
/* The whole pill is the toggle; the checkbox stays for keyboards and screen readers. */
.trend-offices .trend-check-item{position:relative}
.trend-offices .trend-check-item input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.trend-offices .trend-check-item:has(input:focus-visible){box-shadow:0 0 0 3px rgba(79,107,246,.35)}
.trend-offices .trend-check-item:has(input:checked) span::before{content:"✓ "}
@media print{
  #tab-data .bar-track,#tab-data .bar-fill,#tab-data .rating-pill{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  /* The Keys print sheet belongs to the Keys page only. */
  body:has(#tab-data.active) #print-card{display:none!important}
}
@media print{#score-office:has(#office-detail.hidden){display:none!important}}

/* Office Details: clients, Citizen's Charter, personnel and month by month. */
.score-office-gap{margin-top:26px;padding-top:18px;border-top:1px solid var(--border)}
.score-office-clients{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px 28px}
.score-office-clients h5,#office-cc h5{margin:0 0 10px;font-size:12px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--muted)}
.score-office-clients .bar-label{width:auto;flex:1 1 0;min-width:0}
.score-office-clients .bar-track{flex:0 0 40%}
#office-has-data[hidden]{display:none}
#office-months .bar-label{width:80px}
.score-month-count{flex:0 0 64px;text-align:right;font-size:12px;color:var(--muted)}

/* Rankings pills (Office, Service, Personnel). */
.score-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.score-pill{border:1.5px solid var(--border);border-radius:999px;padding:8px 16px;background:var(--card);color:var(--slate);font:700 13px var(--font);cursor:pointer}
.score-pill:hover{border-color:var(--blue);color:var(--blue)}
.score-pill[aria-selected="true"]{border-color:var(--blue);background:var(--blue);color:var(--card)}
.score-pill:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(79,107,246,.35)}
.rank-view[hidden]{display:none}

/* Overview: top personnel. */
.score-see-all{margin-left:auto}
.score-top-people{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:10px}
.score-top-people li{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:var(--bg);min-width:0}
.score-top-people .person-img{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.score-top-rank{flex:0 0 auto;font-weight:800;color:var(--muted);font-size:13px;min-width:24px}
.score-top-who{display:flex;flex-direction:column;min-width:0;flex:1 1 auto}
.score-top-who b,.score-top-who small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.score-top-who small{color:var(--muted);font-size:12px}
.score-top-resp{flex:0 0 auto;color:var(--muted);font-size:12px}
@media print{.score-pills,.score-see-all{display:none!important}.rank-view[hidden]{display:block!important}}