/* ── Reset ────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#fafafa;--sf:#fff;--tx:#111;--tm:#666;--bd:#e0e0e0;--ac:#2563eb;--al:#dbeafe;--pos:#16a34a;--neg:#dc2626;--r:6px;--f:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
html{font-size:15px}
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)}
.tn{padding:.6rem 1.25rem;font-size:.85rem;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)}

/* ── 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:.4rem 1rem;font-size:.78rem;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.6rem;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:.85rem}
thead th{position:sticky;top:0;background:var(--sf);border-bottom:2px solid var(--tx);padding:.5rem .4rem;text-align:left;font-weight:600;font-size:.72rem;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:#f5f5f5}
td{padding:.45rem .4rem;vertical-align:middle}
td.sn{font-weight:500}
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:#15803d}
.sc-mid{color:#2563eb}
.sc-low{color:#d97706}
.sc-poor{color:#dc2626}

/* ── Rank color coding ───────────────────────────────── */
.rk-top{color:#15803d;font-weight:700}
.rk-high{color:#2563eb;font-weight:600}
.rk-mid{color:#d97706}
.rk-low{color:#9ca3af}
.rk-btm{color:#dc2626}

/* ── 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:#dbeafe;color:#1e40af}
.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:#f0f0f0;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:#f0fdf4;border:1px solid #bbf7d0;border-radius:var(--r);padding:.75rem 1rem;font-size:1rem;font-weight:600;text-align:center;margin:.5rem 0}

/* ── Responsive ──────────────────────────────────────── */
@media(max-width:1024px){
  main{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table{min-width:800px}
}
@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}
}
