.page-header {
background:linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%); padding:44px 0 40px;
}

.page-header-inner {
max-width:1200px; margin:0 auto; padding:0 32px; display:flex; align-items:center; gap:40px;
}

.page-header-text {
flex:1;
}

.page-header-eyebrow {
font-size:11px; font-weight:700; letter-spacing:.1em; color:var(--org); text-transform:uppercase; margin-bottom:10px; display:flex; align-items:center; gap:8px;
}

.page-header-eyebrow::before {
content:''; width:24px; height:2px; background:var(--org); border-radius:2px;
}

.page-header-text h1 {
font-family:'DM Serif Display',serif; font-size:42px; color:#fff; line-height:1.1; margin-bottom:8px;
}

.page-header-text p {
font-size:16px; color:rgba(255,255,255,.6); max-width:520px;
}

.controls {
background:#fff; border-bottom:1px solid #ede8e1; position:sticky; top:64px; z-index:90; box-shadow:var(--shadow);
}

.controls-inner {
max-width:1200px; margin:0 auto; padding:14px 32px; display:flex; align-items:center; gap:16px;
}

.view-label {
font-size:13px; font-weight:600; color:#555; white-space:nowrap;
}

.view-toggle {
display:flex; background:#f5f0ea; border-radius:10px; padding:4px; gap:2px;
}

.view-btn {
padding:9px 22px; border-radius:8px; font-size:14px; font-weight:600; border:none; cursor:pointer; color:#888; background:transparent; transition:all .2s; display:flex; align-items:center; gap:7px; white-space:nowrap;
}

.view-btn.active {
background:#fff; color:var(--org); box-shadow:0 1px 4px rgba(0,0,0,.12);
}

.view-btn:hover:not(.active) {
color:var(--org-d);
}

.ctrl-spacer {
flex:1;
}

.time-filter {
display:flex; gap:6px;
}

.time-btn {
padding:7px 16px; border-radius:20px; font-size:13px; font-weight:500; border:1.5px solid #e5e0d8; color:#666; background:#fff; cursor:pointer; transition:all .15s;
}

.time-btn.active {
background:var(--org); color:#fff; border-color:var(--org);
}

.time-btn:hover:not(.active) {
border-color:var(--org); color:var(--org-d);
}

.main {
max-width:1200px; margin:0 auto; padding:32px 32px 64px;
}

.view-panel {
display:none;
}

.view-panel.active {
display:block;
}

.podium-section {
margin-bottom:36px;
}

.podium-row {
display:flex; gap:16px; align-items:flex-end; justify-content:center; margin-bottom:32px;
}

.podium-card {
background:#fff; border-radius:var(--radius); border:1px solid #ede8e1;
    box-shadow:var(--shadow); text-align:center;
    transition:box-shadow .2s;
}

.podium-card:hover {
box-shadow:var(--shadow-md);
}

.podium-card.first {
flex:0 0 280px; padding:28px 24px 20px;
    border:2px solid var(--org-b);
    box-shadow:0 4px 24px rgba(247,148,29,.15);
}

.podium-card.second, .podium-card.third {
flex:0 0 230px; padding:22px 20px 18px;
}

.podium-trophy {
font-size:28px; margin-bottom:8px;
}

.podium-rank {
font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:12px;
}

.rank-gold {
color:var(--org);
}

.rank-silver {
color:#8a8a8a;
}

.rank-bronze {
color:#a0603a;
}

.podium-avatar {
width:72px; height:72px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-weight:700; font-size:22px; margin:0 auto 12px;
}

.podium-card.first .podium-avatar {
width:88px; height:88px; font-size:26px; border:3px solid var(--org);
}

.podium-card.second .podium-avatar, .podium-card.third .podium-avatar {
border:2px solid var(--org-b);
}

.podium-name {
font-size:17px; font-weight:700; color:#1a1a1a; margin-bottom:2px; display:flex; align-items:center; justify-content:center; gap:7px;
}

.podium-card.first .podium-name {
font-size:19px;
}

.podium-title {
font-size:13px; color:#888; margin-bottom:3px;
}

.podium-company {
font-size:13px; color:#555; font-weight:500; margin-bottom:14px;
}

.podium-hrs {
font-size:28px; font-weight:700; color:var(--org); line-height:1;
    margin-bottom:2px;
}

.podium-card.second .podium-hrs, .podium-card.third .podium-hrs {
font-size:24px;
}

.podium-hrs-label {
font-size:12px; color:#bbb;
}

.podium-nfps {
margin-top:14px; display:flex; flex-direction:column; gap:4px;
}

.podium-nfp {
font-size:12px; color:#777; display:flex; align-items:center; gap:5px; justify-content:center;
}

.podium-nfp::before {
content:''; width:5px; height:5px; border-radius:50%; background:var(--org-b); flex-shrink:0;
}

.li-icon-link {
display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:4px; background:var(--li); color:#fff; font-size:11px; font-weight:800; text-decoration:none; flex-shrink:0; transition:opacity .15s, transform .15s;
}

.li-icon-link:hover {
opacity:.85; transform:scale(1.1);
}

.section-title {
font-size:18px; font-weight:700; color:#1a1a1a; margin-bottom:14px; display:flex; align-items:center; gap:10px;
}

.section-title::after {
content:''; flex:1; height:1px; background:#ede8e1;
}

.rankings-table {
background:#fff; border-radius:var(--radius); border:1px solid #ede8e1; overflow:hidden; box-shadow:var(--shadow);
}

.tbl-head {
display:grid; grid-template-columns:64px 1fr 190px 180px 130px;
    background:var(--org); padding:13px 24px;
    font-size:12px; font-weight:700; color:#fff;
    text-transform:uppercase; letter-spacing:.07em;
}

.tbl-row {
display:grid; grid-template-columns:64px 1fr 190px 180px 130px;
    padding:16px 24px; border-bottom:1px solid #f5f1eb;
    align-items:center; transition:background .15s; cursor:pointer;
}

.tbl-row:last-child {
border-bottom:none;
}

.tbl-row:hover {
background:#fdf9f4;
}

.tbl-row.highlight {
background:#fffbf4; border-left:3px solid var(--org); padding-left:21px;
}

.rank-cell {
display:flex; align-items:center;
}

.rank-badge {
width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; flex-shrink:0;
}

.rb-1 {
background:var(--org); color:#fff; box-shadow:0 2px 8px rgba(247,148,29,.4);
}

.rb-2 {
background:#f0f0f0; color:#666; border:2px solid #e0e0e0;
}

.rb-3 {
background:#fdf0e8; color:#a0603a; border:2px solid #f5c9a8;
}

.rb-n {
background:#fafafa; color:#bbb; border:2px solid #eee; font-size:13px;
}

.vol-cell {
display:flex; align-items:center; gap:13px;
}

.tbl-avatar {
width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex-shrink:0; border:2px solid var(--org-b);
}

.vol-name-wrap {

}

.vol-name {
font-size:15px; font-weight:600; color:#1a1a1a; display:flex; align-items:center; gap:7px;
}

.vol-title {
font-size:12px; color:#999; margin-top:1px;
}

.company-cell {
font-size:14px; color:#444; font-weight:500;
}

.nfps-cell {
display:flex; flex-direction:column; gap:3px;
}

.nfp-mini {
font-size:12px; color:#777; display:flex; align-items:center; gap:5px;
}

.nfp-mini::before {
content:''; width:5px; height:5px; border-radius:50%; background:var(--org-b); flex-shrink:0;
}

.hrs-cell {
display:flex; align-items:center; justify-content:flex-end;
}

.hrs-pill-lg {
background:var(--org); color:#fff; padding:7px 18px; border-radius:20px; font-size:16px; font-weight:700; white-space:nowrap;
}

.hrs-pill-sm {
background:var(--org-l); color:var(--org-d); border:1px solid var(--org-b); padding:6px 16px; border-radius:20px; font-size:15px; font-weight:700; white-space:nowrap;
}

.company-rankings {
display:flex; flex-direction:column; gap:16px;
}

.company-rank-card {
background:#fff; border-radius:var(--radius); border:1px solid #ede8e1;
    box-shadow:var(--shadow); overflow:hidden; transition:box-shadow .2s;
}

.company-rank-card:hover {
box-shadow:var(--shadow-md);
}

.company-rank-card.top-company {
border:2px solid var(--org-b); box-shadow:0 4px 20px rgba(247,148,29,.12);
}

.company-rank-header {
display:flex; align-items:center; gap:16px; padding:20px 24px; cursor:pointer;
}

.co-rank-badge {
width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:700; flex-shrink:0;
}

.co-logo {
width:52px; height:52px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; flex-shrink:0; border:1px solid #ede8e1;
}

.co-info {
flex:1;
}

.co-name {
font-size:18px; font-weight:700; color:#1a1a1a;
}

.co-meta {
font-size:13px; color:#999; margin-top:2px;
}

.co-bar-wrap {
flex:0 0 240px;
}

.co-bar-label {
display:flex; justify-content:space-between; margin-bottom:5px;
}

.co-bar-txt {
font-size:12px; color:#999;
}

.co-bar-hrs {
font-size:13px; font-weight:700; color:var(--org-d);
}

.co-bar {
height:8px; background:#f0ebe3; border-radius:4px; overflow:hidden;
}

.co-bar-fill {
height:100%; border-radius:4px; background:var(--org); transition:width .4s ease;
}

.co-total-hrs {
text-align:right; min-width:100px;
}

.co-total-num {
font-size:28px; font-weight:700; color:var(--org); line-height:1;
}

.co-total-label {
font-size:12px; color:#bbb;
}

.company-vols {
border-top:1px solid #f2ede6; display:none;
}

.company-vols.open {
display:block;
}

.co-vol-row {
display:flex; align-items:center; gap:14px; padding:12px 24px 12px 36px; border-bottom:1px solid #f8f4f0; transition:background .1s;
}

.co-vol-row:last-child {
border-bottom:none;
}

.co-vol-row:hover {
background:#fdf9f4;
}

.co-vol-avatar {
width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; border:2px solid var(--org-b);
}

.co-vol-info {
flex:1;
}

.co-vol-name {
font-size:14px; font-weight:600; color:#1a1a1a; display:flex; align-items:center; gap:7px;
}

.co-vol-title {
font-size:12px; color:#999;
}

.co-vol-hrs {
background:var(--org-l); color:var(--org-d); border:1px solid var(--org-b); padding:4px 12px; border-radius:20px; font-size:13px; font-weight:700; white-space:nowrap;
}

.expand-btn {
font-size:12px; color:var(--org); font-weight:600; cursor:pointer; display:flex; align-items:center; gap:5px; padding:8px 24px; background:var(--org-l); border-top:1px solid var(--org-b); width:100%; border:none; text-align:left; cursor:pointer; border-top:1px solid var(--org-b);
}

.expand-btn:hover {
background:#fde8c0;
}

.chevron {
display:inline-block; transition:transform .2s;
}

.chevron.open {
transform:rotate(180deg);
}

svg.icon-sm {
width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}

@keyframes notif-pulse {
0%,100% { transform:scale(1); }
    50% { transform:scale(1.15); }
}

@media(max-width:768px) {
.hero-inner,.page-header-inner {flex-direction:column!important;padding:0 16px!important;gap:20px!important;text-align:center}
.page-header-text h1 {font-size:26px!important}
.main {grid-template-columns:1fr!important;padding:14px 14px 48px!important;gap:16px!important}
.filter-inner,.controls-inner {padding:10px 14px!important;flex-wrap:wrap;gap:6px!important}
.view-toggle {flex-wrap:wrap}
.view-btn {font-size:12px!important;padding:7px 10px!important}
.time-filter {flex-wrap:wrap}
.vol-avatar {width:36px!important;height:36px!important}
.co-bar-wrap {display:none!important}
.podium-row {flex-direction:column!important;align-items:center!important}
.podium-card.first,.podium-card.second,.podium-card.third {flex:none!important;width:100%!important;max-width:320px}
.tbl-row {grid-template-columns:44px 1fr!important;padding:10px 14px!important}
.company-cell,.nfps-cell {grid-column:2;font-size:12px!important}
.hrs-cell {grid-column:1/-1;justify-content:flex-start!important}
.company-rank-header {flex-wrap:wrap!important;padding:14px!important}
.section {padding:28px 16px!important}
.controls-inner {padding:10px 14px!important}
}

/* extracted inline styles */
.leaderboard-i1 {
  display:none;
}

.leaderboard-i2 {
  background:#dbeafe;color:#1e40af;
}

.leaderboard-i3 {
  background:#f3e8ff;color:#7c3aed;
}

.leaderboard-i4 {
  text-align:right;
}

.leaderboard-i5 {
  width:20px;height:20px;font-size:10px;
}

.leaderboard-i6 {
  background:#FEF6EC;color:#C4720D;
}

.leaderboard-i7 {
  background:#fce7f3;color:#be185d;
}

.leaderboard-i8 {
  background:#ecfdf5;color:#065f46;
}

.leaderboard-i9 {
  font-size:13px;color:#8a7a62;margin:-8px 0 18px;line-height:1.5;
}

.leaderboard-i10 {
  width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;background:var(--org);color:#fff;
}

.leaderboard-i11 {
  background:#E6F1FB;color:#185FA5;border-color:#B5D4F4;
}

.leaderboard-i12 {
  width:100%;
}

.leaderboard-i13 {
  margin-left:8px;color:#bbb;font-size:18px;
}

.leaderboard-i14 {
  width:18px;height:18px;font-size:9px;
}

.leaderboard-i15 {
  width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;background:#f0f0f0;color:#666;border:2px solid #e0e0e0;
}

.leaderboard-i16 {
  background:#FFF0F3;color:#BE123C;border-color:#FECDD3;
}

.leaderboard-i17 {
  width:76%;
}

.leaderboard-i18 {
  width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;background:#fdf0e8;color:#a0603a;border:2px solid #f5c9a8;
}

.leaderboard-i19 {
  background:#FEF6EC;color:#C4720D;border-color:#FDDCAB;
}

.leaderboard-i20 {
  width:61%;
}

.leaderboard-i21 {
  width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;background:#fafafa;color:#bbb;border:2px solid #eee;
}

.leaderboard-i22 {
  background:#EAF3DE;color:#3B6D11;border-color:#C0DD97;
}

.leaderboard-i23 {
  width:39%;
}
