/* ==========================================================================
   BuildControl — design system
   Light only. Formal, ruled, dense. Navy and grey, one restrained ochre
   accent reserved for things that need attention. Serif for headings, system
   sans for everything you read in bulk, tabular mono for figures.
   ========================================================================== */

:root{
  color-scheme:light;

  /* brand */
  --navy:#1b3355; --navy-2:#16283f; --navy-3:#254373;
  --steel:#2c5087; --steel-ink:#234376;
  --accent:#8a5a03; --accent-2:#a06a08; --accent-bg:#fdf6e7;

  /* surfaces */
  --bg:#f1f3f6; --surface:#ffffff; --surface-2:#f7f8fa; --surface-3:#eef1f5;
  --sidebar:#fbfcfd;
  --overlay-bg:rgba(22,40,63,.42);

  /* text */
  --ink:#1a2233; --ink-2:#3d4859; --muted:#697588; --muted-2:#8a94a4;

  /* rules */
  --line:#dde2ea; --line-2:#c9d1dd; --line-strong:#aab4c4;

  /* status */
  --ok:#1c6b3a; --ok-bg:#eaf4ed;
  --warn:#8a5a03; --warn-bg:#fdf3e0;
  --bad:#9d1f2c; --bad-bg:#fbecee;
  --info:#1b4f8c; --info-bg:#ebf1f9;
  --neutral-bg:#eef0f4;

  /* elevation + focus */
  --shadow-1:0 1px 1px rgba(20,32,54,.05);
  --shadow-2:0 1px 2px rgba(20,32,54,.07),0 6px 18px rgba(20,32,54,.07);
  --shadow-3:0 10px 34px rgba(20,32,54,.20);
  --focus:0 0 0 3px rgba(44,80,135,.24);

  /* geometry — minimal rounding, formal */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s7:32px; --s8:40px;
  --r-sm:3px; --r:4px; --r-lg:5px; --r-pill:2px;
  --sb:252px; --gutter:var(--s6); --content-max:1560px; --topbar-h:58px;

  /* type */
  --fs-2xs:10px; --fs-xs:11px; --fs-sm:12px; --fs-md:13px; --fs-base:14px;
  --fs-lg:16px; --fs-xl:19px; --fs-2xl:25px;
  --font:"Segoe UI","Segoe UI Variable Text",-apple-system,BlinkMacSystemFont,Roboto,Helvetica,Arial,sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --mono:"Cascadia Mono","SFMono-Regular",Consolas,Menlo,monospace;
}

*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--font);background:var(--bg);color:var(--ink);font-size:var(--fs-base);
  line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
::selection{background:rgba(44,80,135,.16)}
:focus-visible{outline:2px solid var(--steel);outline-offset:2px}
a{color:var(--steel-ink)}
h1,h2,h3,h4{margin:0}

/* Every icon this app renders carries class="ic". An inline <svg> with no
   width/height and no CSS size falls back to the replaced-element default of
   300x150, so one dropped into a container that has no svg rule of its own
   swamps the page. This is only a floor: every container rule further down
   (.btn svg, .empty svg, .callout svg, .nav .navlink .ic, ...) is more
   specific and still wins, so icon sizes elsewhere are unchanged. */
.ic{width:15px;height:15px;flex:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* The sign-in panel is fixed, full-viewport and opaque, so it MUST leave the
   layout once authenticated — otherwise it covers the app and a successful
   sign-in looks like nothing happened. */
.app{display:none;min-height:100vh}
body.authed .app{display:flex}
body.authed #login{display:none}
body:not(.authed) .app{display:none}

/* ---------- Sidebar ---------- */
.sidebar{width:var(--sb);background:var(--sidebar);color:var(--ink-2);position:fixed;top:0;bottom:0;left:0;
  display:flex;flex-direction:column;z-index:40;border-right:1px solid var(--line-2);transition:width .16s ease}
.brand{height:var(--topbar-h);padding:0 var(--s4);display:flex;align-items:center;gap:var(--s3);flex:none;
  border-bottom:1px solid var(--line-2);background:var(--surface);overflow:hidden}
.brand .logo{width:30px;height:30px;border-radius:var(--r-sm);background:var(--navy);
  display:grid;place-items:center;flex:none}
.brand .logo svg{width:17px;height:17px;color:#fff}
.brand .brandtext{min-width:0;width:0;flex:1 1 0;overflow:hidden}
.brand h1{font-family:var(--serif);font-size:var(--fs-lg);color:var(--navy);font-weight:700;
  letter-spacing:.2px;white-space:nowrap;line-height:1.15;display:block;width:100%;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.brand p{margin:0;font-size:9px;color:var(--muted-2);letter-spacing:1.4px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.nav{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--s4) var(--s3) var(--s6)}
.nav::-webkit-scrollbar{width:9px}
.nav::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:6px}
.nav-group+.nav-group{margin-top:var(--s5)}
.nav-group h2{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:1.1px;color:var(--muted-2);
  margin:0 0 var(--s2) var(--s2);font-weight:700;padding-bottom:var(--s1);border-bottom:1px solid var(--line)}
.nav button.navlink{position:relative;display:flex;align-items:center;gap:10px;width:100%;padding:7px var(--s2);
  border:none;border-radius:var(--r-sm);background:transparent;color:var(--ink-2);text-align:left;
  font-size:var(--fs-md);font-family:inherit;cursor:pointer;margin-bottom:1px;
  transition:background .1s,color .1s}
.nav button.navlink:hover{background:var(--surface-3);color:var(--ink)}
.nav button.navlink.active{background:var(--navy);color:#fff;font-weight:600}
.nav button.navlink .ic{width:16px;height:16px;flex:none;opacity:.75}
.nav button.navlink.active .ic{opacity:1}
.nav button.navlink .lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav .badge{background:var(--accent);color:#fff;font-size:var(--fs-2xs);font-weight:700;
  border-radius:var(--r-pill);padding:1px 6px;min-width:17px;text-align:center;flex:none;font-variant-numeric:tabular-nums}
.nav button.navlink.active .badge{background:#fff;color:var(--navy)}

.sidefoot{flex:none;padding:var(--s2) var(--s3);border-top:1px solid var(--line)}
.collapsebtn{width:100%;display:flex;align-items:center;gap:10px;padding:7px var(--s2);border:none;
  background:transparent;color:var(--muted);border-radius:var(--r-sm);font-size:var(--fs-sm);
  font-weight:600;cursor:pointer;font-family:inherit}
.collapsebtn:hover{background:var(--surface-3);color:var(--ink)}
.collapsebtn svg{width:15px;height:15px;flex:none;transition:transform .16s ease}

/* collapsed rail */
body.railed{--sb:64px}
body.railed .brand{justify-content:center;padding:0}
body.railed .brand .brandtext,
body.railed .nav-group h2,
body.railed .nav button.navlink .lbl,
body.railed .collapsebtn span{display:none}
body.railed .nav button.navlink{justify-content:center;padding:10px 0}
body.railed .collapsebtn{justify-content:center}
body.railed .collapsebtn svg{transform:rotate(180deg)}
body.railed .nav-group{border-top:1px solid var(--line);padding-top:var(--s2)}
body.railed .nav-group:first-child{border-top:none;padding-top:0}
body.railed .nav .badge{position:absolute;top:2px;right:6px;padding:0 4px;font-size:9px;min-width:14px}
body.railed .nav button.navlink:hover::after{content:attr(data-label);position:absolute;left:calc(100% + 8px);
  white-space:nowrap;background:var(--navy-2);color:#fff;padding:5px 9px;border-radius:var(--r-sm);
  font-size:var(--fs-sm);font-weight:600;box-shadow:var(--shadow-3);z-index:50}

/* ---------- Main / Topbar ---------- */
.main{margin-left:var(--sb);flex:1;display:flex;flex-direction:column;min-width:0;transition:margin-left .16s ease}
.topbar{position:sticky;top:0;height:var(--topbar-h);background:var(--surface);
  border-bottom:1px solid var(--line-2);padding:0 var(--gutter);display:flex;align-items:center;
  gap:var(--s2);z-index:30}
.topbar .crumb{min-width:0}
.topbar .crumb b{display:block;font-family:var(--serif);font-size:var(--fs-xl);font-weight:700;color:var(--navy);
  letter-spacing:.1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.topbar .crumb small{display:block;font-size:var(--fs-sm);color:var(--muted);font-weight:400;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .spacer{flex:1}
.topbar .divider{width:1px;height:24px;background:var(--line-2);flex:none;margin:0 var(--s1)}

.search{position:relative;flex:none}
.search input{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:7px var(--s3) 7px 30px;width:210px;
  font-size:var(--fs-md);background:var(--surface);color:var(--ink);
  transition:border-color .1s,box-shadow .1s}
.search input::placeholder{color:var(--muted-2)}
.search input:focus{outline:none;border-color:var(--steel);box-shadow:var(--focus)}
.search svg{position:absolute;left:9px;top:8px;width:14px;height:14px;color:var(--muted-2);pointer-events:none}
.search[hidden]{display:none}

/* ---------- Buttons ---------- */
.btn{border:1px solid var(--line-2);background:var(--surface);color:var(--ink);border-radius:var(--r-sm);max-width:100%;overflow:hidden;text-overflow:ellipsis;
  padding:7px var(--s3);font-size:var(--fs-md);cursor:pointer;font-weight:600;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  transition:border-color .1s,color .1s,background .1s}
.btn:hover{border-color:var(--steel);color:var(--steel-ink);background:var(--surface-2)}
.btn:active{background:var(--surface-3)}
.btn:disabled{opacity:.5;cursor:default}
.btn svg{width:14px;height:14px;flex:none}
.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}
.btn.primary:hover{background:var(--navy-3);border-color:var(--navy-3);color:#fff}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn.ghost:hover{background:var(--surface-3);color:var(--ink);border-color:transparent}
.btn.danger{color:var(--bad);border-color:var(--line-2)}
.btn.danger:hover{background:var(--bad-bg);border-color:var(--bad);color:var(--bad)}
.btn.sm{padding:4px 9px;font-size:var(--fs-sm)}
.btn.icon{padding:7px;width:33px;height:33px}
.btn.icon svg{width:16px;height:16px}
.btn.block{width:100%;justify-content:flex-start}
kbd{font-family:var(--mono);font-size:var(--fs-2xs);border:1px solid var(--line-2);border-bottom-width:2px;
  border-radius:3px;padding:1px 4px;background:var(--surface-2);color:var(--muted)}

/* ---------- Dropdown menus ---------- */
.menuwrap{position:relative;flex:none}
.menu{position:absolute;top:calc(100% + 5px);right:0;min-width:222px;background:var(--surface);
  border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--shadow-3);padding:var(--s1);
  z-index:70;display:none}
.menu.open{display:block}
.menu h4{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:.9px;color:var(--muted-2);
  padding:var(--s2) var(--s3) var(--s1);font-weight:700}
.menu button{display:flex;align-items:center;gap:9px;width:100%;min-width:0;border:none;background:transparent;
  color:var(--ink);padding:7px var(--s3);border-radius:var(--r-sm);font-size:var(--fs-md);
  font-weight:500;text-align:left;cursor:pointer;font-family:inherit}
.menu button:hover{background:var(--surface-3)}
.menu button svg{width:15px;height:15px;color:var(--muted);flex:none}
.menu button.danger{color:var(--bad)}
.menu button.danger svg{color:var(--bad)}
.menu button .rt{margin-left:auto;color:var(--muted-2);font-size:var(--fs-xs)}
.menu hr{border:none;border-top:1px solid var(--line);margin:var(--s1) 0}

.userchip{display:flex;align-items:center;gap:8px;font-size:var(--fs-md);color:var(--ink);font-weight:600;
  background:transparent;border:1px solid transparent;border-radius:var(--r-sm);padding:4px 7px;
  cursor:pointer;font-family:inherit;max-width:186px}
.userchip:hover{background:var(--surface-3)}
.userchip .av{width:28px;height:28px;border-radius:var(--r-sm);background:var(--navy);color:#fff;
  display:grid;place-items:center;font-size:var(--fs-sm);font-weight:700;flex:none}
.userchip .who{min-width:0;text-align:left;line-height:1.25}
.userchip .who span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.userchip .who small{display:block;font-size:var(--fs-2xs);color:var(--muted);font-weight:600}

/* project selector */
.projsel{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:7px 28px 7px 10px;font-size:var(--fs-md);
  font-weight:600;color:var(--ink);background-color:var(--surface);-webkit-appearance:none;appearance:none;
  max-width:224px;cursor:pointer;transition:border-color .1s,box-shadow .1s;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23697588' stroke-width='3'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 9px center}
.projsel:hover{border-color:var(--steel)}
.projsel:focus{outline:none;border-color:var(--steel);box-shadow:var(--focus)}

.savestate{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);
  border-radius:var(--r-sm);background:var(--surface);color:var(--muted);padding:5px 8px;
  min-height:33px;font-size:var(--fs-sm);font-weight:700;white-space:nowrap}
.savestate[hidden]{display:none}
.savestate:disabled{opacity:1}
.savedot{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:none}
.savestate[data-state="unsaved"] .savedot,.savestate[data-state="saving"] .savedot{background:var(--warn)}
.savestate[data-state="failed"] .savedot,.savestate[data-state="conflict"] .savedot,
.savestate[data-state="load-failed"] .savedot{background:var(--bad)}
.savestate:not(:disabled){cursor:pointer;color:var(--bad);border-color:var(--bad)}
.savestate:not(:disabled):hover{background:var(--bad-bg)}
.savestate:focus-visible{box-shadow:var(--focus)}

.robanner{display:flex;align-items:center;gap:9px;background:var(--warn-bg);color:var(--warn);
  border-bottom:1px solid var(--line-2);padding:8px var(--gutter);font-size:var(--fs-md);font-weight:500}
.robanner[hidden]{display:none}
.robanner svg{width:15px;height:15px;flex:none}
.robanner b{font-weight:700}

.savebanner{display:flex;align-items:center;gap:var(--s4);background:var(--bad-bg);color:var(--bad);
  border-bottom:1px solid rgba(157,31,44,.28);padding:9px var(--gutter);font-size:var(--fs-md)}
.savebanner[hidden]{display:none}
.savebanner:focus-visible{outline:2px solid var(--bad);outline-offset:-3px}
.savebanner-copy{display:flex;flex:1;min-width:0;gap:var(--s2);flex-wrap:wrap}
.savebanner-copy b{font-weight:700}
.savebanner-actions{display:flex;gap:var(--s2);flex-wrap:wrap}

/* ---------- Content rhythm ---------- */
.content{flex:1;width:100%;max-width:var(--content-max);margin:0 auto;padding:var(--s5) var(--gutter) var(--s8)}
.section-title{font-family:var(--serif);font-size:var(--fs-lg);font-weight:700;color:var(--navy);min-width:0;overflow:hidden;text-overflow:ellipsis;
  margin:var(--s7) 0 var(--s3);display:flex;align-items:center;gap:var(--s3);
  padding-bottom:var(--s2);border-bottom:2px solid var(--navy)}
.section-title:first-child{margin-top:0}
.section-title a{margin-left:auto;font-size:var(--fs-sm);font-weight:600;font-family:var(--font)}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--s4);align-items:start}
.grid-3{display:grid;grid-template-columns:minmax(0,2fr) minmax(272px,1fr);gap:var(--s4);align-items:start}
.stack{display:flex;flex-direction:column;gap:var(--s2)}

/* ---------- KPI cards ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(186px,1fr));gap:0;
  border:1px solid var(--line-2);border-radius:var(--r);background:var(--surface);overflow:hidden}
.kpi{padding:var(--s3) var(--s4);position:relative;min-width:0;border-left:1px solid var(--line)}
.kpi:first-child{border-left:none}
.kpi::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--c,var(--steel))}
.kpi .lbl{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:.8px;color:var(--muted);font-weight:700}
.kpi .val{font-size:var(--fs-2xl);font-weight:700;color:var(--navy);margin-top:3px;letter-spacing:-.5px;
  font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.15}
.kpi .sub{font-size:var(--fs-sm);color:var(--muted);margin-top:1px;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}

/* ---------- Panel & Table ---------- */
.panel{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden}
.panel+.panel{margin-top:var(--s4)}
.panel .ph{padding:var(--s2) var(--s4);border-bottom:1px solid var(--line-2);display:flex;align-items:center;
  gap:var(--s3);min-height:44px;background:var(--surface-2)}
.panel .ph h3{font-family:var(--serif);font-size:var(--fs-base);color:var(--navy);font-weight:700;
  display:flex;align-items:center;gap:7px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.panel .ph h3 svg{width:15px;height:15px;color:var(--muted)}
.panel .ph .spacer{flex:1}
.panel .pbody{padding:var(--s4)}
.tablewrap{overflow:auto;max-height:min(68vh,760px)}

table{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--fs-md)}
thead th{position:sticky;top:0;background:var(--navy);color:#fff;text-align:left;padding:8px var(--s3);
  font-weight:600;font-size:var(--fs-2xs);letter-spacing:.7px;text-transform:uppercase;white-space:nowrap;
  z-index:2;border-right:1px solid rgba(255,255,255,.12)}
thead th:last-child{border-right:none}
thead th.num{text-align:right}
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{background:var(--navy-3)}
th.sortable::after{content:"";display:inline-block;width:0;height:0;margin-left:5px;vertical-align:middle;
  opacity:.4;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:5px solid currentColor}
th.sortable[data-dir="asc"]::after{opacity:1}
th.sortable[data-dir="desc"]::after{opacity:1;transform:rotate(180deg)}
tbody td{padding:7px var(--s3);border-bottom:1px solid var(--line);border-right:1px solid var(--line);
  vertical-align:top}
tbody td:last-child{border-right:none}
tbody td.num{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--mono);
  font-size:var(--fs-sm);white-space:nowrap}
tbody td.nowrap{white-space:nowrap}
tbody td .wrap{display:block;max-width:44ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
tbody tr:nth-child(even) td{background:var(--surface-2)}
tbody tr:hover td{background:var(--info-bg)}
tbody tr.total td{background:var(--navy-2)!important;color:#fff;font-weight:700;border-bottom:none;
  border-right-color:rgba(255,255,255,.12)}
tbody tr.total td.num{color:#fff}

.empty{padding:38px var(--s4);text-align:center;color:var(--muted)}
.empty svg{width:32px;height:32px;opacity:.35;margin-bottom:var(--s2)}
.empty b{color:var(--ink)}

.pill{display:inline-block;padding:2px 8px;border-radius:var(--r-pill);font-size:var(--fs-2xs);font-weight:700;
  letter-spacing:.4px;white-space:nowrap;text-transform:uppercase;border:1px solid transparent}
.pill.ok{background:var(--ok-bg);color:var(--ok);border-color:#c5e0ce}
.pill.warn{background:var(--warn-bg);color:var(--warn);border-color:#ecd9ae}
.pill.bad{background:var(--bad-bg);color:var(--bad);border-color:#eec6cb}
.pill.info{background:var(--info-bg);color:var(--info);border-color:#c8d8ee}
.pill.mut{background:var(--neutral-bg);color:var(--muted);border-color:var(--line-2)}

.rowact{display:flex;gap:2px;justify-content:flex-end}
.iconbtn{border:none;background:transparent;cursor:pointer;color:var(--muted);padding:4px;border-radius:var(--r-sm);
  display:grid;place-items:center;transition:background .1s,color .1s}
.iconbtn:hover{background:var(--surface-3);color:var(--ink)}
.iconbtn.danger:hover{background:var(--bad-bg);color:var(--bad)}
.iconbtn svg{width:15px;height:15px}
.note{font-size:var(--fs-sm);color:var(--muted);padding:9px var(--s4);border-top:1px solid var(--line-2);
  background:var(--surface-2)}
.note b{color:var(--ink)}

/* ---------- Toolbar ---------- */
.toolbar{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center;margin-bottom:var(--s3)}
.toolbar .spacer{flex:1}
.toolbar .count{font-size:var(--fs-sm);color:var(--muted);font-weight:600}
.callout{font-size:var(--fs-md);color:var(--ink-2);background:var(--info-bg);border:1px solid #cfdcee;
  border-left:3px solid var(--info);border-radius:var(--r-sm);padding:9px var(--s3);margin-bottom:var(--s3);
  display:flex;gap:9px;align-items:flex-start}
.callout svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--info)}
.callout b{color:var(--ink)}
.callout.warn{background:var(--warn-bg);border-color:#ecd9ae;border-left-color:var(--warn)}
.callout.warn svg{color:var(--warn)}
.readonly-note{font-size:var(--fs-md);color:var(--ink-2);background:var(--surface-2);
  border:1px solid var(--line-2);border-left:3px solid var(--muted-2);border-radius:var(--r-sm);
  padding:9px var(--s3);margin-bottom:var(--s3)}
/* Not flex: most readonly-notes are a run of inline text with <b> and <a> in
   it, and flex would blow each of those out into its own column. */
.readonly-note svg{width:15px;height:15px;vertical-align:-2px;margin-right:5px;color:var(--muted)}

/* ---------- Modal ---------- */
.overlay{position:fixed;inset:0;background:var(--overlay-bg);display:none;align-items:flex-start;
  justify-content:center;z-index:60;padding:var(--s7) var(--s4);overflow:auto}
.overlay.open{display:flex}
.modal{background:var(--surface);border-radius:var(--r);width:100%;max-width:660px;box-shadow:var(--shadow-3);
  overflow:hidden;border:1px solid var(--line-strong)}
.modal .mh{padding:var(--s3) var(--s4);background:var(--navy);color:#fff;display:flex;align-items:center;gap:9px}
.modal .mh h3{font-family:var(--serif);font-size:var(--fs-lg);font-weight:700;display:flex;align-items:center;gap:7px}
.modal .mh h3 svg{width:16px;height:16px}
.modal .mh button{margin-left:auto;background:transparent;border:none;color:#c3cfe2;cursor:pointer;
  font-size:22px;line-height:1;padding:0 4px;border-radius:var(--r-sm)}
.modal .mh button:hover{color:#fff}
.modal .mb{padding:var(--s4);max-height:64vh;overflow:auto}
.modal .mf{padding:var(--s3) var(--s4);border-top:1px solid var(--line-2);display:flex;gap:9px;
  justify-content:flex-end;background:var(--surface-2);flex-wrap:wrap}
.modal .mf .spacer{flex:1}

.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(226px,1fr));gap:var(--s3)}
.field{display:flex;flex-direction:column;gap:4px;min-width:0}
.field.full{grid-column:1/-1}
.field>label{font-size:var(--fs-sm);font-weight:700;color:var(--ink-2)}
.field input,.field select,.field textarea{border:1px solid var(--line-2);border-radius:var(--r-sm);
  padding:8px 10px;font-size:var(--fs-base);background:var(--surface);color:var(--ink);width:100%;
  transition:border-color .1s,box-shadow .1s}
.field input[readonly]{background:var(--surface-3);color:var(--muted)}
.field textarea{resize:vertical;min-height:62px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--steel);
  box-shadow:var(--focus)}
.field .hint,.hint{font-size:var(--fs-sm);color:var(--muted)}
.field .row{display:flex;gap:6px}
.req{color:var(--bad)}

/* ---------- Command palette ---------- */
#cmdk{position:fixed;inset:0;background:var(--overlay-bg);display:none;align-items:flex-start;
  justify-content:center;z-index:95;padding:12vh var(--s4) var(--s4)}
#cmdk.open{display:flex}
.cmdbox{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);width:100%;
  max-width:548px;box-shadow:var(--shadow-3);overflow:hidden}
.cmdbox input{width:100%;border:none;border-bottom:1px solid var(--line-2);padding:var(--s3) var(--s4);
  font-size:var(--fs-lg);background:transparent;color:var(--ink)}
.cmdbox input:focus{outline:none}
.cmdlist{max-height:52vh;overflow:auto;padding:var(--s1)}
.cmdlist button{display:flex;align-items:center;gap:10px;width:100%;border:none;background:transparent;
  color:var(--ink);padding:8px var(--s3);border-radius:var(--r-sm);font-size:var(--fs-base);text-align:left;
  cursor:pointer;font-family:inherit}
.cmdlist button svg{width:15px;height:15px;color:var(--muted);flex:none}
.cmdlist button .grp{margin-left:auto;font-size:var(--fs-xs);color:var(--muted-2)}
.cmdlist button.on,.cmdlist button:hover{background:var(--surface-3)}
.cmdfoot{border-top:1px solid var(--line-2);padding:7px var(--s4);font-size:var(--fs-xs);color:var(--muted-2);
  display:flex;gap:var(--s4);background:var(--surface-2)}

/* ---------- Toast ---------- */
.toasts{position:fixed;bottom:var(--s5);right:var(--s5);display:flex;flex-direction:column;gap:8px;z-index:100;
  pointer-events:none}
.toast{background:var(--navy-2);color:#fff;padding:9px var(--s3);border-radius:var(--r-sm);font-size:var(--fs-md);
  box-shadow:var(--shadow-3);display:flex;align-items:center;gap:9px;animation:slidein .18s ease;
  pointer-events:auto;max-width:378px;border-left:3px solid var(--steel)}
.toast.ok{border-left-color:#4caf7d}
.toast.bad{background:var(--bad);border-left-color:#f0b6bd}
.toast button{background:transparent;border:none;color:inherit;cursor:pointer;opacity:.7;font-size:16px;
  line-height:1;margin-left:auto}
.toast button:hover{opacity:1}
@keyframes slidein{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}

/* ---------- Charts ---------- */
.bars{display:flex;align-items:flex-end;gap:9px;height:190px;padding:var(--s4) var(--s3) 0}
.bars .bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;height:100%;
  justify-content:flex-end;min-width:0}
.bars .bar .col{width:100%;max-width:44px;background:var(--steel);transition:height .3s}
.bars .bar .pair{display:flex;gap:2px;align-items:flex-end;width:100%;height:100%;justify-content:center}
.bars .bar .cap{font-size:var(--fs-2xs);color:var(--muted);text-align:center;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;max-width:100%}
.legend{display:flex;gap:var(--s3);font-size:var(--fs-sm);color:var(--muted);flex-wrap:wrap}
.legend i{display:inline-block;width:9px;height:9px;margin-right:5px;vertical-align:-1px}

/* ---------- Health gauge & minis ---------- */
.health{display:flex;align-items:center;gap:var(--s6);flex-wrap:wrap}
.health-ring{width:108px;height:108px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:conic-gradient(var(--ring-c,var(--ok)) calc(var(--p,80)*1%),var(--surface-3) 0);position:relative}
.health-ring::after{content:"";position:absolute;inset:11px;background:var(--surface);border-radius:50%}
.health-ring>div{position:relative;z-index:1;text-align:center;line-height:1}
.health-ring.ok{--ring-c:var(--ok)}.health-ring.warn{--ring-c:var(--warn)}.health-ring.bad{--ring-c:var(--bad)}
.health-num{font-family:var(--serif);font-size:31px;font-weight:700;color:var(--navy)}
.health-of{font-size:var(--fs-xs);color:var(--muted);margin-top:3px}
.health-lbl{font-family:var(--serif);font-size:var(--fs-xl);font-weight:700}
.health-lbl.ok{color:var(--ok)}.health-lbl.warn{color:var(--warn)}.health-lbl.bad{color:var(--bad)}
.health-sub{font-size:var(--fs-sm);color:var(--muted);margin-top:2px}
.minis{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:9px;padding:var(--s3)}
.mini{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:10px 11px;display:flex;
  align-items:center;gap:11px;background:var(--surface-2)}
.mini-v{font-size:21px;font-weight:700;color:var(--bad);font-variant-numeric:tabular-nums}
.mini-v small{font-size:var(--fs-sm);font-weight:700}
.mini-l{font-size:var(--fs-sm);font-weight:600;line-height:1.3;min-width:0}
.mini-l span{font-weight:400;font-size:var(--fs-xs);color:var(--muted)}

/* ---------- Attachments ---------- */
.attgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(126px,1fr));gap:var(--s3);
  margin-bottom:var(--s3)}
.att{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:7px;position:relative;background:var(--surface-2)}
.attthumb{display:flex;height:84px;border-radius:var(--r-sm);overflow:hidden;background:var(--surface-3);
  align-items:center;justify-content:center}
.attthumb img{width:100%;height:100%;object-fit:cover}
.filetype{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--steel)}
.filetype svg{width:24px;height:24px}
.filetype span{font-size:var(--fs-2xs);font-weight:700;color:var(--muted)}
.attname{font-size:var(--fs-sm);font-weight:600;margin-top:5px;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.attsub{font-size:var(--fs-2xs);color:var(--muted)}
.attdel{position:absolute;top:5px;right:5px;background:var(--surface)}
.attup{display:flex;flex-direction:column;align-items:center;gap:3px;border:1px dashed var(--line-strong);
  border-radius:var(--r-sm);padding:var(--s4);cursor:pointer;color:var(--steel-ink);font-weight:600;
  font-size:var(--fs-md);text-align:center;transition:border-color .1s,background .1s}
.attup:hover{border-color:var(--steel);background:var(--surface-2)}
.attup small{color:var(--muted);font-weight:400;font-size:var(--fs-xs)}
.attup svg{width:15px;height:15px;vertical-align:-3px}

/* ---------- Gantt ---------- */
.gantt{padding:var(--s3) var(--s4) var(--s4);overflow-x:auto}
.gmarks{position:relative;height:19px;margin-left:216px;border-bottom:1px solid var(--line-2);
  margin-bottom:var(--s2);min-width:360px}
.gmark{position:absolute;top:0;font-size:var(--fs-2xs);color:var(--muted);transform:translateX(-2px);
  white-space:nowrap;border-left:1px solid var(--line-2);padding-left:3px;height:14px}
.gtoday{position:absolute;top:0;bottom:-1200px;width:2px;background:var(--accent);z-index:2}
.grow{display:flex;align-items:center;margin:3px 0}
.glabel{width:216px;flex:none;font-size:var(--fs-sm);font-weight:600;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;padding-right:10px}
.gtrack{position:relative;flex:1;height:22px;background:var(--surface-3);border-radius:var(--r-sm);min-width:360px}
.gbar{position:absolute;top:2px;height:18px;border-radius:var(--r-sm);display:flex;align-items:center;
  min-width:3px;overflow:hidden}
.gbar span{position:relative;z-index:1;font-size:var(--fs-2xs);font-weight:700;color:#fff;padding:0 5px}
.gfill{position:absolute;left:0;top:0;bottom:0;background:rgba(255,255,255,.3)}

/* ---------- Checkboxes / access ---------- */
.chk{display:flex;align-items:center;gap:var(--s2);font-size:var(--fs-md);font-weight:500;margin:5px 0;
  cursor:pointer}
.chk input{width:auto;margin:0;accent-color:var(--navy)}
.acclist{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:var(--s2) var(--s3);max-height:168px;
  overflow:auto;margin-top:var(--s1);background:var(--surface-2)}

/* ---------- Portfolio ---------- */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(306px,1fr));gap:var(--s4)}
.pcard{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);padding:var(--s4);
  cursor:pointer;transition:box-shadow .12s,border-color .12s;text-align:left;font-family:inherit;
  color:inherit;width:100%;display:block}
.pcard:hover{box-shadow:var(--shadow-2);border-color:var(--line-strong)}
.pcard.active{border-color:var(--navy);box-shadow:inset 3px 0 0 var(--navy)}
.pcard-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.pcard-name{font-family:var(--serif);font-weight:700;color:var(--navy);font-size:var(--fs-lg);line-height:1.25}
.pcard-sub{font-size:var(--fs-sm);color:var(--muted);margin-top:2px}
.pcard-ring{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(var(--rc,var(--navy)) calc(var(--p,0)*1%),var(--surface-3) 0);position:relative}
.pcard-ring::after{content:"";position:absolute;inset:6px;background:var(--surface);border-radius:50%}
.pcard-ring span{position:relative;z-index:1;font-weight:700;font-size:var(--fs-lg);color:var(--navy)}
.pcard-bar{height:6px;background:var(--surface-3);border-radius:var(--r-pill);margin:var(--s3) 0 5px;
  overflow:hidden}
.pcard-bar div{height:100%;background:var(--navy)}
.pcard-meta{display:flex;justify-content:space-between;font-size:var(--fs-sm);font-weight:600;
  margin-bottom:10px;gap:10px}
.pcard-meta .ok{color:var(--ok)}.pcard-meta .warn{color:var(--warn)}.pcard-meta .bad{color:var(--bad)}
.pcard-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;border-top:1px solid var(--line);
  padding-top:var(--s3)}
.pcard-grid .pk{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.pcard-grid .pv{font-size:var(--fs-base);font-weight:700;color:var(--ink);margin-top:1px}
.pcard-foot{margin-top:var(--s3);font-size:var(--fs-sm);font-weight:600;color:var(--accent)}
.pcard-foot svg{width:13px;height:13px;vertical-align:-2px}

/* ---------- Alerts / messages ---------- */
.bellbtn{position:relative}
.bellbadge{position:absolute;top:0;right:0;background:var(--bad);color:#fff;font-size:9.5px;font-weight:700;
  border-radius:var(--r-pill);padding:1px 4px;min-width:15px;text-align:center;line-height:1.3;
  box-shadow:0 0 0 2px var(--surface)}
.msgcompose{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:var(--s3);background:var(--surface-2);
  margin-bottom:var(--s3)}
.msgitem{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:9px 11px;margin-bottom:8px;
  background:var(--surface)}
.msgitem.unread{border-color:#ecd9ae;background:var(--warn-bg);box-shadow:inset 3px 0 0 var(--accent)}
.msghead{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm);margin-bottom:3px;flex-wrap:wrap}
.msghead .msgts{margin-left:auto;color:var(--muted);font-size:var(--fs-xs);font-variant-numeric:tabular-nums}
.msgtext{font-size:var(--fs-md);line-height:1.45;white-space:pre-wrap}

/* ---------- Estimator & lookup ---------- */
.resbox{background:var(--surface-2);border:1px solid var(--line-2);border-left:3px solid var(--navy);
  border-radius:var(--r-sm);padding:10px var(--s3);font-size:var(--fs-md);color:var(--ink-2)}
.resbox b{color:var(--navy);font-variant-numeric:tabular-nums}
.lookupinput{font-family:var(--mono);font-size:var(--fs-xl);font-weight:700;color:var(--navy);text-align:center;
  padding:11px;border:2px solid var(--navy)!important;background:var(--surface-2)}
.lookuptbl{border:1px solid var(--line-2);border-radius:var(--r-sm);overflow:hidden}
.lookuptbl th{background:var(--surface-3);color:var(--ink-2);width:150px;text-align:left;position:static;
  text-transform:none;letter-spacing:0;font-size:var(--fs-md);padding:8px var(--s3);font-weight:700;
  border-right:1px solid var(--line)}
.lookuptbl td{padding:8px var(--s3);border-bottom:1px solid var(--line)}

/* ---------- Login ---------- */
#login{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100;
  padding:var(--s5);overflow:auto;background:var(--bg)}
#login::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,var(--navy) 0,var(--navy) 190px,transparent 190px)}
.loginbox{position:relative;z-index:1;background:var(--surface);color:var(--ink);border:1px solid var(--line-2);
  border-radius:var(--r);padding:var(--s6) var(--s6) var(--s5);width:100%;max-width:390px;
  box-shadow:var(--shadow-3);text-align:center}
.loginbox .logo{width:52px;height:52px;border-radius:var(--r);margin:0 auto var(--s3);background:var(--navy);
  display:grid;place-items:center}
.loginbox .logo svg{width:27px;height:27px;color:#fff}
.loginbox h1{font-family:var(--serif);font-size:23px;color:var(--navy);letter-spacing:.2px}
.loginbox .tag{margin:2px 0 var(--s4);font-size:var(--fs-2xs);color:var(--muted);letter-spacing:1.5px;
  text-transform:uppercase;font-weight:700}
.loginbox label{display:block;text-align:left;font-size:var(--fs-sm);font-weight:700;color:var(--ink-2);
  margin:0 0 4px}
.loginbox .ff{margin-bottom:var(--s3)}
.loginbox input{width:100%;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:10px 12px;
  font-size:var(--fs-base);background:var(--surface);color:var(--ink);transition:border-color .1s,box-shadow .1s}
.loginbox input:focus{outline:none;border-color:var(--steel);box-shadow:var(--focus)}
.loginbox .pwwrap{position:relative}
.loginbox .pwwrap input{padding-right:42px}
.loginbox .pwtoggle{position:absolute;right:5px;top:5px;border:none;background:transparent;cursor:pointer;
  color:var(--muted);padding:6px;border-radius:var(--r-sm);display:grid;place-items:center}
.loginbox .pwtoggle:hover{background:var(--surface-3);color:var(--ink)}
.loginbox .pwtoggle svg{width:16px;height:16px}
.loginbox button[type=submit]{width:100%;margin-top:var(--s1);padding:11px;font-size:var(--fs-lg)}
.lerr{color:var(--bad);font-size:var(--fs-sm);font-weight:600;min-height:17px;margin-bottom:5px}
.loginbox .hint{font-size:var(--fs-sm);color:var(--muted);margin:var(--s3) 0 0}
.lping{font-size:var(--fs-sm);border-radius:var(--r-sm);padding:8px 11px;margin:0 0 var(--s3);
  background:var(--surface-2);color:var(--muted);line-height:1.45;text-align:left;
  border:1px solid var(--line-2);border-left:3px solid var(--muted-2)}
.lping.ok{background:var(--ok-bg);color:var(--ok);font-weight:600;border-color:#c5e0ce;border-left-color:var(--ok)}
.lping.bad{background:var(--bad-bg);color:var(--bad);font-weight:600;border-color:#eec6cb;border-left-color:var(--bad)}
.lping a{color:inherit;text-decoration:underline}
#lbtn[disabled]{opacity:.7;cursor:default}
.lver{font-size:var(--fs-2xs);color:var(--muted-2);margin-top:var(--s3);letter-spacing:.4px}

/* ---------- Printable documents ---------- */
#printview{display:none;position:fixed;inset:0;background:#565d66;overflow:auto;z-index:200;padding:var(--s5)}
#printview .pv-doc{background:#fff;max-width:820px;margin:0 auto;padding:44px 50px;box-shadow:var(--shadow-3)}
.pv-actions{max-width:820px;margin:0 auto var(--s3);display:flex;gap:var(--s2);justify-content:flex-end}
.docpage{font-size:var(--fs-md);color:#1a2233}
.dochead{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px double #1b3355;
  padding-bottom:var(--s3);margin-bottom:var(--s4)}
.docco{font-family:var(--serif);font-size:var(--fs-xl);font-weight:700;color:#1b3355}
.docsub{font-size:var(--fs-sm);letter-spacing:2.4px;color:#697588;font-weight:700;margin-top:3px}
.doclogo{font-family:var(--serif);font-weight:700;color:#1b3355;font-size:var(--fs-md);
  border:1px solid #1b3355;padding:5px 10px}
.docmeta{width:100%;border-collapse:collapse;margin-bottom:var(--s3)}
.docmeta td{border:1px solid #ccd4e0;padding:7px 9px;font-size:var(--fs-sm);vertical-align:top}
.docmeta b{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:.6px;color:#697588;font-weight:700}
.doctwo{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin:5px 0 var(--s3)}
.doctwo h4{margin:0 0 5px;font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.7px;color:#1b3355}
.doctbl{width:100%;border-collapse:collapse}
.doctbl td,.doctbl th{border-bottom:1px solid #e0e5ed;padding:6px 8px;font-size:var(--fs-sm);text-align:left;
  color:#1a2233}
.doctbl .num{text-align:right;font-variant-numeric:tabular-nums}
.doctbl thead th{background:#1b3355;color:#fff;border:none;font-size:var(--fs-2xs);text-transform:uppercase;
  letter-spacing:.6px}
.doctbl .tot td{font-weight:700;border-top:2px solid #1b3355;background:#f2f5f9}
.doctbl.wide{margin:var(--s2) 0 var(--s3)}
.doctbl .pill{background:#eef0f4;color:#3d4859;border-color:#d5dbe4}
.docnet{display:flex;justify-content:space-between;align-items:center;background:#1b3355;color:#fff;
  padding:11px var(--s4);margin:5px 0 var(--s5);font-weight:700;font-size:var(--fs-lg);letter-spacing:.6px}
.docsign{display:flex;justify-content:space-between;margin-top:var(--s8);font-size:var(--fs-sm);color:#444}
.dochx{font-family:var(--serif);margin:var(--s4) 0 5px;color:#1b3355;font-size:var(--fs-base)}
.docfoot{margin-top:var(--s5);border-top:1px solid #e0e5ed;padding-top:var(--s2);font-size:var(--fs-2xs);
  color:#98a2b3;text-align:center}

/* ---------- Dashboard command centre ---------- */
.dash-context{display:flex;align-items:center;gap:9px;background:var(--info-bg);border:1px solid #cfdcee;
  border-left:3px solid var(--info);border-radius:var(--r-sm);padding:8px var(--s3);margin-bottom:var(--s3);
  font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif;font-size:var(--fs-md);color:var(--ink-2)}
.dash-context svg{width:15px;height:15px;flex:none;color:var(--info)}
.dash-context b{color:var(--ink)}
.dash-context small{margin-left:auto;color:var(--muted);white-space:nowrap}
.dash-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3);margin-bottom:var(--s4)}
.dash-metric{position:relative;display:grid;grid-template-rows:20px 39px minmax(18px,1fr);align-items:start;
  min-width:0;min-height:106px;padding:11px var(--s3);text-align:left;background:var(--surface);color:var(--ink);
  border:1px solid var(--line-2);border-top:3px solid var(--steel);border-radius:var(--r-sm);cursor:pointer}
.dash-metric:hover,.dash-risk:hover{background:var(--surface-2);border-color:var(--steel)}
.dash-metric:focus-visible,.dash-risk:focus-visible,.dash-panel-link:focus-visible{outline:2px solid var(--steel);outline-offset:2px}
.dash-metric-label{font:700 var(--fs-xs)/1.2 "Segoe UI Variable Text","Segoe UI",Arial,sans-serif;
  text-transform:uppercase;letter-spacing:.65px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-metric-value{font:700 25px/1.15 "Cascadia Mono",Consolas,monospace;color:var(--navy);
  font-variant-numeric:tabular-nums;letter-spacing:-1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-metric-detail{font:500 var(--fs-sm)/1.35 "Segoe UI Variable Text","Segoe UI",Arial,sans-serif;
  color:var(--muted);padding-right:20px;overflow:hidden;text-overflow:ellipsis}
.dash-metric-arrow{position:absolute;right:var(--s3);bottom:10px;color:var(--steel-ink);font-weight:700}
.dash-metric.tone-ok{border-top-color:var(--ok)}
.dash-metric.tone-ok .dash-metric-value{color:var(--ok)}
.dash-metric.tone-warn{border-top-color:var(--warn)}
.dash-metric.tone-warn .dash-metric-value{color:var(--warn)}
.dash-metric.tone-bad{border-top-color:var(--bad)}
.dash-metric.tone-bad .dash-metric-value{color:var(--bad)}
.dash-metric.tone-info{border-top-color:var(--info)}
.dash-metric.tone-info .dash-metric-value{color:var(--info)}
.dash-work{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(250px,.65fr);gap:var(--s4);margin-bottom:var(--s4)}
.dash-work .panel+.panel,.dash-analytics-grid .panel+.panel{margin-top:0}
.dash-attention .ph h3,.dash-actions .ph h3,.dash-analytics .ph h3{
  font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif;text-align:left}
.dash-risk{display:grid;grid-template-columns:68px minmax(0,1fr) 112px;align-items:center;gap:var(--s3);
  width:100%;min-height:52px;padding:7px var(--s3);border:0;border-bottom:1px solid var(--line);
  background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif}
.dash-risk:last-child{border-bottom:0}
.dash-risk-copy{min-width:0}
.dash-risk-copy b{display:block;overflow-wrap:anywhere}
.dash-risk-copy small{display:block;color:var(--muted);font-size:var(--fs-sm);font-weight:400;margin-top:2px;
  overflow-wrap:anywhere}
.dash-risk-go{text-align:right;color:var(--steel-ink);font-size:var(--fs-sm);font-weight:700}
.dash-healthy{display:flex;align-items:center;gap:var(--s3);min-height:76px;padding:var(--s4);color:var(--ok);
  font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif}
.dash-healthy svg{width:24px;height:24px;flex:none}
.dash-healthy b{display:block;color:var(--ink)}
.dash-healthy span{display:block;color:var(--muted);font-size:var(--fs-sm);margin-top:2px}
.dash-action{font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif;text-align:left}
.dash-panel-link{margin-left:auto;border:0;background:transparent;color:var(--steel-ink);font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif;
  font-size:var(--fs-sm);font-weight:700;text-align:left;cursor:pointer;padding:5px;border-radius:var(--r-sm)}
.dash-panel-link:hover{color:var(--navy);text-decoration:underline}
.dash-analytics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
.dash-analytics{min-width:0}
.dash-bars{height:190px;display:flex;align-items:flex-end;gap:9px;padding:var(--s4) var(--s3) 0}
.dash-bar-group{height:100%;min-width:0;flex:1;display:flex;align-items:flex-end;justify-content:center;gap:2px;
  position:relative;padding-bottom:24px}
.dash-bar-group small{position:absolute;bottom:4px;left:0;right:0;text-align:center;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-size:var(--fs-2xs)}
.dash-bar{display:block;width:calc(50% - 1px);max-width:18px;min-height:2px;background:var(--steel)}
.dash-bar.budget{background:var(--navy)}
.dash-bar.committed{background:var(--accent)}
.dash-bar.cash{width:min(44px,70%)}
.dash-bar.cash.positive{background:var(--ok)}
.dash-bar.cash.negative{background:var(--bad)}

/* ---------- Mobile ---------- */
.menubtn{display:none}
.scrim{display:none;position:fixed;inset:0;background:rgba(22,40,63,.45);z-index:35}
body.navopen .scrim{display:block}

@media(max-width:1180px){ .grid-3{grid-template-columns:1fr} }
@media(max-width:980px){
  :root{--gutter:var(--s4)}
  .sidebar{transform:translateX(-100%);transition:transform .2s ease;box-shadow:var(--shadow-3);width:252px}
  body.navopen .sidebar{transform:none}
  body.railed .sidebar{width:252px}
  body.railed .brand .brandtext,body.railed .nav-group h2,
  body.railed .nav button.navlink .lbl,body.railed .collapsebtn span{display:revert}
  body.railed .nav button.navlink{justify-content:flex-start;padding:7px var(--s2)}
  .main{margin-left:0}
  .menubtn{display:inline-flex}
  .sidefoot{display:none}
  .topbar .crumb b{font-size:var(--fs-lg)}
  .search input{width:148px}
  .kpis{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
  .kpi{border-top:1px solid var(--line)}
  .dash-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dash-work{grid-template-columns:1fr}
}
@media(max-width:720px){
  .topbar{padding:0 6px;gap:3px}
  .topbar .crumb{display:none}
  .topbar [data-act="opencmd"],.topbar .divider{display:none}
  .search{display:none}
  .userchip .who{display:none}
  .userchip{max-width:none;padding:3px}
  .projsel{max-width:70px;padding-left:6px}
  #addBtn{width:33px;padding:7px}
  #addBtnLabel{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .topbar:has(.savestate:not([hidden]):not(:disabled)) .projsel{display:none}
  .savestate[data-state="saved"] .save-label,
  .savestate[data-state="unsaved"] .save-label,
  .savestate[data-state="saving"] .save-label{position:absolute;width:1px;height:1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap}
  .savestate[data-state="saved"],.savestate[data-state="unsaved"],.savestate[data-state="saving"]{
    width:33px;justify-content:center;padding:5px}
  .savebanner{align-items:stretch;flex-direction:column;gap:var(--s2)}
  .savebanner-copy{flex-direction:column;gap:2px}
  .savebanner-actions{display:grid;grid-template-columns:1fr;gap:var(--s2)}
  .savebanner-actions .btn{min-height:44px;width:100%}
  .content{padding:var(--s4) var(--gutter) var(--s7)}
  .modal .mb{padding:var(--s3)}
  .toasts{left:var(--s3);right:var(--s3);bottom:var(--s3)}
  .toast{max-width:none}
  .glabel{width:128px}
  .gmarks{margin-left:128px}
  .dash-context small{display:none}
  .dash-kpis{gap:var(--s2)}
  .dash-metric{min-height:112px;padding:10px;touch-action:manipulation}
  .dash-metric-value{font-size:20px}
  .dash-metric-arrow{right:10px}
  .dash-risk{grid-template-columns:58px minmax(0,1fr);min-height:52px;position:relative}
  .dash-risk-go{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .dash-analytics-grid{grid-template-columns:1fr}
  .dash-action,.dash-panel-link{min-height:44px}
}

/* ---------- Print ---------- */
@media print{
  .sidebar,.topbar,.toolbar,.rowact,.no-print,.scrim,.toasts,.robanner{display:none!important}
  .main{margin:0}
  .content{padding:0;max-width:none}
  .panel{box-shadow:none;border:1px solid #bbb;break-inside:avoid}
  .tablewrap{max-height:none;overflow:visible}
  thead th{background:#1b3355!important;color:#fff!important;
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.showprint>*:not(#printview){display:none!important}
  body.showprint #printview{position:static;background:#fff;padding:0;display:block}
  body.showprint #printview .pv-actions{display:none}
  body.showprint #printview .pv-doc{box-shadow:none;max-width:none;margin:0;padding:0}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
.brand .logo img, #login .logo img { width: 100%; height: 100%; object-fit: contain; border-radius: inherit; }
.company-logo-preview { display: block; max-width: 220px; max-height: 120px; object-fit: contain; border: 1px solid var(--line, #d9e0e8); border-radius: 8px; padding: 8px; background: #fff; }