:root{--navy:#1F3864;--orange:#F28C28;--blue:#2F75B5;--red:#C00000;--redbg:#FFC7CE;--redtx:#9C0006;--amb:#FFEB9C;--ambtx:#9C5700;--grn:#C6EFCE;--grntx:#006100;--grey:#f3f4f6;--line:#d9dde3;--tx:#1b1f24;--mut:#667085}
*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arial,sans-serif;font-size:14px;color:var(--tx);background:#f6f7f9}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
header{background:var(--navy);color:#fff;display:flex;align-items:center;gap:6px;padding:0 14px;flex-wrap:wrap;position:sticky;top:0;z-index:5}
header .brand{display:flex;align-items:center;gap:9px;margin-right:16px;padding:9px 0;color:#fff;text-decoration:none}header .brand:hover{text-decoration:none}
.wm{font-family:'Archivo','Segoe UI',Arial,sans-serif;letter-spacing:.5px}header .brand .wm{font-size:17px;font-weight:800;white-space:nowrap;letter-spacing:1.6px}header .brand .wm b{font-weight:500;color:#F9B26B}
header nav a{color:#dbe4f3;padding:14px 10px;display:inline-block;font-weight:600}
header nav a{border-bottom:3px solid transparent;padding-bottom:11px}header nav a.on,header nav a:hover{color:#fff;background:rgba(255,255,255,.12);text-decoration:none}header nav a.on{border-bottom-color:var(--orange)}
header .me{margin-left:auto;font-size:13px;color:#dbe4f3}header .me a{color:#fff;margin-left:8px}
main{padding:14px 38px;max-width:none;margin:0}@media(max-width:900px){main{padding:12px 12px}}
h1{font-size:22px;margin:4px 0 12px;color:var(--navy)}h2{font-size:16px;margin:22px 0 8px;color:var(--navy)}h3{font-size:14px;margin:14px 0 6px}
.flash{padding:10px 14px;border-radius:6px;margin-bottom:10px;font-weight:600}.flash.red{background:var(--redbg);color:var(--redtx)}.flash.green{background:var(--grn);color:var(--grntx)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.tile{border-radius:8px;padding:12px;color:#fff;background:var(--navy)}.tile .v{font-size:24px;font-weight:700;margin-top:4px}.tile .l{font-size:12px;opacity:.9}
.tile.ok{background:#548235}.tile.bad{background:var(--red)}.tile.warn{background:#BF8F00}
table{border-collapse:collapse;width:100%;background:#fff}th,td{border:1px solid var(--line);padding:6px 7px;text-align:left;vertical-align:top}
th{background:#eef1f5;font-size:12px;color:#344054;white-space:nowrap}td.n,th.n{text-align:right;white-space:nowrap}
.wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:8px}.wrap table{border:0}
.chip{display:inline-block;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:700;white-space:nowrap}
.red{background:var(--redbg);color:var(--redtx)}.amber{background:var(--amb);color:var(--ambtx)}.green{background:var(--grn);color:var(--grntx)}.grey{background:var(--grey);color:#555}
td.red,td.amber,td.green{font-weight:600}
ul.al{margin:0;padding-left:16px}ul.al li{margin:1px 0}li.red{color:var(--redtx);background:none;font-weight:700}li.amber{color:var(--ambtx);background:none}
.card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:14px;margin-bottom:14px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.grid2,.grid3{grid-template-columns:1fr}}
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px 14px}
label{display:block;font-size:12px;color:var(--mut);font-weight:600;margin-bottom:3px}
input,select,textarea{width:100%;padding:7px 8px;border:1px solid #c7cdd6;border-radius:6px;font:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid #9ec1ea;border-color:var(--blue)}
textarea{min-height:60px}
button,.btn{background:var(--blue);color:#fff;border:0;border-radius:6px;padding:8px 14px;font-weight:700;cursor:pointer;display:inline-block}
.btn.sec,button.sec{background:#e7ecf3;color:var(--navy)}button.del{background:#fff;color:var(--red);border:1px solid var(--red)}
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--line);margin:10px 0 14px;flex-wrap:wrap}
.tabs a{padding:8px 12px;border-radius:6px 6px 0 0;font-weight:700;color:#475467}.tabs a.on{background:#fff;border:2px solid var(--line);border-bottom:2px solid #fff;margin-bottom:-2px;color:var(--navy)}
.muted{color:var(--mut);font-size:12px}.right{text-align:right}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.kv{display:grid;grid-template-columns:170px 1fr;gap:4px 10px}.kv div:nth-child(odd){color:var(--mut)}
.msg{border-left:3px solid var(--blue);background:#f8fafc;padding:6px 10px;margin:6px 0;border-radius:4px}.msg.done{opacity:.55}
.copy{background:#eef6ee;border:1px dashed #7aa874;padding:8px;border-radius:6px;font-size:13px}
.bar{height:12px;display:inline-block;vertical-align:middle}
.small{font-size:12px}.nowrap{white-space:nowrap}
.subnav{display:flex;gap:4px;flex-wrap:wrap;align-items:center;margin:-4px 0 14px;border-bottom:2px solid var(--line)}
.subnav a{padding:8px 10px;font-weight:600;color:#344054;border-bottom:3px solid transparent;margin-bottom:-2px}
.subnav a.on{color:var(--navy);border-bottom-color:var(--navy)}.subnav a:hover{text-decoration:none;background:#eef1f5}
.tile.soap{background:#1B7F79}.tile.powder{background:#C55A11}.tile.gp{background:#375623}.tile.cost{background:#C00000}.tile.sales{background:#2E75B6}
td.neg,span.neg{color:var(--redtx);font-weight:700}td.b{font-weight:700}tr.tot td{background:#E2EFDA;font-weight:700}
input.sm{width:90px;padding:4px 6px;text-align:right}input.md{width:130px;padding:4px 6px}td.inp{background:#FFF9E6}
.stack{display:flex;height:22px;border-radius:4px;overflow:hidden;min-width:260px}.stack span{display:block;height:100%}
.legend span{display:inline-block;width:10px;height:10px;margin:0 4px 0 10px;vertical-align:middle}
.flash.amber{background:var(--amb);color:var(--ambtx)}
/* excel-like tables */
.wrap.tall{max-height:78vh;overflow:auto}
table.xl{font-size:12.5px;border-collapse:separate;border-spacing:0}
table.xl th,table.xl td{white-space:nowrap;padding:4px 8px;border:0;border-right:1px solid #e3e7ee;border-bottom:1px solid #e3e7ee}
table.xl thead th{position:sticky;top:0;z-index:3;background:#1F3864;color:#fff;font-size:11.5px;text-align:center;vertical-align:middle;line-height:1.25}
table.xl tbody tr:nth-child(even) td{background:#f2f5fa}
table.xl tbody tr:nth-child(odd) td{background:#fff}
table.xl tbody tr:hover td{background:#e3ecf8}
table.xl td.inp,table.xl tbody tr td.inp{background:#FFF2CC}
table.xl td.inp input,table.xl td.inp select{background:#FFF9E6;border:1px solid #e6cf85}
table.xl tr.cat td{background:#D9E1F2!important;font-weight:700;color:#1F3864}
table.xl tr.sec td{background:#1F3864!important;color:#fff;font-weight:700;font-size:11.5px}
table.xl tr.tot td{background:#E2EFDA!important;font-weight:700}
table.xl tr.big td{background:#C6EFCE!important;font-weight:800;font-size:13.5px}
table.xl td.sticky,table.xl th.sticky{position:sticky;left:0;z-index:2}
table.xl thead th.sticky{z-index:4}
table.xl tbody td.sticky{box-shadow:2px 0 0 #d0d6df}
table.xl input.sm{width:78px}table.xl input.xs{width:58px;padding:3px 5px;text-align:right}
.u{color:#667085;font-size:11px;margin-left:2px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 10px}.chips a{padding:5px 12px;border-radius:16px;background:#e7ecf3;color:#1F3864;font-weight:700;font-size:13px}
.chips a.on{background:#1F3864;color:#fff}.chips a:hover{text-decoration:none;filter:brightness(.95)}
.qbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin-bottom:12px}
.qbar input{width:80px;padding:4px 6px;text-align:right;background:#FFF2CC;border-color:#e6cf85}.qbar label{font-weight:700;font-size:13px}
.star{color:#BF8F00;font-size:14px}
.sheettabs{display:flex;gap:3px;flex-wrap:wrap;margin:8px 0}.sheettabs a{padding:3px 8px;border:1px solid #c7cdd6;border-radius:4px 4px 0 0;font-size:12px;background:#f3f4f6;color:#344054}
.sheettabs a.on{background:#1F3864;color:#fff;border-color:#1F3864}
.kv{display:grid;grid-template-columns:auto auto;gap:4px 14px;align-items:center}.kv b{color:#1F3864}
table.xl input,table.xl select{padding:2px 5px;font-size:12.5px;height:24px}
table.xl td{vertical-align:middle}

/* user menu (top right) */
header details.me{position:relative;margin-left:auto}
header details.me summary{list-style:none;cursor:pointer;color:#fff;font-weight:700;font-size:13px;padding:6px 12px;border-radius:16px;background:rgba(255,255,255,.12)}
header details.me summary::-webkit-details-marker{display:none}
header details.me summary:hover,header details.me[open] summary{background:rgba(255,255,255,.25)}
header details.me .menu{position:absolute;right:0;top:36px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(16,24,40,.18);min-width:210px;z-index:50;padding:6px 0}
header details.me .menu a{display:block;margin:0;padding:9px 16px;color:#1F3864;font-weight:600;font-size:14px}
header details.me .menu a:hover{background:#eef3fa;text-decoration:none}
header details.me .menu a.out{border-top:1px solid var(--line);color:#C00000;margin-top:4px}
header details.me .who{padding:8px 16px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;color:#1F3864;font-weight:800;font-size:14px}
header details.me .who span{display:block;font-weight:400;font-size:12px;color:#667085}

/* login */
.card.login{max-width:380px;margin:80px auto;padding:30px 30px 26px;border-top:5px solid var(--orange)}
.login-logo{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:10px}
.login-logo .w1{font-size:32px;font-weight:800;color:var(--navy);line-height:1;letter-spacing:.06em;margin-right:-.06em}
.login-logo .w2{font-size:21.5px;font-weight:500;color:var(--orange);letter-spacing:.05em;margin-right:-.05em;line-height:1.05}

/* ================= dark mode (chosen in the user menu; saved in this browser) ================= */
html[data-theme=dark]{color-scheme:dark;--tx:#e6e9ef;--mut:#9aa4b5;--line:#2e3648;--grey:#262d3a;--blue:#7cb0ff;--redbg:#4a1d22;--redtx:#ffb3b8;--amb:#44391a;--ambtx:#ffd98a;--grn:#1d3d27;--grntx:#9fe0b0}
html[data-theme=dark] body{background:#0f131a}
html[data-theme=dark] h1,html[data-theme=dark] h2,html[data-theme=dark] .kv b{color:#b9d1ff}
html[data-theme=dark] .card,html[data-theme=dark] .wrap,html[data-theme=dark] table,html[data-theme=dark] .qbar,html[data-theme=dark] .fbar,html[data-theme=dark] .sg-box{background:#171c26;border-color:var(--line)}
html[data-theme=dark] th{background:#1f2634;color:#c9d1de}
html[data-theme=dark] input,html[data-theme=dark] select,html[data-theme=dark] textarea{background:#0f141c;border-color:#3a4456;color:var(--tx)}
html[data-theme=dark] input::placeholder{color:#6f7a8c}
html[data-theme=dark] .btn.sec,html[data-theme=dark] button.sec,html[data-theme=dark] .plus-btn{background:#263349;color:#d6e2f5;border-color:#3a4456}
html[data-theme=dark] button.del{background:transparent}
html[data-theme=dark] .tabs a{color:#aab4c4}html[data-theme=dark] .tabs a.on{background:#171c26;border-color:var(--line);border-bottom-color:#171c26;color:#fff}
html[data-theme=dark] .chips a{background:#263349;color:#d6e2f5}html[data-theme=dark] .chips a.on{background:#F28C28;color:#1b1f24}
html[data-theme=dark] .subnav a{color:#c9d1de}html[data-theme=dark] .subnav a.on{color:#fff;border-bottom-color:#F28C28}html[data-theme=dark] .subnav a:hover{background:#1f2634}
html[data-theme=dark] .sheettabs a{background:#1f2634;color:#c9d1de;border-color:#3a4456}
html[data-theme=dark] .msg{background:#1a2130}html[data-theme=dark] .copy{background:#18291d;border-color:#3f6b44}
html[data-theme=dark] .grey{color:#c9d1de}
html[data-theme=dark] table.xl th,html[data-theme=dark] table.xl td{border-color:#2a3242}
html[data-theme=dark] table.xl tbody tr:nth-child(even) td{background:#1a202b}
html[data-theme=dark] table.xl tbody tr:nth-child(odd) td{background:#161b24}
html[data-theme=dark] table.xl tbody tr:hover td{background:#22314a}
html[data-theme=dark] table.xl tr.cat td{background:#24324d!important;color:#cfe0ff}
html[data-theme=dark] table.xl tr.tot td,html[data-theme=dark] tr.tot td{background:#1f3a2a!important}
html[data-theme=dark] table.xl tr.big td{background:#1e4a2c!important}
html[data-theme=dark] td.inp,html[data-theme=dark] table.xl td.inp,html[data-theme=dark] table.xl tbody tr td.inp{background:#3a3320}
html[data-theme=dark] table.xl td.inp input,html[data-theme=dark] table.xl td.inp select,html[data-theme=dark] .qbar input{background:#2c2718;border-color:#6b5a2a}
html[data-theme=dark] table.xl tbody td.sticky{box-shadow:2px 0 0 #2a3242}
html[data-theme=dark] .u{color:#8a95a8}
/* light backgrounds written directly on page elements */
html[data-theme=dark] [style*="background:#fff" i],html[data-theme=dark] [style*="background: #fff" i],html[data-theme=dark] [style*="background:#fa" i],html[data-theme=dark] [style*="background:#f7" i],html[data-theme=dark] [style*="background:#f6" i],html[data-theme=dark] [style*="background:#f3" i],html[data-theme=dark] [style*="background:#f2" i],html[data-theme=dark] [style*="background:#ee" i]{background:#171c26!important}
html[data-theme=dark] [style*="background:#fff1f1" i]{background:#3a1f24!important}
html[data-theme=dark] [style*="background:#fff9e6" i],html[data-theme=dark] [style*="background:#ffd966" i]{background:#3a3320!important;color:#ffe3a3}
html[data-theme=dark] [style*="background:#e7ecf3" i],html[data-theme=dark] [style*="background:#eaf6ea" i]{background:#263349!important}
html[data-theme=dark] [style*="background:#dbe8f7" i],html[data-theme=dark] [style*="background:#9dc3e6" i]{background:#22406b!important;color:#e6efff}
html[data-theme=dark] [style*="color:#1F3864" i],html[data-theme=dark] [style*="color: #1F3864" i],html[data-theme=dark] [style*="color:#222" i],html[data-theme=dark] [style*="color:#2F5597" i]{color:#b9d1ff!important}
/* user menu + login */
html[data-theme=dark] header details.me .menu{background:#171c26;border-color:var(--line)}
html[data-theme=dark] header details.me .menu a,html[data-theme=dark] header details.me .who{color:#d6e2f5}
html[data-theme=dark] header details.me .menu a:hover{background:#22314a}
html[data-theme=dark] header details.me .menu a.out{color:#ff8f8f}
html[data-theme=dark] .login-logo .w1{color:#fff}
html[data-theme=dark] header{background:#131a2a;box-shadow:0 1px 0 #2a3242}

/* light / dark switch in the user menu */
.theme{display:flex;align-items:center;gap:8px;padding:8px 16px;border-top:1px solid var(--line);margin-top:4px;font-size:12px;color:var(--mut);font-weight:600}
.theme .seg{display:flex;margin-left:auto;background:#eef1f5;border-radius:16px;padding:2px}
.theme .seg button{background:transparent;color:#475467;border:0;border-radius:14px;padding:4px 11px;font-size:12px;font-weight:700;cursor:pointer}
.theme .seg button.on{background:#1F3864;color:#fff}
html[data-theme=dark] .theme .seg{background:#0f141c}html[data-theme=dark] .theme .seg button{color:#aab4c4}html[data-theme=dark] .theme .seg button.on{background:#F28C28;color:#1b1f24}
/* dark: page-specific pieces */
html[data-theme=dark] button:not([class]),html[data-theme=dark] .btn:not(.sec){background:#2F75B5;color:#fff}
html[data-theme=dark] [style*="color:var(--navy)"]{color:#b9d1ff!important}
html[data-theme=dark] table.shp tr:nth-child(even) td{background:#1a202b}
html[data-theme=dark] .ans,html[data-theme=dark] .kp>div,html[data-theme=dark] .stackc,html[data-theme=dark] .boeq,html[data-theme=dark] .plus-pop,html[data-theme=dark] .kpi .tip{background:#171c26;border-color:var(--line);color:var(--tx)}
html[data-theme=dark] .chips a[href]{border-color:#3a4456}
html[data-theme=dark] .sg-box div.on,html[data-theme=dark] .sg-box div:hover,html[data-theme=dark] .plus-btn:hover{background:#22314a}
html[data-theme=dark] .sg-box b,html[data-theme=dark] .kp .v,html[data-theme=dark] .kpi .tip b{color:#b9d1ff}
html[data-theme=dark] .sg-note{background:#3a3320;color:#ffe3a3}
html[data-theme=dark] .leg{color:#c9d1de}
html[data-theme=dark] .kpi .i:hover,html[data-theme=dark] .kpi .i.open{background:#fff;color:#1F3864}
html[data-theme=dark] .hbtn{background:#263349;color:#d6e2f5}
html[data-theme=dark] tr.hrow>td{background:#131820!important}
html[data-theme=dark] .src.ICUMS{background:#22406b;color:#e6efff}html[data-theme=dark] .src.LINE{background:#163f39;color:#bdeee4}html[data-theme=dark] .src.person{background:#2a303c;color:#c9d1de}
html[data-theme=dark] table.shp .dt span{color:#7d8799}
html[data-theme=dark] .red{background:var(--redbg)}html[data-theme=dark] .amber{background:var(--amb)}html[data-theme=dark] .green{background:var(--grn)}
html[data-theme=dark] li.red,html[data-theme=dark] li.amber{background:none}
html[data-theme=dark] [style*="background:#f1" i],html[data-theme=dark] [style*="background:#f4" i],html[data-theme=dark] [style*="background:#f5" i],html[data-theme=dark] [style*="background:#f8" i],html[data-theme=dark] [style*="background:#f9" i],html[data-theme=dark] [style*="background:#fb" i],html[data-theme=dark] [style*="background:#fc" i]{background:#171c26!important}
html[data-theme=dark] [style*="background:#C6EFCE" i],html[data-theme=dark] [style*="background:#E2EFDA" i]{background:#1d3d27!important}
html[data-theme=dark] [style*="background:#dfe4ea" i]{background:#2e3648!important}
html[data-theme=dark] [style*="border:1px solid #dfe4ea" i]{border-color:#2e3648!important}

/* tables fit the page: headers wrap instead of pushing the table wider */
table.xl thead th{white-space:normal}
.wrap{overflow-x:auto}

/* column titles in the middle – everywhere */
thead th,tr:not(:has(td)) > th{text-align:center !important;vertical-align:middle !important}