/* OPSCI design system — navy/teal, approved via pssda2025/mock-home (light), dark derived from it. */
/* Self-hosted (SIL OFL 1.1, latin subset, variable weight) — no third-party font request. */
@font-face{font-family:"Manrope"; font-style:normal; font-weight:200 800; font-display:swap; src:url("../fonts/manrope-latin.woff2") format("woff2");}
@font-face{font-family:"JetBrains Mono"; font-style:normal; font-weight:100 800; font-display:swap; src:url("../fonts/jetbrains-mono-latin.woff2") format("woff2");}
:root{
  font-size:87.5%; /* 14px baseline — scales every rem-based spacing value below */
  --bg:#e1e9e8; --surface:#fafcfb; --surface-2:#edf3f1; --mat:transparent;
  --border:#c6d3d0; --divider:#e3eae8; --text:#142e40; --mute:#536967;
  --accent:#006d66; --accent-soft:#e7f4f0;
  --positive:#147468; --positive-soft:#e2f2ec;
  --negative:#a34239; --negative-soft:#fcece7;
  --link:#3268a5; --link-hover:#204d80; --link-line:#b5c9df;
  --header-bg:#173746; --header-text:#f2f7f5; --header-hover:#a9ccee; --header-dot:#69c7b7; --header-note:#b2c7c9;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#1b2b32; --surface:#22353d; --surface-2:#2a3f48; --mat:transparent;
    --border:#3a535d; --divider:#304750; --text:#e4eeec; --mute:#8fa6a6;
    --accent:#3cb5a6; --accent-soft:#14332f;
    --positive:#4fcf9f; --positive-soft:#143128;
    --negative:#f08a7e; --negative-soft:#3a201c;
    --link:#8db8e8; --link-hover:#b8d3f3; --link-line:#3a5673;
    --header-bg:#13242b; --header-text:#e4eeec; --header-hover:#a9ccee; --header-dot:#3cb5a6; --header-note:#8fa6a6;
  }
}
:root[data-theme="dark"]{
  --bg:#1b2b32; --surface:#22353d; --surface-2:#2a3f48; --mat:transparent;
  --border:#3a535d; --divider:#304750; --text:#e4eeec; --mute:#8fa6a6;
  --accent:#3cb5a6; --accent-soft:#14332f;
  --positive:#4fcf9f; --positive-soft:#143128;
  --negative:#f08a7e; --negative-soft:#3a201c;
  --link:#8db8e8; --link-hover:#b8d3f3; --link-line:#3a5673;
  --header-bg:#13242b; --header-text:#e4eeec; --header-hover:#a9ccee; --header-dot:#3cb5a6; --header-note:#8fa6a6;
}
*{box-sizing:border-box;}
body{
  background:var(--bg); color:var(--text);
  font-family:"Manrope", -apple-system, sans-serif;
  margin:0; line-height:1.45; -webkit-font-smoothing:antialiased;
}
a{color:var(--link); text-underline-offset:3px;}
a:hover{color:var(--link-hover);}
.mono{font-family:"JetBrains Mono", monospace; font-variant-numeric:tabular-nums;}

header.topbar{
  background:var(--header-bg); box-shadow:0 2px 0 var(--accent);
  font-weight:800; letter-spacing:-0.01em;
}
header.topbar .topbar-inner{
  max-width:1240px; margin:0 auto; padding:0.55rem 24px;
  display:flex; align-items:center; gap:0.5rem 2.6rem; flex-wrap:wrap;
}
header.topbar .brand-link{color:var(--header-text); text-decoration:none; display:inline-flex; align-items:baseline; gap:0.35rem; font-size:1.45rem; letter-spacing:-0.05em;}
header.topbar .dot{color:var(--header-dot); font-size:0.6rem; align-self:center;}
header.topbar .tabs{display:flex; flex-wrap:wrap; gap:0.3rem 1.6rem; font-weight:600; font-size:0.9rem; flex:1;}
header.topbar .tabs a, header.topbar .nav-menu summary{white-space:nowrap;}
header.topbar .tabs a{color:var(--header-text); text-decoration:none; padding:0.2rem 0;}
header.topbar .brand-link:hover, header.topbar .tabs a:hover{color:var(--header-hover);}
header.topbar .tabs a.active{color:var(--header-hover); box-shadow:inset 0 -2px 0 var(--header-dot);}
header.topbar .nav-menu{position:relative;}
header.topbar .nav-menu summary{list-style:none; cursor:pointer; color:var(--header-text); padding:0.2rem 0;}
header.topbar .nav-menu summary::-webkit-details-marker{display:none;}
header.topbar .nav-menu summary::after{content:" ▾"; font-size:0.8em;}
header.topbar .nav-menu summary:hover, header.topbar .nav-menu[open] summary{color:var(--header-hover);}
header.topbar .nav-menu.active summary{color:var(--header-hover); box-shadow:inset 0 -2px 0 var(--header-dot);}
header.topbar .nav-menu-panel{
  position:absolute; top:calc(100% + 0.55rem); left:-0.9rem; z-index:20; display:flex; flex-direction:column;
  min-width:17rem; max-width:min(26rem, 92vw); padding:0.35rem 0; background:var(--header-bg);
  border:1px solid var(--accent); border-radius:6px; box-shadow:0 10px 28px rgba(0,0,0,0.28);
}
header.topbar .nav-menu-panel a{padding:0.34rem 0.95rem; font-size:0.86rem; font-weight:600; color:var(--header-text); text-decoration:none; line-height:1.35;}
header.topbar .nav-menu-panel a:hover, header.topbar .nav-menu-panel a[aria-current]{background:rgba(255,255,255,0.08); color:var(--header-hover);}
header.topbar .nav-menu-panel .nav-menu-all{border-bottom:1px solid rgba(255,255,255,0.14); margin-bottom:0.25rem; padding-bottom:0.45rem;}
header.topbar .header-note{font-size:0.72rem; color:var(--header-note); font-weight:500; letter-spacing:0.04em; text-transform:uppercase;}
@media (max-width:900px){ header.topbar .header-note{display:none;} }
@media (max-width:600px){
  header.topbar .topbar-inner{padding:0.5rem 16px;}
  header.topbar .tabs{gap:0.3rem 1.1rem; font-size:0.84rem; flex-basis:100%;}
}

main{max-width:1240px; margin:0 auto; padding:0.6rem 24px 1.2rem; display:flex; flex-direction:column; gap:0.6rem;}
@media (max-width:600px){ main{padding:0.5rem 16px 1rem;} }

/* ---- search form ---- */
.search-panel{background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:0.7rem 0.9rem;}
.search-panel-title{font-size:0.95rem; font-weight:800; letter-spacing:-0.01em; margin:0 0 0.5rem;}
.search-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:0.6rem 1rem;}
@media (max-width:720px){ .search-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:460px){ .search-grid{grid-template-columns:1fr;} }
.search-grid label{display:flex; flex-direction:column; gap:0.2rem; font-size:0.8rem; color:var(--mute); font-weight:600; min-width:0;}
.search-grid input, .search-grid select{
  font-family:inherit; font-size:0.88rem; padding:0.35rem 0.5rem; border:1px solid var(--border);
  border-radius:6px; background:var(--surface-2); color:var(--text); width:100%; min-width:0;
}
.search-grid input:focus, .search-grid select:focus{outline:2px solid var(--accent); outline-offset:1px;}
.search-grid-name-row{grid-template-columns:repeat(3, 1fr) auto;}
@media (max-width:860px){ .search-grid-name-row{grid-template-columns:1fr 1fr;} }
@media (max-width:460px){ .search-grid-name-row{grid-template-columns:1fr;} }
.status-toggle-group{display:flex; flex-direction:column; gap:0.2rem; justify-content:flex-end;}
.search-grid-sublabel{font-size:0.8rem; color:var(--mute); font-weight:600;}
.status-checkbox-label{display:flex; align-items:center; gap:0.4em; font-size:0.85rem; font-weight:500; color:var(--text); cursor:pointer; white-space:nowrap; padding:0.35rem 0;}
.search-grid-compact{grid-template-columns:1fr 1.4fr auto; align-items:end;}
.search-grid-compact .inline-pair{display:flex; gap:0.4rem;}
.search-grid-compact .inline-pair input{flex:0 1 110px; min-width:80px;}
.search-grid-compact .inline-pair select{flex:1 1 auto; min-width:140px;}
@media (max-width:620px){
  .search-grid-compact{grid-template-columns:1fr;}
  .search-grid-compact button{width:100%;}
  .search-grid-compact .inline-pair{flex-direction:column;}
}

.search-grid-cascade{grid-template-columns:1fr 1.3fr 1.3fr auto; align-items:end; margin-top:0.6rem;}
@media (max-width:860px){ .search-grid-cascade{grid-template-columns:1fr 1fr;} }
@media (max-width:460px){ .search-grid-cascade{grid-template-columns:1fr;} }


.year-nav{display:flex; align-items:center; gap:1rem; margin-bottom:0.5rem;}
.year-nav a{font-weight:700; font-size:0.86rem; text-decoration:none;}
.year-nav a:hover{text-decoration:underline;}
.year-nav-current{font-weight:800; font-size:0.95rem;}
.year-nav-edge{color:var(--border); font-weight:700; font-size:0.86rem;}

.pagination{display:flex; align-items:center; gap:1rem; margin-top:0.85rem; font-size:0.86rem; flex-wrap:wrap;}
.pagination a{font-weight:700; text-decoration:none;}
.pagination a:hover{text-decoration:underline;}
.pagination span{color:var(--mute);}
.pagination-export{margin-left:auto; color:var(--accent);}

.compare-table td:first-child, .compare-table th:first-child{color:var(--mute); font-weight:600; white-space:nowrap;}
.compare-cta{
  display:flex; align-items:center; gap:0.75rem; flex-wrap:wrap; margin-top:0.85rem;
  padding:0.6rem 0.9rem; border:1.5px solid var(--accent); border-radius:6px; background:var(--accent-soft);
}
.compare-cta .compare-cta-label{font-weight:800; font-size:0.9rem; color:var(--accent); white-space:nowrap;}
.compare-cta select{
  font-family:inherit; font-weight:600; font-size:0.9rem; padding:0.4rem 0.6rem; border:1px solid var(--border);
  border-radius:6px; background:var(--surface); color:var(--text); flex:1 1 220px; min-width:0;
}
.compare-picker{display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; margin-top:0.5rem;}
.compare-picker label{font-size:0.8rem; color:var(--mute); font-weight:600;}
.compare-picker select{
  font-family:inherit; font-size:0.85rem; padding:0.32rem 0.55rem; border:1px solid var(--border);
  border-radius:6px; background:var(--surface); color:var(--text);
  max-width:100%;
}

.search-actions{margin-top:0.75rem;}
button, .btn{
  font-family:inherit; font-weight:700; font-size:0.88rem; background:var(--accent); color:#fff;
  border:none; padding:0.42rem 1rem; border-radius:6px; cursor:pointer;
}
button:hover, .btn:hover{filter:brightness(1.05);}

.result-summary{color:var(--mute); font-size:0.85rem; margin:0 0 0.5rem;}
.result-table{width:100%; border-collapse:collapse; font-size:0.86rem;}
.result-table th{
  text-align:left; padding:0.32rem 0.55rem; color:var(--mute); font-size:0.74rem; background:var(--surface-2);
  border-bottom:1px solid var(--border); font-weight:700;
}
.result-table td{padding:0.32rem 0.55rem; border-bottom:1px solid var(--divider);}
.result-table td.num, .result-table th.num{text-align:right; white-space:nowrap;}
.result-table tr:last-child td{border-bottom:none;}
.result-table tr:hover td{background:var(--surface-2);}
.result-table a{font-weight:700; text-decoration:none;}
.result-table a:hover{text-decoration:underline;}
.result-table td:first-child a{text-decoration:underline; text-decoration-color:var(--link-line); text-decoration-thickness:1px;}
.result-table td:first-child a:hover{text-decoration-color:currentColor;}
.result-table .muted{color:var(--mute); font-weight:500;}

.dense-table{font-size:0.78rem;}
.dense-table th{padding:0.2rem 0.5rem 0.3rem;}
.dense-table td{padding:0.18rem 0.5rem;}
.dense-table .dot{display:inline-block; width:0.55rem; height:0.55rem; border-radius:50%; margin-right:0.45rem; vertical-align:middle;}
.dense-table .s{color:var(--mute); font-weight:500; font-size:0.72rem; display:block; margin-top:0.1rem;}

/* Name and Years get a fixed floor (covers ~90% of names / exactly fits
   "YYYY-YYYY") so a long title/employer can't squeeze them onto two lines —
   Title and Employer absorb the remaining width instead. */
.employee-results-table{table-layout:fixed;}
.employee-results-table th:nth-child(1), .employee-results-table td:nth-child(1){width:17ch;}
.employee-results-table th:nth-child(2), .employee-results-table td:nth-child(2){width:32%;}
.employee-results-table th:nth-child(3), .employee-results-table td:nth-child(3){width:32%;}
.employee-results-table th:nth-child(4), .employee-results-table td:nth-child(4){width:11ch; white-space:nowrap;}
.employee-results-table th:nth-child(5), .employee-results-table td:nth-child(5){width:9ch; white-space:nowrap;}

.top-earners-table{table-layout:fixed;}
.top-earners-table th:nth-child(1), .top-earners-table td:nth-child(1){width:7ch;}
.top-earners-table th:nth-child(2), .top-earners-table td:nth-child(2){width:14ch;}
.top-earners-table th:nth-child(3), .top-earners-table td:nth-child(3){width:28%;}
.top-earners-table th:nth-child(4), .top-earners-table td:nth-child(4){width:28%;}
.top-earners-table th:nth-child(5), .top-earners-table td:nth-child(5){width:11ch; white-space:nowrap;}
.top-earners-table th:nth-child(6), .top-earners-table td:nth-child(6){width:8ch; white-space:nowrap;}
.top-earners-table td a{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; max-width:100%; vertical-align:bottom;}

.table-toolbar{display:flex; gap:0.5rem; margin-top:0.6rem; flex-wrap:wrap;}
.table-toolbar button{
  font-family:inherit; font-size:0.76rem; font-weight:600; color:var(--mute);
  background:var(--surface); border:1px solid var(--border); border-radius:5px;
  padding:0.28rem 0.7rem; cursor:pointer;
}
.table-toolbar button:hover{color:var(--text); border-color:var(--accent);}
.alt-link{font-weight:400 !important; color:var(--mute) !important; margin-left:0.3em; font-size:0.78em; text-transform:uppercase; letter-spacing:0.03em;}
.alt-link:hover{color:var(--accent) !important;}

/* Phones: wide tables scroll inside their card rather than squeezing or
   spilling off the page; fixed-layout tables keep a readable minimum width. */
@media (max-width:700px){
  .card, .panel{overflow-x:auto;}
  .top-earners-table, .employee-results-table{min-width:640px;}
}

/* ---- profile ---- */
.id-card{display:flex; justify-content:space-between; align-items:flex-start; gap:0.85rem; flex-wrap:wrap;}
.id-card h1{font-size:1.4rem; margin:0 0 0.15rem; font-weight:800; letter-spacing:-0.01em;}
.id-card .role{color:var(--mute); font-size:0.92rem; margin:0;}
.id-card .role b{color:var(--text); font-weight:600;}
.tag{
  display:inline-flex; align-items:center; gap:0.4em; background:var(--surface-2); border:1px solid var(--border);
  padding:0.2rem 0.55rem; border-radius:999px; font-size:0.76rem; color:var(--mute); font-weight:600;
}
.tag-row{display:flex; gap:0.4rem; flex-wrap:wrap;}

.grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:0.7rem;}
@media (max-width:720px){ .grid{grid-template-columns:1fr 1fr;} }
@media (max-width:460px){ .grid{grid-template-columns:1fr;} }

.tile{background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:0.55rem 0.8rem;}
.tile .label{font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--mute); font-weight:600; margin-bottom:0.2rem;}
.tile .value{font-size:1.25rem; font-weight:700;}
.tile.accent{background:linear-gradient(180deg, var(--accent-soft), var(--surface)); border-color:var(--accent);}
.tile.accent .value{color:var(--accent);}

.panel{background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:0.7rem 0.9rem;}
.panel h2{font-size:0.92rem; margin:0 0 0.5rem; font-weight:800; letter-spacing:-0.01em; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0.3rem;}
.panel h2 .sub{font-size:0.76rem; color:var(--mute); font-weight:500;}
.panel p.muted{color:var(--mute); font-size:0.85rem; margin:0;}

.card{background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:0.7rem 0.95rem; min-width:0;}
.card h3{font-size:0.92rem; margin:0 0 0.45rem; font-weight:800; letter-spacing:-0.01em; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0.3rem;}
.card h3 .sub{font-size:0.74rem; color:var(--mute); font-weight:500;}

.standing-row{display:grid; grid-template-columns:1fr 2fr auto; gap:0.75rem; align-items:center; padding:0.4rem 0; border-bottom:1px solid var(--border);}
.standing-row:last-child{border-bottom:none;}
.standing-row .name{font-size:0.86rem;}
.standing-row .name small{display:block; color:var(--mute); font-size:0.76rem;}
.standing-row .rank{font-size:0.8rem; color:var(--mute); text-align:right; white-space:nowrap;}
.pbar{background:var(--surface-2); border-radius:999px; height:8px; position:relative; overflow:hidden;}
.pbar-fill{background:var(--accent); height:100%; border-radius:999px;}

.history-wrap{overflow-x:auto;}
table.history{width:100%; border-collapse:collapse; min-width:820px; font-size:0.86rem;}
table.history th{
  text-align:left; padding:0.32rem 0.55rem; color:var(--mute); font-size:0.74rem; background:var(--surface-2);
  border-bottom:1px solid var(--border); font-weight:700;
}
table.history td{padding:0.32rem 0.55rem; border-bottom:1px solid var(--divider);}
table.history tr:last-child td{border-bottom:none;}
table.history td.num, table.history th.num{text-align:right; white-space:nowrap;}
table.history tr:hover td{background:var(--surface-2);}
.chip{display:inline-block; padding:0.12rem 0.42rem; border-radius:4px; font-size:0.74rem; font-weight:700; white-space:nowrap;}
.chip-pos{background:var(--positive-soft); color:var(--positive);}
.chip-neg{background:var(--negative-soft); color:var(--negative);}
.chip-mute{background:var(--surface-2); color:var(--mute);}
.flags{display:flex; gap:0.3rem; flex-wrap:wrap;}
.flag{font-size:0.66rem; font-weight:700; padding:0.08rem 0.35rem; border-radius:5px; text-transform:uppercase; letter-spacing:0.03em; white-space:nowrap;}
.flag-switch{background:#dce6f7; color:#2d5fa8;}
.flag-gap{background:var(--surface-2); color:var(--mute);}
.flag-promo{background:var(--positive-soft); color:var(--positive);}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .flag-switch{background:#1c2c44; color:#8fb4ea;} }
:root[data-theme="dark"] .flag-switch{background:#1c2c44; color:#8fb4ea;}

footer.note{color:var(--mute); font-size:0.76rem; padding-top:0.35rem;}
footer.site-footnote{color:var(--mute); font-size:0.74rem; line-height:1.55; padding:0.7rem 0 0.2rem; margin-top:0.2rem; border-top:1px solid var(--border);}

/* ---- home dashboard (home.html) and sector dashboards (sector.html) ---- */
.hero{padding:0.5rem 0 0;}
.hero .eyebrow{color:var(--accent); font-size:0.7rem; letter-spacing:0.12em; text-transform:uppercase; font-weight:800; margin:0 0 0.3rem;}
.hero h1{font-size:1.65rem; line-height:1.12; margin:0 0 0.35rem; font-weight:800; letter-spacing:-0.03em; max-width:900px;}
.hero-home h1{font-size:clamp(1.65rem, 3vw, 2.4rem); line-height:1.1; letter-spacing:-0.045em; max-width:none;}
.hero p.lede{color:var(--mute); font-size:0.95rem; line-height:1.5; margin:0 0 0.3rem; max-width:910px;}

.overview-bar{display:flex; align-items:flex-end; justify-content:space-between; gap:0.8rem 1.5rem; flex-wrap:wrap; border-top:1px solid var(--border); padding:0.55rem 0 0.1rem;}
.summary-stats{display:flex; gap:2.2rem;}
.summary-stat strong{display:block; font-size:1.45rem; letter-spacing:-0.04em; font-weight:800; line-height:1.2;}
.summary-stat span{font-size:0.74rem; color:var(--mute);}
.sector-picker{display:flex; flex-direction:column; gap:0.2rem; min-width:240px;}
.sector-picker label{font-size:0.72rem; color:var(--mute); font-weight:700;}
.sector-picker select{
  font-family:inherit; font-size:0.85rem; font-weight:600; padding:0.35rem 0.6rem; border:1px solid var(--border);
  border-radius:6px; background:var(--surface); color:var(--text); width:100%; max-width:300px;
}
@media (max-width:700px){
  .overview-bar{flex-direction:column; align-items:stretch;}
  .summary-stats{justify-content:space-between; gap:0.8rem;}
  .summary-stat strong{font-size:1.2rem;}
  .sector-picker select{max-width:none;}
}

.dashboard-mat{background:var(--mat);}

.bento{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0.7rem;}
.bento .span2{grid-column:span 2;}
.bento .span4{grid-column:span 4;}
.bento .span6{grid-column:span 6;}
.bento .span3{grid-column:span 3;}
/* The three-up row (sector mix, largest employers, top earners) goes 2+1 before fully stacking. */
@media (max-width:1050px){ .bento .trio{grid-column:span 3;} .bento .trio-last{grid-column:span 6;} }
@media (max-width:860px){ .bento .span2,.bento .span3,.bento .span4,.bento .trio{grid-column:span 6;} }
.bento .card{display:flex; flex-direction:column; gap:0.1rem;}

/* Drawn in real pixels (charts.js sizes the viewBox to this box), so text never stretches. */
.trend-chart{display:block; width:100%; height:200px; margin:auto 0;}
@media (max-width:700px){ .trend-chart{height:160px;} }
.trend-legend{display:flex; gap:1.4rem; font-size:0.74rem; color:var(--mute); margin-top:0.35rem; flex:0 0 auto; flex-wrap:wrap;}
.trend-legend .sw{display:inline-block; width:0.9rem; height:2px; margin-right:0.35em; vertical-align:middle;}
.trend-legend .sw.bars{height:8px; border-radius:2px;}

.donut-wrap{display:flex; flex-direction:column; align-items:center; gap:0.5rem; flex:1;}
.donut-wrap svg{flex:0 0 auto; width:180px; height:180px;}
.donut-legend{width:100%;}
.donut-row{display:flex; align-items:center; gap:0.4rem; font-size:0.76rem; padding:0.08rem 0;}
.donut-row .dot{width:0.6rem; height:0.6rem; border-radius:2px; flex:0 0 auto;}
.donut-row .n{flex:1; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.donut-row .v{color:var(--mute);}

.mini-row{display:flex; justify-content:space-between; align-items:center; gap:0.6rem; padding:0.3rem 0; border-bottom:1px solid var(--divider); font-size:0.82rem;}
.mini-row:last-of-type{border-bottom:none;}
.mini-row .t{font-weight:700; line-height:1.4;}
.mini-row .t a, .notable-card .who a{text-decoration:underline; text-decoration-color:var(--link-line); text-decoration-thickness:1px;}
.mini-row .t a:hover, .notable-card .who a:hover{text-decoration-color:currentColor;}
.mini-row .s{color:var(--mute); font-size:0.72rem; display:block; margin-top:0.05rem; line-height:1.4;}
.mini-row .s a{text-decoration:none;}
.mini-row .job-sub{color:var(--mute); font-size:0.72rem; font-weight:500;}
.mini-row .n{color:var(--mute); white-space:nowrap;}
.card p.muted{font-size:0.72rem; line-height:1.45; margin-top:0.35rem;}

.insight-note{background:var(--accent-soft); border:1px solid var(--accent); border-radius:6px; padding:0.5rem 0.75rem; font-size:0.78rem; margin-top:0.5rem;}
.insight-note b{color:var(--accent);}

/* One compact row of six on wide screens, divided by rules rather than boxed. */
.notable-grid{display:grid; grid-template-columns:repeat(6,minmax(0,1fr));}
.notable-card{padding:0.15rem 0.8rem; border-right:1px solid var(--border); min-width:0;}
.notable-card:first-child{padding-left:0;}
.notable-card:last-child{border-right:0; padding-right:0;}
@media (max-width:1050px){
  .notable-grid{grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:0.6rem;}
  .notable-card:nth-child(n){padding:0.15rem 0.8rem;}
  .notable-card:nth-child(3n+1){padding-left:0;}
  .notable-card:nth-child(3n){border-right:0;}
}
@media (max-width:600px){
  .notable-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .notable-card:nth-child(n){padding:0.15rem 0.7rem; border-right:1px solid var(--border);}
  .notable-card:nth-child(odd){padding-left:0;}
  .notable-card:nth-child(even){border-right:0;}
}
.notable-card .role{font-size:0.7rem; color:var(--accent); font-weight:800; margin-bottom:0.15rem;}
.notable-card .who{font-weight:700; font-size:0.88rem;}
.notable-card .s{color:var(--mute); font-size:0.7rem; line-height:1.4; margin-top:0.05rem;}
.notable-card .s a{color:var(--link);}
.notable-card .sal{font-size:1rem; font-weight:700; margin:0.3rem 0;}

.why-section{padding:0.6rem 0 0.2rem;}
.why-section h2{font-size:1.15rem; font-weight:800; letter-spacing:-0.03em; margin:0 0 0.45rem;}
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;}
@media (max-width:700px){ .why-grid{grid-template-columns:1fr; gap:0.6rem;} }
.why-grid h3{font-size:0.86rem; font-weight:800; margin:0 0 0.2rem;}
.why-grid p{margin:0; color:var(--mute); font-size:0.82rem; line-height:1.55;}

/* ---- in-page sector view (Positions / Employers / Employees with a sector selected) ---- */
.sector-view-head{display:flex; align-items:baseline; justify-content:space-between; gap:0.3rem 1rem; flex-wrap:wrap; padding-top:0.3rem;}
.sector-view-head h2{font-size:1.3rem; font-weight:800; letter-spacing:-0.02em; margin:0;}
.sector-view-links{display:flex; gap:1.2rem; font-size:0.84rem;}
.sector-view-links a{text-decoration:none;}
.sector-view-links a:hover{text-decoration:underline;}
.donut-side{flex-direction:row; align-items:center; gap:1rem;}
.donut-side svg{width:150px; height:150px;}
@media (max-width:520px){ .donut-side{flex-direction:column;} }
.stat-grid{display:grid; grid-template-columns:1fr 1fr; gap:0.9rem 1.2rem; margin:0.3rem 0 0.2rem;}
.inline-toggle{margin:0 0 0.3rem;}
.more-rows summary{cursor:pointer; list-style:none; font-size:0.76rem; font-weight:600; color:var(--mute); margin:0.35rem 0 0.1rem; display:inline-block;
  background:var(--surface); border:1px solid var(--border); border-radius:5px; padding:0.25rem 0.7rem;}
.more-rows summary::-webkit-details-marker{display:none;}
.more-rows summary:hover{color:var(--text); border-color:var(--accent);}
.more-rows[open] summary{display:none;}
.inline-toggle label{display:inline-flex; align-items:center; gap:0.4em; font-size:0.78rem; color:var(--mute); cursor:pointer;}
/* Labelled vertical bars (plain HTML, no chart script): count on top, year below. */
.vbars{display:flex; align-items:flex-end; gap:0.8rem; height:200px; padding:0.4rem 0.2rem 0; margin-top:auto;}
.vbar{flex:1; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:0.25rem; min-width:0;}
.vbar-track{flex:1; width:100%; display:flex; align-items:flex-end; justify-content:center;}
.vbar-fill{width:100%; max-width:64px; background:var(--accent); border-radius:3px 3px 0 0; min-height:2px; opacity:0.85;}
.vbar-n{font-size:0.8rem; font-weight:600;}
.vbar-y{font-size:0.74rem; color:var(--mute);}

/* ---- text pages (about, about the data, contact, privacy, terms) ---- */
/* Sized to match Home: body ~ the dashboard's lede, headings ~ its card titles. */
.prose{max-width:78ch; font-size:0.92rem; line-height:1.6;}
.prose h1{font-size:1.65rem; line-height:1.12; margin:0.5rem 0 0.5rem; font-weight:800; letter-spacing:-0.03em;}
.prose h2{font-size:1rem; margin:1.1rem 0 0.25rem; font-weight:800; letter-spacing:-0.01em;}
.prose p, .prose ul{margin:0 0 0.6rem;}
.prose li{margin-bottom:0.15rem;}
.prose .lede{color:var(--mute); font-size:0.95rem;}
.prose .dictionary{margin:0 0 0.6rem;}
.prose .dictionary dt{font-weight:700; margin-top:0.55rem;}
.prose .dictionary dd{margin:0.1rem 0 0; color:var(--text);}

/* ---- site footer ---- */
.site-footer{display:flex; justify-content:space-between; align-items:center; gap:0.4rem 1.2rem; flex-wrap:wrap; font-size:0.8rem; padding:0.6rem 0 0.2rem; border-top:1px solid var(--border);}
.site-footer nav{display:flex; flex-wrap:wrap; gap:0.3rem 1.3rem;}
.site-footer nav a{color:var(--link); text-decoration:none;}
.site-footer nav a:hover{color:var(--link-hover); text-decoration:underline;}
.site-footer .owner{color:var(--mute); margin:0;}
.site-footer .visit-count{color:var(--mute); margin:0 0 0 auto;}

a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible{outline:3px solid var(--accent); outline-offset:3px; border-radius:2px;}
header.topbar a:focus-visible{outline-color:var(--header-dot);}