/* Data Integrity page: dark brand band, then KPI cards, two pies, rate cards, a sortable
   jurisdiction table with expandable rows, source pies and a reading guide.
   Series colours are CVD-checked; every pie labels its own slices with value, name and count. */
.itg{font-size:15px;line-height:1.6;--ink:var(--gsein-dark,#0B181A);--ink-2:#13272A;--gold:#F3D27A;--accent:#2a78d6;--accent-ink:#1c5cab;--accent-tint:#EEF4FC;
  --card:#fff;--line:#E6E3DA;--line-2:#F0EEE7;--fg:#14211F;--muted:#5E6B68;--faint:#8C9794;
  background:var(--gsein-light,#FBFAF6);color:var(--fg);padding-bottom:64px}
.itg-num{font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.itg-band{background:radial-gradient(1200px 400px at 85% -10%,#1C3A3D 0,transparent 60%),var(--ink);color:#E9F1EF}
/* The hero carries the site's hero classes too (cov-hero, cov-eyebrow, cov-lede), so site-theme.css gives it
   the same kicker, title size and lede as every other page. */
.itg-hero{display:grid;gap:14px;padding:56px 0 32px}
.itg-eyebrow{margin:0;color:var(--gsein-mint,#67DEC1);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.itg-hero h1{margin:0;color:#fff;font-size:clamp(26px,3vw,36px);line-height:1.2;font-weight:700;letter-spacing:-.01em}
html[dir="rtl"] .itg-hero h1{letter-spacing:0;line-height:1.3}
.itg-lede{margin:0;color:#B9C8C4;max-width:68ch;font-size:16px;line-height:1.7}
.itg-fine{margin:0;color:#8DA29D;max-width:72ch;font-size:13px;line-height:1.6}
.itg-asof{margin:6px 0 0;color:#8DA29D;font-size:12.5px;display:flex;gap:8px;align-items:center}
.itg-dot{width:8px;height:8px;border-radius:50%;background:var(--gsein-mint,#67DEC1);box-shadow:0 0 0 4px rgba(103,222,193,.15)}
.itg-body{display:grid;gap:28px;padding-top:28px}
.itg-empty{margin:0;padding:22px;color:var(--muted);text-align:center;background:var(--card);border:1px solid var(--line);border-radius:18px}
.itg :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* While the figures load: empty card shapes hold the layout, so nothing below jumps; then the sections fade in. */
.itg-skel{display:grid;gap:28px}
.itg-skel>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.itg-skel>div+div{grid-template-columns:repeat(2,minmax(0,1fr))}
.itg-skel i{display:block;height:170px;background:var(--card);border:1px solid var(--line);border-radius:18px;animation:itg-pulse 1.4s ease-in-out infinite alternate}
.itg-skel>div+div i{height:480px}
@keyframes itg-pulse{from{opacity:1}to{opacity:.55}}
.itg-in>*{animation:itg-in .38s cubic-bezier(.2,.7,.2,1) both}
.itg-in>*:nth-child(2){animation-delay:.05s}.itg-in>*:nth-child(3){animation-delay:.1s}.itg-in>*:nth-child(4){animation-delay:.15s}
.itg-in>*:nth-child(n+5){animation-delay:.2s}
@keyframes itg-in{from{opacity:0;transform:translateY(10px)}}
@media(max-width:900px){.itg-skel>div{grid-template-columns:repeat(2,minmax(0,1fr))}.itg-skel>div+div{grid-template-columns:1fr}.itg-skel>div+div i{height:420px}}
@media(prefers-reduced-motion:reduce){.itg-skel i,.itg-in>*{animation:none}}

/* KPI cards */
.itg-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.itg-kpis.itg-k5{grid-template-columns:repeat(5,minmax(0,1fr))}
.itg-kpi{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px 20px 18px;display:grid;gap:6px;align-content:start;box-shadow:0 1px 2px rgba(11,24,26,.04),0 8px 24px -16px rgba(11,24,26,.18);min-width:0}
.itg-kpi-h{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--muted)}
.itg-ico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none;color:var(--hi);background:color-mix(in srgb,var(--h) 14%,#fff)}
.itg-ico svg{width:19px;height:19px}
.itg-kpi-v{font-size:clamp(22px,2.2vw,30px);font-weight:500;color:var(--fg);line-height:1.2}
.itg-kpi-s{font-size:13px;font-weight:600}
.itg-kpi-d{font-size:12.5px;color:var(--faint);line-height:1.5}

/* Cards and section heads */
.itg-card{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;min-width:0}
.itg-head{padding:20px 22px 0;display:grid;gap:4px}
.itg-head h2{margin:0;font-size:20px;font-weight:700;letter-spacing:-.01em}
.itg-head p{margin:0;color:var(--muted);font-size:13.5px;max-width:70ch}
.itg-row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}

/* Pie with callout labels: drawn at real pixel width by integrity.js */
.itg-pie{width:100%;padding:8px 22px 18px;box-sizing:border-box}
.itg-pie svg{display:block;width:100%;height:auto;overflow:visible}
.itg-pie .sls{filter:drop-shadow(0 8px 18px rgba(11,24,26,.14))}
.itg-pie .sl{stroke:#fff;stroke-width:1.5;stroke-linejoin:round;transition:transform .18s ease,opacity .18s ease}
.itg-pie svg.hov .sl{opacity:.5}
.itg-pie svg.hov .sl.on{opacity:1;transform:translate(var(--dx),var(--dy))}
.itg-pie svg.hov .co{opacity:.45}
.itg-pie svg.hov .co.on{opacity:1}
.itg-pie .co{transition:opacity .18s ease}
.itg-pie .ld{fill:none;stroke:#9AA6A3;stroke-width:1}
.itg-pie .pv{font:600 17px "IBM Plex Mono",ui-monospace,monospace;fill:var(--fg);letter-spacing:-.02em}
.itg-pie .pn{font-size:12.5px;font-weight:500;fill:#33403D}
.itg-pie .pc{font:400 12px "IBM Plex Mono",ui-monospace,monospace;fill:var(--faint)}
/* Centre disk in deep orange (Noor, 2026-10-19: no black in the charts); white figure 5.2:1, cream label 4.7:1. */
.itg-pie .hole{fill:#C2410C}
.itg-pie .cv{font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500;fill:#fff;letter-spacing:-.02em}
.itg-pie .cl{font-size:10px;font-weight:600;letter-spacing:.09em;fill:#FFF1E6}
/* Processing Outcome flow: total node in the same deep orange, translucent ribbons, solid outcome nodes. */
.itg-pie .src{fill:#C2410C}
.itg-pie .rb{opacity:.4;transition:opacity .18s ease}
.itg-pie .nd{transition:opacity .18s ease}
.itg-pie svg.hov .rb{opacity:.14}
.itg-pie svg.hov .rb.on{opacity:.7}
.itg-pie svg.hov .nd{opacity:.45}
.itg-pie svg.hov .nd.on{opacity:1}
.itg-pie .fl{font-size:10.5px;font-weight:600;letter-spacing:.09em;fill:var(--muted)}
.itg-pie .fv{font:500 22px "IBM Plex Mono",ui-monospace,monospace;fill:#B03A0A;letter-spacing:-.02em}
.itg-pie-empty{margin:0;padding:30px;color:var(--muted);text-align:center}
.itg-pending{margin:0 22px 20px;display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:12px;background:#F6F5F0;color:var(--muted);font-size:13px;line-height:1.5}
.itg-pending i{width:10px;height:10px;border-radius:3px;background:#C9CFCC;flex:none;margin-top:5px}
.itg-pending b{color:var(--fg);font-weight:500}
@media (prefers-reduced-motion:reduce){.itg-pie .sl,.itg-pie .co,.itg-pie .rb,.itg-pie .nd{transition:none}}

/* Info tip */
.itg-tip{position:relative;display:inline-flex}
.itg-tip button{width:18px;height:18px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--muted);font:600 11px/1 inherit;cursor:help;padding:0;display:grid;place-items:center}
.itg-tip [role=tooltip]{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:260px;background:var(--ink);color:#E9F1EF;font-size:12.5px;font-weight:400;line-height:1.5;padding:10px 12px;border-radius:10px;box-shadow:0 10px 30px -10px rgba(0,0,0,.4);opacity:0;visibility:hidden;transition:opacity .12s;z-index:20;pointer-events:none}
.itg-tip:hover [role=tooltip],.itg-tip:focus-within [role=tooltip]{opacity:1;visibility:visible}
.itg-tip [role=tooltip] b{display:block;color:#fff;margin-bottom:2px}

/* Floating chart tooltip */
.itg-float{position:fixed;z-index:40;pointer-events:none;background:var(--ink);color:#fff;border-radius:10px;padding:8px 11px;font-size:12.5px;box-shadow:0 10px 30px -10px rgba(0,0,0,.4);opacity:0;transition:opacity .1s}
.itg-float b{display:block;font-weight:600}
.itg-float span{color:#B9C8C4}

/* Rate cards */
.itg-rates{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
/* Same card as the KPI row: radius, padding, shadow and figure size. */
.itg-rate{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px 20px 18px;display:grid;gap:6px;align-content:start;min-width:0;box-shadow:0 1px 2px rgba(11,24,26,.04),0 8px 24px -16px rgba(11,24,26,.18)}
.itg-rate-h{display:flex;align-items:center;gap:10px}
.itg-rate h3{margin:0;font-size:13px;font-weight:600;color:var(--muted);line-height:1.3}
.itg-rate .v{font-size:clamp(22px,2.2vw,30px);font-weight:500;line-height:1.2}
.itg-rate p{margin:0;font-size:12.5px;color:var(--faint);line-height:1.5}

/* Jurisdiction table */
.itg-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:16px 22px}
.itg-search{flex:1 1 240px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:0 12px;color:var(--faint);max-width:360px}
.itg-search input{border:0;background:transparent;color:var(--fg);font:inherit;padding:9px 0;width:100%;outline:none}
.itg-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(42,120,214,.18)}
.itg-count{margin-inline-start:auto;color:var(--muted);font-size:13px}
.itg-scroll{overflow-x:auto}
.itg table{width:100%;border-collapse:collapse;font-size:14px}
.itg th{font-size:12px;font-weight:600;color:var(--faint);text-align:end;padding:0;letter-spacing:.03em;background:var(--line-2);white-space:nowrap}
.itg th:first-child{text-align:start}
.itg th>span,.itg th>button{display:block;padding:10px 14px}
.itg th>button{width:100%;border:0;background:transparent;font:inherit;color:inherit;text-align:inherit;cursor:pointer;letter-spacing:inherit}
.itg th>button:hover{color:var(--fg)}
.itg th>button::after{content:"";display:inline-block;width:0;height:0;margin-inline-start:6px;vertical-align:middle;border:4px solid transparent;border-top-color:currentColor;opacity:.25;transform:translateY(2px)}
.itg th[aria-sort=descending]>button{color:var(--fg)}
.itg th[aria-sort=descending]>button::after{opacity:1}
.itg th[aria-sort=ascending]>button{color:var(--fg)}
.itg th[aria-sort=ascending]>button::after{opacity:1;border-top-color:transparent;border-bottom-color:currentColor;transform:translateY(-2px)}
.itg td{padding:12px 14px;border-top:1px solid var(--line-2);text-align:end;white-space:nowrap}
.itg td:first-child{text-align:start}
.itg tr.j{cursor:pointer}
.itg tr.j:hover td{background:#F7F9FC}
.itg tr.j[aria-expanded=true] td{background:var(--accent-tint)}
.itg-ctry{display:flex;align-items:center;gap:10px}
.itg-chev{width:16px;height:16px;color:var(--faint);transition:transform .15s;flex:none}
tr[aria-expanded=true] .itg-chev{transform:rotate(90deg);color:var(--accent-ink)}
html[dir=rtl] .itg-chev{transform:scaleX(-1)}
html[dir=rtl] tr[aria-expanded=true] .itg-chev{transform:rotate(90deg)}
.itg-flag{width:24px;height:18px;flex:none;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(11,24,26,.12);background:#EEF0EE}
.itg-detail h3 .itg-flag{width:28px;height:21px;margin-inline-end:10px;vertical-align:-4px}
.itg-cc{font:500 11px/1 "IBM Plex Mono",ui-monospace,monospace;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:4px 5px}
.itg-cname{font-weight:500}
.itg-pend{color:var(--faint);font-size:13px}
.itg-dash{color:var(--faint)}
/* Pager: ten jurisdictions per page */
.itg-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;border-top:1px solid var(--line-2)}
.itg-range{color:var(--muted);font-size:13px}
.itg-range b{color:var(--fg);font-weight:500}
.itg-pages{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.itg-pages button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;height:36px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--fg);font:inherit;font-size:13.5px;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.itg-pages button:hover:not(:disabled){border-color:var(--accent);color:var(--accent-ink)}
.itg-pages .itg-pg.on{background:#C2410C;border-color:#C2410C;color:#fff;cursor:default}
.itg-pages button:disabled{opacity:.4;cursor:not-allowed}
.itg-gap{min-width:20px;text-align:center;color:var(--faint)}
html[dir=rtl] .itg-step svg{transform:scaleX(-1)}

/* Expanded jurisdiction */
.itg tr.d td{padding:0;background:#FBFCFA;text-align:start;white-space:normal}
.itg-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:24px;padding:22px 24px 24px;border-top:1px solid var(--line-2)}
.itg-detail h3{margin:0 0 12px;font-size:16px;font-weight:700}
.itg-detail h4{margin:0 0 6px;font-size:13px;font-weight:600;color:var(--muted)}
.itg-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.itg-fact{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.itg-fact span{display:block;font-size:12px;color:var(--muted)}
.itg-fact b{display:block;font:500 18px "IBM Plex Mono",ui-monospace,monospace;color:var(--fg)}
.itg-fact small{font-size:12px;color:var(--accent-ink);font-weight:600}

/* GLEIF status table */
.itg-status{padding:8px 22px 20px}
.itg-status table td{padding:11px 14px}
.itg-status .st{display:flex;align-items:center;gap:8px}
.itg-status .st i{width:10px;height:10px;border-radius:3px}

/* Sources: donut of issued GSEINs by source + one panel per source */
.itg-sources{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:8px 20px;align-items:center;padding:0 22px 22px 0}
.itg-srcs{display:grid;gap:14px}
.itg-src{border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:10px;background:#fff}
.itg-src-n{margin:0;font-size:13px;color:var(--muted)}
.itg-src-n b{font-size:14px;font-weight:500;color:var(--fg)}
.itg-src .itg-facts{grid-template-columns:repeat(3,minmax(0,1fr))}
.itg-src .itg-fact{padding:10px 12px}
.itg-src .itg-fact b{font-size:16px}
.itg-detail .itg-pie{padding:0}
/* Expanded jurisdiction: rows of icon cards, the headline cards' style at a smaller size. */
.itg-detail{grid-template-columns:minmax(0,1fr);gap:12px}
.itg-detail h3{grid-column:1/-1;margin:0 0 2px}
.itg-dgrid{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.itg-dcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:grid;gap:6px;align-content:start;min-width:0;box-shadow:0 1px 2px rgba(11,24,26,.04)}
.itg-dcard .itg-ico{width:30px;height:30px;border-radius:9px}
.itg-dcard .itg-ico svg{width:17px;height:17px}
.itg-dcard b{font-size:20px;font-weight:500;color:var(--fg);line-height:1.2}
.itg-dcard small{font-size:12px;font-weight:600}
.itg-dgrid.itg-d5{grid-template-columns:repeat(5,minmax(0,1fr))}
/* Why records were excluded: the jurisdiction's pie on a card of the same style. */
.itg-why{grid-column:1/-1;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px 6px;box-shadow:0 1px 2px rgba(11,24,26,.04);min-width:0}
.itg-why h4{margin:0 0 4px;font-size:13px;font-weight:600;color:var(--muted)}

/* Reading guide */
.itg-guide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:18px 22px 6px}
.itg-guide.itg-g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.itg-guide div{display:grid;gap:4px;align-content:start}
.itg-guide b{font-size:14px}
.itg-guide span{font-size:13px;color:var(--muted);line-height:1.55}
/* Confidentiality note: light orange panel matching the chart centre disk (Noor: no black). */
.itg-conf{margin:14px 22px 22px;padding:14px 16px;border-radius:12px;background:#FFF3EA;border:1px solid #F6D3BC;color:#7C2D12;font-size:13px;line-height:1.6;display:flex;gap:10px;align-items:flex-start}
.itg-conf svg{flex:none;color:#C2410C;margin-top:2px}

@media(max-width:1100px){.itg-kpis,.itg-rates{grid-template-columns:repeat(2,minmax(0,1fr))}.itg-guide,.itg-guide.itg-g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .itg-kpis.itg-k5{grid-template-columns:repeat(6,minmax(0,1fr))}.itg-k5>*{grid-column:span 2}.itg-k5>:nth-child(n+4){grid-column:span 3}}
@media(max-width:900px){.itg-row2,.itg-sources,.itg-detail{grid-template-columns:1fr}.itg-sources{padding:0 16px 18px}.itg-dgrid,.itg-dgrid.itg-d5{grid-template-columns:repeat(2,minmax(0,1fr))}.itg-d5>:first-child{grid-column:1/-1}}
@media(max-width:640px){
  .itg-kpis,.itg-rates,.itg-kpis.itg-k5{grid-template-columns:repeat(2,minmax(0,1fr))}.itg-k5>*,.itg-k5>:nth-child(n+4){grid-column:auto}.itg-k5>:first-child{grid-column:1/-1}
  .itg-why{padding:12px 10px 4px}
  .itg-pie{padding:6px 12px 14px}
  .itg-guide{grid-template-columns:1fr}
  .itg-facts{grid-template-columns:1fr 1fr}
  .itg-src .itg-facts{grid-template-columns:1fr;gap:8px}
  .itg-src .itg-fact{display:flex;align-items:baseline;gap:10px}
  .itg-src .itg-fact span{flex:1}
  .itg-count{margin-inline-start:0}
  .itg-dcard{padding:12px 14px}
  .itg-dcard .itg-kpi-h{flex-direction:column;align-items:flex-start;gap:8px}
  .itg-dcard b{font-size:18px}
  .itg-pager{justify-content:center}
  .itg-step span{display:none}
}
/* Keep the expanded panel inside the viewport while the table scrolls sideways. */
.itg tr.d td>.itg-detail{position:sticky;inset-inline-start:0;max-width:min(100%,calc(100vw - 34px))}