/* one fixed look: emerald night with brass — same in every theme */
:root, :root[data-theme="light"], :root[data-theme="dark"]{
  color-scheme:dark;
  --ground:#0B1311; --surface:#111B19; --surface2:#15211E; --surface3:#1C2A27;
  --line:#26352F; --line-soft:#1D2A26;
  --ink:#E6EBE7; --ink2:#A7B4AE; --ink3:#7A8883;
  --band:#081C19; --band-ink:#E6EBE7; --band-line:#17332D; --band-dim:#86A097;
  --accent:#C9A66B; --accent-ink:#1A140A; --accent-wash:#2E2717; --gold:#D8B97F;
  --good:#79B394; --good-wash:#18302A; --warn:#D6A95C; --warn-wash:#33291A; --bad:#D98A8F; --bad-wash:#381F22;
  --shadow:0 1px 0 rgba(0,0,0,.3), 0 10px 30px -22px rgba(0,0,0,.7);
  --r:3px;
  --sans:"IBM Plex Sans Arabic", "Segoe UI", Tahoma, "Geeza Pro", sans-serif;
  --display:"Reem Kufi", "IBM Plex Sans Arabic", "Segoe UI", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.6}
.app{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh}
.rail{background:var(--band);color:var(--band-ink);padding:18px 14px;display:flex;flex-direction:column;gap:14px;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{display:flex;gap:14px;align-items:center;padding:4px 8px 14px;border-bottom:1px solid var(--gold);border-image:linear-gradient(to left,var(--gold),transparent) 1}
.mark{width:38px;height:38px;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:20px;transform:rotate(45deg)}
.mark > span{transform:rotate(-45deg)}
.brand b{display:block;font-family:var(--display);font-weight:600;font-size:21px;line-height:1.2;color:var(--gold)}
.brand span{font-size:11.5px;color:var(--band-dim)}
.navgroup p{margin:0 0 4px;padding:0 8px;font-size:11px;letter-spacing:.04em;color:var(--band-dim);font-weight:600}
.nav{display:flex;flex-direction:column;gap:2px}
.nav button{all:unset;display:flex;gap:9px;align-items:center;padding:6px 8px;border-radius:var(--r);cursor:pointer;color:var(--band-ink);font-size:13.5px}
.nav button:hover{background:var(--band-line)}
.nav button[aria-current="true"]{background:var(--band-line);box-shadow:inset -2px 0 0 var(--gold);color:#fff}
.nav button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.nav button[disabled]{opacity:.45;cursor:default}
.nav button[disabled]:hover{background:none}
.num{font-family:var(--mono);font-size:11px;min-width:22px;height:20px;border-radius:3px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:var(--band-dim)}
.soon{margin-inline-start:auto;font-size:10.5px;color:var(--band-dim)}
.railfoot{margin-top:auto;font-size:11.5px;color:var(--band-dim);padding:10px 6px 0;border-top:1px solid var(--band-line)}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;padding:12px 28px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.topbar .client{font-family:var(--display);font-weight:600;font-size:16px}
.topbar .sub{color:var(--ink3);font-size:12.5px}
.grow{flex:1}
.wrap{padding-block:24px 60px;padding-inline:28px;max-width:1280px;width:100%;display:flex;flex-direction:column;gap:18px}
.pagehead{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.pagehead h1{margin:0;font-family:var(--display);font-weight:600;font-size:25px;line-height:1.3;text-wrap:balance}
.pagehead p{margin:4px 0 0;color:var(--ink2);max-width:70ch}
.eyebrow{font-size:11.5px;color:var(--accent);letter-spacing:.03em;font-weight:600;letter-spacing:.02em}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.panel > header{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-soft)}
.panel > header h2{margin:0;font-size:15px;font-weight:600}
.panel > header .hint{color:var(--ink3);font-size:12.5px}
.panel > header .tag{font-family:var(--mono);font-size:11px;color:var(--ink3);border:1px solid var(--line);border-radius:3px;padding:0 5px}
.pbody{padding:14px 16px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:12px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.stat .k{font-size:12px;color:var(--ink3)}
.stat .v{font-family:var(--mono);font-size:24px;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.3}
.stat .s{font-size:12px;color:var(--ink2)}
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th{font-weight:600;color:var(--ink2);text-align:start;font-size:12px;background:var(--surface2);border-bottom:1px solid var(--line);padding:7px 8px;white-space:nowrap}
td{border-bottom:1px solid var(--line-soft);padding:4px 8px;vertical-align:middle}
td.n{text-align:end;font-family:var(--mono);font-variant-numeric:tabular-nums}
th.n{text-align:end}
tr:hover td{background:var(--surface2)}
input,select,textarea{font:inherit;color:var(--ink);background:transparent;border:1px solid transparent;border-radius:3px;padding:4px 6px;width:100%;min-width:0}
input:hover,select:hover,textarea:hover{border-color:var(--line)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);background:var(--surface)}
input[type=number]{font-family:var(--mono);text-align:end;direction:ltr}
textarea{border-color:var(--line);resize:vertical}
.btn{font:inherit;font-size:13px;font-weight:500;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--r);padding:6px 12px;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--surface2)}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.primary:hover{filter:brightness(1.07)}
.btn.sm{padding:3px 9px;font-size:12px}
.btn.ghost{border-color:transparent;background:none;color:var(--ink3)}
.btn.ghost:hover{color:var(--bad);background:var(--bad-wash)}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;padding:1px 8px;border-radius:20px;background:var(--surface3);color:var(--ink2);white-space:nowrap}
.chip.good{background:var(--good-wash);color:var(--good)}
.chip.warn{background:var(--warn-wash);color:var(--warn)}
.chip.bad{background:var(--bad-wash);color:var(--bad)}
.chip.acc{background:var(--accent-wash);color:var(--accent)}
.findings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.findings li{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:9px 0;border-bottom:1px solid var(--line-soft);align-items:start}
.findings li:last-child{border-bottom:0}
.sev{width:8px;height:8px;border-radius:50%;margin-top:7px}
.sev.bad{background:var(--bad)} .sev.warn{background:var(--warn)} .sev.good{background:var(--good)}
.findings small{display:block;color:var(--ink3);font-size:12px}
.meter{height:8px;border-radius:4px;background:var(--surface3);overflow:hidden}
.meter i{display:block;height:100%;background:var(--accent)}
.meter.good i{background:var(--good)} .meter.warn i{background:var(--warn)} .meter.bad i{background:var(--bad)}
.health{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
.ring{--p:0;width:132px;height:132px;border-radius:50%;background:conic-gradient(var(--ringc,var(--accent)) calc(var(--p)*1%), var(--surface3) 0);display:grid;place-items:center}
.ring > div{width:104px;height:104px;border-radius:50%;background:var(--surface);display:grid;place-items:center;text-align:center}
.ring b{font-family:var(--display);font-size:30px;font-weight:500;line-height:1}
.ring span{font-size:11.5px;color:var(--ink3)}
.comp{display:grid;grid-template-columns:minmax(120px,190px) 1fr 42px;gap:6px 12px;align-items:center;font-size:12.5px}
.comp .v{font-family:var(--mono);text-align:end}
.tree{list-style:none;margin:0;padding:0}
.tree ul{list-style:none;margin:0;padding-inline-start:22px;border-inline-start:1px dashed var(--line);margin-inline-start:10px}
.tree li{padding:3px 0}
.node{display:inline-flex;flex-wrap:wrap;gap:8px;align-items:center;padding:5px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.node b{font-weight:600}
.node .code{font-family:var(--mono);font-size:11px;color:var(--ink3)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.card{border:1px solid var(--line);border-radius:var(--r);padding:12px;display:flex;flex-direction:column;gap:6px;background:var(--surface)}
.card h3{margin:0;font-size:14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.card label{font-size:11.5px;color:var(--ink3)}
.stages{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.stage{border:1px solid var(--line);border-radius:var(--r);padding:12px;background:var(--surface);cursor:pointer;display:flex;flex-direction:column;gap:8px;text-align:start;font:inherit;color:inherit}
.stage:hover{border-color:var(--accent)}
.stage:focus-visible{outline:2px solid var(--accent)}
.stage .t{font-weight:600}
.stage .num2{font-size:11.5px;color:var(--accent);font-weight:600}
.matrix td{text-align:center}
.matrix select{width:62px;text-align:center;font-family:var(--mono)}
.matrix td.flag{background:var(--bad-wash)}
.note{font-size:12.5px;color:var(--ink2);background:var(--surface2);border:1px solid var(--line-soft);border-radius:var(--r);padding:9px 12px}
.report{max-width:78ch;line-height:1.85}
.report h3{margin:18px 0 6px;font-size:15px}
.report p{margin:0 0 8px}
.muted{color:var(--ink3)}
.toasts{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));inset-inline-start:16px;display:flex;flex-direction:column;gap:6px;z-index:20}
.toast{background:var(--band);color:var(--band-ink);padding:8px 14px;border-radius:var(--r);box-shadow:var(--shadow);font-size:13px}
.empty{padding:26px;text-align:center;color:var(--ink3)}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .rail{position:static;height:auto;flex-direction:row;overflow-x:auto;gap:18px;padding:12px 16px}
  .brand{border-bottom:0;padding:0;flex:none}
  .navgroup{flex:none}
  .nav{flex-direction:row}
  .railfoot{display:none}
  .wrap{padding-inline:16px}
  .topbar{padding:10px 16px;position:static}
  .health{grid-template-columns:1fr;justify-items:center}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- release 2–4 additions ---- */
.ctxbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ctxbar label{font-size:12px;color:var(--ink3)}
.ctxbar select{width:auto;border-color:var(--line);background:var(--surface2)}
.ctxbar.alt select{border-color:var(--accent);color:var(--accent)}
.banner{border:1px solid var(--accent);background:var(--accent-wash);color:var(--ink);border-radius:var(--r);padding:9px 14px;font-size:13px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.readonly input,.readonly select,.readonly textarea{pointer-events:none;opacity:.85}
.readonly .btn.ghost,.readonly .addrow{display:none}
.bars{display:flex;flex-direction:column;gap:6px}
.bar{display:grid;grid-template-columns:minmax(110px,200px) 1fr minmax(70px,auto);gap:10px;align-items:center;font-size:12.5px}
.bar .v{font-family:var(--mono);text-align:end;white-space:nowrap}
.tornado{display:grid;grid-template-columns:minmax(120px,190px) 1fr 1fr;gap:6px 0;align-items:center;font-size:12.5px}
.tornado .l{padding-inline-end:10px}
.tornado .neg,.tornado .pos{height:16px;display:flex}
.tornado .neg{justify-content:flex-end;border-inline-end:1px solid var(--ink3)}
.tornado .neg i{background:var(--good);display:block;height:100%}
.tornado .pos i{background:var(--bad);display:block;height:100%}
.signin{max-width:380px;margin:12vh auto;display:flex;flex-direction:column;gap:12px}
.signin input{border-color:var(--line);background:var(--surface2);padding:8px 10px}
.signin h1{font-family:var(--display);color:var(--gold);margin:0;font-size:30px}
.pill-list{display:flex;flex-wrap:wrap;gap:6px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:13px}
.kv b{color:var(--ink2);font-weight:500}
td.good{color:var(--good)} td.bad{color:var(--bad)} td.warn{color:var(--warn)}
.sync{font-size:11.5px}

/* ---- interactive org chart ---- */
.orgbox{display:flex;flex-direction:column;gap:10px}
.orgbar{gap:8px}
.orgscroll{direction:ltr;overflow:auto;max-height:78vh;border:1px solid var(--line-soft);border-radius:var(--r);background:
  radial-gradient(circle at 1px 1px, var(--line-soft) 1px, transparent 0) 0 0/18px 18px, var(--surface2)}
.orgsize{position:relative;margin-inline:auto;min-width:100%}
.org{direction:ltr;transform-origin:top left;display:inline-block;min-width:100%;padding:18px 20px 26px;box-sizing:border-box}
.org ul{display:flex;justify-content:center;padding:20px 0 0;margin:0;list-style:none;position:relative}
.org > ul{padding-top:0}
.org li{display:flex;flex-direction:column;align-items:center;position:relative;padding:20px 6px 0;list-style:none}
.org li::before,.org li::after{content:"";position:absolute;top:0;right:50%;width:50%;height:20px;border-top:1px solid var(--band-dim)}
.org li::after{right:auto;left:50%;border-left:1px solid var(--band-dim)}
.org li:only-child::before,.org li:only-child::after{display:none}
.org li:only-child{padding-top:0}
.org li:first-child::before,.org li:last-child::after{border:0 none}
.org li:last-child::before{border-right:1px solid var(--band-dim);border-radius:0 6px 0 0}
.org li:first-child::after{border-radius:6px 0 0 0}
.org ul ul::before{content:"";position:absolute;top:0;left:50%;height:20px;border-left:1px solid var(--band-dim)}
.org > ul > li{padding-top:0}
.org > ul > li::before,.org > ul > li::after{display:none}
.ocard{direction:rtl;position:relative;width:176px;background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--ink3);border-radius:var(--r);padding:8px 10px 9px;display:flex;flex-direction:column;gap:2px;text-align:start;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;box-shadow:var(--shadow);transition:box-shadow .15s,border-color .15s}
.ocard:hover{border-color:var(--accent)}
.ocard.t-exec{border-top-color:var(--gold)}
.ocard.t-core{border-top-color:var(--accent)}
.ocard.t-support{border-top-color:var(--ink3)}
.ocard.t-control{border-top-color:var(--good)}
.ocard.t-advisory{border-top-color:var(--warn)}
.oc-top{display:flex;justify-content:space-between;gap:6px;font-size:10.5px;color:var(--ink3)}
.oc-code{font-family:var(--mono)}
.oc-name{font-size:13px;line-height:1.35;font-weight:600}
.oc-head{font-size:11.5px;color:var(--ink2)}
.oc-meta{font-size:11px;color:var(--ink3)}
.oc-meta em{font-style:normal;color:var(--warn)}
.oc-tools{position:absolute;bottom:-11px;inset-inline-start:50%;transform:translateX(50%);display:flex;gap:4px}
.oc-btn{font:inherit;font-size:11px;line-height:1;min-width:22px;height:20px;padding:0 5px;border-radius:10px;border:1px solid var(--line);background:var(--surface2);color:var(--ink2);cursor:pointer}
.oc-btn:hover{border-color:var(--accent);color:var(--accent)}
.oc-btn:focus-visible{outline:2px solid var(--accent)}
.org li > ul{margin-top:10px}
.ocard.dragging{opacity:.35}
.ocard.drop-ok{border-color:var(--good);box-shadow:0 0 0 3px var(--good-wash)}
.ocard.drop-bad{border-color:var(--bad);box-shadow:0 0 0 3px var(--bad-wash);cursor:not-allowed}
.oghost{position:fixed;z-index:50;pointer-events:none;opacity:.92;transform:rotate(-2deg);box-shadow:0 12px 30px rgba(0,0,0,.5);cursor:grabbing}
.org-rootdrop{direction:rtl;display:none;margin:0 auto 14px;max-width:360px;text-align:center;font-size:12px;color:var(--ink3);border:1px dashed var(--line);border-radius:var(--r);padding:8px}
.org.is-dragging .org-rootdrop{display:block}
.org-rootdrop.drop-ok{border-color:var(--good);color:var(--good)}
.org-rootdrop.drop-bad{border-color:var(--bad);color:var(--bad)}

/* ---- logo ---- */
.brand{flex-direction:column;align-items:flex-start;gap:6px}
.brand .logo{display:block;width:118px;height:auto}
.brand > span{font-size:11.5px;color:var(--band-dim);line-height:1.5}
.logo-lg{display:block;width:180px;height:auto;margin:0 auto 6px}
@media (max-width:860px){ .brand .logo{width:84px} .brand > span{display:none} }

/* ---- files + AI workbench ---- */
.workbench{align-items:start}
.aipanel{border-color:color-mix(in srgb, var(--accent) 45%, var(--line))}
.aipanel > header h2::before{content:"✦ ";color:var(--gold)}
.aiactions{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-top:10px}
.aiact{font:inherit;text-align:start;display:flex;flex-direction:column;gap:2px;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface2);color:var(--ink);cursor:pointer}
.aiact b{font-size:13px;font-weight:600}
.aiact span{font-size:11.5px;color:var(--ink3)}
.aiact:hover:not(:disabled){border-color:var(--accent);background:var(--accent-wash)}
.aiact:focus-visible{outline:2px solid var(--accent)}
.aiact:disabled{opacity:.5;cursor:wait}
.aibusy{margin-top:10px;display:flex;gap:8px;align-items:center;color:var(--accent);font-size:13px}
.spin{width:14px;height:14px;border:2px solid var(--accent-wash);border-top-color:var(--accent);border-radius:50%;animation:spin 0.8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.airesult{margin-top:12px;border-top:1px solid var(--line-soft);padding-top:10px}
.airesult h3{margin:0 0 6px;font-size:14px;color:var(--gold)}
.airesult h4{margin:10px 0 4px;font-size:12.5px;color:var(--ink2)}
.airesult table td{font-size:12px;padding:4px 6px}
.pill-list label.chip{cursor:pointer}

/* ---- table tools ---- */
.etable{display:flex;flex-direction:column;gap:8px}
.ttools input[type=search]{max-width:280px;border-color:var(--line);background:var(--surface2)}
.tfoot:empty{display:none}

/* ---- intake + templates ---- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.step{border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;background:var(--surface);display:flex;flex-direction:column;gap:3px}
.step .n{font-family:var(--display);color:var(--gold);font-size:18px;line-height:1}
.step b{font-size:13.5px}
.step > span:last-child{font-size:12px;color:var(--ink3)}
.dropzone{border:1.5px dashed var(--accent);border-radius:var(--r);background:var(--surface);padding:28px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.dropzone b{font-size:15px}
.dropzone.over{background:var(--accent-wash)}
.sheetcard{border:1px solid var(--line);border-radius:var(--r);padding:12px;display:flex;flex-direction:column;gap:10px;margin-bottom:12px;background:var(--surface2)}
.sheetcard details summary{cursor:pointer;color:var(--accent);font-size:12.5px}
.mapgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;margin-top:8px}
.mapcell{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--ink2)}
.mapcell select{border-color:var(--line);background:var(--surface)}
.mapcell.missing select{border-color:var(--bad)}
.docrow{padding:6px 0;border-bottom:1px solid var(--line-soft)}
.docrow:last-child{border-bottom:0}
.tplgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px}
.tplcard{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:16px;display:flex;flex-direction:column;gap:10px;border-top:3px solid var(--band-line)}
.tplcard.featured{border-top-color:var(--gold);grid-column:1/-1;background:linear-gradient(180deg,var(--accent-wash),var(--surface) 70%)}
.tplcard h3{margin:0;font-family:var(--display);font-weight:600;font-size:17px;color:var(--ink)}
.tplcard p{margin:0;color:var(--ink2);font-size:13px}
.tplhead{display:flex;justify-content:space-between;align-items:center}
.tplmark{width:28px;height:28px;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-family:var(--display);transform:rotate(45deg);font-size:14px}
.fullai{display:flex;flex-direction:column;gap:4px;margin:10px 0}
.fstep{display:flex;gap:10px;align-items:center;font-size:13px;padding:4px 0;flex-wrap:wrap}
.fstep .fi{width:18px;text-align:center;font-family:var(--mono)}
.fstep.run .fi{color:var(--accent);animation:spin 1.2s linear infinite;display:inline-block}
.fstep.done .fi{color:var(--good)} .fstep.fail .fi{color:var(--bad)} .fstep.wait{color:var(--ink3)}
.fstep small{color:var(--bad);width:100%}