/* SiSUN Ops — PV-cell blue structure, irradiance amber accent, IBM Plex body, Archivo display */
[hidden]{display:none!important}
:root{
  --bg:#F5F6F8; --surface:#FFFFFF; --sunk:#EEF1F4; --ink:#14212E; --ink-2:#4A5866; --ink-3:#7A8794;
  --line:#DDE2E8; --line-2:#C6CED7; --cell:#1E4E79; --cell-tint:#E3ECF5; --sun:#D98A12; --sun-tint:#FBF0DC;
  --good:#2E7D4F; --good-tint:#E2F2E8; --warn:#A86200; --warn-tint:#FCEFD9; --bad:#B3261E; --bad-tint:#F9E3E1;
  --nav:#14212E; --nav-ink:#C9D3DD; --nav-on:#FFFFFF;
  --f-d:"Archivo","Helvetica Neue",Arial,sans-serif; --f-b:"IBM Plex Sans","Segoe UI",Roboto,Arial,sans-serif; --f-m:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --r:10px;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0E141A; --surface:#151E27; --sunk:#1B2631; --ink:#E6ECF1; --ink-2:#AAB6C2; --ink-3:#7E8B98;
  --line:#25323E; --line-2:#334351; --cell:#7FB2E5; --cell-tint:#19304A; --sun:#F0A93A; --sun-tint:#3A2A10;
  --good:#6CC18F; --good-tint:#16301F; --warn:#E3A44B; --warn-tint:#352712; --bad:#F08A82; --bad-tint:#3A1A18;
  --nav:#0A1016; color-scheme:dark}}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:14.5px/1.5 var(--f-b);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--cell);text-decoration:none}
.boot{display:grid;place-items:center;height:100vh;color:var(--ink-3)}
/* shell */
.shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.side{background:var(--nav);color:var(--nav-ink);padding:18px 12px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--f-d);font-weight:800;color:#fff;font-size:17px;padding:4px 10px 18px}
.brand .sun{width:22px;height:22px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 4px rgba(240,169,58,.18)}
.side a{display:flex;align-items:center;gap:10px;color:var(--nav-ink);padding:8px 10px;border-radius:8px;font-size:14px}
.side a:hover{background:rgba(255,255,255,.06);color:#fff}
.side a.on{background:rgba(255,255,255,.1);color:var(--nav-on)}
.side a .ic{width:18px;text-align:center;opacity:.85;font-size:14px}
.side .grp{font-family:var(--f-m);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#6F7E8C;padding:14px 10px 4px}
.side .me{margin-top:auto;font-size:12.5px;padding:10px;border-top:1px solid rgba(255,255,255,.08)}
.side .me b{color:#fff;display:block;font-weight:600}
.side .me button{margin-top:6px;background:none;border:1px solid rgba(255,255,255,.18);color:var(--nav-ink);border-radius:6px;padding:3px 8px;cursor:pointer;font-size:12px}
main{min-width:0;padding:24px 28px 96px}
.top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.top h1{font-family:var(--f-d);font-size:26px;line-height:1.1;margin:0;letter-spacing:-.01em}
.top .sub{color:var(--ink-3);font-size:13px;margin-top:4px}
.crumb{font-family:var(--f-m);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--cell);margin-bottom:6px}
.crumb a{color:var(--cell)}
.demo-bar{background:var(--sun-tint);color:var(--warn);border:1px solid var(--sun);border-radius:8px;padding:6px 12px;font-size:12.5px;margin-bottom:14px}
/* cards */
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{overflow-wrap:break-word;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;min-width:0}
.card h2{font-family:var(--f-d);font-size:15px;margin:0 0 10px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.card h2 a{font-family:var(--f-b);font-size:12.5px;font-weight:500}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:14px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;display:block;color:inherit;position:relative}
a.kpi:hover{border-color:var(--line-2)}
.kpi .l{font-size:12px;color:var(--ink-2)}
.kpi .v{font-family:var(--f-d);font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.15;margin:2px 0}
.kpi .s{font-size:12px;color:var(--ink-3)}
.kpi.warn{border-color:var(--sun);background:var(--sun-tint)}
.kpi.bad .v{color:var(--bad)}
.kpi .bar{height:6px;border-radius:3px;background:var(--sunk);margin-top:8px;overflow:hidden}
.kpi .bar i{display:block;height:100%;background:var(--cell);border-radius:3px}
.kpi.warn .bar i{background:var(--sun)}
/* tables */
.tw{overflow-x:auto;margin:0 -4px}
table{border-collapse:collapse;width:100%;font-size:13.5px}
th{font-family:var(--f-m);font-weight:500;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line-2);white-space:nowrap;cursor:default}
th.sort{cursor:pointer}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--sunk)}
.num{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--f-m);font-size:12.5px;white-space:nowrap}
.muted{color:var(--ink-3)}
.small{font-size:12.5px}
.mono{font-family:var(--f-m)}
.pill{display:inline-block;font-family:var(--f-m);font-size:11px;padding:2px 8px;border-radius:999px;white-space:nowrap;background:var(--sunk);color:var(--ink-2)}
.p-good{background:var(--good-tint);color:var(--good)}.p-warn{background:var(--warn-tint);color:var(--warn)}.p-bad{background:var(--bad-tint);color:var(--bad)}.p-blue{background:var(--cell-tint);color:var(--cell)}.p-sun{background:var(--sun-tint);color:var(--warn)}
.prog{display:flex;align-items:center;gap:8px;min-width:140px}
.prog .t{position:relative;flex:1;height:8px;border-radius:4px;background:var(--sunk)}
.prog .a{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--cell)}
.prog .p{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink)}
/* controls */
.bar-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);background:var(--surface);border-radius:8px;padding:7px 12px;cursor:pointer;font-size:13.5px;white-space:nowrap}
.btn:hover{border-color:var(--ink-3)}
.btn.pri{background:var(--cell);border-color:var(--cell);color:#fff}
@media (prefers-color-scheme:dark){.btn.pri{color:#0E141A}}
.btn.sun{background:var(--sun);border-color:var(--sun);color:#1b1206}
.btn.sm{padding:4px 9px;font-size:12.5px}
.btn:disabled{opacity:.5;cursor:not-allowed}
input.in,select.in,textarea.in{border:1px solid var(--line-2);background:var(--surface);border-radius:8px;padding:7px 10px;min-width:0}
textarea.in{width:100%;min-height:70px}
.in:focus,.btn:focus-visible{outline:2px solid var(--cell);outline-offset:1px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow-x:auto}
.tabs a{padding:8px 12px;color:var(--ink-2);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a.on{color:var(--ink);border-bottom-color:var(--sun);font-weight:600}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}
.form label{display:grid;gap:4px;font-size:12.5px;color:var(--ink-2)}
.form label.full{grid-column:1/-1}
.seg{display:inline-flex;border:1px solid var(--line-2);border-radius:999px;overflow:hidden}
.seg button{border:0;background:none;padding:4px 10px;font-size:12.5px;cursor:pointer}
.seg button.on{background:var(--cell);color:#fff}
.seg button.on.r-partial{background:var(--sun);color:#1b1206}
.seg button.on.r-no{background:var(--bad);color:#fff}
/* drawer */
#drawer{position:fixed;inset:0;background:rgba(10,16,22,.45);z-index:50;display:flex;justify-content:flex-end}
#drawer .pane{background:var(--bg);width:min(560px,100%);height:100%;overflow-y:auto;padding:20px 22px 80px;box-shadow:-12px 0 30px rgba(0,0,0,.2)}
#drawer .pane h2{font-family:var(--f-d);margin:0 0 4px;font-size:20px}
#drawer .x{float:right}
#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:999px;z-index:60;font-size:13.5px}
/* planner */
.plan{display:grid;grid-template-columns:170px repeat(6,minmax(120px,1fr));border:1px solid var(--line);border-radius:var(--r);overflow:hidden;min-width:900px;background:var(--surface)}
.plan>div{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px;min-height:56px;font-size:12.5px}
.plan .h{background:var(--sunk);font-family:var(--f-m);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;min-height:auto;color:var(--ink-2)}
.plan .h.today{color:var(--warn)}
.plan .who b{display:block}.plan .who span{color:var(--ink-3);font-size:11.5px}
.plan .cell{cursor:pointer}
.plan .cell:hover{background:var(--sunk)}
.chip{display:block;border-radius:6px;padding:3px 6px;margin-bottom:3px;background:var(--cell-tint);color:var(--cell);font-size:11.5px;line-height:1.3}
.chip.clash{background:var(--bad-tint);color:var(--bad)}
.chip.leave{background:var(--sunk);color:var(--ink-3)}
/* charts */
.chart svg{width:100%;height:auto;display:block}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--ink-2);margin-top:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
/* login */
.login{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--nav)}
.login .box{background:var(--surface);border-radius:14px;padding:28px;width:min(380px,100%);display:grid;gap:12px}
.login h1{font-family:var(--f-d);margin:0;font-size:24px;display:flex;align-items:center;gap:10px}
.login .err{color:var(--bad);font-size:13px}
.empty{padding:28px;text-align:center;color:var(--ink-3)}
.stagerow td{vertical-align:top}
.reason{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}
/* phone */
@media (max-width:860px){
  .shell{grid-template-columns:1fr}
  .side{position:fixed;bottom:0;top:auto;height:auto;width:100%;flex-direction:row;z-index:40;padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));overflow-x:auto;gap:2px}
  .side .brand,.side .grp,.side .me{display:none}
  .side a{flex-direction:column;gap:2px;font-size:10.5px;padding:6px 8px;min-width:62px;text-align:center}
  main{padding:16px 16px 110px}
  .g2,.g3,.form{grid-template-columns:1fr}
  .top h1{font-size:22px}
  tr.stack td{display:block;text-align:left!important;border-bottom:0;padding:6px 4px}
  tr.stack{display:block;border-bottom:1px solid var(--line)}
  .seg button{padding:6px 10px}
}