/* Process BI brand theme - one theme for every dashboard (light + dark) */
:root{--bg:#FFFFFF;--card:#FFFFFF;--text:#0F1B33;--muted:#64748B;--accent:#2E6BF6;--line:rgba(15,27,51,.10);--good:#138a4b;--bad:#c8372d;--shadow:0 1px 2px rgba(10,20,40,.06)}
html[data-theme=dark]{--bg:#0A1220;--card:#121C31;--text:#E8EEF9;--muted:#8DA0C4;--accent:#46D5FF;--line:rgba(255,255,255,.10);--good:#2fe0a0;--bad:#ff7a7a;--shadow:none}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
body{padding:12px 16px 28px}
#app{max-width:1500px;margin:0 auto;min-width:900px}
.canvas{position:relative;width:100%;aspect-ratio:1280/720;--u:1px}
.hdr{position:absolute;left:0;top:0;width:100%;height:calc(60*var(--u));display:flex;align-items:center;gap:calc(12*var(--u));padding:0 calc(14*var(--u))}
.logo{height:calc(48*var(--u));width:auto;flex:none}
.ttl{flex:1;min-width:0}
.ttl h1{margin:0;font-size:calc(21*var(--u));font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ttl p{margin:calc(1*var(--u)) 0 0;font-size:calc(11.5*var(--u));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tools{display:flex;gap:calc(8*var(--u));flex:none}
.btn{font:inherit;font-size:calc(11.5*var(--u));color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:calc(8*var(--u));padding:calc(6*var(--u)) calc(11*var(--u));cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--accent);color:var(--accent)} .btn.sm{font-size:calc(10*var(--u));padding:calc(3*var(--u)) calc(8*var(--u))}
/* rail chrome */
.canvas.rail .hdr{width:calc(204*var(--u));height:auto;flex-wrap:wrap;align-content:flex-start;padding:calc(12*var(--u)) calc(12*var(--u)) 0}
.canvas.rail .ttl{flex:1 1 100%;margin-top:calc(2*var(--u))} .canvas.rail .ttl h1{font-size:calc(16*var(--u));white-space:normal}
.canvas.rail .ttl p{white-space:normal;font-size:calc(10.5*var(--u))}
.canvas.rail .tools{flex-wrap:wrap;flex:1 1 100%;margin-top:calc(4*var(--u))}
.railnav{position:absolute;left:0;top:calc(176*var(--u));width:calc(204*var(--u));padding:0 calc(12*var(--u));display:flex;flex-direction:column;gap:calc(5*var(--u))}
.rn{font:inherit;font-size:calc(12*var(--u));text-align:left;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:calc(8*var(--u));padding:calc(7*var(--u)) calc(10*var(--u));cursor:pointer}
.rn.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600} html[data-theme=dark] .rn.on,html[data-theme=dark] .chip.on,html[data-theme=dark] .tab.on{color:#06182F}
#vis{position:absolute;inset:0;pointer-events:none} #vis>*{pointer-events:auto}
.card{position:absolute;background:var(--card);border:1px solid var(--line);border-radius:calc(10*var(--u));display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow)}
.card.plain{background:transparent;border:0;box-shadow:none}
.vt-title{font-size:calc(12.5*var(--u));font-weight:600;padding:calc(9*var(--u)) calc(12*var(--u)) 0;flex:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vt-sub{font-size:calc(10.5*var(--u));color:var(--muted);padding:calc(1*var(--u)) calc(12*var(--u)) 0;flex:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:calc(15*var(--u))} .vt-sub b{font-weight:700}
.narr.hl{font-size:calc(14.5*var(--u));font-weight:500;border-left:calc(4*var(--u)) solid var(--accent);border-radius:calc(10*var(--u));line-height:1.35}
.kpi.tgt{border-left:calc(4*var(--u)) solid var(--line)} .kpi.tgt.ok{border-left-color:var(--good)} .kpi.tgt.off{border-left-color:var(--bad)} .kpi.tgt .kd{font-weight:600;font-size:calc(11.5*var(--u))}
.vbody{flex:1;min-height:0;position:relative;padding:calc(4*var(--u)) calc(8*var(--u)) calc(6*var(--u))}
.v-kpi .vbody,.v-slicer .vbody,.v-param .vbody,.v-bookmarks .vbody,.v-range .vbody,.v-narrative .vbody{padding:0}
.chart{display:block;overflow:visible}
.chart text{fill:var(--text)}
.chart .ax{fill:var(--muted)} .chart .lb{fill:var(--text)} .chart .lb.sm{font-size:.85em;fill:var(--muted)} .chart .vt{fill:var(--muted);font-weight:600} .chart .big{font-size:calc(17*var(--u));font-weight:700} .chart .big.g{font-size:calc(22*var(--u))} .chart .cv{font-weight:600}
.chart .tm1{fill:#fff;font-weight:700} .chart .tm2{fill:#fff;opacity:.85} .chart .tl{font-weight:700;fill:var(--text);font-size:.95em} .chart .tv{fill:var(--text);font-size:.85em;opacity:.8}
.chart .grid{stroke:var(--line);stroke-width:1} .chart .vl{stroke:var(--muted);stroke-dasharray:3 3;stroke-width:1}
.chart .track{fill:var(--line)} .chart .track-s{stroke:var(--line)} .chart .mini{fill:none;stroke:var(--line)} .chart .empty-cell{fill:var(--line)}
.pick{cursor:pointer;transition:opacity .15s} .pick:hover{opacity:.85}
.empty{padding:20px;color:var(--muted);font-size:13px}
/* kpi */
.kpi{height:100%;padding:calc(10*var(--u)) calc(14*var(--u));position:relative;display:flex;flex-direction:column;justify-content:center}
.kpi.trend{display:grid;grid-template-columns:minmax(0,1fr) calc(34% + 9*var(--u));grid-template-rows:auto auto;column-gap:calc(8*var(--u));align-content:center;padding-block:calc(6*var(--u))}
.kpi.trend .kmain{min-width:0;align-self:center}.kpi.trend>.kd{grid-column:1/-1;grid-row:2;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi.trend>.spark{position:static;grid-column:2;grid-row:1;width:100%;height:calc(30*var(--u));align-self:center}
.kpi.inl{flex-direction:row;align-items:baseline;gap:calc(10*var(--u));justify-content:flex-start;padding:0 calc(14*var(--u));align-items:center}
.kl{font-size:calc(11.5*var(--u));color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.kv{font-size:calc(27*var(--u));font-weight:700;letter-spacing:-.02em;line-height:1.1} .inl .kv{font-size:calc(20*var(--u))}
.kd{font-size:calc(11*var(--u));color:var(--muted);margin-top:calc(2*var(--u))} .inl .kd{margin:0} .kd span{opacity:.8;margin-left:4px}
b.warn{color:#b7791f} .kd.good,b.good{color:var(--good)} .kd.bad,b.bad{color:var(--bad)}
.spark{position:absolute;right:calc(12*var(--u));bottom:calc(10*var(--u));width:34%;height:calc(30*var(--u))}
/* controls */
.slc,.seg,.rng{height:100%;display:flex;flex-direction:column;justify-content:center;gap:calc(3*var(--u));padding:0 calc(10*var(--u));overflow:hidden}
.lbl{font-size:calc(9.5*var(--u));color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em;flex:none;line-height:1}
.chips{display:flex;gap:calc(5*var(--u));flex-wrap:nowrap;overflow:hidden}
.slc.vert{justify-content:flex-start;padding-top:calc(8*var(--u))} .slc.vert .chips{flex-direction:row;align-items:flex-start;flex-wrap:wrap;gap:calc(4*var(--u));overflow:visible}
.seg.vert{justify-content:flex-start;padding-top:calc(8*var(--u))} .seg.vert .chips{flex-direction:column;align-items:flex-start;flex-wrap:nowrap;gap:calc(4*var(--u));overflow:visible}
.tabs .tools{display:flex;gap:8px;margin-left:8px} .tabs .btn{font-size:12px;padding:6px 11px;border-radius:8px}
.chip{font:inherit;font-size:calc(10.5*var(--u));color:var(--text);background:transparent;border:1px solid var(--line);border-radius:999px;padding:calc(3*var(--u)) calc(9*var(--u));cursor:pointer;white-space:nowrap;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.chip:hover{border-color:var(--accent)} .chip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.rng .rr{display:flex;flex-direction:row;gap:calc(8*var(--u))} .rng .rr input{flex:1;min-width:0} .rng{gap:calc(1*var(--u))} .rng input,.wif input,.cr input{width:100%;accent-color:var(--accent);height:calc(14*var(--u));margin:0}
.rl{display:flex;justify-content:space-between;font-size:calc(10.5*var(--u));color:var(--text)}
.wif{display:grid;gap:calc(10*var(--u));padding:calc(6*var(--u)) calc(4*var(--u));font-size:calc(11.5*var(--u))} .wif label{display:grid;grid-template-columns:1.1fr 1.6fr 44px;align-items:center;gap:calc(10*var(--u))} .wif b{text-align:right}
.narr .nt{display:block;width:100%} .narr{height:100%;display:flex;align-items:center;padding:0 calc(14*var(--u));font-size:calc(12.5*var(--u));line-height:1.4;overflow:hidden} .narr.big{font-size:calc(17*var(--u));font-weight:500;letter-spacing:-.01em}
/* table */
.tbl{height:100%;overflow:auto} table{border-collapse:collapse;width:100%;font-size:calc(11.5*var(--u))}
th{position:sticky;top:0;background:var(--card);text-align:left;font-weight:700;color:var(--muted);padding:calc(6*var(--u)) calc(8*var(--u));border-bottom:1px solid var(--line);white-space:nowrap;cursor:pointer;user-select:none}
th:hover{color:var(--accent)}
td{padding:calc(5.5*var(--u)) calc(8*var(--u));border-bottom:1px solid var(--line);white-space:nowrap;position:relative} .n{text-align:right;font-variant-numeric:tabular-nums}
tbody tr{cursor:pointer} tbody tr:hover{background:var(--line)} tr.on{background:var(--line);font-weight:600} tr.fade{opacity:.4}
.ib{position:absolute;left:0;top:18%;height:64%;background:var(--accent);opacity:.18;border-radius:3px} .tv2{position:relative}
tfoot td{position:sticky;bottom:0;background:var(--card);font-weight:700;border-top:1px solid var(--line)}
table.stmt tr.sub td,table.stmt tr.total td{font-weight:700;background:var(--line)} table.stmt tr.total td{border-top:2px solid var(--muted)} table.stmt td:first-child{padding-left:calc(14*var(--u))} table.stmt tr.line td:first-child{padding-left:calc(24*var(--u))}
/* drill */
.crumbrow{height:calc(22*var(--u));display:flex;align-items:center;font-size:calc(10.5*var(--u));color:var(--muted)} .crumb{font-style:italic}
/* calculator + terminal */
.calc{display:grid;grid-template-columns:1fr;gap:calc(6*var(--u));height:100%;grid-template-rows:auto 1fr auto;font-size:calc(11.5*var(--u))} .cl-h{padding:calc(2*var(--u)) 0} .muted{color:var(--muted)}
.cl-list{display:grid;gap:calc(5*var(--u));align-content:start;overflow:auto} .cr{display:grid;grid-template-columns:1.25fr 1.5fr 62px 64px;gap:calc(8*var(--u));align-items:center} .cr i{color:var(--muted);font-style:normal;font-size:.9em}
.cr b{text-align:right;font-weight:600} .cr em{font-style:normal;text-align:right;color:var(--accent);font-weight:700}
.cl-t{display:flex;gap:calc(10*var(--u))} .cl-t>div{flex:1;background:var(--bg);border-radius:8px;padding:calc(8*var(--u)) calc(12*var(--u));display:flex;flex-direction:column} .cl-t span{font-size:.8em;color:var(--muted);text-transform:uppercase;letter-spacing:.04em} .cl-t b{font-size:calc(19*var(--u))}
.term{height:100%;display:flex;flex-direction:column;gap:calc(6*var(--u))} .term .tb{display:flex;gap:calc(5*var(--u));flex-wrap:wrap}
.term pre{flex:1;margin:0;background:#050B16;color:#9bf2c4;border-radius:8px;padding:calc(10*var(--u));font-family:Consolas,"Cascadia Mono",monospace;font-size:calc(11*var(--u));overflow:auto;white-space:pre}
.term .note{font-size:calc(9.5*var(--u));color:var(--muted)}
/* page chrome */
.tabs{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}
.tab{font:inherit;font-size:13px;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:8px;padding:7px 14px;cursor:pointer}
.tab.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.hint{font-size:12px;color:var(--muted);margin-left:auto}
.notes{margin-top:12px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px 18px 12px;font-size:13px;line-height:1.5} .notes h3{margin:10px 0 6px} .notes a{color:var(--accent)}
#tip{position:fixed;display:none;z-index:50;background:#0B1220;color:#E8EEF9;border-radius:8px;padding:8px 11px;font-size:12px;line-height:1.5;pointer-events:none;box-shadow:0 6px 24px rgba(0,0,0,.28);max-width:300px}
.embed body{padding:0}
.embed .notes{display:none!important}
.ttl h1,.vt-title,.kpi .v,.rn,.tab{font-family:"Space Grotesk",Inter,"Segoe UI",system-ui,sans-serif}
