/* Procurement Control Tower — front-end styling.
   Design tokens carried over from Procurement_Control_Tower_v3.html for visual continuity. */
:root{
  --navy:#0e2440; --navy2:#22456a; --teal:#0e7f9a; --teal2:#15a6c6;
  --accent:#e8833a; --green:#1f9d63; --red:#d6483f; --amber:#d9a441;
  --bg:#f1f4f8; --bg2:#e7edf3; --card:#fff; --line:#e4e9f0; --line2:#eef2f7; --muted:#64748b;
  --shadow:0 1px 2px rgba(16,40,66,.05),0 1px 3px rgba(16,40,66,.04);
  --shadow-lg:0 10px 30px rgba(16,40,66,.13);
  --r:12px; --r-sm:8px;
  /* redesign tokens (2026-09) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  --fs-xs:11px; --fs-sm:12px; --fs-md:14px; --fs-lg:16px; --fs-xl:20px; --fs-2xl:26px;
  --green-bg:rgba(31,157,99,.12); --amber-bg:rgba(217,164,65,.16);
  --red-bg:rgba(214,72,63,.12); --teal-bg:rgba(14,127,154,.10); --navy-bg:rgba(34,69,106,.10);
  --e1:var(--shadow); --e2:0 4px 14px rgba(16,40,66,.08); --e3:var(--shadow-lg);
  --dur:150ms;
  --surface-2:#f7f9fc; --ink:var(--navy); --ink-soft:var(--muted);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Inter','Segoe UI',Roboto,-apple-system,Arial,sans-serif;font-size:14px;
  line-height:1.5;color:var(--navy);-webkit-font-smoothing:antialiased;
  background:radial-gradient(1200px 500px at 80% -100px,#e9f2f6,transparent),var(--bg);}
.tabnum{font-variant-numeric:tabular-nums}
a{color:var(--teal);text-decoration:none}
h1,h2,h3,h4{margin:0}
.muted{color:var(--muted)}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* layout */
.shell{display:flex;min-height:100vh}
.side{width:212px;flex:none;background:linear-gradient(180deg,#0f2742,#0b1d33);
  color:#cfe0ea;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.brand{padding:16px 16px 12px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand b{color:#fff;font-size:14px;display:block;letter-spacing:.2px}
.brand span{font-size:10px;color:#8fb0c4}
.nav{padding:8px 8px;flex:1 1 auto;min-height:0;overflow-y:auto}
.nav::-webkit-scrollbar{width:8px}
.nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:8px}
.nav::-webkit-scrollbar-track{background:transparent}
.nav .grp{font-size:9.5px;text-transform:uppercase;color:#7f9db2;margin:12px 8px 4px;letter-spacing:.6px}
.nav a{display:flex;align-items:center;gap:8px;color:#cfe0ea;padding:7px 10px;border-radius:7px;
  font-size:12.5px;cursor:pointer}
.nav a:hover{background:rgba(255,255,255,.06)}
.nav a.active{background:linear-gradient(90deg,rgba(17,160,191,.28),rgba(17,160,191,.05));
  color:#fff;box-shadow:inset 2px 0 0 var(--teal2)}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{background:linear-gradient(90deg,var(--navy),var(--teal));color:#fff;
  padding:12px 20px;display:flex;align-items:center;justify-content:space-between}
.topbar h1{margin:0;font-size:16px;font-weight:600}
.topbar .sub{font-size:11px;color:#d7ebf2}
.content{padding:20px 24px;flex:1}

/* cards + kpi */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:var(--s4) 18px;box-shadow:var(--e1);margin-bottom:var(--s4)}
.card h2{margin:0 0 10px;font-size:14px}
.card .ct{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px;font-weight:600}
.grid{display:grid;gap:14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:14px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;
  box-shadow:var(--shadow);position:relative;overflow:hidden}
.kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--teal)}
.kpi .v{font-size:var(--fs-2xl);font-weight:800;letter-spacing:-.3px;line-height:1.1}
.kpi .l{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-top:3px}
.kpi .d{font-size:11px;font-weight:700;margin-top:4px}
.kpi .d.up{color:var(--green)} .kpi .d.down{color:var(--red)} .kpi .d.flat{color:var(--muted)}
.kpi.a::before{background:var(--accent)} .kpi.g::before{background:var(--green)}
.kpi.r::before{background:var(--red)} .kpi.n::before{background:var(--navy2)}

/* tables */
table{width:100%;border-collapse:collapse;font-size:12px}
th,td{padding:9px 11px;text-align:left;border-bottom:1px solid var(--line2)}
th{background:#f5f8fb;position:sticky;top:0;font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:.5px;color:var(--muted);border-bottom:1px solid var(--line)}
tbody tr:nth-child(even) td{background:#fafcfe}
tbody tr:hover td{background:var(--teal-bg)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
thead th{position:sticky;top:0;background:var(--surface-2);z-index:1;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700}
tbody tr{transition:background var(--dur)}
th.num,td.num{text-align:right;font-variant-numeric:tabular-nums}
.rowbad{background:var(--red-bg)}

/* pills + buttons */
.pill{display:inline-block;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:600;line-height:1.5}
.pill.green{background:var(--green-bg);color:#137a4c}
.pill.amber{background:var(--amber-bg);color:#9a6a12}
.pill.red{background:var(--red-bg);color:#b3352c}
.pill.teal{background:var(--teal-bg);color:#0b6379}
.pill.gray{background:#eef2f7;color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--teal);color:#fff;border:1px solid transparent;border-radius:var(--r-sm);padding:7px 12px;font-size:12px;font-weight:600;cursor:pointer;transition:filter var(--dur),box-shadow var(--dur)}
.btn:hover{filter:brightness(1.06)}
.btn.ghost{background:#fff;color:var(--teal);border-color:var(--line)}
.btn.ghost:hover{background:var(--surface-2,#f7f9fc)}
.btn.sm{padding:5px 10px;font-size:11px}
.btn.primary{background:var(--accent)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,.nav a:focus-visible{outline:2px solid var(--teal2);outline-offset:2px}
input,select{border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 9px;font-size:12px;font-family:inherit;color:var(--ink,var(--navy));background:#fff;transition:border-color var(--dur)}
input:focus,select:focus{border-color:var(--teal2);outline:none}

textarea{font-family:inherit;font-size:12.5px;padding:7px 9px;border:1px solid var(--line);
  border-radius:7px;color:var(--navy);background:#fff}
textarea:focus{outline:none;border-color:var(--teal)}
label.fld{display:block;font-size:11px;color:var(--muted);margin:8px 0 3px;text-transform:uppercase;letter-spacing:.4px}

.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.muted{color:var(--muted)}
.right{margin-left:auto}
.hidden{display:none!important}
.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;
  border-radius:50%;animation:spin .7s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.empty{padding:30px;text-align:center;color:var(--muted)}
.tag-src{cursor:pointer;border-bottom:1px dotted var(--teal);color:var(--teal2)}
.banner{padding:10px 14px;border-radius:8px;font-size:12px;margin-bottom:12px}
.banner.warn{background:#fdf3e0;color:#8a6412;border:1px solid #f0dcae}
.banner.err{background:#fbe9e9;color:#a33;border:1px solid #f2c9c9}
.banner.ok{background:#e6f5ee;color:#1d7a4f;border:1px solid #bfe6d2}

/* ============================ redesign: shell polish ============================ */
.topbar{position:sticky;top:0;z-index:20;box-shadow:0 2px 10px rgba(15,39,66,.12)}
.side .brand b{font-size:15px}
.nav a{transition:background .12s ease}
.card{transition:box-shadow .15s ease,transform .15s ease}

/* persona segmented toggle */
.seg{display:inline-flex;background:rgba(255,255,255,.14);border-radius:9px;padding:3px;gap:2px}
.seg button{background:transparent;border:none;color:#dbeaf2;font-size:11.5px;font-weight:600;
  padding:5px 12px;border-radius:7px;cursor:pointer;letter-spacing:.3px}
.seg button.on{background:#fff;color:var(--navy)}
/* light variant for use on white cards (content area) */
.content .seg{background:#eef2f6}
.content .seg button{color:#5b7488}
.content .seg button.on{background:var(--navy);color:#fff}
/* spec parameter comparison matrix */
.specmx{border-collapse:separate;border-spacing:0;min-width:100%}
.specmx thead th{position:sticky;top:0;z-index:2;background:#f4f7fa}
.specmx th:first-child,.specmx td.mx-name{position:sticky;left:0;z-index:1;background:#fff;font-weight:600;
  box-shadow:1px 0 0 var(--line);min-width:180px}
.specmx thead th:first-child{z-index:3}
.specmx td{vertical-align:top;white-space:nowrap}
.specmx td.mx-empty{color:#b6c2cc;text-align:center}
/* multi-select checkbox filter dropdown (GRN transactions) */
.cdrop{position:relative;display:inline-block}
.cdrop-btn{background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:12px;
  cursor:pointer;color:var(--navy);white-space:nowrap;font-weight:600}
.cdrop-btn:hover{border-color:var(--teal)}
.cdrop.active .cdrop-btn{border-color:var(--teal);color:var(--teal2)}
.cdrop-n{background:var(--teal);color:#fff;border-radius:9px;padding:0 6px;font-size:10px;margin:0 2px}
.cdrop-panel{display:none;position:absolute;z-index:40;top:calc(100% + 4px);left:0;min-width:210px;
  max-height:300px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:8px;
  box-shadow:var(--shadow);padding:6px}
.cdrop-panel.open{display:block}
.cdrop-tools{display:flex;gap:8px;align-items:center;padding:2px 6px 6px;border-bottom:1px solid var(--line);margin-bottom:4px;font-size:11px}
.cdrop-search{flex:1;min-width:0;font-size:11px;padding:3px 6px}
.cdrop-opts{max-height:230px;overflow:auto}
.cdrop-opt{display:flex;gap:8px;align-items:center;padding:4px 6px;border-radius:6px;font-size:12px;cursor:pointer;white-space:nowrap}
.cdrop-opt:hover{background:#f4f9fb}
/* dataset upload tiles + mode radios (Data Tracker) */
.dsup{flex:1;min-width:230px;max-width:320px;border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fbfdfe}
.dsup.core{background:#f5fbfc;border-color:#bfe6ef}
.dsup-t{font-weight:700;color:var(--navy);font-size:13px}
.dsup-s{color:#5b7488;font-size:11px;margin:2px 0 8px}
.dsup-ver{font-size:11px;color:var(--navy);background:#fff;border:1px solid var(--line);border-radius:6px;padding:6px 8px;min-height:34px}
.dsup-ver .muted{font-size:10px}
.dsradio{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:8px;padding:9px 11px;margin-top:6px;cursor:pointer}
.dsradio input{margin-top:3px}
.dsradio:hover{background:#f4f9fb}
.ok{color:#1f9d63}
.bad{color:#d6483f}
.topbar select{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);color:#fff}
.topbar select option{color:var(--navy)}

/* breadcrumbs */
.crumbs{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--muted);
  padding:8px 20px;background:#f6f8fb;border-bottom:1px solid var(--line)}
.crumbs a{color:var(--teal)} .crumbs .sep{color:#b8c6ce}
.crumbs b{color:var(--navy)}

/* clickable KPI cards + deltas + hero band */
.kpi{position:relative;transition:box-shadow var(--dur),transform var(--dur)}
.kpi.click{cursor:pointer}
.kpi.click:hover{box-shadow:var(--e2);transform:translateY(-1px)}
.kpi.click::after{content:"›";position:absolute;top:10px;right:12px;color:#c2ced8;font-size:16px;font-weight:700}
.kpi .delta{font-size:11px;font-weight:600;margin-top:2px}
.kpi .delta.up{color:var(--green)} .kpi .delta.down{color:var(--red)}
.hero .kpi .v{font-size:26px}
.hero{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.sectionhead{font-size:13px;font-weight:700;color:var(--navy);margin:6px 2px 10px;
  display:flex;align-items:center;gap:8px}
.sectionhead .tag{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}

/* funnel */
.funnel{display:flex;flex-direction:column;gap:6px}
.funnel .frow{display:flex;align-items:center;gap:10px;cursor:pointer;padding:3px 4px;border-radius:6px}
.funnel .frow:hover{background:#eef6f9}
.funnel .fname{width:120px;font-size:12px;text-transform:capitalize}
.funnel .fbar{flex:1;height:16px;background:#eef2f6;border-radius:8px;overflow:hidden}
.funnel .fbar>span{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--teal2))}
.funnel .fcount{width:52px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}

/* my-desk buckets */
.buckets{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.bucket{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:0 1px 2px rgba(15,39,66,.04)}
.bucket .bh{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;
  border-bottom:1px solid var(--line);font-weight:700;font-size:12.5px}
.bucket .bh .n{font-size:18px;font-weight:800}
.bucket.r .bh{background:#fbe9e9;color:#a33} .bucket.a .bh{background:#fdf3e0;color:#8a6412}
.bucket.g .bh{background:#e6f5ee;color:#1d7a4f} .bucket.n .bh{background:#eef4f8;color:var(--navy2)}
.bucket .brow{display:block;padding:8px 14px;border-bottom:1px solid #f0f3f7;cursor:pointer;font-size:12px}
.bucket .brow:hover{background:#f6fafc}
.bucket .brow .p{color:var(--muted);font-size:11px}
.bucket .mine{border-left:3px solid var(--teal2)}
.bucket .more{padding:8px 14px;font-size:11px;color:var(--teal);cursor:pointer}
.gauge{height:10px;background:#eef2f6;border-radius:6px;overflow:hidden;margin-top:6px}
.gauge>span{display:block;height:100%;background:linear-gradient(90deg,var(--green),#5bc191)}
@media(max-width:900px){.side{width:64px}.brand span,.nav .grp,.nav a span.lbl{display:none}}

/* ============================ SVG charts ============================ */
.chartrow{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.chartrow svg text.dc-v{font-size:20px;font-weight:800;fill:var(--navy)}
.chartrow svg text.dc-l{font-size:8px;fill:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.legend{display:flex;flex-direction:column;gap:5px;font-size:11.5px;min-width:150px}
.legend .lg{display:flex;align-items:center;gap:7px}
.legend .lg .lk{flex:1;color:var(--navy2)}
.legend .sw{width:10px;height:10px;border-radius:3px;flex:none}
svg text.ax{font-size:8.5px;fill:var(--muted)}
.hbars{display:flex;flex-direction:column;gap:8px}
.hb{display:grid;grid-template-columns:150px 1fr 78px;align-items:center;gap:10px;border-radius:6px;padding:2px 4px}
.hb:hover{background:#f4f9fb}
.hbk{font-size:11.5px;color:var(--navy2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbt{height:15px;background:#eef2f6;border-radius:8px;overflow:hidden}
.hbt>span{display:block;height:100%;border-radius:8px;width:var(--w)}
.hbv{font-size:11.5px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
/* fill-in animation */
@keyframes groww{from{width:0}to{width:var(--w)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.hbt>span.anim{animation:groww .6s ease-out}
svg.anim{animation:fadein .5s ease-out}
/* cut-by segmented control */
.cutseg{display:inline-flex;background:#eef2f6;border-radius:8px;padding:3px;gap:2px}
.cutseg button{background:transparent;border:none;font-size:11.5px;font-weight:600;color:var(--muted);
  padding:5px 12px;border-radius:6px;cursor:pointer}
.cutseg button.on{background:#fff;color:var(--navy);box-shadow:var(--shadow)}
/* chart card header accent */
.chead{display:flex;align-items:center;justify-content:space-between;margin:-16px -18px 12px;padding:11px 18px;
  border-bottom:1px solid var(--line);border-radius:var(--r) var(--r) 0 0;
  background:linear-gradient(90deg,#f6fbfc,#fff)}
.chead .t{font-weight:700;font-size:13px;color:var(--navy)}
.chead .s{font-size:11px;color:var(--muted)}

/* ============================================================ dashboard polish pass
   Shared refinements applied to every intelligence tab (GRN / NCC / Open PR / Vendor
   / Pipeline) via common classes — premium KPI tiles, card hover, header accent dots,
   consistent database summary + export affordance. */
.kpis.hero{gap:12px}
.kpis.hero .kpi{padding:16px 18px;background:linear-gradient(180deg,#fff,#f7fbfd)}
.kpis.hero .kpi::before{width:5px}
.kpis.hero .kpi .v{font-size:25px}
.kpi.g{background:linear-gradient(180deg,#fff,#f2fbf6)}
.kpi.a{background:linear-gradient(180deg,#fff,#fff7f0)}
.kpi.r{background:linear-gradient(180deg,#fff,#fdf3f2)}
.kpi.n{background:linear-gradient(180deg,#fff,#f4f8fd)}
.card:hover{box-shadow:0 6px 20px rgba(16,40,66,.08)}
.chead .t{display:inline-flex;align-items:center;gap:8px}
.chead .t::before{content:"";width:8px;height:8px;border-radius:3px;flex:none;
  background:linear-gradient(135deg,var(--teal2),var(--teal));box-shadow:0 0 0 3px rgba(21,166,198,.12)}
/* consistent database summary strip + right-aligned toolbar affordance */
.dbsum{font-size:12px;color:var(--muted);margin-bottom:6px}
.dbsum b{color:var(--navy)}
.btn.exp{margin-left:auto}
/* donut center label a touch bolder */
.dc-v{font-weight:800}

/* ============================ UI refinement & delight pass (2026-08-25) ============================ */
/* consistent nav icon column + refined active/hover */
.nav a .ico{width:20px;min-width:20px;text-align:center;font-size:13px;line-height:1;flex:none;
  opacity:.92;filter:saturate(.9)}
.nav a{position:relative;transition:background .14s ease,color .14s ease,padding .14s ease}
.nav a:hover{color:#eaf4fa}
.nav a:hover .ico{opacity:1}
.nav a.active{color:#fff;font-weight:600}
.nav a.active::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,var(--teal2),var(--teal))}
.nav a.active .ico{opacity:1;filter:none}
.nav .grp{margin-top:14px}
.nav .grp:first-child{margin-top:4px}

/* view enters with a gentle fade+rise on every navigation (delight) */
@keyframes viewin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.content{animation:viewin .24s cubic-bezier(.22,.61,.36,1)}

/* app-wide slim scrollbars (nav keeps its own dark one) */
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#cbd7e2;border-radius:8px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:#aebecd;background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}

/* keyboard focus rings for polish + accessibility */
button:focus-visible,textarea:focus-visible,summary:focus-visible,.cdrop-btn:focus-visible{outline:2px solid var(--teal2);outline-offset:1px;border-radius:6px}
textarea:focus{box-shadow:0 0 0 3px rgba(21,166,198,.12)}

/* buttons: subtle press + tactile ghost */
.btn:hover{box-shadow:0 3px 10px rgba(14,127,154,.22)}
.btn:active{transform:translateY(1px)}
.btn.ghost:hover{box-shadow:0 2px 8px rgba(16,40,66,.08)}

/* pills + links: gentle interaction */
.pill{transition:transform .1s ease}
.tag-src{transition:color .12s ease,border-color .12s ease}
.tag-src:hover{color:var(--teal);border-bottom-style:solid}

/* cards: a touch more lift on hover, calmer rest shadow */
.card{transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease}
.card:hover{box-shadow:0 6px 20px rgba(16,40,66,.09);border-color:#d9e2ec}

/* refined empty state */
.empty{padding:32px 24px;line-height:1.5}

/* topbar breathing room + crumbs */
.content{padding:22px 26px}
.crumbs a{color:#3f6f88;text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* selection colour on-brand */
::selection{background:rgba(21,166,198,.22)}

/* density */
body[data-density="compact"]{font-size:13px}
body[data-density="compact"] .content{padding:12px 16px}
body[data-density="compact"] .card{padding:11px 13px;margin-bottom:11px}
body[data-density="compact"] th,body[data-density="compact"] td{padding:6px 9px}
body[data-density="compact"] .kpi{padding:10px 12px}
body[data-density="compact"] .kpi .v{font-size:20px}

/* skeletons + states */
.skel{background:linear-gradient(90deg,#eef2f7 25%,#e2e8f1 37%,#eef2f7 63%);background-size:400% 100%;animation:shimmer 1.3s ease infinite;border-radius:6px}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
.skelrow{height:34px;margin-bottom:8px}
.skelcard{height:78px}
.emptybox{text-align:center;color:var(--muted);padding:36px 16px}
.emptybox .i{font-size:30px;opacity:.7}
.emptybox .t{font-size:14px;font-weight:700;color:var(--ink,var(--navy));margin-top:8px}
.emptybox .h{font-size:12px;margin-top:4px}
.emptybox .cta{margin-top:12px}

/* nav group collapse (B2) */
.nav .grp{display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none}
.nav .grp::after{content:"▾";font-size:9px;opacity:.6;transition:transform var(--dur)}
.nav .grp.collapsed::after{transform:rotate(-90deg)}
.nav a.gh-hidden{display:none}

/* ⌘K command palette (B3) */
.cmdk-bg{position:fixed;inset:0;background:rgba(15,39,66,.45);z-index:1200;display:flex;align-items:flex-start;justify-content:center;padding:80px 16px}
.cmdk{width:560px;max-width:96vw;background:#fff;border-radius:var(--r);box-shadow:var(--e3);overflow:hidden}
.cmdk input{width:100%;border:none;border-bottom:1px solid var(--line);padding:14px 16px;font-size:15px;border-radius:0}
.cmdk input:focus{outline:none;border-color:var(--line)}
.cmdk .res{max-height:52vh;overflow:auto;padding:6px}
.cmdk .r{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;cursor:pointer;font-size:13px}
.cmdk .r .k{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-left:auto}
.cmdk .r.sel,.cmdk .r:hover{background:var(--teal-bg)}
.cmdk .empty{padding:20px;text-align:center;color:var(--muted)}

/* topbar refresh (B4) */
.kbd{font-size:9px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);border-radius:4px;padding:0 4px;margin-left:4px;color:#fff}
.topbar .btn.ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.25)}
.topbar .btn.ghost:hover{background:rgba(255,255,255,.2)}

/* dashboard scaffold (C1) */
.dashhead{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:var(--s4)}
.dashhead .t{font-size:var(--fs-xl);font-weight:700}
.dashhead .s{font-size:12px;color:var(--muted);margin-top:2px}
.kpis.hero .kpi .v{font-size:var(--fs-2xl)}
/* .chead .t and .chead .s already defined above; add right-align helpers only */
.chead .s.right,.chead .exp{margin-left:auto}

/* ---------------------------------------------------------------- Fabricator Order Allocation */
.fabtabs{display:flex;gap:4px;margin-bottom:14px;border-bottom:2px solid #e3ebf1}
.fabtabs button{background:none;border:none;padding:9px 16px;font-size:13px;font-weight:600;color:#5b7488;
  cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px}
.fabtabs button.on{color:var(--navy);border-bottom-color:var(--teal,#0e7f9a)}
.faboptgrid{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start}
@media(max-width:900px){.faboptgrid{grid-template-columns:1fr}}
.fabctrl{position:sticky;top:12px}
.fabf{margin:12px 0}
.fabf .fl{font-size:11.5px;font-weight:700;color:#3d5a72;margin-bottom:6px}
.fabseg{display:inline-flex;flex-wrap:wrap;gap:4px;background:#eef2f6;border-radius:8px;padding:3px;width:100%}
.fabseg button{flex:1;background:transparent;border:none;color:#5b7488;font-size:11.5px;font-weight:600;
  padding:6px 8px;border-radius:6px;cursor:pointer;white-space:nowrap}
.fabseg button.on{background:var(--navy);color:#fff}
.fabchk{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#33506a;cursor:pointer;margin:3px 0}
.fabdis{max-height:190px;overflow:auto;border:1px solid #e3ebf1;border-radius:8px;padding:8px;background:#fafcfd}
.fabheat{border-collapse:collapse;font-size:12px}
.fabheat th,.fabheat td{border:1px solid #eef2f6;padding:6px 9px;text-align:center}
.fabheat th{background:#f4f8fb;color:#3d5a72;position:sticky;top:0}
.fabheat td:first-child,.fabheat th:first-child{text-align:left;position:sticky;left:0;background:#f9fbfd}
.fabscoregrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.fabscore{padding:16px}
.fabmetrics{margin-top:12px;display:flex;flex-direction:column;gap:9px}
.fabmet{font-size:11.5px;color:#3d5a72}
.fabmet .hbt{height:7px;margin-top:3px;background:#eef2f6;border-radius:4px;overflow:hidden}
.fabmet .hbt .anim{display:block;height:100%;width:var(--w);border-radius:4px}

/* Fabricator Inputs sheet */
.fabmat{border-collapse:collapse;font-size:12px}
.fabmat th,.fabmat td{border:1px solid #eef2f6;padding:4px 6px;text-align:center}
.fabmat th{background:#f4f8fb;color:#3d5a72;position:sticky;top:0}
.fabmat td:first-child,.fabmat th:first-child{text-align:left;position:sticky;left:0;background:#f9fbfd;white-space:nowrap}
.fabmat input{border:1px solid #d8e2ea;border-radius:5px;padding:3px 5px;font-size:12px;text-align:right}
.fabmat input:focus{outline:none;border-color:#0e7f9a;box-shadow:0 0 0 2px rgba(14,127,154,.15)}
#fabBody table input,#fabBody table select{border:1px solid #d8e2ea;border-radius:5px;padding:3px 6px;font-size:12px}
#fabBody table input[type=number]{text-align:right}
#fabBody table input:focus,#fabBody table select:focus{outline:none;border-color:#0e7f9a;box-shadow:0 0 0 2px rgba(14,127,154,.15)}

/* ---------------------------------------------------------------- Global Sourcing Intelligence */
.gsihero{background:linear-gradient(135deg,#0f2742 0%,#123a52 100%);color:#dbeaf2}
.gsihero .t,.gsihero .muted{color:#dbeaf2!important}
.gsidims{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:14px}
.gsidim{background:rgba(255,255,255,.06);border-radius:8px;padding:10px 8px;text-align:center}
.gsidim .di{font-size:20px}
.gsidim .dt{font-size:11px;font-weight:700;letter-spacing:.04em;margin:3px 0}
.gsidim .dd{font-size:10px;color:#a9c3d6;line-height:1.35}
.gsicases{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.gsicase{border:1px solid #e3ebf1;border-radius:10px;padding:14px;cursor:pointer;transition:all .15s;background:#fafcfd}
.gsicase:hover{border-color:#0e7f9a;box-shadow:0 3px 12px rgba(14,127,154,.12)}
.gsicase.on{border-color:#0e7f9a;box-shadow:0 0 0 2px rgba(14,127,154,.18);background:#fff}
.gsicase .gt{font-weight:700;font-size:13.5px;color:#0f2742}
.gsicase .gtag{display:inline-block;font-size:10px;font-weight:700;color:#0e7f9a;background:#0e7f9a14;padding:2px 8px;border-radius:10px;margin:6px 0}
.gsicase .gctx{font-size:11.5px;color:#5b7488;line-height:1.5}
.gsicase .gcta{font-size:11px;font-weight:700;color:#0e7f9a;margin-top:8px}
.gvrow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 0;border-bottom:1px solid #f0f4f7;flex-wrap:wrap}
.gvn{font-weight:600;font-size:12.5px;color:#22456a}
.gtiers{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.gtier{font-size:11px;color:#5b7488;background:#f4f8fb;border-radius:5px;padding:2px 7px}
.gtier.best{background:#1f9d631a;color:#1f9d63;font-weight:700}
.garr{color:#c3d2dc;font-size:11px}
.gsiplan.good{border:1.5px solid #1f9d63}
.gsiplan.bad{border:1.5px solid #d6483f}
.gsibreak{display:flex;gap:16px;flex-wrap:wrap;padding:10px 4px 2px;font-size:11.5px;color:#5b7488}
.gsibreak .tot{margin-left:auto;color:#0f2742}
.gmove{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid #f0f4f7;font-size:12.5px;color:#33506a;line-height:1.6}
.gmove .gmi{color:#e8833a;font-weight:700;font-size:16px}
.gmove b{color:#0f2742}.gmove em{color:#0e7f9a;font-style:normal}
.gcrossgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}
.gcross{background:#fafcfd;border:1px solid #e3ebf1;border-radius:8px;padding:10px 12px}
.gcross .gcn{font-weight:700;font-size:12.5px;color:#22456a}
.gcross .gcb{font-size:11.5px;color:#5b7488;margin-top:3px}
tr.gchg{background:#1f9d630d}

/* ================= Global Sourcing Intelligence — light theme ================= */
.gsi-dark{--gc-bd:#e3ebf1;--gc-navy:#0f2742;--gc-muted:#5b7488;--gc-teal:#0e7f9a;--gc-gold:#b07d18;--gc-gn:#1f9d63;color:var(--gc-navy)}
.gsi-eyebrow{font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--gc-muted);margin-bottom:10px}
.gsi-muted{color:var(--gc-muted);font-size:12px;line-height:1.65}
.gsi-h{font-family:Georgia,serif;font-size:clamp(22px,3vw,32px);font-weight:700;line-height:1.14;color:var(--gc-navy);margin:2px 0 10px}
.gsi-h span{color:var(--gc-gold)}
.gsi-h3{font-family:Georgia,serif;font-size:19px;color:var(--gc-navy);font-weight:700}
.gsi-lead{font-size:13px;line-height:1.8;color:#3d5a72;max-width:760px}
.gsi-lead b{color:var(--gc-navy)}
.gsi-hero{display:grid;grid-template-columns:280px 1fr;gap:26px;align-items:center;background:linear-gradient(135deg,#f2f8fb,#eaf3f7);border:1px solid var(--gc-bd);border-radius:14px;padding:22px;margin-bottom:16px}
@media(max-width:820px){.gsi-hero{grid-template-columns:1fr}}
.gsi-herographic{text-align:center}
.gsi-herocap{font-size:10.5px;color:var(--gc-muted);line-height:1.6;margin-top:8px}
.gsi-herocap b{color:var(--gc-gold)}
.gsidims{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:16px}
@media(max-width:820px){.gsidims{grid-template-columns:repeat(2,1fr)}}
.gsidim{background:#fff;border:1px solid var(--gc-bd);border-top:2px solid var(--dc);border-radius:9px;padding:10px 8px;text-align:center}
.gsidim .di{font-size:18px;color:var(--dc)}
.gsidim .dt{font-size:11px;font-weight:800;letter-spacing:.03em;margin:4px 0 2px;color:var(--gc-navy)}
.gsidim .dd{font-size:9.5px;color:var(--gc-muted);line-height:1.35}
.gsi-panel{background:#fff;border:1px solid var(--gc-bd);border-radius:13px;padding:16px 18px;margin-bottom:14px;box-shadow:0 1px 3px rgba(15,39,66,.05)}
.gsi-casehead{display:flex;justify-content:space-between;gap:16px}
.gsi-ph{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.gsi-ph span:first-child{font-size:13px;font-weight:700;color:var(--gc-navy)}
.gsi-tag{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gc-muted)}
.gsi-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:900px){.gsi-grid2{grid-template-columns:1fr}}
.gsi-load{padding:34px;text-align:center;color:var(--gc-teal);font-size:14px;letter-spacing:.05em;animation:gspin 1.2s linear infinite}
@keyframes gspin{to{opacity:.5}}
.gsicases{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.gsi-dark .gsicase{background:#fafcfd;border:1px solid var(--gc-bd);border-radius:11px;padding:15px;cursor:pointer;transition:all .18s}
.gsi-dark .gsicase:hover{border-color:var(--gc-teal);transform:translateY(-2px);box-shadow:0 6px 16px rgba(14,127,154,.1)}
.gsi-dark .gsicase.on{border-color:var(--gc-gold);box-shadow:0 0 0 1px var(--gc-gold),0 6px 16px rgba(176,125,24,.12);background:#fff}
.gsicase .gci{font-size:18px}
.gsicase .gt{font-weight:700;font-size:13.5px;color:var(--gc-navy);margin-top:4px}
.gsicase .gtag{display:inline-block;font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--gc-gold);background:rgba(176,125,24,.1);padding:2px 8px;border-radius:10px;margin:7px 0}
.gsicase .gctx{font-size:11px;color:var(--gc-muted);line-height:1.55}
.gsicase .gcta{font-size:11px;font-weight:700;color:var(--gc-teal);margin-top:9px}
.gsi-status{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;background:#f4f8fb;border:1px solid var(--gc-bd);border-radius:10px;padding:10px 16px;margin-bottom:14px;font-family:Consolas,Menlo,monospace;font-size:11px;color:var(--gc-muted)}
.gsi-status b{color:var(--gc-navy);font-weight:700}
.gsi-ok{color:#fff;background:var(--gc-gn);padding:2px 10px;border-radius:20px;font-weight:800;letter-spacing:.05em}
.gsi-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:14px}
@media(max-width:900px){.gsi-kpis{grid-template-columns:repeat(2,1fr)}}
.gsi-kpi{background:#fff;border:1px solid var(--gc-bd);border-radius:12px;padding:15px 16px}
.gsi-kpi.hero{border-color:var(--gc-gold);box-shadow:0 0 0 1px rgba(176,125,24,.25)}
.gsi-kpi.good{border-color:rgba(31,157,99,.5)}
.gsi-kv{font-family:Consolas,Menlo,monospace;font-size:24px;font-weight:800;color:var(--gc-navy)}
.gsi-kpi.hero .gsi-kv{color:var(--gc-gold)}
.gsi-kpi.good .gsi-kv{color:var(--gc-gn)}
.gsi-kpi.dim .gsi-kv{color:#5b7488}
.gsi-kl{font-size:11px;color:var(--gc-muted);margin-top:5px}
.gsi-ksub{font-size:11px;color:#3d5a72;margin-top:3px}
.gsi-ksub b{color:var(--gc-gn)}
.gvrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #eef2f6;flex-wrap:wrap}
.gvdot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.gvn{font-weight:600;font-size:12.5px;color:var(--gc-navy);min-width:150px}
.gsi-rc{font-size:9px;font-weight:800;color:#fff;background:var(--gc-teal);padding:1px 6px;border-radius:8px;letter-spacing:.05em}
.gtiers{display:flex;align-items:center;gap:5px;flex-wrap:wrap;font-family:Consolas,Menlo,monospace}
.gtiers i{color:#c3d2dc;font-style:normal}
.gtier{font-size:11px;color:var(--gc-muted);background:#f4f8fb;border-radius:5px;padding:2px 8px}
.gtier b{color:var(--gc-navy)}
.gtier.best{background:rgba(31,157,99,.12);color:var(--gc-gn)}
.gtier.best b{color:var(--gc-gn)}
.gsi-tblwrap{overflow:auto}
.gsi-tbl,.gsi-avl{width:100%;border-collapse:collapse;font-size:12px}
.gsi-tbl th,.gsi-avl th{text-align:left;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--gc-muted);padding:8px 10px;border-bottom:1px solid var(--gc-bd);background:#f7fafc}
.gsi-tbl td,.gsi-avl td{padding:8px 10px;border-bottom:1px solid #eef2f6;color:#33506a}
.gsi-tbl td.num,.gsi-tbl th.num{text-align:right;font-family:Consolas,Menlo,monospace}
.gsi-tbl b{color:var(--gc-navy)}
.gsi-avl th{text-align:center}
.gsi-avl td{text-align:center}
.gsi-avl td:first-child{text-align:left}
.gsi-avl td:first-child b{color:var(--gc-navy)}
.gsi-avl td:first-child span{display:block;font-size:10px;color:var(--gc-muted)}
.gyes{color:var(--gc-gn);font-weight:800}
.gno{color:#c3d2dc}
tr.gchg{background:rgba(31,157,99,.07)}
.gpill{font-size:9.5px;font-weight:800;letter-spacing:.03em;padding:2px 8px;border-radius:10px}
.gpill.amb{color:#8a6412;background:#fdf3e0}
.gpill.pur{color:#6f4bc2;background:rgba(156,114,232,.14)}
.gpill.grn{color:var(--gc-gn);background:rgba(31,157,99,.12)}
.gsi-aha{border-color:rgba(176,125,24,.4);background:#fffdf6}
.gmove{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid #eef2f6;font-size:12.5px;color:#33506a;line-height:1.65}
.gmove:last-child{border-bottom:none}
.gmove .gmi{color:var(--gc-gold);font-weight:800;font-size:17px}
.gmove b{color:var(--gc-navy)}
.gmove .amb{color:#c67c1a}
.gmove em{color:var(--gc-teal);font-style:normal;font-weight:600}
.gsi-consol{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center}
@media(max-width:820px){.gsi-consol{grid-template-columns:1fr}}
.gcs-h{font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px}
.gcs-h.dim{color:#c0392b}
.gcs-h.good{color:var(--gc-gn)}
.gchips{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.gchip{height:44px;border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0 6px;font-family:Consolas,Menlo,monospace}
.gchip b{font-size:13px;color:#fff}
.gchip span{font-size:8.5px;opacity:.9;color:#fff}
.gchip.bad{background:linear-gradient(180deg,#e05858,#c0392b)}
.gchip.good{background:linear-gradient(180deg,#2bbd7e,#1f9d63)}
.gcarrow{font-size:26px;color:var(--gc-gold);text-align:center}
.gsi-dark .gax{fill:#5b7488;font-size:10px;font-family:Consolas,Menlo,monospace}
.gsi-dark .glbl{font-size:11px;font-weight:700;font-family:Consolas,Menlo,monospace}
.gsi-wbar{transition:none}

/* Data-request modal: multi-select projects/datasets + email draft */
.rqchips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px;min-height:22px}
.rqchip{font-size:11px;background:rgba(14,127,154,.1);color:#0e7f9a;border-radius:12px;padding:2px 8px;font-weight:600}
.rqchip a{cursor:pointer;color:#0e7f9a;margin-left:3px;font-weight:700}
.rqlist{max-height:150px;overflow:auto;border:1px solid #e3ebf1;border-radius:8px;padding:6px;background:#fafcfd}
.rqopt{display:block;font-size:12px;padding:3px 5px;cursor:pointer;color:#33506a;border-radius:4px}
.rqopt:hover{background:#eef6f9}
.rqds{display:flex;flex-direction:column;gap:3px}

/* Demand Bundling — richer drilldown */
.bkpis{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:10px 0 4px}
@media(max-width:760px){.bkpis{grid-template-columns:repeat(3,1fr)}}
.bkpi{background:#f6fafc;border:1px solid #e3ebf1;border-radius:8px;padding:9px 10px;text-align:center}
.bkpi .v{font-size:17px;font-weight:800;color:#0f2742}
.bkpi .l{font-size:9.5px;color:#5b7488;margin-top:2px;line-height:1.3}
.bsec{font-size:12px;font-weight:800;letter-spacing:.02em;color:#0f2742;margin:16px 0 6px;padding-bottom:4px;border-bottom:1px solid #eef2f6;display:flex;gap:8px;align-items:center}
.bvlist{display:flex;flex-direction:column;gap:5px}
.bvproj{font-size:12px;color:#33506a;line-height:1.9}
.bvproj>b{display:inline-block;min-width:70px;color:#0f2742}
.bvchip{display:inline-block;font-size:10.5px;background:#eef2f7;color:#5b7488;border-radius:10px;padding:1px 8px;margin:2px 3px 2px 0}
.bvchip.com{background:rgba(31,157,99,.14);color:#1f9d63;font-weight:700}
.bsim{display:inline-block;min-width:42px;text-align:right;font-weight:700;color:#0e7f9a}
.btl{display:flex;gap:6px;align-items:flex-end;padding:6px 2px;overflow-x:auto}
.btlcol{display:flex;flex-direction:column;align-items:center;min-width:38px}
.btlbar{width:26px;background:linear-gradient(180deg,#15a6c6,#0e7f9a);border-radius:3px 3px 0 0}
.btlm{font-size:9px;color:#5b7488;margin-top:3px;white-space:nowrap}
.btln{font-size:10px;font-weight:700;color:#0f2742}