:root{--ink:#102033;--muted:#66758a;--line:#d8e2ed;--bg:#eef3f8;--panel:#fff;--nav:#061f35;--blue:#1769d2;--green:#168a45;--amber:#c77700;--red:#d92d20;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink)}button,select{font:inherit}.sidebar{position:fixed;inset:0 auto 0 0;width:260px;padding:24px 18px;background:linear-gradient(180deg,#062a46,#031927);color:#fff;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;margin-bottom:30px}.brand-mark{width:50px;height:50px;border:2px solid #4ba1ff;border-radius:50%;display:grid;place-items:center;color:#75b7ff;font-size:27px;font-weight:900}.brand strong{display:block;font-size:22px}.brand span{color:#75b7ff;letter-spacing:.15em;text-transform:uppercase}nav{display:grid;gap:8px}nav a{color:#d8ebff;text-decoration:none;padding:14px 16px;border-radius:8px}nav a.active,nav a:hover{background:#145d9c}.site-card{margin-top:auto;padding-top:18px;border-top:1px solid rgba(255,255,255,.18);display:grid;gap:6px}.site-card span,.site-card small{color:#abc3d8}
main{margin-left:260px;padding:24px}.topbar{display:grid;grid-template-columns:minmax(320px,1fr) 220px auto;gap:18px;align-items:center;margin-bottom:18px}h1,h2,p{margin:0}h1{font-size:32px}.topbar p{color:var(--muted);margin-top:5px}.topbar label,.status{min-height:58px;display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:var(--panel);padding:10px 14px;border-radius:8px;color:var(--muted);font-weight:800}.topbar select{border:0;background:transparent;color:var(--ink);font-weight:900}.status{color:var(--green)}.status span{width:10px;height:10px;border-radius:50%;background:var(--green)}
.grid{display:grid;grid-template-columns:minmax(460px,1fr) minmax(380px,.9fr) 390px;gap:14px;align-items:start}.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 12px 30px rgba(24,39,55,.08)}.panel-title{min-height:56px;display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}.panel-title h2{font-size:18px}.panel-title button{border:1px solid var(--line);background:#f7fbff;color:var(--blue);border-radius:6px;padding:8px 10px;font-weight:800;cursor:pointer}.panel-title span,#riskBadge{padding:7px 11px;border-radius:999px;background:#fff3cd;color:var(--amber);font-weight:900}
table{width:calc(100% - 28px);margin:14px;border-collapse:collapse;font-size:14px}th,td{padding:10px;border:1px solid var(--line);text-align:left}th{background:#f6f8fb;color:#41526a}.tag{padding:5px 8px;border-radius:999px;font-weight:800}.good{background:#dcfce7;color:var(--green)}.watch{background:#fff3cd;color:var(--amber)}.poor{background:#fee4e2;color:var(--red)}.risk{font-weight:900;color:var(--blue)}
#workOrderCards{display:grid;gap:10px;padding:14px}.wo{border:1px solid var(--line);border-left:5px solid var(--blue);border-radius:8px;padding:12px;background:#fbfdff}.wo.critical{border-left-color:var(--red)}.wo.high{border-left-color:var(--amber)}.wo strong{display:block;margin-bottom:5px}.wo small{color:var(--muted)}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px}.metric-grid article{border:1px solid var(--line);border-radius:8px;padding:14px;background:#fbfdff}.metric-grid span{color:var(--muted)}.metric-grid strong{display:block;margin-top:6px;color:var(--blue);font-size:24px}.recommendation{display:flex;gap:12px;align-items:center;margin:0 14px 14px;padding:14px;border:1px solid #ffd9a1;background:#fffaf0;border-radius:8px}.recommendation span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--amber);color:#fff;font-weight:900;flex:none}
canvas{width:100%;display:block;max-height:340px;padding:14px 18px 18px}.timeline{grid-column:span 3}#pmTimeline{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:18px}.pm{border:1px solid var(--line);border-radius:8px;padding:12px;background:#e8f2ff;color:#0b4d92;font-weight:800}.pm.overdue{background:#fee4e2;color:var(--red)}.pm.soon{background:#fff3cd;color:var(--amber)}
@media(max-width:1220px){.sidebar{position:static;width:auto}main{margin-left:0}.topbar,.grid{grid-template-columns:1fr}.timeline{grid-column:auto}}@media(max-width:680px){main{padding:12px}.sidebar{padding:18px}nav{grid-template-columns:1fr 1fr}h1{font-size:25px}.metric-grid{grid-template-columns:1fr}table{font-size:12px}#pmTimeline{grid-template-columns:1fr}}