@font-face{font-family:"Erode";src:url(fonts/erode-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Erode";src:url(fonts/erode-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Erode";src:url(fonts/erode-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Plex Arabic";src:url(fonts/plex-ar-400.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:"Plex Arabic";src:url(fonts/plex-ar-500.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:"Plex Arabic";src:url(fonts/plex-ar-700.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF}

/* ------------------------------------------------------------------ tokens */
:root{
  color-scheme:dark;
  --page:#12100e; --page-2:#191511;
  --panel:#1b1714; --panel-2:#231e19; --panel-3:#2d261f;
  --lip:rgba(255,220,190,.06);
  --edge:rgba(247,145,28,.10);
  --ink:#f3ece6; --ink-2:#c3b6aa; --muted:#8f8277; --hair:#2e261f; --axis:#3d332b;
  --brand:#f7911c; --brand-ink:#ffb35c; --brand-wash:rgba(247,145,28,.10); --brand-ring:rgba(247,145,28,.38);
  --on-brand:#1b120a;
  /* answer polarity (ordinal, ECHO) */
  --a-sp:#f7a13c; --a-p:#a8672a; --a-n:#3f6e9c; --a-sn:#86b4e3; --a-dk:#6d635b; --a-na:#463e38;
  /* four PM elements (validated categorical, dark steps) */
  --e-sdh:#d0730f; --e-mea:#3f86d6; --e-acc:#1f9e76; --e-pem:#a877d9;
  --female:#e0801a; --male:#3f86d6; --unk:#5a5049;
  --r0:#2a211a; --r1:#4a3220; --r2:#77471e; --r3:#b0651b; --r4:#ec8c22; --r5:#fbc27f;
  --map-empty:#211b16; --map-line:#14100d; --map-gov:#8f8277;
  --good:#0ca30c; --warn:#fab219; --crit:#e0564e; --good-ink:#6fcf6f; --warn-ink:#f5c24a;
  --map-proj:#2f2720; --map-proj-hi:#3a3027; --map-proj-line:#4a3d31; --map-track:#3a3129;
  --tip-bg:#2a221c; --tip-shadow:0 3px 8px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,220,190,.07);
  --panel-shadow:0 1px 0 rgba(0,0,0,.35);
  --dawn:linear-gradient(180deg,rgba(247,145,28,.07) 0,rgba(247,145,28,.02) 240px,rgba(18,16,14,0) 560px);
  --grain:.32;
  --display:"Erode","Plex Arabic",Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Plex Arabic","Noto Sans Arabic","Geeza Pro",sans-serif;
  --gut:clamp(16px,2.2vw,30px);
  --r:14px;
}
:root[data-theme="light"]{
  color-scheme:light;
  --page:#f5f1ee; --page-2:#efe9e4;
  --panel:#fffdfb; --panel-2:#f7f2ee; --panel-3:#efe7e0;
  --lip:rgba(255,255,255,.9);
  --edge:rgba(160,90,20,.10);
  --ink:#1d1611; --ink-2:#5a4d43; --muted:#7a6d62; --hair:#e8e0d9; --axis:#d3c8be;
  --brand:#f7911c; --brand-ink:#b35f06; --brand-wash:rgba(247,145,28,.10); --brand-ring:rgba(210,116,12,.42);
  --on-brand:#1b120a;
  --a-sp:#c65f06; --a-p:#f3a654; --a-n:#7fa8d0; --a-sn:#285b8c; --a-dk:#a99f96; --a-na:#d9d1ca;
  --e-sdh:#d9780a; --e-mea:#2f6fb3; --e-acc:#169c78; --e-pem:#8a5cc9;
  --female:#d9780a; --male:#2f6fb3; --unk:#c4b9b0;
  --r0:#fdf0e1; --r1:#fcd9ae; --r2:#fab86c; --r3:#f7911c; --r4:#cf6e08; --r5:#8f4a05;
  --map-empty:#ece5df; --map-line:#fffdfb; --map-gov:#6d5f54; --map-proj:#f6e7d6; --map-proj-hi:#f1dcc4; --map-proj-line:#dcc5ad; --map-track:#e6d8ca; --good-ink:#2f7d18; --warn-ink:#9a6400;
  --tip-bg:#ffffff; --tip-shadow:0 3px 10px rgba(80,45,15,.14),0 0 0 1px rgba(80,45,15,.06);
  --panel-shadow:0 1px 2px rgba(90,50,15,.06),0 0 0 1px rgba(90,50,15,.05);
  --dawn:linear-gradient(180deg,rgba(247,145,28,.10) 0,rgba(247,145,28,.03) 240px,rgba(245,241,238,0) 560px);
  --grain:.18;
}

/* ------------------------------------------------------------------ base */
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--page);color:var(--ink);font:14px/1.45 var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh;position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:var(--dawn),var(--page)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:var(--grain);mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
[dir="rtl"] body,[lang="ar"] body{font-family:"Plex Arabic",var(--sans)}
button,select,input{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
svg{display:block}
.num{font-variant-numeric:tabular-nums}
[hidden]{display:none!important}

/* ------------------------------------------------------------------ top */
.top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 20px;padding:16px var(--gut) 8px}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.logo{height:38px;width:auto;display:block}
.logo-dark{display:none}
:root[data-theme="dark"] .logo-dark{display:block}
:root[data-theme="dark"] .logo-light{display:none}
.brand-t{display:flex;flex-direction:column;line-height:1.15;padding-inline-start:14px;min-width:0}
.brand-t b{font-family:var(--display);font-weight:500;font-size:23px;letter-spacing:.004em;white-space:nowrap}
[dir="rtl"] .brand-t b{font-family:"Plex Arabic",var(--sans);font-weight:700;font-size:20px}
.brand-t span{color:var(--muted);font-size:12.5px;white-space:nowrap}
.tabs{grid-column:1 / -1;grid-row:2;justify-self:start;min-width:0;position:relative;display:flex;gap:2px;padding:4px;border-radius:13px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);max-width:100%;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{position:relative;z-index:1;border:0;background:none;padding:7px 13px;border-radius:10px;color:var(--ink-2);font-weight:500;white-space:nowrap;transition:color .2s}
.tab:hover{color:var(--ink)}
.tab[aria-selected="true"]{color:var(--brand-ink)}
.tab-ind{position:absolute;z-index:0;top:4px;bottom:4px;left:0;width:0;border-radius:10px;background:var(--panel-3);box-shadow:inset 0 0 0 1px var(--edge);transition:transform .38s cubic-bezier(.3,.9,.3,1),width .38s cubic-bezier(.3,.9,.3,1)}
.tools{display:flex;align-items:center;gap:8px;white-space:nowrap}
.sync{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;margin-inline-end:4px}
.sync i{width:7px;height:7px;border-radius:50%;background:var(--good);display:inline-block}
.sync.stale i{background:var(--warn)}
.sync.bad i{background:var(--crit)}
.ic{width:34px;height:34px;border:0;border-radius:10px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);display:grid;place-items:center;color:var(--ink-2);transition:color .2s,background .2s}
.ic:hover{color:var(--ink);background:var(--panel-2)}
.ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ic svg .fillc{fill:currentColor;stroke:none}
.ic .fs-out{display:none}
.is-fs .ic .fs-out{display:block}
.is-fs .ic .fs-in{display:none}
.ic.spinning svg{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.seg{display:flex;border-radius:10px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);padding:3px}
.seg button{border:0;background:none;padding:4px 10px;border-radius:7px;color:var(--ink-2);font-size:13px;transition:background .2s,color .2s;min-width:34px}
.seg button:hover{color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--panel-3);color:var(--brand-ink)}
.xbtn{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:10px;padding:8px 12px;background:var(--brand-wash);color:var(--brand-ink);font-weight:600;font-size:13px;box-shadow:inset 0 0 0 1px var(--edge);transition:background .2s}
.xbtn:hover{background:rgba(247,145,28,.18)}
.xbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ------------------------------------------------------------------ filters */
.filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 14px;padding:6px var(--gut) 14px}
.presets{display:flex;gap:2px;padding:3px;border-radius:11px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);flex-wrap:wrap}
.presets button{border:0;background:none;padding:6px 10px;border-radius:8px;color:var(--ink-2);font-size:12.5px;white-space:nowrap}
.presets button:hover{color:var(--ink)}
.presets button[aria-pressed="true"]{background:var(--panel-3);color:var(--brand-ink)}
.fgrid{display:flex;flex-wrap:wrap;gap:8px}
.fsel{display:flex;flex-direction:column;gap:3px}
.fsel span{font-size:11.5px;color:var(--muted);padding-inline-start:3px}
.fsel select{appearance:none;border:0;border-radius:10px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);padding:7px 30px 7px 11px;min-width:118px;max-width:200px;color:var(--ink);cursor:pointer;font-size:13px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%239a8b7e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}
[dir="rtl"] .fsel select{padding:7px 11px 7px 30px;background-position:left 11px center}
.fsel select.on{background-color:var(--panel-3);box-shadow:inset 0 0 0 1px var(--brand-ring)}
.fsel option{background:var(--panel);color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:8px;padding:5px 9px;background:var(--brand-wash);color:var(--brand-ink);font-size:12.5px;box-shadow:inset 0 0 0 1px var(--edge)}
.chip svg{width:11px;height:11px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}
.chip:hover{background:rgba(247,145,28,.18)}
.reset{display:none;align-items:center;gap:6px;border:0;background:none;color:var(--ink-2);padding:7px 9px;border-radius:9px;font-size:13px}
.reset.show{display:inline-flex}
.reset:hover{color:var(--ink);background:var(--panel)}
.reset svg{width:13px;height:13px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round}

/* ------------------------------------------------------------------ layout */
main{padding:0 var(--gut) 24px;min-height:60vh}
.view{display:none}
.view.on{display:block}
.grid{display:grid;gap:14px}
.g-ov{grid-template-columns:minmax(0,1.5fr) minmax(360px,1fr);align-items:stretch}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-21{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.g-12{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.span2{grid-column:span 2}
.mt{margin-top:14px}
.stackcol{display:flex;flex-direction:column;gap:14px;min-width:0}

/* ------------------------------------------------------------------ card */
.card{position:relative;background:var(--panel);border-radius:var(--r);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);padding:16px 18px 18px;min-width:0;display:flex;flex-direction:column}
.card-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:0 0 12px}
.card-h .ttl{min-width:0}
.card-h h3{font-family:var(--display);font-weight:500;font-size:19px;line-height:1.2;margin:0}
[dir="rtl"] .card-h h3{font-family:"Plex Arabic",var(--sans);font-weight:700;font-size:17px}
.card-h p{margin:3px 0 0;color:var(--muted);font-size:12.5px;line-height:1.35}
.acts{display:flex;align-items:center;gap:2px;flex:none;opacity:.8;transition:opacity .2s}
.card:hover .acts,.acts:focus-within{opacity:1}
.acts button{width:28px;height:28px;border:0;background:none;border-radius:8px;display:grid;place-items:center;color:var(--muted)}
.acts button:hover{background:var(--panel-2);color:var(--ink)}
.acts button[aria-pressed="true"]{color:var(--brand-ink);background:var(--panel-2)}
.acts svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.acts .sep{width:1px;height:16px;background:var(--hair);margin:0 3px;border-radius:1px}
.card-b{flex:1;min-height:0;position:relative}
.card.max{position:fixed;inset:18px;z-index:60;overflow:auto;box-shadow:0 0 0 100vmax rgba(10,7,5,.62)}
.card.max .card-b{min-height:0}
.foot-note{color:var(--muted);font-size:12px;margin:10px 0 0}
.empty{color:var(--muted);font-size:13px;padding:24px 0;text-align:center}

.hero{display:flex;flex-direction:column;gap:14px}
.narr{background:var(--panel-2);border-radius:10px;padding:12px 14px;font-size:13px;line-height:1.55;color:var(--ink-2);position:relative}
.narr strong{color:var(--ink)}
.narr .copy{position:absolute;top:8px;inset-inline-end:8px;border:0;background:var(--panel-3);color:var(--ink-2);border-radius:7px;padding:4px 8px;font-size:11.5px}
.narr .copy:hover{color:var(--ink)}
.narr p{margin:0 0 4px;padding-inline-end:56px}
.narr ul{margin:4px 0 0;padding-inline-start:18px}

/* ------------------------------------------------------------------ bars */
.hb{display:grid;gap:3px}
.hb-r{display:grid;grid-template-columns:minmax(90px,var(--lw,38%)) minmax(0,1fr) auto;align-items:center;gap:10px;padding:5px 6px;border-radius:8px;cursor:pointer}
.hb-r.static{cursor:default}
.hb-r:hover{background:var(--panel-2)}
.hb-r.sel{background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--brand-ring)}
.hb-r.dim{opacity:.42}
.hb-l{min-width:0;font-size:13px;color:var(--ink-2);line-height:1.25;display:flex;align-items:center;gap:8px}
.hb-l span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb-l img{height:16px;width:auto;max-width:54px;object-fit:contain;flex:none;filter:brightness(0) invert(1);opacity:.75}
:root[data-theme="light"] .hb-l img{filter:brightness(0);opacity:.6}
.hb-t{height:10px;border-radius:4px;background:var(--panel-3);position:relative;overflow:hidden}
.hb-f{position:absolute;inset-block:0;inset-inline-start:0;border-radius:4px;background:var(--brand);transition:width .5s cubic-bezier(.3,.9,.3,1)}
.hb-v{font-variant-numeric:tabular-nums;font-weight:600;font-size:13px;min-width:var(--vw,92px);text-align:end;display:flex;gap:8px;justify-content:flex-end;align-items:baseline}
.hb-v small{color:var(--muted);font-weight:400;font-size:11.5px}
.ref{position:absolute;inset-block:-3px;width:2px;border-radius:1px;background:var(--ink);opacity:.55}

/* stacked 100% answer bars */
.st{display:grid;gap:6px}
.st-r{display:grid;grid-template-columns:minmax(120px,var(--lw,34%)) minmax(0,1fr) 56px;gap:12px;align-items:center;padding:4px 6px;border-radius:8px}
.st-r.sel{background:var(--panel-2)}
.st-l{min-width:0;font-size:13px;line-height:1.25;color:var(--ink-2)}
.st-l b{color:var(--ink);font-weight:600;margin-inline-end:6px;font-size:12px}
.st-bar{display:flex;height:16px;gap:2px}
.st-bar i{display:block;height:100%;min-width:2px;cursor:pointer;transition:flex-grow .5s ease,opacity .2s}
.st-bar i:first-child{border-start-start-radius:4px;border-end-start-radius:4px}
.st-bar i:last-child{border-start-end-radius:4px;border-end-end-radius:4px}
.st-bar i.dim{opacity:.3}
.st-v{font-family:var(--display);font-size:18px;text-align:end;line-height:1}
.st-v.low{color:var(--crit)}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:12px 0 0;padding:0;list-style:none;font-size:12px;color:var(--ink-2)}
.legend li{display:flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:3px;display:block}
.st-sep{height:1px;margin:6px 6px;background:var(--hair);border-radius:1px}
.st-grp{font-size:11.5px;color:var(--muted);padding:6px 6px 0}

/* svg charts */
.chart{position:relative;width:100%}
.chart svg{width:100%;height:auto;overflow:visible;direction:ltr}
.ax text{fill:var(--muted);font-size:11px}
.ax line{stroke:var(--hair);stroke-width:1}
.ax .base{stroke:var(--axis)}
.ln{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.cross{stroke:var(--ink-2);stroke-width:1;opacity:0}
.chart:hover .cross{opacity:.5}
.col{cursor:pointer;transition:opacity .2s}
.col.dim{opacity:.35}

/* heat table */
.ht-wrap{overflow:auto;border-radius:10px}
table.ht{border-collapse:separate;border-spacing:2px;width:100%;font-size:12.5px}
.ht th{font-weight:500;color:var(--muted);text-align:center;padding:6px 6px;font-size:11.5px;line-height:1.2;vertical-align:bottom}
.ht th.rowh{text-align:start;color:var(--ink-2);font-size:12.5px;vertical-align:middle;min-width:150px}
.ht th.grp{color:var(--ink);font-size:12px;border-bottom:0}
.ht td{text-align:center;padding:7px 4px;border-radius:5px;font-variant-numeric:tabular-nums;font-weight:600;min-width:52px;cursor:default}
.ht td.na{color:var(--muted);font-weight:400;background:var(--panel-2)}
.ht td{position:relative}
.ht td.warn::after{content:"";position:absolute;top:4px;inset-inline-end:4px;width:6px;height:6px;border-radius:50%;background:var(--crit);box-shadow:0 0 0 1.5px var(--panel)}
.ht td small{display:block;font-weight:400;font-size:10.5px;opacity:.8}
.ht tr.tot th,.ht tr.tot td{border-top:0}

/* data table */
.tbl-wrap{overflow:auto;max-height:560px;border-radius:10px;box-shadow:inset 0 0 0 1px var(--hair)}
.card.max .tbl-wrap{max-height:none}
table.dt{border-collapse:collapse;width:100%;font-size:12.5px}
.dt th{position:sticky;top:0;background:var(--panel-2);text-align:start;font-weight:600;color:var(--ink-2);padding:8px 10px;white-space:nowrap;cursor:pointer;z-index:1}
.dt th:hover{color:var(--ink)}
.dt th .arr{opacity:.6;margin-inline-start:4px}
.dt td{padding:7px 10px;border-top:1px solid var(--hair);vertical-align:top;white-space:nowrap;max-width:340px;overflow:hidden;text-overflow:ellipsis}
.dt td.n{text-align:end;font-variant-numeric:tabular-nums;white-space:nowrap}
.dt tr:hover td{background:var(--panel-2)}
.dt tr.click{cursor:pointer}
.dt .pill{display:inline-block;padding:1px 7px;border-radius:6px;font-size:11.5px;background:var(--panel-3);color:var(--ink-2)}
.dt .lowv{color:var(--crit);font-weight:600}
.dt .ok{color:var(--good)}
.dt img{height:16px;width:auto;max-width:60px;object-fit:contain;vertical-align:middle;filter:brightness(0) invert(1);opacity:.75}
:root[data-theme="light"] .dt img{filter:brightness(0);opacity:.6}
.tbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}
.tbar input{border:0;border-radius:9px;background:var(--panel-2);padding:7px 11px;min-width:220px;color:var(--ink);box-shadow:inset 0 0 0 1px var(--hair)}
.tbar .cnt{color:var(--muted);font-size:12px}
.pager{display:flex;gap:4px;align-items:center;justify-content:flex-end;margin-top:10px;color:var(--muted);font-size:12px}
.pager button{border:0;background:var(--panel-2);border-radius:7px;padding:5px 10px;color:var(--ink-2)}
.pager button:disabled{opacity:.4;cursor:default}

/* KPI strip */
.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.kpi{background:var(--panel);border-radius:var(--r);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);padding:14px 16px;min-width:0}
.kpi b{display:block;font-family:var(--display);font-weight:400;font-size:30px;line-height:1.05}
.kpi span{display:block;color:var(--ink-2);font-size:12.5px;margin-top:4px;line-height:1.3}
.kpi em{display:block;font-style:normal;color:var(--muted);font-size:11.5px;margin-top:2px}
.kpi.flag b{color:var(--crit)}

/* voices */
.vq{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 12px}
.vq button{border:0;border-radius:8px;padding:5px 10px;background:var(--panel-2);color:var(--ink-2);font-size:12.5px}
.vq button[aria-pressed="true"]{background:var(--brand-wash);color:var(--brand-ink);box-shadow:inset 0 0 0 1px var(--edge)}
.vq button b{font-weight:600;margin-inline-start:4px}
.voices{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:10px;max-height:720px;overflow:auto;padding:2px}
.voice{background:var(--panel-2);border-radius:11px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.voice p{margin:0;font-size:14px;line-height:1.6;color:var(--ink)}
.voice .m{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;color:var(--muted)}
.voice .m b{color:var(--brand-ink);font-weight:600}

/* misc */
.loading{display:flex;align-items:center;gap:12px;color:var(--ink-2);padding:60px 0;justify-content:center}
.spin{width:18px;height:18px;border-radius:50%;border:2px solid var(--hair);border-top-color:var(--brand);animation:spin .8s linear infinite}
.err{background:var(--panel);border-radius:var(--r);padding:16px 18px;color:var(--ink);box-shadow:inset 0 0 0 1px var(--crit);margin-bottom:14px}
.gate{max-width:360px;margin:60px auto;background:var(--panel);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--panel-shadow)}
.gate label{display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:12px}
.gate input{border:0;border-radius:9px;background:var(--panel-2);padding:9px 11px;color:var(--ink)}
.gate button{border:0;border-radius:9px;padding:9px;background:var(--brand);color:var(--on-brand);font-weight:700}
.tip{position:fixed;z-index:80;pointer-events:none;background:var(--tip-bg);color:var(--ink);border-radius:10px;padding:10px 12px;font-size:12.5px;box-shadow:var(--tip-shadow);max-width:300px;opacity:0;transition:opacity .12s;line-height:1.4}
.tip.on{opacity:1}
.tip .tt{font-weight:700;margin-bottom:3px}
.tip .tv{font-family:var(--display);font-size:20px;line-height:1.1}
.tip .ts{color:var(--muted);font-size:11.5px}
.tip .tr{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;margin-top:3px}
.tip .tr i{width:9px;height:9px;border-radius:3px}
.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,0);z-index:90;background:var(--tip-bg);color:var(--ink);padding:10px 14px;border-radius:10px;box-shadow:var(--tip-shadow);font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s}
.toast.on{opacity:1}
.foot{display:flex;flex-direction:column;align-items:center;gap:14px;padding:26px var(--gut) 30px;color:var(--muted);font-size:12px;text-align:center}
.foot .dl{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px;max-width:1100px}
.foot .dl img{height:22px;width:auto;max-width:96px;object-fit:contain;filter:brightness(0) invert(1);opacity:.55;transition:opacity .2s}
:root[data-theme="light"] .foot .dl img{filter:brightness(0);opacity:.45}
.foot .dl img:hover{opacity:.9}
.foot p{margin:0;line-height:1.5}
.foot a{color:var(--ink-2)}
.method{font-size:13px;line-height:1.6;color:var(--ink-2)}
.method h4{font-family:var(--display);font-weight:400;font-size:16px;color:var(--ink);margin:14px 0 4px}
[dir="rtl"] .method h4{font-family:"Plex Arabic",var(--sans);font-weight:700}
.method ol,.method ul{margin:4px 0;padding-inline-start:20px}
.method .issue{background:var(--panel-2);border-radius:9px;padding:10px 12px;margin:6px 0}
.method code{background:var(--panel-3);padding:1px 5px;border-radius:5px;font-size:12px}

/* full screen & export */
.is-fs .top{padding-top:10px}
.exporting .acts,.exporting .map-ui{visibility:hidden}

/* mobile filter toggle */
.ftoggle{display:none;align-items:center;gap:8px;margin:2px var(--gut) 12px;border:0;border-radius:10px;padding:9px 13px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);color:var(--ink);font-weight:600}
.ftoggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.ftoggle b{color:var(--brand-ink);font-weight:700}
/* ------------------------------------------------------------------ responsive */
@media (max-width:1320px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1180px){
  .g-ov,.g-21,.g-12,.g-3{grid-template-columns:minmax(0,1fr)}
  .span2{grid-column:auto}
}
@media (max-width:860px){
  .g-2{grid-template-columns:minmax(0,1fr)}
  .rose-wrap{grid-template-columns:minmax(0,1fr)}
  .rose{max-width:240px;margin:0 auto}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tools .sync{display:none}
  .xbtn span{display:none}
  .brand-t span{display:none}
  .map-wrap{min-height:340px}
}
@media (max-width:860px){
  .ftoggle{display:inline-flex}
  .filters{display:none}
  .filters.open{display:flex}
  .fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .fsel select{min-width:0;max-width:none;width:100%}
}
@media (max-width:560px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tools{gap:5px}
  .ic{width:32px;height:32px}
  #fsBtn{display:none}
  .xbtn{padding:8px 9px}
  .seg button{min-width:30px;padding:4px 7px}
  .logo{height:32px}
  .el{grid-template-columns:10px minmax(0,1fr) auto}
  .card{padding:14px 14px 16px}
  .acts .sep,.acts button:nth-last-child(1){display:none}
  .brand-t{display:none}
  .st-r{grid-template-columns:minmax(0,1fr) 48px}
  .st-r .st-l{grid-column:1 / -1}
  .hb-r{grid-template-columns:minmax(0,1fr) auto;}
  .hb-r .hb-t{grid-column:1 / -1;grid-row:2}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.filters,.tools,.acts,.tabs,.map-ui{display:none!important}body::after,body::before{display:none}.view{display:block!important}}

.tabs:not(:has(.tab)){display:none}
/* donor (locked) version */
.dlogo{height:34px;width:auto;max-width:130px;object-fit:contain;display:block;margin-inline-start:6px}
:root[data-theme="dark"] .dlogo{filter:brightness(0) invert(1);opacity:.9}
/* brief (one-page) version */
.brief .tabs{display:none}
.brief .voices{max-height:430px}

/* selected / filtered-out rows in clickable tables */
.dt tr.sel td{background:var(--brand-wash);color:var(--ink);font-weight:600}
.dt tr.sel:hover td{background:rgba(247,145,28,.16)}
.dt tr.dim td{opacity:.42}
.dt tr.dim:hover td{opacity:.8}

/* ------------------------------------------------------------------ PC634 additions */
.narr{margin:0}
.kpis-ov{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;border-radius:12px;overflow:hidden}
.kpis-ov .kpi{border-radius:0;box-shadow:none;background:var(--panel);padding:12px 14px}
.kpis-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;border-radius:12px;overflow:hidden}
.kpis-4 .kpi{border-radius:0;box-shadow:none;background:var(--panel-2)}
.kpi b{font-weight:500;letter-spacing:.005em}
.fsel input[type=date]{appearance:none;border:0;border-radius:10px;background:var(--panel);box-shadow:inset 0 1px 0 var(--lip),var(--panel-shadow);padding:6px 10px;min-width:132px;color:var(--ink);font-size:13px;color-scheme:inherit}
.fsel input.on{background-color:var(--panel-3);box-shadow:inset 0 0 0 1px var(--brand-ring)}

/* map */
.map-card .card-b{display:flex;flex-direction:column}
.map-wrap{position:relative;flex:1;min-height:560px;border-radius:12px;overflow:hidden;background:var(--panel-2);touch-action:none;cursor:grab}
.map-wrap.drag{cursor:grabbing}
.map-wrap svg{position:absolute;inset:0;width:100%;height:100%;direction:ltr}
.sd{fill:var(--map-empty);stroke:var(--map-line);stroke-width:1;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.sd.proj{fill:var(--map-proj);stroke:var(--map-proj-line);stroke-width:1.3}
.sd.proj:hover{fill:var(--map-proj-hi)}
.sd.dim{opacity:.55}
.govl{fill:none;stroke:var(--map-gov);stroke-width:1.2;stroke-dasharray:5 4;opacity:.55;pointer-events:none;vector-effect:non-scaling-stroke}
.mlab{pointer-events:none}
.sdn{fill:var(--ink-2);font-family:var(--display);font-style:italic;opacity:.55}
[dir="rtl"] .sdn{font-style:normal;font-family:"Plex Arabic",var(--sans)}
.town{fill:var(--muted)}
.townl{fill:var(--muted);font-family:var(--sans)}
.spoke{fill:none;stroke:var(--brand);stroke-width:1.2;opacity:.34;vector-effect:non-scaling-stroke;stroke-linecap:round}
.spoke.dim{opacity:.08}
.lead{stroke:var(--ink-2);stroke-width:.8;opacity:.5;vector-effect:non-scaling-stroke}
.anchor{fill:var(--ink-2);opacity:.7}
.vil{cursor:pointer;transition:opacity .25s}
.vil.dim{opacity:.32}
.vfill{stroke:var(--panel-2);stroke-width:1.2;vector-effect:non-scaling-stroke;transition:fill .45s ease}
.vtrack{fill:none;stroke:var(--map-track)}
.varc{fill:none;stroke:var(--brand);stroke-linecap:round}
.vil.approx .vtrack{stroke-dasharray:2 2.4}
.vil:hover .vfill,.vil.sel .vfill{stroke:var(--ink);stroke-width:2}
.vval{font-family:var(--sans);font-weight:700;pointer-events:none}
.vlab{fill:var(--ink);font-family:var(--sans);font-weight:500;paint-order:stroke;stroke:var(--panel-2);stroke-width:3px;stroke-linejoin:round;pointer-events:none}
.dpm{cursor:pointer}
.dpm path{fill:var(--panel);stroke:var(--brand-ink);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.dpm:hover path,.dpm.sel path{fill:var(--brand)}
.map-ui{position:absolute;top:10px;inset-inline-end:10px;display:flex;flex-direction:column;gap:4px;z-index:2}
.map-ui button{width:30px;height:30px;border:0;border-radius:8px;background:var(--panel);color:var(--ink-2);box-shadow:var(--panel-shadow);display:grid;place-items:center;font-size:17px;line-height:1}
.map-ui button:hover{color:var(--ink)}
.map-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;padding:10px 2px 0;color:var(--muted);font-size:12px}
.ramp{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;min-width:0}
.ramp .sw{display:flex;gap:2px}
.ramp .sw i{width:22px;height:8px;display:block}
.ramp .sw i:first-child{border-radius:4px 0 0 4px}
.ramp .sw i:last-child{border-radius:0 4px 4px 0}
.ramp .zero{display:flex;align-items:center;gap:5px;margin-inline-start:6px}
.ramp .zero i{width:12px;height:8px;border-radius:3px;background:var(--map-empty);box-shadow:inset 0 0 0 1px var(--axis)}
.mkeys{display:flex;flex-wrap:wrap;gap:4px 14px}
.mkeys span{display:inline-flex;align-items:center;gap:6px}
.mkeys svg{width:16px;height:16px;fill:none}
.k-track{stroke:var(--map-track);stroke-width:2.2}
.k-arc{stroke:var(--brand);stroke-width:2.2;stroke-linecap:round}
.k-dp{fill:var(--panel);stroke:var(--brand-ink);stroke-width:1.6;stroke-linejoin:round}
.k-approx{stroke:var(--ink-2);stroke-width:1.4;stroke-dasharray:2 2}
.src{color:var(--muted);font-size:11px;margin:6px 2px 0;opacity:.8}

/* IPTT scorecard */
.sc{display:grid;gap:2px}
.sc-r{display:grid;grid-template-columns:30px minmax(0,1fr) minmax(90px,34%) 58px 92px;align-items:center;gap:10px;border:0;background:none;text-align:start;padding:9px 8px;border-radius:10px;color:inherit}
.sc-r:hover{background:var(--panel-2)}
.sc-r.sel{background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--brand-ring)}
.sc-k{font-family:var(--display);font-weight:500;font-size:15px;color:var(--brand-ink)}
.sc-l{font-size:13px;color:var(--ink-2);line-height:1.25;min-width:0}
.sc-t{position:relative;height:8px;border-radius:4px;background:var(--panel-3)}
.sc-f{position:absolute;inset-block:0;inset-inline-start:0;border-radius:4px;background:var(--brand);transition:width .6s cubic-bezier(.3,.9,.3,1)}
.sc-f.mon{background:var(--warn)}
.sc-f.act{background:var(--crit)}
.sc-tick{position:absolute;top:-4px;bottom:-4px;width:2px;border-radius:1px;background:var(--ink)}
.sc-v{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}
.sc-v b{font-family:var(--display);font-weight:500;font-size:20px}
.sc-v small{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.sc-s,.stx{justify-self:end;font-size:12px;font-weight:600;padding:3px 0}
.sc-s.ok,.stx.ok{color:var(--good-ink)}
.sc-s.mon,.stx.mon{color:var(--warn-ink)}
.sc-s.act,.stx.act{color:var(--crit)}
.sc-s.nodata,.stx.nodata{color:var(--muted)}

/* cash journey */
.journey-card .card-b{padding-top:4px}
.jr svg{width:100%;height:auto;overflow:visible;direction:ltr}
.jr-top{stroke:var(--hair);stroke-width:1}
.jr-80{stroke:var(--crit);stroke-width:1;opacity:.35;stroke-dasharray:3 4}
.jr-ax{fill:var(--muted);font-size:11px}
.jr-area{fill:var(--brand);opacity:.07}
.jr-line{fill:none;stroke:var(--brand);stroke-width:3;stroke-linecap:round}
.jr-stem{stroke:var(--hair);stroke-width:1}
.jr-st{cursor:pointer}
.jr-dot{fill:var(--panel);stroke:var(--brand);stroke-width:3;transition:r .2s}
.jr-dot.low{stroke:var(--crit)}
.jr-st:hover .jr-dot,.jr-st.sel .jr-dot{fill:var(--brand)}
.jr-v{fill:var(--ink);font-family:var(--display);font-weight:500;font-size:21px}
.jr-v.low{fill:var(--crit)}
.jr-l{font-size:12px;line-height:1.25;color:var(--ink-2);text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.jr-l b{font-family:var(--display);font-weight:500;color:var(--brand-ink);font-size:12.5px}
[dir="rtl"] .jr-l{font-family:"Plex Arabic",var(--sans)}

/* dumbbell */
.db{display:grid;gap:4px}
.db-r{display:grid;grid-template-columns:minmax(90px,42%) minmax(0,1fr) 82px;gap:10px;align-items:center;padding:4px 6px;border-radius:8px}
.db-r:hover{background:var(--panel-2)}
.db-l{font-size:12.5px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-t{position:relative;height:14px}
.db-t::before{content:"";position:absolute;inset-inline:0;top:6px;height:2px;border-radius:1px;background:var(--panel-3)}
.db-seg{position:absolute;top:5px;height:4px;border-radius:2px}
.db-seg.down{background:var(--a-sp);opacity:.55}
.db-seg.up{background:var(--crit);opacity:.5}
.db-a{position:absolute;top:2px;width:10px;height:10px;border-radius:50%;background:var(--panel);box-shadow:inset 0 0 0 2px var(--ink-2)}
.db-b{position:absolute;top:1px;width:12px;height:12px;border-radius:50%;background:var(--brand)}
.db-v{display:flex;justify-content:flex-end;gap:8px;font-variant-numeric:tabular-nums;font-size:12.5px}
.db-v .va{color:var(--muted)}
.db-ka{background:var(--panel)!important;box-shadow:inset 0 0 0 2px var(--ink-2);border-radius:50%!important}
.db-kb{background:var(--brand)!important;border-radius:50%!important}
.st-empty{color:var(--muted);font-size:12px}
.hb-t .big{position:absolute;top:1px;width:8px;height:8px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 1.5px var(--panel-3)}

/* sample progress */
.prog{display:grid;gap:3px}
.pg-r{display:grid;grid-template-columns:minmax(90px,30%) minmax(0,1fr) 108px;gap:10px;align-items:center;padding:5px 6px;border-radius:8px;cursor:pointer}
.pg-r:hover{background:var(--panel-2)}
.pg-r.sel{background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--brand-ring)}
.pg-l{font-size:13px;color:var(--ink-2)}
.pg-t{position:relative;height:10px;border-radius:5px;background:var(--panel-3);display:flex;align-items:center;gap:2px;overflow:hidden}
.pg-f{position:absolute;inset-block:0;inset-inline-start:0;border-radius:5px;background:var(--brand)}
.pg-b{position:relative;z-index:1;width:4px;height:4px;border-radius:50%;background:var(--ink);margin-inline-start:3px}
.pg-v{display:flex;gap:6px;justify-content:flex-end;align-items:baseline;font-variant-numeric:tabular-nums}
.pg-v b{font-weight:600;font-size:13px}
.pg-v small{color:var(--muted);font-size:11px}

/* tables */
.lv{display:inline-block}
.lv0{font-weight:700;color:var(--ink)}
.lv1{padding-inline-start:12px;font-weight:600}
.lv2{padding-inline-start:24px;color:var(--ink-2)}
.lv3{padding-inline-start:36px;color:var(--ink-2)}
.xsel{appearance:none;border:0;border-radius:10px;background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--hair);padding:7px 30px 7px 11px;color:var(--ink);font-size:13px;max-width:min(560px,80vw);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%239a8b7e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}
[dir="rtl"] .xsel{padding:7px 11px 7px 30px;background-position:left 11px center}
.foot .dl img{height:26px}
.foot .dl .logo-dark{display:none}
:root[data-theme="dark"] .foot .dl .logo-dark{display:block}
:root[data-theme="dark"] .foot .dl .logo-light{display:none}
.foot .dl img{filter:none!important;opacity:.85!important}
@media (max-width:1180px){.g-ov{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){.kpis-ov,.kpis-4{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-r{grid-template-columns:28px minmax(0,1fr) 54px;}.sc-t{grid-column:1 / -1;grid-row:2}.sc-s{display:none}.map-wrap{min-height:420px}.jr-v{font-size:26px}}
@media (max-width:560px){.db-r,.pg-r{grid-template-columns:minmax(0,1fr) auto}.db-r .db-t,.pg-r .pg-t{grid-column:1 / -1;grid-row:2}}