:root{--bg:#07111f;--panel:#0d1a2d;--panel2:#13243a;--line:#243955;--text:#f4f7fb;--muted:#8fa4ba;--blue:#2f80ed;--green:#27c281;--red:#ef5350;--orange:#ffb020}
*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}button{font:inherit}.app-shell{display:grid;grid-template-columns:220px 1fr;min-height:100vh}.sidebar{background:#07101d;border-right:1px solid var(--line);padding:24px 16px;display:flex;flex-direction:column}.brand{font-weight:800;letter-spacing:1.5px;font-size:19px;display:flex;align-items:center;gap:10px;margin-bottom:34px}.brand-mark{background:var(--blue);padding:7px 6px;border-radius:8px}.nav-item{width:100%;text-align:left;background:transparent;color:var(--muted);border:0;padding:13px 14px;border-radius:9px;margin:3px 0;cursor:pointer}.nav-item.active{background:#122946;color:#fff}.nav-item small{float:right;color:#607b99}.connection{margin-top:auto;color:var(--muted);font-size:12px;display:flex;gap:8px;align-items:center}.dot{width:9px;height:9px;border-radius:50%;display:inline-block}.dot.pending{background:var(--orange)}.dot.online{background:var(--green)}.dot.offline{background:var(--red)}.main-area{min-width:0}.topbar{height:88px;padding:17px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.topbar h1{font-size:22px;margin:0 0 3px}.topbar p{margin:0;color:var(--muted);font-size:13px}.topbar button,.waze-btn{background:var(--blue);color:white;border:0;border-radius:8px;padding:10px 16px;cursor:pointer;font-weight:650}.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:14px 18px}.summary article{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:13px 16px}.summary span{display:block;color:var(--muted);font-size:12px}.summary strong{font-size:24px}.workspace{height:calc(100vh - 174px);display:grid;grid-template-columns:285px 1fr;position:relative;border-top:1px solid var(--line)}.device-list-panel{background:var(--panel);border-right:1px solid var(--line);overflow:auto}.panel-title{padding:17px;font-weight:700;border-bottom:1px solid var(--line)}.device-card{padding:15px 17px;border-bottom:1px solid var(--line);cursor:pointer}.device-card:hover{background:var(--panel2)}.device-card .row{display:flex;justify-content:space-between;gap:8px}.device-name{font-weight:700}.status{font-size:11px;text-transform:uppercase}.status.online{color:var(--green)}.status.offline{color:var(--muted)}.device-meta{color:var(--muted);font-size:12px;margin-top:7px}.map{min-width:0}.details-panel{position:absolute;right:16px;top:16px;width:330px;max-height:calc(100% - 32px);overflow:auto;background:rgba(13,26,45,.97);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 16px 45px rgba(0,0,0,.45);z-index:3}.hidden{display:none}.close{float:right;background:transparent;color:white;border:0;font-size:25px;cursor:pointer}.detail-title{font-size:21px;font-weight:750;margin-bottom:5px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.metric{background:#0a1525;border:1px solid var(--line);border-radius:9px;padding:11px}.metric span{display:block;color:var(--muted);font-size:11px}.metric strong{font-size:15px}.warning{color:#ffd27b;background:#3a2b11;border:1px solid #72531b;padding:9px;border-radius:8px;font-size:12px;margin:10px 0}.waze-btn{display:block;text-align:center;text-decoration:none;margin-top:14px}.loading,.error{padding:18px;color:var(--muted)}.error{color:#ff8a86}
@media(max-width:800px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.summary{grid-template-columns:repeat(2,1fr)}.workspace{height:calc(100vh - 252px);grid-template-columns:1fr}.device-list-panel{display:none}.details-panel{left:10px;right:10px;bottom:10px;top:auto;width:auto;max-height:47%}}

.brand small{color:var(--muted);font-size:10px}.badge{display:inline-block;margin-top:7px;padding:3px 7px;border-radius:10px;background:#3a2b11;color:#ffd27b;font-size:11px}.history{padding:14px 18px}.toolbar{display:flex;gap:12px;align-items:end;background:var(--panel);border:1px solid var(--line);padding:14px;border-radius:10px}.toolbar label{display:grid;gap:5px;color:var(--muted)}.toolbar select{background:var(--bg);color:white;border:1px solid var(--line);padding:9px;border-radius:7px}.toolbar button{background:var(--blue);color:#fff;border:0;padding:10px 16px;border-radius:8px}.history-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}.history-summary article{background:var(--panel);border:1px solid var(--line);padding:12px;border-radius:9px;color:var(--muted)}.history-summary strong{display:block;color:#fff;font-size:22px}.lists{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lists>div{background:var(--panel);border:1px solid var(--line);padding:13px;border-radius:9px}.item{border-top:1px solid var(--line);padding:9px 0;color:var(--muted)}#historyMap{height:430px;margin-bottom:14px}.no-fix{background:#401b1b;color:#ffaaa7}.brand span{background:var(--blue);padding:7px;border-radius:7px}.connection i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--orange);margin-right:6px}.connection i.ok{background:var(--green)}.connection i.bad{background:var(--red)}
