@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root{--ink:#10141b;--muted:#5c6472;--paper:#f3f0e9;--card:#fff;--line:#ddd9d0;--black:#0d1014;--blue:#2f74ff;--blue-soft:#eaf1ff;--gold:#c99547;--green:#118360;--shadow:0 18px 50px rgba(15,20,27,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif;font-size:16px;line-height:1.55}button,input,select{font:inherit}a{color:inherit}
.topbar{height:76px;padding:0 max(24px,calc((100vw - 1440px)/2));display:flex;align-items:center;justify-content:space-between;background:rgba(13,16,20,.97);color:#fff;position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.1)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:Manrope,sans-serif;font-weight:800}.brand small{display:block;color:#aeb6c2;font:500 11px/1.2 'DM Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase}.brand-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--gold);color:#111;border-radius:10px;font-size:13px;letter-spacing:.04em}
.topnav{display:flex;gap:4px}.topnav a{padding:9px 13px;border-radius:8px;text-decoration:none;color:#bdc4cf;font-size:14px;font-weight:600}.topnav a:hover,.topnav a.active{background:#fff;color:#111}
main{width:min(1440px,calc(100% - 48px));margin:auto}.intro{padding:72px 0 42px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:56px;align-items:end}.eyebrow{margin:0 0 10px;color:#9a6b27;text-transform:uppercase;font-size:12px;font-weight:800;letter-spacing:.13em}.intro h1{font:800 clamp(38px,5vw,72px)/1.02 Manrope,sans-serif;letter-spacing:-.045em;margin:0;max-width:850px}.lede{max-width:760px;color:var(--muted);font-size:19px;margin:22px 0 0}
.summary{display:grid;grid-template-columns:repeat(3,1fr);min-width:420px;background:var(--black);color:white;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}.summary div{padding:22px;border-right:1px solid #2a2e35}.summary div:last-child{border:0}.summary strong{font:800 28px/1 Manrope,sans-serif;display:block}.summary span{display:block;color:#adb5c1;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-top:7px}
.workspace{background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:52px}.category-wrap{padding:20px 22px 16px;background:#faf9f6;border-bottom:1px solid var(--line)}.category-heading{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px}.category-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}.category-tabs button{border:1px solid var(--line);background:white;color:#424a57;border-radius:999px;padding:9px 14px;white-space:nowrap;cursor:pointer;font-weight:700;font-size:13px}.category-tabs button:hover,.category-tabs button.active{background:var(--black);border-color:var(--black);color:#fff}
.explorer-grid{display:grid;grid-template-columns:300px minmax(0,1fr);min-height:720px}.dataset-panel{border-right:1px solid var(--line);background:#faf9f6;padding:20px 14px}.panel-label{padding:0 9px 12px;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.dataset-list{display:flex;flex-direction:column;gap:5px}.dataset-list button{border:0;background:transparent;text-align:left;border-radius:10px;padding:11px 12px;cursor:pointer;color:#3e4652;font-weight:600}.dataset-list button span{display:block;color:#8a919c;font-weight:500;font-size:11px;margin-top:2px}.dataset-list button:hover{background:#ece9e2}.dataset-list button.active{background:var(--blue);color:white}.dataset-list button.active span{color:#dce8ff}
.data-panel{padding:34px;min-width:0}.dataset-header{display:flex;justify-content:space-between;gap:28px;align-items:start}.dataset-header h2{font:800 clamp(27px,3vw,42px)/1.1 Manrope,sans-serif;letter-spacing:-.035em;margin:0}.dataset-header p:not(.eyebrow){color:var(--muted);margin:10px 0 0;max-width:730px}.export-button{border:0;border-radius:10px;padding:11px 16px;background:var(--black);color:#fff;font-weight:700;cursor:pointer;white-space:nowrap}.export-button:hover{background:var(--blue)}
.dataset-stats{display:flex;gap:9px;margin:22px 0}.dataset-stats span{border:1px solid var(--line);border-radius:999px;padding:6px 11px;color:var(--muted);font-size:12px;font-weight:600}.field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}.field{border:1px solid var(--line);border-radius:12px;padding:14px;min-width:0;background:#faf9f6}.field span{display:block;color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;overflow-wrap:anywhere}.field strong{display:block;font-size:17px;margin-top:6px;overflow-wrap:anywhere}
.chart-card,.table-card{border:1px solid var(--line);border-radius:16px;margin-top:22px;overflow:hidden}.chart-card{padding:22px}.chart-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.chart-head h3{font:800 18px Manrope,sans-serif;margin:0}.chart-head span{color:var(--muted);font-size:12px}.bar-chart{display:grid;gap:11px}.bar-row{display:grid;grid-template-columns:minmax(110px,200px) minmax(180px,1fr) 90px;gap:12px;align-items:center;font-size:12px}.bar-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-track{height:12px;border-radius:99px;background:#ebe8e1;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),#5a94ff)}.bar-value{text-align:right;font-weight:800}
.table-tools{padding:16px;display:flex;align-items:end;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);background:#faf9f6}.table-tools label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.search-box{width:min(440px,70%)}input,select{border:1px solid #cbc7be;background:#fff;border-radius:9px;padding:9px 11px;color:var(--ink);outline:none}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}.table-wrap{overflow:auto;max-height:610px}table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}th{position:sticky;top:0;z-index:1;background:#f0ede7;color:#3d4551;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.04em}th,td{padding:11px 13px;border-bottom:1px solid #ece9e3;min-width:130px;max-width:330px;vertical-align:top;overflow-wrap:anywhere}td{color:#39414d}tbody tr:hover td{background:#f7faff}.pagination{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;background:#faf9f6;color:var(--muted);font-size:12px}.pagination button{border:1px solid var(--line);background:#fff;padding:7px 11px;cursor:pointer}.pagination button:first-child{border-radius:8px 0 0 8px}.pagination button:last-child{border-radius:0 8px 8px 0}.pagination button:disabled{opacity:.45;cursor:not-allowed}.empty-state{margin-top:22px;border:1px dashed #c7c2b8;border-radius:14px;padding:22px;color:var(--muted);background:#faf9f6}
footer{width:min(1440px,calc(100% - 48px));margin:0 auto 40px;display:flex;justify-content:space-between;color:var(--muted);font-size:13px}
@media(max-width:960px){.intro{grid-template-columns:1fr}.summary{min-width:0}.explorer-grid{grid-template-columns:1fr}.dataset-panel{border-right:0;border-bottom:1px solid var(--line)}.dataset-list{display:grid;grid-template-columns:repeat(2,1fr)}.field-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.topbar{height:auto;padding:12px 16px;align-items:flex-start}.brand small{display:none}.topnav{flex-direction:column;align-items:flex-end}.topnav a{padding:4px 8px;font-size:12px}main{width:min(100% - 24px,1440px)}.intro{padding:42px 0 28px;gap:28px}.summary{grid-template-columns:1fr}.summary div{border-right:0;border-bottom:1px solid #2a2e35}.data-panel{padding:22px 16px}.dataset-header{flex-direction:column}.dataset-list,.field-grid{grid-template-columns:1fr}.table-tools{align-items:stretch;flex-direction:column}.search-box{width:100%}.bar-row{grid-template-columns:100px minmax(120px,1fr) 70px}footer{width:calc(100% - 24px);flex-direction:column;gap:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}