*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0d0d0d;color:#e0e0e0;min-height:100vh;font-size:14px}.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh}.login-card{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:8px;padding:2rem 2.5rem;width:360px}.login-card h1{text-align:center;margin-bottom:1.5rem;color:#00d4aa;font-size:1.6rem}.login-card input{display:block;width:100%;padding:.6rem .8rem;margin-bottom:.75rem;background:#111;border:1px solid #333;border-radius:4px;color:#e0e0e0;font-size:.95rem;outline:none}.login-card input:focus{border-color:#00d4aa}.login-card button{width:100%;padding:.7rem;background:#00d4aa;border:none;border-radius:4px;color:#0d0d0d;font-weight:600;font-size:.95rem;cursor:pointer;margin-top:.25rem}.login-card button:disabled{opacity:.5;cursor:not-allowed}.page{max-width:1100px;margin:0 auto;padding:0 1.25rem 3rem}header{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1px solid #1e1e1e;margin-bottom:1.5rem}.logo{color:#00d4aa;font-weight:700;font-size:1.1rem}.btn-link{background:none;border:none;color:#666;cursor:pointer;font-size:.9rem}.btn-link:hover{color:#ccc}h2{font-size:.75rem;font-weight:600;color:#555;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.75rem}.card{background:#151515;border:1px solid #222;border-radius:6px;margin-bottom:.6rem;overflow:hidden}.card-header{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;cursor:pointer;-webkit-user-select:none;user-select:none}.card-header:hover{background:#1a1a1a}.site-name{font-weight:500;flex:1}.site-loc{color:#555;font-size:.85rem}.chevron{color:#444;font-size:.7rem}.device-list{border-top:1px solid #1e1e1e}.device-row{display:flex;align-items:center;gap:.75rem;padding:.65rem 1rem;cursor:pointer;border-bottom:1px solid #1a1a1a}.device-row:last-child{border-bottom:none}.device-row:hover{background:#1a1a1a}.dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.dot.online{background:#00d4aa}.dot.offline{background:#333}.dev-label{flex:1}.dev-type{color:#555;font-size:.8rem;min-width:160px}.dev-seen{color:#444;font-size:.8rem;min-width:160px;text-align:right}.device-title{margin-bottom:1.25rem}.device-title h2{font-size:.95rem;color:#aaa;text-transform:none;letter-spacing:0}.dev-num{color:#555;font-size:.85rem}.controls{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem;flex-wrap:wrap}.controls select{flex:1;min-width:220px;background:#151515;border:1px solid #2a2a2a;color:#e0e0e0;padding:.45rem .6rem;border-radius:4px;font-size:.9rem;outline:none}.controls select:focus{border-color:#00d4aa}.range-tabs{display:flex;gap:.25rem}.range-tabs button{background:#151515;border:1px solid #2a2a2a;color:#666;padding:.4rem .75rem;border-radius:4px;cursor:pointer;font-size:.85rem}.range-tabs button:hover{border-color:#444;color:#aaa}.range-tabs button.active{background:#00d4aa;border-color:#00d4aa;color:#0d0d0d;font-weight:600}.chart-wrap{background:#111;border:1px solid #1e1e1e;border-radius:6px;padding:1rem .5rem 1rem 0}.loading{text-align:center;padding:5rem;color:#444}.empty{text-align:center;padding:5rem;color:#333}.error{color:#f55;padding:1rem}.tab-bar{display:flex;gap:.25rem;margin-bottom:1.25rem;border-bottom:1px solid #1e1e1e;padding-bottom:.5rem}.tab-bar button{background:none;border:none;color:#666;padding:.4rem .9rem;cursor:pointer;font-size:.9rem;border-radius:4px}.tab-bar button.active{color:#00d4aa;background:#111}.tab-bar button:hover{color:#ccc}.tab-toolbar{margin-bottom:1rem}.admin-table{width:100%;border-collapse:collapse;font-size:.9rem}.admin-table th{text-align:left;color:#555;font-weight:500;padding:.5rem .75rem;border-bottom:1px solid #1e1e1e;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.admin-table td{padding:.6rem .75rem;border-bottom:1px solid #181818}.admin-table tr:hover td{background:#141414}.actions{display:flex;gap:.35rem;justify-content:flex-end}.btn-primary{background:#00d4aa;border:none;border-radius:4px;color:#0d0d0d;font-weight:600;padding:.45rem .9rem;cursor:pointer;font-size:.85rem}.btn-primary:hover{background:#00bfa0}.btn-sm{background:#1a1a1a;border:1px solid #2a2a2a;color:#888;padding:.3rem .6rem;border-radius:3px;cursor:pointer;font-size:.8rem}.btn-sm:hover{border-color:#444;color:#ccc}.btn-sm.danger{color:#c05;border-color:#2a0011}.btn-sm.danger:hover{background:#1a0008;color:#f36}.role-badge{font-size:.75rem;padding:.15rem .45rem;border-radius:3px}.role-badge.super_admin{background:#1a0d33;color:#a78bfa}.role-badge.owner{background:#0d1a0d;color:#4ade80}.role-badge.viewer{background:#111;color:#666}.muted{color:#555;font-size:.85rem}.card-actions{display:flex;gap:.35rem;margin-left:auto}.site-detail{border-top:1px solid #1e1e1e;padding:.75rem 1rem 1rem}.detail-section{margin-bottom:1rem}.detail-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#555}.detail-row{display:flex;align-items:center;gap:.75rem;padding:.4rem 0;border-bottom:1px solid #181818;font-size:.88rem}.detail-row:last-child{border-bottom:none}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:100}.modal{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:8px;width:400px;max-width:95vw}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.1rem;border-bottom:1px solid #222;font-weight:500}.modal-body{padding:1.1rem;display:flex;flex-direction:column;gap:.6rem}.modal-body label{font-size:.8rem;color:#666;text-transform:uppercase;letter-spacing:.04em}.modal-body input,.modal-body select{background:#111;border:1px solid #2a2a2a;border-radius:4px;color:#e0e0e0;padding:.5rem .65rem;font-size:.9rem;outline:none}.modal-body input:focus,.modal-body select:focus{border-color:#00d4aa}.modal-footer{display:flex;justify-content:flex-end;gap:.5rem;padding:.75rem 1.1rem;border-top:1px solid #222}
