/* ── Reset ────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#f8fafc;--sf:#fff;--tx:#0f172a;--tm:#64748b;--bd:#e2e8f0;--ac:#3b82f6;--al:#eff6ff;--ah:#2563eb;--abr:#bfdbfe;--pos:#10b981;--warn:#f59e0b;--neg:#ef4444;--hov:#f1f5f9;--r:8px;--f:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
html{font-size:16px}
body{font-family:var(--f);background:var(--bg);color:var(--tx);line-height:1.5;min-height:100vh;display:flex;flex-direction:column}

/* ── Top nav ─────────────────────────────────────────── */
.top-nav{max-width:1180px;width:100%;margin:0 auto;padding:1rem 1rem 0;display:flex;gap:0;border-bottom:2px solid var(--bd);align-items:center}
.tn{padding:.6rem 1.25rem;font-size:.9rem;font-weight:600;text-decoration:none;color:var(--tm);border-bottom:2px solid transparent;margin-bottom:-2px;transition:color .15s,border-color .15s}
.tn:hover{color:var(--tx)}
.tn.active{color:var(--ac);border-bottom-color:var(--ac)}
.nav-group{display:flex;align-items:center;gap:0}
.nav-label{font-size:.85rem;padding:0 .3rem 0 .25rem;opacity:.7}
.nav-divider{color:var(--bd);font-size:1rem;padding:0 .35rem;margin-bottom:-2px;user-select:none}

/* ── Sub nav ─────────────────────────────────────────── */
.sub-nav{max-width:1180px;width:100%;margin:0 auto;padding:0 1rem;display:flex;gap:0;border-bottom:1px solid var(--bd)}
.sn{padding:.5rem 1rem;font-size:.85rem;font-weight:500;text-decoration:none;color:var(--tm);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s}
.sn:hover{color:var(--tx)}
.sn.active{color:var(--ac);border-bottom-color:var(--ac)}

/* ── Banner ──────────────────────────────────────────── */
.banner{max-width:1180px;width:100%;margin:0 auto;padding:.5rem 1rem;font-size:.78rem;color:var(--tm);background:#fffbeb;border-left:3px solid #f59e0b}
.banner a{color:var(--ac);text-decoration:none}
.banner a:hover{text-decoration:underline}

/* ── Header ──────────────────────────────────────────── */
header{max-width:1180px;width:100%;margin:0 auto;padding:1.5rem 1rem 1rem}
h1{font-size:1.75rem;font-weight:700;letter-spacing:-.02em}
.sub{color:var(--tm);font-size:.875rem;margin-top:.25rem}
.sub a{color:var(--ac);text-decoration:none}
.sub a:hover{text-decoration:underline}
.sw{margin-top:1.25rem}
#search{width:100%;padding:.65rem 1rem;font-size:.95rem;font-family:var(--f);border:1px solid var(--bd);border-radius:var(--r);background:var(--sf);outline:none;transition:border-color .15s}
#search:focus{border-color:var(--ac);box-shadow:0 0 0 2px var(--al)}
.filters{display:flex;align-items:center;gap:.75rem;margin-top:.75rem;flex-wrap:wrap}
select{padding:.4rem .6rem;font-size:.85rem;font-family:var(--f);border:1px solid var(--bd);border-radius:var(--r);background:var(--sf);cursor:pointer;max-width:320px}
.stats{font-size:.8rem;color:var(--tm)}

/* ── Table ────────────────────────────────────────────── */
main{max-width:1180px;width:100%;margin:0 auto;padding:0 1rem 2rem;flex:1}
table{width:100%;border-collapse:collapse;font-size:.9rem}
thead th{position:sticky;top:0;background:var(--sf);border-bottom:2px solid var(--tx);padding:.6rem .5rem;text-align:left;font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--tm);white-space:nowrap;user-select:none}
th.sortable{cursor:pointer}
th.sortable:hover{color:var(--ac)}
th.sortable.active{color:var(--tx)}
th.sortable.active::after{content:' ▼';font-size:.6rem}
th.sortable.active.asc::after{content:' ▲'}
th.num,td.num{text-align:right}
tbody tr{border-bottom:1px solid var(--bd);transition:background .1s}
tbody tr:hover{background:var(--hov)}
td{padding:.45rem .4rem;vertical-align:middle}
td.sn{font-weight:500}
.school-link{color:var(--ac);text-decoration:none;font-weight:500}
.school-link:hover{text-decoration:underline;color:var(--ah)}
.board-link{color:var(--tm);text-decoration:none;font-size:.78rem}
.board-link:hover{text-decoration:underline;color:var(--ac)}
td.bc{font-size:.78rem;color:var(--tm);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
td.pc{font-size:.78rem;color:var(--tm)}
td.ac{font-size:.75rem;color:var(--tm);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Score color coding ──────────────────────────────── */
td.sc{font-weight:700;font-variant-numeric:tabular-nums}
.sc-top{color:var(--pos)}
.sc-mid{color:var(--ac)}
.sc-low{color:var(--warn)}
.sc-poor{color:var(--neg)}

/* ── Rank color coding ───────────────────────────────── */
.rk-top{color:var(--pos);font-weight:700}
.rk-high{color:var(--ac);font-weight:600}
.rk-mid{color:var(--warn)}
.rk-low{color:#94a3b8}
.rk-btm{color:var(--neg)}

/* ── Growth ──────────────────────────────────────────── */
.gp{color:var(--pos);font-weight:600}
.gn{color:var(--neg);font-weight:600}
.g0{color:var(--tm)}

/* ── Association badges ──────────────────────────────── */
.ab{font-size:.75rem;padding:.15rem .4rem;border-radius:3px;display:inline-block;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ab-yes{background:var(--al);color:var(--ah)}
.ab-none{color:var(--tm)}

/* ── Links ───────────────────────────────────────────── */
.wl{color:var(--ac);text-decoration:none;font-size:.78rem}
.wl:hover{text-decoration:underline}

/* ── Sparkline ───────────────────────────────────────── */
.spark{vertical-align:middle}

/* ── No results / hints / loading ────────────────────── */
#no-results{text-align:center;padding:2rem;color:var(--tm);font-size:.9rem}
.hint{color:var(--tm);font-size:.8rem;font-style:italic}
.hidden{display:none}
.loading{text-align:center;padding:3rem 1rem;color:var(--tm);font-size:.9rem}
.loading::before{content:'';display:block;width:28px;height:28px;margin:0 auto .75rem;border:3px solid var(--bd);border-top-color:var(--ac);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── References ──────────────────────────────────────── */
.refs{max-width:1180px;width:100%;margin:0 auto;padding:1.5rem 1rem;border-top:1px solid var(--bd)}
.refs h2{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--tm);margin-bottom:.75rem}
.rg{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem}
.rg a{font-size:.8rem;color:var(--ac);text-decoration:none;white-space:nowrap}
.rg a:hover{text-decoration:underline}

/* ── Footer ──────────────────────────────────────────── */
footer{max-width:1180px;width:100%;margin:0 auto;padding:1.5rem 1rem;border-top:1px solid var(--bd);font-size:.75rem;color:var(--tm)}
footer a{color:var(--ac);text-decoration:none}
footer a:hover{text-decoration:underline}

/* ── Methodology ─────────────────────────────────────── */
.methodology{padding-top:1rem}
.methodology section{margin-bottom:2rem}
.methodology h2{font-size:1.1rem;margin-bottom:.75rem}
.methodology p{font-size:.875rem;color:var(--tx);margin:.5rem 0;line-height:1.6}
.methodology ul{font-size:.875rem;padding-left:1.25rem;line-height:1.8}
.meth-table{width:100%;border-collapse:collapse;font-size:.82rem;margin:.75rem 0}
.meth-table th{background:var(--hov);font-weight:600;text-align:left;padding:.5rem .6rem;border-bottom:2px solid var(--bd)}
.meth-table td{padding:.5rem .6rem;border-bottom:1px solid var(--bd);vertical-align:top}
.meth-table a{color:var(--ac);text-decoration:none}
.meth-table a:hover{text-decoration:underline}
.formula-box{background:#ecfdf5;border:1px solid #a7f3d0;border-radius:var(--r);padding:.75rem 1rem;font-size:1rem;font-weight:600;text-align:center;margin:.5rem 0}

/* ── School Detail Pages ─────────────────────────────── */
.breadcrumb{max-width:1180px;width:100%;margin:0 auto;padding:.6rem 1rem;font-size:.78rem;color:var(--tm)}
.breadcrumb a{color:var(--ac);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span{color:var(--tx);font-weight:500}

.school-header{max-width:1180px;width:100%;margin:0 auto;padding:1rem 1rem .5rem}
.school-header h1{font-size:1.5rem}

.school-detail{max-width:1180px;width:100%;margin:0 auto;padding:0 1rem 2rem}

.school-section{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--bd)}
.school-section:last-child{border-bottom:none}
.school-section h2{font-size:1.1rem;font-weight:700;margin-bottom:1rem;color:var(--tx)}
.school-section h3{font-size:.92rem;font-weight:600;margin:1.25rem 0 .5rem;color:var(--tx)}

.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;margin-bottom:1rem}
.stat-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:1rem;text-align:center;transition:box-shadow .15s}
.stat-card:hover{box-shadow:0 2px 8px rgba(0,0,0,.08)}
.stat-card .stat-value{display:block;font-size:1.5rem;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums}
.stat-card .stat-label{display:block;font-size:.72rem;color:var(--tm);margin-top:.25rem;text-transform:uppercase;letter-spacing:.03em}
.stat-card.highlight{border-color:var(--ac);background:var(--al)}
.stat-card.sc-top .stat-value{color:var(--pos)}
.stat-card.sc-mid .stat-value{color:var(--ac)}
.stat-card.sc-low .stat-value{color:var(--warn)}
.stat-card.sc-poor .stat-value{color:var(--neg)}

.detail-table{width:100%;border-collapse:collapse;font-size:.84rem;margin:.5rem 0}
.detail-table th{background:var(--hov);font-weight:600;text-align:left;padding:.45rem .5rem;border-bottom:2px solid var(--bd);font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--tm)}
.detail-table td{padding:.45rem .5rem;border-bottom:1px solid var(--bd)}
.detail-table th.num,.detail-table td.num{text-align:right}
.detail-table tbody tr:hover{background:var(--hov)}

.salary-summary{margin-top:.5rem}
.school-budget-estimate{margin-top:1rem}

.contact-list{list-style:none;padding:0;font-size:.88rem;line-height:2}
.contact-list li{padding:.15rem 0}
.contact-list a{color:var(--ac);text-decoration:none}
.contact-list a:hover{text-decoration:underline}

.related-links{list-style:none;padding:0;font-size:.88rem;line-height:2}
.related-links a{color:var(--ac);text-decoration:none}
.related-links a:hover{text-decoration:underline}

.data-note{font-size:.75rem;color:var(--tm);margin-top:.75rem;font-style:italic}
.data-note a{color:var(--ac);text-decoration:none}
.data-note a:hover{text-decoration:underline}

.faq-item{margin-bottom:.5rem;border:1px solid var(--bd);border-radius:var(--r);overflow:hidden}
.faq-item summary{padding:.65rem .85rem;font-size:.88rem;font-weight:600;cursor:pointer;background:var(--sf);transition:background .1s}
.faq-item summary:hover{background:var(--hov)}
.faq-item p{padding:.5rem .85rem .75rem;font-size:.85rem;color:var(--tx);line-height:1.6}

.pct-bars{margin:.5rem 0}
.pct-bar-row{display:flex;align-items:center;gap:.5rem;margin:.35rem 0}
.pct-label{font-size:.78rem;min-width:180px;color:var(--tx);font-weight:500}
.pct-bar{flex:1;height:20px;background:var(--hov);border-radius:10px;overflow:hidden}
.pct-fill{height:100%;border-radius:10px;transition:width .3s}
.pct-value{font-size:.78rem;font-weight:600;min-width:40px;text-align:right;font-variant-numeric:tabular-nums}

.board-note{font-size:.82rem;color:var(--tm);margin-bottom:.75rem;padding:.5rem .75rem;background:#f8fafc;border-left:3px solid var(--ac);border-radius:0 var(--r) var(--r) 0}

.table-search{width:100%;padding:.5rem .75rem;border:1px solid #ddd;border-radius:var(--r);font-size:.85rem;font-family:inherit;margin-bottom:.35rem;box-sizing:border-box}
.table-search:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 2px rgba(37,99,235,.15)}
.search-count{font-size:.78rem;color:var(--tm);margin:0 0 .5rem}
.expand-btn{display:block;width:100%;padding:.6rem;margin-top:.5rem;border:1px solid var(--bd);border-radius:var(--r);background:var(--sf);color:var(--ac);font-weight:600;font-size:.82rem;cursor:pointer;text-align:center;font-family:inherit}
.expand-btn:hover{background:var(--al);border-color:var(--ac)}
.show-more-btn{display:block;width:100%;padding:.75rem;margin-top:.75rem;border:1px solid var(--bd);border-radius:var(--r);background:var(--sf);color:var(--ac);font-weight:600;font-size:.85rem;cursor:pointer;text-align:center;font-family:inherit;transition:background .15s,border-color .15s}
.show-more-btn:hover{background:var(--al);border-color:var(--ac)}

/* ── Browse grid ─────────────────────────────────────── */
.browse-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem;max-width:1180px;margin:0 auto;padding:1rem}
.browse-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:1.25rem;transition:box-shadow .15s,border-color .15s}
.browse-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.08);border-color:var(--ac)}
.browse-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}
.browse-card-header h3{font-size:1rem;font-weight:600;color:var(--tx);margin:0}
.browse-card-badge{background:var(--al);color:var(--ac);font-size:.75rem;font-weight:600;padding:.2rem .6rem;border-radius:99px}
.browse-card-body{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;font-size:.82rem;color:var(--tm)}
.browse-card-score{font-size:.82rem}
.browse-card-detail{font-size:.82rem}
.browse-card-actions{display:flex;gap:.5rem}
.browse-card-link{font-size:.78rem;font-weight:600;color:var(--ac);text-decoration:none;padding:.3rem .6rem;border:1px solid var(--bd);border-radius:var(--r);transition:background .12s}
.browse-card-link:hover{background:var(--al)}

/* ── Detail table scroll wrapper ─────────────────────── */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -.5rem;padding:0 .5rem}
.table-scroll .detail-table{min-width:480px}

/* ── Responsive ──────────────────────────────────────── */
@media(max-width:1024px){
  main{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table{min-width:800px}
  .detail-table{min-width:0}
}
@media(max-width:640px){
  html{font-size:13px}
  h1{font-size:1.3rem}
  .top-nav{padding:.5rem .5rem 0;overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap}
  .tn{padding:.5rem .6rem;font-size:.78rem;white-space:nowrap;flex-shrink:0}
  header{padding:1rem .75rem .75rem}
  .filters{gap:.5rem}
  select{max-width:none;width:100%;font-size:.82rem}
  .banner{font-size:.72rem;padding:.4rem .75rem}
  table{font-size:.78rem;min-width:700px}
  td,th{padding:.35rem .25rem}
  td.bc{max-width:100px}
  td.sn{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .refs{padding:1rem .75rem}
  footer{padding:1rem .75rem;text-align:center}
  .methodology{padding:1rem .25rem 0}
  .meth-table{font-size:.75rem}
  .formula-box{font-size:.85rem;padding:.5rem .75rem}

  /* ── Institutional detail pages (mobile) ───────────── */
  .breadcrumb{padding:.4rem .75rem;font-size:.72rem}
  .school-header{padding:.75rem .75rem .25rem}
  .school-header h1{font-size:1.2rem;line-height:1.3}
  .school-header .sub{font-size:.75rem;line-height:1.4}
  .school-detail{padding:0 .75rem 1.5rem}
  .school-section{margin-bottom:1.25rem;padding-bottom:1rem}
  .school-section h2{font-size:.95rem;margin-bottom:.65rem}
  .school-section h3{font-size:.82rem;margin:.75rem 0 .35rem}

  /* Stat cards: 2 columns on mobile */
  .stat-cards{grid-template-columns:repeat(2,1fr);gap:.5rem}
  .stat-card{padding:.65rem .5rem}
  .stat-card .stat-value{font-size:1.15rem}
  .stat-card .stat-label{font-size:.62rem;letter-spacing:.02em}

  /* Detail tables: scroll horizontally */
  .detail-table{font-size:.75rem;min-width:420px}
  .detail-table th,.detail-table td{padding:.35rem .35rem}
  .school-section{overflow-x:auto;-webkit-overflow-scrolling:touch}

  /* Progress bars */
  .pct-label{min-width:120px;font-size:.72rem}
  .pct-bar{height:14px}
  .pct-value{font-size:.72rem;min-width:35px}

  /* Salary summary */
  .salary-summary{font-size:.82rem}
  .board-note{font-size:.75rem;padding:.4rem .6rem}

  /* Contact & related links */
  .contact-list{font-size:.82rem;line-height:1.8}
  .related-links{font-size:.82rem;line-height:1.8}
  .data-note{font-size:.7rem}

  .show-more-btn{font-size:.78rem}

  /* FAQ items */
  .faq-item summary{padding:.5rem .65rem;font-size:.82rem}
  .faq-item p{padding:.4rem .65rem .6rem;font-size:.78rem}

  /* Search and expand within sections */
  .table-search{font-size:.78rem;padding:.4rem .6rem}
  .search-count{font-size:.72rem}
  .expand-btn{font-size:.75rem;padding:.5rem}

  /* Sub-nav */
  .sub-nav{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap}
  .sn{white-space:nowrap;flex-shrink:0}
}