/* ============ AI4C 质检智能体 · design tokens ============ */
:root{
  --page:#0d0f13;
  --surface:#171a20;
  --surface-2:#1e232b;
  --surface-3:#252b35;
  --ink:#ffffff;
  --ink-2:#c3c2b7;
  --muted:#898781;
  --grid:#262a31;
  --baseline:#3a3f47;
  --border:rgba(255,255,255,.08);
  --border-strong:rgba(255,255,255,.16);
  --s1:#3987e5;  /* blue    */
  --s2:#199e70;  /* aqua    */
  --s3:#c98500;  /* yellow  */
  --s4:#9085e9;  /* violet  */
  --s5:#e66767;  /* red     */
  --good:#0ca30c;
  --warn:#fab219;
  --serious:#ec835a;
  --crit:#d03b3b;
  --accent:#3987e5;
  --radius:12px;
  --font:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--font);
  background:var(--page);
  color:var(--ink);
  font-size:14px;
  line-height:1.55;
  overflow:hidden;
}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#2c313a;border-radius:6px;border:2px solid var(--page)}
::-webkit-scrollbar-track{background:transparent}

.app{display:flex;height:100vh}

/* ============ sidebar ============ */
.sidebar{
  width:224px;flex:none;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#12151b 0%,#0f1116 100%);
  border-right:1px solid var(--border);
}
.brand{display:flex;align-items:center;gap:10px;padding:18px 16px 16px}
.brand-logo{
  width:42px;height:42px;flex:none;border-radius:11px;
  background:linear-gradient(135deg,#3987e5,#1c5cab);
  color:#fff;font-weight:800;font-size:15px;letter-spacing:.5px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(57,135,229,.35);
}
.brand-name{font-size:16px;font-weight:700;letter-spacing:1px}
.brand-sub{font-size:11px;color:var(--muted);margin-top:1px}
.nav-flow{font-size:10.5px;color:var(--muted);letter-spacing:2px;padding:6px 22px 2px}
.nav{display:flex;flex-direction:column;gap:2px;padding:4px 10px 10px;flex:1;position:relative}
.nav a{
  display:flex;align-items:center;gap:10px;position:relative;
  padding:10px 12px;border-radius:9px;color:var(--ink-2);
  text-decoration:none;font-size:13.5px;transition:background .15s,color .15s;
}
.nav a::after{content:"";position:absolute;left:23px;top:38px;height:8px;width:1px;background:var(--border)}
.nav a:last-child::after{display:none}
.nav-n{flex:none;width:20px;height:20px;border-radius:50%;background:var(--surface-2);border:1px solid var(--border-strong);
  display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:700;color:var(--muted)}
.nav a.active .nav-n{background:var(--accent);border-color:var(--accent);color:#fff}
.nav a svg{width:18px;height:18px;fill:currentColor;opacity:.85;flex:none}
.nav a:hover{background:rgba(255,255,255,.05);color:var(--ink)}
.nav a.active{background:rgba(57,135,229,.16);color:#8db9f0;font-weight:600}
.nav a.active svg{opacity:1}
.nav-dot{position:absolute;right:12px;width:7px;height:7px;border-radius:50%;background:var(--warn);
  box-shadow:0 0 0 0 rgba(250,178,25,.5);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(250,178,25,.45)}70%{box-shadow:0 0 0 7px rgba(250,178,25,0)}100%{box-shadow:0 0 0 0 rgba(250,178,25,0)}}
.sidebar-foot{padding:14px 16px;border-top:1px solid var(--border)}
.demo-badge{font-size:11px;color:var(--s3);background:rgba(201,133,0,.12);border:1px solid rgba(201,133,0,.3);
  border-radius:6px;padding:3px 8px;display:inline-block}
.ver{font-size:11px;color:var(--muted);margin-top:8px}

/* ============ main / topbar ============ */
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;border-bottom:1px solid var(--border);flex:none;
  background:rgba(23,26,32,.6);
}
.page-title{font-size:18px;font-weight:700}
.page-sub{font-size:12px;color:var(--muted);margin-top:1px}
.topbar-right{display:flex;align-items:center;gap:10px;font-size:12.5px}
.plant-chip,.shift-chip{color:var(--ink-2);background:var(--surface-2);border:1px solid var(--border);
  padding:4px 10px;border-radius:20px}
.clock{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.view{flex:1;overflow-y:auto;padding:20px 24px 32px}

/* ============ generic card / grid ============ */
.grid{display:grid;gap:14px}
.card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:16px 18px;min-width:0;
}
.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.card-title{font-size:14px;font-weight:700}
.card-note{font-size:12px;color:var(--muted)}

/* ============ data-source chips (数据需求有机体现) ============ */
.chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.chip{
  display:inline-flex;align-items:center;gap:4px;cursor:help;
  font-size:11px;color:var(--ink-2);background:var(--surface-2);
  border:1px solid var(--border);border-radius:20px;padding:2px 9px;
  transition:border-color .15s,color .15s;
}
.chip:hover{border-color:var(--accent);color:#8db9f0}
.chip .dot{width:6px;height:6px;border-radius:50%;flex:none}

/* ============ KPI tiles ============ */
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}
.kpi-label{font-size:12px;color:var(--muted)}
.kpi-value{font-size:26px;font-weight:700;margin-top:4px;letter-spacing:-.5px}
.kpi-value small{font-size:14px;font-weight:600;color:var(--ink-2);margin-left:2px}
.kpi-foot{display:flex;align-items:center;justify-content:space-between;margin-top:6px;gap:8px}
.delta{font-size:12px;font-weight:600}
.delta.up-good{color:var(--good)} .delta.down-bad{color:var(--crit)}
.delta.up-bad{color:var(--crit)}  .delta.down-good{color:var(--good)}
.delta.flat{color:var(--muted)}

/* ============ badges & status ============ */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;
  padding:2px 10px;border-radius:20px;white-space:nowrap}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.badge.run{color:#4fc06a;background:rgba(12,163,12,.12)}
.badge.warn{color:var(--warn);background:rgba(250,178,25,.1)}
.badge.crit{color:#e66767;background:rgba(208,59,59,.14)}
.badge.idle{color:var(--muted);background:rgba(137,135,129,.12)}
.badge.info{color:#8db9f0;background:rgba(57,135,229,.14)}

/* ============ tables ============ */
table.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{text-align:left;color:var(--muted);font-weight:600;padding:7px 10px;border-bottom:1px solid var(--border);white-space:nowrap}
.tbl td{padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.05);color:var(--ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.tbl tr:last-child td{border-bottom:none}
.tbl td.num{text-align:right}
.tbl th.num{text-align:right}

/* ============ tooltip ============ */
.tooltip{
  position:fixed;z-index:1000;pointer-events:none;max-width:320px;
  background:#20252e;border:1px solid var(--border-strong);border-radius:9px;
  padding:9px 12px;font-size:12px;color:var(--ink-2);
  box-shadow:0 8px 28px rgba(0,0,0,.5);
}
.tooltip .tt-title{color:var(--ink);font-weight:700;margin-bottom:4px;font-size:12.5px}
.tooltip .tt-row{display:flex;align-items:center;gap:6px;margin-top:2px;white-space:nowrap}
.tooltip .tt-row .sw{width:8px;height:8px;border-radius:50%;flex:none}
.tooltip .tt-row b{margin-left:auto;color:var(--ink);font-variant-numeric:tabular-nums;padding-left:14px}
.tooltip ul{margin:4px 0 0 16px}
.tooltip li{margin:1px 0}

/* ============ charts ============ */
.chart{position:relative}
.chart svg{display:block;width:100%}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink-2);margin-bottom:6px}
.legend .lg{display:inline-flex;align-items:center;gap:6px}
.legend .sw{width:9px;height:9px;border-radius:50%}
.legend .sw.line{width:14px;height:3px;border-radius:2px}

/* ============ dashboard specifics ============ */
.line-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.line-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;position:relative}
.line-card.warned{border-color:rgba(250,178,25,.45);background:linear-gradient(180deg,rgba(250,178,25,.05),var(--surface) 55%)}
.line-card h4{font-size:14px;display:flex;align-items:center;justify-content:space-between}
.line-meta{font-size:11.5px;color:var(--muted);margin-top:2px}
.line-stats{display:flex;gap:18px;margin-top:10px}
.line-stats .ls b{display:block;font-size:19px;font-weight:700;font-variant-numeric:tabular-nums}
.line-stats .ls span{font-size:11px;color:var(--muted)}
.line-link{display:inline-flex;align-items:center;gap:4px;margin-top:10px;font-size:12px;color:#8db9f0;text-decoration:none}
.line-link:hover{text-decoration:underline}

.alarm-feed{display:flex;flex-direction:column;gap:0;max-height:296px;overflow-y:auto}
.alarm{display:flex;gap:10px;padding:8px 2px;border-bottom:1px solid rgba(255,255,255,.05);font-size:12.5px;align-items:flex-start}
.alarm:last-child{border-bottom:none}
.alarm .t{color:var(--muted);font-variant-numeric:tabular-nums;flex:none;width:40px}
.alarm .lv{flex:none;width:8px;height:8px;border-radius:50%;margin-top:5px}
.alarm .msg{color:var(--ink-2)}
.alarm .msg b{color:var(--ink)}

/* ============ station 在线检测 ============ */
.station-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:14px}
.cam{position:relative;background:#0a0c10;border-radius:10px;overflow:hidden;border:1px solid var(--border)}
.cam svg{display:block;width:100%}
.cam-hud{position:absolute;top:10px;left:12px;right:12px;display:flex;justify-content:space-between;
  font-size:11.5px;color:#9fb6d8;font-variant-numeric:tabular-nums;pointer-events:none}
.cam-hud .rec{color:#e66767}
.cam-hud .rec::before{content:"●";margin-right:4px;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.15}}
.scanline{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#3987e5 30%,#7db4f0 50%,#3987e5 70%,transparent);
  box-shadow:0 0 14px rgba(57,135,229,.8);opacity:0;pointer-events:none}
.scanning .scanline{opacity:1;animation:scan 1s linear}
@keyframes scan{0%{top:6%}100%{top:94%}}
.verdict{position:absolute;right:14px;bottom:14px;font-size:22px;font-weight:800;letter-spacing:2px;
  padding:4px 18px;border-radius:9px;border:2px solid}
.verdict.ok{color:#4fc06a;border-color:#2e7d3e;background:rgba(12,163,12,.12)}
.verdict.ng{color:#ff7b7b;border-color:#a33;background:rgba(208,59,59,.16)}
.station-ctrl{display:flex;align-items:center;gap:10px;margin-top:10px}
.btn{
  font:inherit;font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer;
  background:var(--surface-2);border:1px solid var(--border-strong);border-radius:8px;padding:6px 14px;
  transition:background .15s;
}
.btn:hover{background:var(--surface-3)}
.btn.primary{background:var(--accent);border-color:transparent}
.btn.primary:hover{background:#2a78d6}
.btn.ghost{background:transparent}
.defect-list{display:flex;flex-direction:column;gap:8px}
.defect-item{display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:9px;padding:8px 12px;font-size:12.5px}
.defect-item .conf{margin-left:auto;flex:none;width:120px}
.confbar{height:5px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.confbar i{display:block;height:100%;border-radius:3px;background:var(--s5)}
.measure{margin-bottom:12px}
.measure .m-head{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:4px}
.measure .m-head b{font-variant-numeric:tabular-nums}
.tolbar{position:relative;height:10px;border-radius:5px;background:var(--surface-3)}
.tolbar .zone{position:absolute;top:0;bottom:0;background:rgba(12,163,12,.25);border-radius:5px}
.tolbar .pin{position:absolute;top:-3px;width:4px;height:16px;border-radius:2px;background:var(--ink)}
.tolbar .pin.out{background:var(--crit)}
.hist-stream{max-height:250px;overflow-y:auto}

/* ============ agent 智能体 ============ */
.agent-grid{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:14px;height:100%}
.chat-panel{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);overflow:hidden;height:calc(100vh - 130px)}
.chat-scroll{flex:1;overflow-y:auto;padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.chat-input{border-top:1px solid var(--border);padding:12px 16px;display:flex;gap:10px;background:var(--surface)}
.chat-input input{flex:1;font:inherit;font-size:13.5px;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--border-strong);border-radius:9px;padding:9px 14px;outline:none}
.chat-input input:focus{border-color:var(--accent)}
.presets{display:flex;gap:8px;flex-wrap:wrap;padding:0 16px 12px;background:var(--surface)}
.preset{font-size:12px;color:#8db9f0;background:rgba(57,135,229,.1);border:1px solid rgba(57,135,229,.35);
  border-radius:20px;padding:4px 12px;cursor:pointer;transition:background .15s}
.preset:hover{background:rgba(57,135,229,.22)}
.msg{max-width:88%;animation:fadeUp .3s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.msg.user{align-self:flex-end;background:var(--accent);color:#fff;border-radius:14px 14px 3px 14px;
  padding:9px 14px;font-size:13.5px}
.msg.agent{align-self:flex-start;width:88%}
.agent-head{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-bottom:6px}
.agent-avatar{width:24px;height:24px;border-radius:7px;background:linear-gradient(135deg,#3987e5,#1c5cab);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff}
.phase{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#8db9f0;
  margin:10px 0 2px;text-transform:none}
.phase::after{content:"";flex:1;height:1px;background:var(--border)}
.think{background:var(--surface-2);border:1px solid var(--border);border-left:3px solid var(--s4);
  border-radius:9px;padding:10px 14px;font-size:13px;color:var(--ink-2)}
.think b{color:var(--ink)}
.toolcall{background:var(--surface-2);border:1px solid var(--border);border-radius:9px;padding:9px 13px;font-size:12.5px}
.toolcall .tc-head{display:flex;align-items:center;gap:8px;color:var(--ink)}
.toolcall .tc-head .ico{flex:none;width:22px;height:22px;border-radius:6px;background:var(--surface-3);
  display:flex;align-items:center;justify-content:center;font-size:12px}
.toolcall .tc-q{color:var(--muted);font-size:11.5px;margin:3px 0 0 30px;font-family:Consolas,monospace}
.toolcall .tc-res{margin:6px 0 0 30px;color:var(--ink-2);border-top:1px dashed var(--border);padding-top:6px}
.toolcall .tc-res .hit{color:var(--warn);font-weight:700}
.toolcall .tc-res .clear{color:var(--good);font-weight:700}
.tc-status{margin-left:auto;font-size:11px;color:var(--muted)}
.spinner{display:inline-block;width:12px;height:12px;border:2px solid var(--border-strong);
  border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;vertical-align:-2px}
@keyframes spin{to{transform:rotate(360deg)}}
.hypos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hypo{display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:8px;padding:7px 11px;font-size:12.5px;color:var(--ink-2)}
.hypo .tag{flex:none;font-size:11px;font-weight:700;color:#8db9f0;background:rgba(57,135,229,.14);
  border-radius:5px;padding:1px 7px}
.hypo .st{margin-left:auto;font-size:11px;flex:none}
.hypo.confirmed{border-color:rgba(250,178,25,.5)} .hypo.confirmed .st{color:var(--warn);font-weight:700}
.hypo.excluded{opacity:.55} .hypo.excluded .st{color:var(--good)}
.conclusion{background:linear-gradient(135deg,rgba(57,135,229,.14),rgba(144,133,233,.1));
  border:1px solid rgba(57,135,229,.4);border-radius:11px;padding:14px 16px;font-size:13px}
.conclusion h5{font-size:13.5px;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.conclusion .conf-badge{margin-left:auto;font-size:11.5px;color:var(--s3);background:rgba(201,133,0,.14);
  border:1px solid rgba(201,133,0,.35);border-radius:14px;padding:1px 9px}
.chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0;font-size:12px}
.chain .node{background:var(--surface-2);border:1px solid var(--border-strong);border-radius:7px;padding:4px 10px;color:var(--ink)}
.chain .node.root{border-color:var(--crit);color:#ff9b9b}
.chain .arr{color:var(--muted)}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.mini-chart{background:var(--surface-2);border:1px solid var(--border);border-radius:9px;padding:10px 12px}
.mini-chart .mc-title{font-size:12px;color:var(--muted);margin-bottom:6px}

/* agent right rail */
.rail{display:flex;flex-direction:column;gap:14px;height:calc(100vh - 130px);overflow-y:auto}
.pipeline{display:flex;flex-direction:column;gap:0}
.pstep{display:flex;gap:12px;position:relative;padding-bottom:16px}
.pstep::before{content:"";position:absolute;left:11px;top:24px;bottom:0;width:2px;background:var(--border)}
.pstep:last-child::before{display:none}
.pstep .pdot{flex:none;width:24px;height:24px;border-radius:50%;background:var(--surface-2);
  border:2px solid var(--border-strong);display:flex;align-items:center;justify-content:center;
  font-size:11px;color:var(--muted);z-index:1}
.pstep.active .pdot{border-color:var(--accent);color:#8db9f0;box-shadow:0 0 0 4px rgba(57,135,229,.15)}
.pstep.done .pdot{background:var(--accent);border-color:var(--accent);color:#fff}
.pstep .pt{font-size:12.5px;font-weight:600;color:var(--muted);padding-top:3px}
.pstep.active .pt,.pstep.done .pt{color:var(--ink)}
.pstep .pd{font-size:11px;color:var(--muted)}
.src-live{display:flex;flex-direction:column;gap:6px}
.src-item{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-2);
  background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:6px 10px;animation:fadeUp .3s ease}
.src-item .cnt{margin-left:auto;color:var(--muted);font-size:11px}
.vs-table{width:100%;border-collapse:collapse;font-size:12px}
.vs-table td{padding:6px 8px;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:top;color:var(--ink-2)}
.vs-table td:first-child{color:var(--muted);white-space:nowrap}
.vs-table tr:last-child td{border-bottom:none}
.vs-table .ai{color:#8db9f0}

/* ============ RCA ============ */
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.filters select{font:inherit;font-size:12.5px;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--border-strong);border-radius:8px;padding:6px 10px;outline:none;cursor:pointer}
.rca-banner{
  background:linear-gradient(135deg,rgba(208,59,59,.12),rgba(201,133,0,.07));
  border:1px solid rgba(208,59,59,.35);border-radius:var(--radius);padding:16px 20px;margin-bottom:14px;
}
.rca-banner h3{font-size:15px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rca-banner p{color:var(--ink-2);font-size:13px;margin-top:6px;max-width:1100px}
.mmee{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.mmee-card{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:12px 14px}
.mmee-card.hit{border-color:rgba(250,178,25,.55);background:linear-gradient(180deg,rgba(250,178,25,.07),var(--surface-2) 60%)}
.mmee-card h5{font-size:13px;display:flex;justify-content:space-between;align-items:center}
.mmee-card p{font-size:12px;color:var(--ink-2);margin-top:6px}
.mmee-card .st{font-size:11px;font-weight:700}
.mmee-card .st.hit{color:var(--warn)} .mmee-card .st.clear{color:var(--good)}
.action-list{display:flex;flex-direction:column;gap:8px}
.action-item{display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:9px;padding:9px 13px;font-size:12.5px}
.action-item .who{margin-left:auto;color:var(--muted);font-size:11.5px;flex:none}
.action-item .n{flex:none;width:20px;height:20px;border-radius:6px;background:rgba(57,135,229,.16);
  color:#8db9f0;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* ============ data map ============ */
.dmap-grid{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:14px}
.dmap-svg-wrap{overflow-x:auto}
.dm-node{cursor:pointer}
.dm-node rect{transition:stroke .15s}
.dm-link{transition:opacity .2s,stroke .2s}
.dm-dim{opacity:.12}
.field-tbl{width:100%;border-collapse:collapse;font-size:12px}
.field-tbl th{text-align:left;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--border)}
.field-tbl td{padding:6px 8px;border-bottom:1px solid rgba(255,255,255,.05);color:var(--ink-2)}
.field-tbl code{font-family:Consolas,monospace;font-size:11px;color:#8db9f0;background:rgba(57,135,229,.1);
  padding:1px 5px;border-radius:4px}
.proto{display:inline-block;font-size:10.5px;font-weight:700;border-radius:4px;padding:1px 6px}
.proto.opcua{color:#8db9f0;background:rgba(57,135,229,.14)}
.proto.api{color:#5ec99a;background:rgba(25,158,112,.14)}
.proto.db{color:#d9a13d;background:rgba(201,133,0,.14)}
.proto.file{color:#b0a8f0;background:rgba(144,133,233,.14)}

/* utility */
.mt14{margin-top:14px}
.muted{color:var(--muted)}
.span2{grid-column:span 2}
.hidden{display:none!important}
@media (max-width:1280px){
  .kpis{grid-template-columns:repeat(3,1fr)}
  .line-cards{grid-template-columns:repeat(2,1fr)}
  .mmee{grid-template-columns:repeat(2,1fr)}
}