
/* Layout: fixed left navigation rail (navy) + scrolling work area; top bar carries scenario, currency, gate and headline price. */
:root{
  --navy:#1F3864; --navy-2:#2B4A80; --gold:#C9A227; --gold-soft:#F3E7BF;
  --bg:#F5F6F9; --surface:#FFFFFF; --surface-2:#EEF1F6; --line:#D9DEE8; --fg:#1B2333; --muted:#5E6A80;
  --ok:#1E7B4A; --ok-bg:#DDF2E6; --warn:#8A5A00; --warn-bg:#FCEFC7; --bad:#B42318; --bad-bg:#FDE3E0; --mute-bg:#E8EBF0;
  --cM:#B42318; --cC:#9A6B00; --cO:#2F5597; --chg:#FFF4D1;
  --rail:#1F3864; --rail-fg:#DCE4F2; --rail-on:#C9A227;
  --f-display:"Archivo", "Arial Narrow", Arial, sans-serif;
  --f-body:"Carlito", Calibri, "Segoe UI", Arial, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, Consolas, monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0F1522; --surface:#171F30; --surface-2:#1E2840; --line:#2C3754; --fg:#E6EAF2; --muted:#9AA6BD;
  --ok:#5FD39A; --ok-bg:#163A2A; --warn:#F2C66B; --warn-bg:#3A2F12; --bad:#FF8A7E; --bad-bg:#43201E; --mute-bg:#242E45;
  --cM:#FF8A7E; --cC:#F2C66B; --cO:#8FB2F0; --chg:#3A3215; --gold-soft:#3A3215;
  --rail:#0B1220; --rail-fg:#B9C5DC; --navy-2:#8FB2F0; color-scheme: dark; } }
:root[data-theme="dark"]{
  --bg:#0F1522; --surface:#171F30; --surface-2:#1E2840; --line:#2C3754; --fg:#E6EAF2; --muted:#9AA6BD;
  --ok:#5FD39A; --ok-bg:#163A2A; --warn:#F2C66B; --warn-bg:#3A2F12; --bad:#FF8A7E; --bad-bg:#43201E; --mute-bg:#242E45;
  --cM:#FF8A7E; --cC:#F2C66B; --cO:#8FB2F0; --chg:#3A3215; --gold-soft:#3A3215;
  --rail:#0B1220; --rail-fg:#B9C5DC; --navy-2:#8FB2F0; color-scheme: dark; }
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:15px;line-height:1.45;margin:0}
.app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
aside{background:var(--rail);color:var(--rail-fg);position:sticky;top:0;height:100vh;overflow:auto;padding-block:18px;padding-inline:12px}
.brand{font-family:var(--f-display);font-weight:800;letter-spacing:.06em;color:#fff;font-size:15px;padding:0 8px}
.brand small{display:block;font-weight:500;letter-spacing:.02em;color:var(--rail-on);font-size:12px;margin-top:2px}
.navgroup{margin-top:18px}
.navlabel{font-size:11px;text-transform:uppercase;letter-spacing:.12em;opacity:.65;padding:0 8px 6px}
.navbtn{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;background:none;border:0;color:inherit;font:inherit;padding:7px 10px;border-radius:6px;cursor:pointer;border-left:3px solid transparent}
.navbtn:hover{background:rgba(255,255,255,.07)}
.navbtn.on{background:rgba(201,162,39,.16);border-left-color:var(--rail-on);color:#fff;font-weight:700}
.navbtn:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.lock{font-family:var(--f-mono);font-size:9px;border:1px solid currentColor;border-radius:3px;padding:0 3px;opacity:.7}
.wrap{min-width:0;display:flex;flex-direction:column}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;padding-block:10px;padding-inline:20px}
.top label{display:flex;flex-direction:column;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);gap:2px}
.top select{min-width:0;max-width:300px}
.gate{font-family:var(--f-display);font-weight:800;letter-spacing:.08em;font-size:13px;padding:6px 12px;border-radius:5px}
.g-RED.gate{background:var(--bad);color:#fff}.g-AMBER.gate{background:#E0A100;color:#1B1300}.g-GREEN.gate{background:#1E7B4A;color:#fff}
#headline{margin-left:auto;font-size:15px}
#headline b{font-family:var(--f-mono);font-size:17px}
.tog{display:flex!important;flex-direction:row!important;align-items:center;gap:6px;text-transform:none!important;letter-spacing:0!important;font-size:14px!important;color:var(--fg)!important}
#navsel{display:none}
main{padding-block:22px 48px;padding-inline:24px;max-width:1400px;width:100%}
h2{font-family:var(--f-display);font-size:26px;font-weight:700;margin:0 0 6px;text-wrap:balance;color:var(--fg)}
h3{font-family:var(--f-display);font-size:15px;font-weight:700;margin:0 0 10px;letter-spacing:.01em}
h4{font-family:var(--f-display);font-size:13px;margin:14px 0 6px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.subh{margin:18px 0 8px}
.lede{color:var(--muted);max-width:75ch;margin:0 0 16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:16px;min-width:0}
.card.mini{margin:0}
details.card>summary{cursor:pointer;font-family:var(--f-display);font-weight:700}
details.card[open]>summary{margin-bottom:10px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.grid2>.card{margin-bottom:0}.grid2{margin-bottom:16px}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:16px}
.tw{overflow-x:auto;max-width:100%}
table{border-collapse:collapse;width:100%;font-size:14px}
th{font-family:var(--f-display);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;text-align:left;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:2px solid var(--line);white-space:nowrap;background:var(--surface)}
td{padding:6px 8px;border-bottom:1px solid var(--line);vertical-align:top}
tr.dim td{color:var(--muted)}
tr.r-miss td{background:var(--bad-bg)}
tr.tot td{font-weight:700;background:var(--surface-2)}
tr.grand td{font-weight:700;background:var(--gold-soft);border-top:2px solid var(--gold)}
.num,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
td.num{text-align:right;white-space:nowrap}
.c{text-align:center}
.sm{font-size:12.5px}
.muted{color:var(--muted)}
.pl{font-weight:700}
.why{font-size:12.5px;color:var(--muted);max-width:52ch}
select,input{font:inherit;font-size:14px;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:5px 7px;max-width:100%}
td.ctl select,td.ctl input{width:100%;min-width:150px}
td.sm-ctl input{min-width:80px}
table.master td.ctl input{min-width:90px;width:110px}
input.chg{background:var(--chg);border-color:var(--gold)}
input:disabled,select:disabled{opacity:.75;background:var(--surface-2)}
.pctwrap{display:flex;align-items:center;gap:4px}.pctwrap input{min-width:70px!important}.pctwrap i{font-style:normal;color:var(--muted)}
.pill{display:inline-block;font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px;background:var(--mute-bg);color:var(--muted);white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.warn{background:var(--warn-bg);color:var(--warn)}.pill.bad{background:var(--bad-bg);color:var(--bad)}
.cls{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:4px;font-family:var(--f-mono);font-weight:500;font-size:12px;border:1.5px solid}
.cls-M{color:var(--cM)}.cls-C{color:var(--cC)}.cls-O{color:var(--cO)}
.btn{font:inherit;font-weight:700;background:var(--navy);color:#fff;border:0;border-radius:6px;padding:8px 14px;cursor:pointer}
.btn:hover{filter:brightness(1.12)}
.btn.sm{font-size:13px;padding:5px 10px}
.btn.ghost{background:transparent;color:var(--navy-2);border:1px solid var(--line)}
.btn.bad{background:var(--bad)}
.btn.gold{background:var(--gold);color:#1B1300}
.btn:disabled{opacity:.5;cursor:not-allowed}
.qtop{justify-content:flex-end;margin-bottom:10px}
#toppdf[hidden]{display:none}
.note{background:var(--gold-soft);border:1px solid var(--gold);border-radius:6px;padding:10px 12px;margin-bottom:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.alert{background:var(--bad-bg);color:var(--bad);border-radius:6px;padding:10px 12px;margin-bottom:14px;font-weight:700}
.ok-t{color:var(--ok);font-weight:700}.bad-t{color:var(--bad);font-weight:700}.warn-t{color:var(--warn)}
.sumbar{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:14px}
.sumbar b{font-family:var(--f-mono)}
.legend{display:flex;gap:6px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:12.5px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.chip{font-size:13px;text-decoration:none;color:var(--navy-2);border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:3px 11px}
.hero{display:flex;gap:20px;align-items:center;border-radius:10px;padding:18px 22px;margin-bottom:16px;background:var(--surface);border:1px solid var(--line);border-left:8px solid var(--muted)}
.hero.g-RED{border-left-color:var(--bad)}.hero.g-AMBER{border-left-color:#E0A100}.hero.g-GREEN{border-left-color:#1E7B4A}
.hero p{margin:0;max-width:70ch}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.big{font-family:var(--f-display);font-weight:800;font-size:34px;letter-spacing:.04em;line-height:1}
.hero.g-RED .big{color:var(--bad)}.hero.g-AMBER .big{color:var(--warn)}.hero.g-GREEN .big{color:var(--ok)}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;min-width:0}
.tile span{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.tile b{font-size:20px;font-family:var(--f-display)}
.tile b.num{font-family:var(--f-mono);font-size:19px}
.tile small{color:var(--muted);font-size:12.5px}
.kv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:0;margin:0}
.kv dt,.kv dd{margin:0;padding:6px 0;border-bottom:1px solid var(--line)}
.kv dt{color:var(--muted);padding-right:10px}
.kv dd{text-align:right;font-size:14px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.bars{display:flex;flex-direction:column;gap:8px}
.bar{display:grid;grid-template-columns:minmax(0,170px) minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13.5px}
.bt{height:14px;background:var(--surface-2);border-radius:3px;overflow:hidden}
.bf{display:block;height:100%;background:var(--navy-2);border-radius:3px}
.bf.alt{background:var(--gold)}
.bv{font-size:13px;min-width:90px;text-align:right}
.romline{font-size:20px;margin:0}
.romres{font-family:var(--f-mono);font-size:28px;font-weight:500;color:var(--fg);margin:4px 0}
.result{border-top:4px solid var(--gold)}
.riskbig .pill{font-size:18px;padding:6px 16px;margin-bottom:10px}
.list{margin:0;padding-left:18px}.list li{margin:3px 0}
.mgmt{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.mgmt label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.mgmt input{background:var(--chg);border-color:var(--gold)}
.intbadge{font-family:var(--f-mono);font-size:11px;vertical-align:middle;color:var(--bad);border:1px solid var(--bad);border-radius:4px;padding:2px 6px;margin-left:8px}
textarea{width:100%;font-family:var(--f-mono);font-size:12px;background:var(--surface-2);color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:8px;margin:8px 0}
.qdoc{max-width:1000px}
.qhead{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;background:var(--navy);color:#fff;border-bottom:5px solid var(--gold);border-radius:8px 8px 0 0;padding:18px 20px}
.qbrand{font-family:var(--f-display);font-weight:800;letter-spacing:.12em;font-size:22px}
.qsub{color:var(--gold);font-weight:700}
.qconf{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;border:1px solid var(--gold);color:var(--gold);padding:3px 8px;border-radius:3px}
.qmeta{background:var(--surface);border:1px solid var(--line);border-top:0;border-radius:0 0 8px 8px;padding:6px 18px 10px;margin-bottom:16px}
.qmeta .kv{grid-template-columns:repeat(3,minmax(0,.7fr) minmax(0,1fr))}
.qmeta .kv dd{text-align:left}
.sign{margin-top:18px}
.qact{display:flex;gap:10px;align-items:center}
table.just td{min-width:110px}
@media (max-width:1100px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  aside{display:none}
  #navsel{display:block;width:100%}
  .top{padding-inline:16px}
  main{padding-inline:16px}
  .grid2{grid-template-columns:1fr}
  #headline{margin-left:0;width:100%}
  .qmeta .kv{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
  .bar{grid-template-columns:minmax(0,110px) minmax(0,1fr) auto}
}
@media (max-width:520px){.tiles{grid-template-columns:1fr}.hero{flex-direction:column;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---- application additions ---- */
.loginbody{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:linear-gradient(160deg,var(--rail) 0 38%,var(--bg) 38%)}
.loginbox{width:min(400px,100%);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:26px;display:flex;flex-direction:column;gap:12px;box-shadow:0 10px 30px rgba(15,21,34,.18)}
.loginbox.wide{width:min(620px,100%)}
.loginbox h1{font-family:var(--f-display);font-size:22px;margin:4px 0 0}
.loginbox label,.form label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.loginbox input,.form input,.form select{font-size:15px;padding:8px 10px}
.loginbrand{font-family:var(--f-display);font-weight:800;letter-spacing:.08em;color:var(--navy-2);font-size:16px;border-bottom:3px solid var(--gold);padding-bottom:8px}
.loginbrand small{display:block;font-weight:500;letter-spacing:.02em;color:var(--muted);font-size:12px}
fieldset{border:1px solid var(--line);border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:10px}
legend{font-family:var(--f-display);font-weight:700;padding:0 6px}
code{font-family:var(--f-mono);font-size:13px;background:var(--surface-2);padding:1px 5px;border-radius:4px}
.who{margin-top:24px;padding:12px 10px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;display:flex;flex-direction:column;gap:2px}
.who b{color:#fff}.who span{opacity:.7;margin-bottom:6px}
.linkbtn{background:none;border:0;color:var(--rail-on);font:inherit;padding:0;cursor:pointer;text-decoration:underline}
.qbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-right:8px;border-right:1px solid var(--line)}
.qref{font-family:var(--f-mono);font-weight:500;font-size:14px}
.dirty{color:var(--warn);font-size:12.5px;font-weight:700}
.saved{color:var(--muted);font-size:12.5px}
#toast{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:20;display:flex;flex-direction:column;gap:8px;max-width:min(420px,calc(100vw - 32px))}
.toast{background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:8px;font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.toast.err{background:var(--bad);color:#fff}
.st-Draft{background:var(--mute-bg);color:var(--muted)}.st-Submitted{background:var(--warn-bg);color:var(--warn)}.st-Approved,.st-Won{background:var(--ok-bg);color:var(--ok)}
.st-Issued{background:#DCE6F7;color:#1F3864}.st-Lost,.st-Cancelled{background:var(--bad-bg);color:var(--bad)}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.toolbar input[type=search]{min-width:220px;flex:1 1 240px;max-width:420px}
.pipe{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:16px}
.pipe .tile b{font-size:18px}
.rowbtns{display:flex;gap:6px;flex-wrap:wrap}
tr.clickable{cursor:pointer}tr.clickable:hover td{background:var(--surface-2)}
.lockbar{background:var(--surface-2);border:1px solid var(--line);border-left:5px solid var(--navy-2);border-radius:6px;padding:10px 12px;margin-bottom:14px}
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;align-items:end}
