
/* CPII Data Lab — shared light editorial theme */
:root{
  color-scheme:light;
  --bg:#f7f4eb;--panel:#fffef9;--panel2:#eaf1ef;
  --line:rgba(9,47,59,.20);--line2:rgba(9,47,59,.10);
  --ink:#092f3b;--muted:#60737a;--dim:#87969a;
  --amp:#d89500;--volt:#0875b8;--hot:#c94640;--violet:#675bc7;--grn:#27875b;
}
html{background:var(--bg)}
body{
  background-color:var(--bg);color:var(--ink);
  background-image:radial-gradient(980px 520px at 88% -4%,rgba(8,117,184,.075),transparent 60%),radial-gradient(820px 520px at -8% 8%,rgba(216,149,0,.075),transparent 58%);
}
.top{background:rgba(247,244,235,.94);border-bottom-color:var(--line);box-shadow:0 1px 0 rgba(255,255,255,.65)}
.brand,.brand-link{color:var(--ink)}
.top nav a:hover,.top nav a[aria-current="true"]{color:var(--ink);background:var(--panel2)}
.suite-strip{background:#e5eeeb;border-bottom-color:var(--line)}
.suite-label{color:var(--muted)}
.suite-links a:hover,.suite-links a[aria-current="page"]{background:var(--panel);color:var(--blue,var(--volt));box-shadow:inset 0 0 0 1px var(--line)}
.hero{background:linear-gradient(180deg,rgba(255,254,249,.64),rgba(247,244,235,.18));border-bottom-color:var(--line)}
.hero h1,.hero h2{color:var(--ink)}
.hero .lede{color:var(--muted)}
.hero .lede b{color:var(--ink)}
.eyebrow{color:var(--volt)}
.ribbon{background:var(--panel);border-color:var(--line)}
.ribbon-head .t{color:var(--muted)}
.ribbon-key .k{color:var(--muted)}
.ribbon-key .k b{color:var(--ink)}
.stats{background:var(--line);border-color:var(--line)}
.stat{background:rgba(255,254,249,.8)}
.stat .l{color:var(--muted)}
section{border-bottom-color:var(--line2)}
.card,.matrix,.data-actions,.callout{background:rgba(255,254,249,.88);border-color:var(--line);box-shadow:0 12px 38px rgba(9,47,59,.045)}
.card-note,.sec-sub,.hhi-note,.mx-legend{color:var(--muted)}
.seg-ctrl{background:var(--panel2);border-color:var(--line)}
.seg-ctrl button{color:var(--muted)}
.seg-ctrl button.on{color:white;background:var(--amp)}
.seg-ctrl.volt button.on{color:white;background:var(--volt)}
.bar .track,.mx-cell .mtrack{background:var(--panel2)}
.metrics{background:var(--line);border-color:var(--line)}
.metric{background:var(--panel)}
.matrix{background:var(--panel);overflow:auto;overscroll-behavior-inline:contain}
.mx-head{background:var(--panel2);border-bottom-color:var(--line)}
.mx-row{border-bottom-color:var(--line2)}
.mx-row:hover{background:#f2f6f4}
.mx-head,.mx-row{min-width:760px}
.search,select.filter{background:var(--panel);color:var(--ink);border-color:var(--line)}
.search input{color:var(--ink)}
.tbl-scroll{background:var(--panel);border-color:var(--line);overflow:auto;overscroll-behavior:contain}
thead th{background:var(--panel2);color:var(--muted);border-bottom-color:var(--line)}
tbody td{border-bottom-color:var(--line2);color:var(--muted)}
tbody td.nm,tbody td.rt{color:var(--ink)}
tbody tr:hover td{background:#f2f6f4}
.ct-tip{background:#092f3b;color:white;border-color:rgba(255,255,255,.2)}
.ct-tip .ty{color:rgba(255,255,255,.62)}
.ct-tip .tr .tv{color:white}
.grid-l{stroke:var(--line2)}
.zero-l{stroke:var(--muted)}
.hm-cell.na{background:var(--panel2)!important}
.hm-bar{background:linear-gradient(90deg,var(--hot),#dfe7e4 48%,var(--volt))}
.download-btn{background:var(--ink);color:white}
.source-guard{background:rgba(255,254,249,.72);color:var(--muted)}
.source-guard::before{background:var(--volt)}
.callout{border-left-color:var(--volt)}
.xlink{color:var(--volt);border-bottom-color:rgba(8,117,184,.28)}
footer{background:#092f3b;color:white;border-top:0}
footer p,footer .foot-note{color:rgba(255,255,255,.64)}
footer p b{color:white}
footer .foot-t{color:#65cde3}
footer .xlink{color:#ffd410;border-bottom-color:rgba(255,212,16,.35)}
.vintage-bar{border-bottom:1px solid var(--line);background:#eaf1ef}
.vintage-bar .wrap{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.vintage-label{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:800}
.vintage-chip{padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);font-family:var(--mono);font-size:10px}
.vintage-warning{margin-left:auto;color:var(--hot);font-size:11px;font-weight:750}
.data-actions.two-buttons{align-items:center}
.action-buttons{display:flex;gap:9px;flex-wrap:wrap}
.source-note-box{margin-top:24px;padding:18px 20px;border:1px solid var(--line);border-radius:12px;background:#eef4f2;color:var(--muted);font-size:13px}
.source-note-box strong{color:var(--ink)}
@media(max-width:860px){
  .vintage-warning{width:100%;margin-left:0}
  .data-actions.two-buttons{align-items:stretch}
  .action-buttons{width:100%}.action-buttons .download-btn{flex:1}
}
@media(max-width:520px){.action-buttons{flex-direction:column}}


/* Data Lab index — light treatment */
.data-lab-hub{--paper:#f7f4eb;--white:#fffef9;--deep:#092f3b;--ink:#092f3b;--muted:#60737a;--line:rgba(9,47,59,.16)}
.data-lab-hub header{background:rgba(247,244,235,.95)}
.data-lab-hub .hero{background:linear-gradient(135deg,#edf5f2 0%,#f7f4eb 68%,#fff4c9 145%);color:var(--ink);border-bottom:1px solid var(--line)}
.data-lab-hub .hero:after{border-color:rgba(9,47,59,.09);box-shadow:0 0 0 95px rgba(9,47,59,.025),0 0 0 190px rgba(9,47,59,.015)}
.data-lab-hub .hero p{color:var(--muted)}
.data-lab-hub .hero-note{border-left-color:var(--line)}
.data-lab-hub .hero-note strong{color:var(--blue)}
.data-lab-hub h1 em{color:#d89500}
.data-lab-hub footer{background:#092f3b}
@media(max-width:760px){.data-lab-hub .tools{grid-template-columns:1fr}}

/* Shared Data Lab navigation, actions and accessibility primitives */
html{scroll-padding-top:118px}
body{overflow-x:hidden}
.skip-link{position:fixed;left:14px;top:12px;z-index:1000;transform:translateY(-180%);padding:9px 13px;border-radius:7px;background:var(--amp);color:white;font-weight:800;text-decoration:none;box-shadow:0 8px 24px rgba(9,47,59,.15)}
.skip-link:focus{transform:translateY(0)}
.brand-link{text-decoration:none;border-radius:6px}
.suite-strip .wrap{min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.suite-links{display:flex;align-items:center;justify-content:flex-end;gap:5px;overflow-x:auto;scrollbar-width:thin}
.suite-links a{flex:0 0 auto;color:var(--muted);text-decoration:none;font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;padding:6px 9px;border-radius:6px}
.top nav a[aria-current]{color:var(--ink);background:var(--panel2)}
.data-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:28px 0 16px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.data-actions p{margin:0;color:var(--muted);font-size:13px;max-width:66ch}
.download-btn{appearance:none;border:0;border-radius:999px;background:var(--ink);color:white;padding:10px 15px;font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.download-btn:hover{filter:brightness(1.12)}
.source-guard{display:inline-flex;align-items:center;gap:7px;margin-top:12px;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:rgba(255,254,249,.72);color:var(--muted);font-family:var(--mono);font-size:10px;letter-spacing:.04em;text-transform:uppercase}
.source-guard::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--volt)}
button,.filter,th{touch-action:manipulation}
@media(max-width:860px){
  html{scroll-padding-top:154px}
  .top .wrap{height:auto;min-height:58px;flex-wrap:wrap;padding-top:10px;padding-bottom:9px}
  .top nav{display:flex;width:100%;order:3;margin-left:0;gap:2px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
  .top nav a{flex:0 0 auto}
  .suite-strip .wrap{padding-top:6px;padding-bottom:6px;align-items:flex-start;flex-direction:column}
  .suite-links{width:100%;justify-content:flex-start}
  .tbl-scroll table{min-width:980px}
  tbody{display:table-row-group;max-height:none;overflow:visible}
  thead tr,tbody tr{display:table-row;width:auto;table-layout:auto}
}
@media(max-width:520px){
  .data-actions{align-items:stretch}.download-btn{width:100%}
}
@media(max-width:860px){.top .brand-link{max-width:100%;white-space:normal;font-size:10.5px;line-height:1.35}}
