/* Graphite: the desktop app's house style. Neutral grey surfaces split by hairlines,
   one blue accent, green/red only for P&L, Inter with tabular numerals. */
:root{
  --bg:#0E1114; --panel:#12161A; --alt:#151A1F; --line:#22272E; --line2:#2D333B;
  --accent:#2F6FEB; --accent-h:#255FD0; --text:#E6EDF3; --muted:#768390; --slate:#ADBAC7;
  --green:#3FB950; --red:#F47067; --amber:#D4A72C;
  --font:"Inter","InterVariable","Segoe UI",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;background:var(--bg);color:var(--text);font:13px/1.45 var(--font);
  font-feature-settings:"tnum" 1,"cv11" 1;-webkit-font-smoothing:antialiased}
a{color:var(--slate)} a:hover{color:var(--text)}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
button,input,select{font:inherit;color:inherit}

.topbar{display:flex;align-items:center;gap:16px;height:44px;padding:0 16px;
  border-bottom:1px solid var(--line);background:var(--panel);position:sticky;top:0;z-index:5}
.brand{font-weight:600;letter-spacing:.01em;display:flex;align-items:center;gap:8px;white-space:nowrap}
.mark{width:10px;height:10px;background:var(--accent);border-radius:2px}
.tag{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);
  border:1px solid var(--line2);border-radius:3px;padding:1px 5px}
.ctx{flex:1;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gh{margin-left:auto;font-size:12px;text-decoration:none;border:1px solid var(--line2);border-radius:3px;padding:3px 9px}

.layout{display:grid;grid-template-columns:300px minmax(0,1fr);min-height:calc(100vh - 44px - 41px)}
.panel{border-right:1px solid var(--line);background:var(--panel);padding:14px}
.sect{margin-bottom:14px}
.lbl{display:block;font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted);margin-bottom:5px}
.lbl.row{display:flex;justify-content:space-between}
input,select{width:100%;height:30px;background:var(--bg);border:1px solid var(--line2);border-radius:3px;
  padding:0 8px;outline:none}
input:focus,select:focus{border-color:var(--accent)}
input[type=date]{color-scheme:dark}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hold-edit{width:100%;border-collapse:collapse}
.hold-edit td{padding:0 0 5px}
.hold-edit td:nth-child(1){width:55%;padding-right:5px}
.hold-edit td:nth-child(2){width:35%;padding-right:5px}
.hold-edit input.t{text-transform:uppercase}
.hold-edit input.w{text-align:right}
.x{width:26px;height:30px;background:none;border:0;color:var(--muted);cursor:pointer;font-size:15px}
.x:hover{color:var(--red)}
.btn{height:32px;border-radius:3px;cursor:pointer;padding:0 12px;border:1px solid var(--line2);background:none}
.btn.ghost{width:100%;color:var(--slate);border-style:dashed}
.btn.ghost:hover{color:var(--text);border-color:var(--muted)}
.btn.primary{width:100%;background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600;margin-top:4px}
.btn.primary:hover{background:var(--accent-h)}
.btn.primary:disabled{opacity:.6;cursor:progress}
.hint{font-size:11px;color:var(--muted);margin-top:5px}
.ranges{display:flex;gap:0;margin:-4px 0 14px;border:1px solid var(--line2);border-radius:3px;overflow:hidden}
.ranges button{flex:1;height:26px;background:none;border:0;border-right:1px solid var(--line2);
  color:var(--muted);font-size:11px;cursor:pointer}
.ranges button:last-child{border-right:0}
.ranges button:hover{color:var(--text);background:var(--alt)}
.engine{margin-top:10px}
.eprog{height:2px;background:var(--line2);overflow:hidden}
.eprog div{height:100%;width:0;background:var(--accent);transition:width .25s}
.emsg{font-size:11px;color:var(--muted);margin-top:5px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.engine.ready .eprog{display:none}
.err{color:var(--red);font-size:12px;margin-top:8px;min-height:1em}

.main{min-width:0;position:relative}
.kpis{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));border-bottom:1px solid var(--line);background:var(--panel)}
.kpi{padding:8px 12px;border-right:1px solid var(--line);min-width:0}
.kpi:last-child{border-right:0}
.kpi .k{font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.kpi .v{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;margin:1px 0;white-space:nowrap}
.kpi .s{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos{color:var(--green)} .neg{color:var(--red)}

.tabs{display:flex;border-bottom:1px solid var(--line);padding:0 8px;overflow-x:auto}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:9px 12px;color:var(--muted);cursor:pointer;white-space:nowrap}
.tabs button.on{color:var(--text);border-bottom-color:var(--accent)}
.tabs button:hover{color:var(--text)}
.body{padding:12px}
.empty{padding:48px 12px;color:var(--slate);max-width:560px}
.pane{border:1px solid var(--line);background:var(--panel);margin-bottom:12px;min-width:0}
.ph{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);
  padding:8px 12px;border-bottom:1px solid var(--line)}
.chart{height:320px}
.chart.short{height:220px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.split>.pane{margin-bottom:12px}
.tw{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
table.data th{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);
  text-align:right;padding:6px 12px;border-bottom:1px solid var(--line);white-space:nowrap;cursor:default}
table.data td{text-align:right;padding:5px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
table.data th:first-child,table.data td:first-child{text-align:left}
table.data tr.total td{font-weight:600;border-top:1px solid var(--line2);border-bottom:0}
table.data tbody tr:hover td{background:var(--alt)}
table.data th.sortable{cursor:pointer} table.data th.sortable:hover{color:var(--text)}
.note{font-size:11px;color:var(--muted);padding:6px 12px 10px;margin:0}
.badge{font-size:10px;padding:1px 5px;border-radius:3px;border:1px solid var(--line2);color:var(--slate)}
.badge.ok{color:var(--green);border-color:rgba(63,185,80,.35)}
.badge.bad{color:var(--red);border-color:rgba(244,112,103,.35)}
.warns{border:1px solid rgba(212,167,44,.35);color:var(--amber);padding:8px 12px;font-size:12px}

.loading{position:absolute;inset:0;background:rgba(14,17,20,.72);display:flex;flex-direction:column;
  align-items:center;justify-content:flex-start;padding-top:140px;gap:10px;color:var(--slate);z-index:3}
.loading .bar{width:180px;height:2px;background:var(--line2);position:relative;overflow:hidden}
.loading .bar::after{content:"";position:absolute;left:-40%;width:40%;height:100%;background:var(--accent);animation:slide 1.1s infinite ease-in-out}
@keyframes slide{to{left:100%}}
.skeleton .v,.skeleton .s{color:transparent;background:var(--alt);border-radius:2px}

.foot{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;border-top:1px solid var(--line);
  font-size:11px;color:var(--slate);background:var(--panel);flex-wrap:wrap}

@media (max-width:1180px){ .kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .kpi:nth-child(4n){border-right:0} .kpi:nth-child(-n+4){border-bottom:1px solid var(--line)} }
@media (max-width:860px){
  .layout{grid-template-columns:1fr}
  .panel{border-right:0;border-bottom:1px solid var(--line)}
  .split{grid-template-columns:1fr;gap:0}
  .ctx{display:none} .topbar{position:static}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi{border-bottom:1px solid var(--line)} .kpi:nth-child(2n){border-right:0} .kpi:nth-child(4n){border-right:0}
  .kpi:nth-child(odd){border-right:1px solid var(--line)}
  .chart{height:260px} .chart.short{height:200px}
  .body{padding:8px} .loading{padding-top:60px}
}