:root{--bg:#fff;--bg-secondary:#f5f5f7;--bg-tertiary:#e8e8ed;--text-primary:#1d1d1f;--text-secondary:#6e6e73;--text-tertiary:#86868b;--accent:#0071e3;--accent-hover:#0077ed;--green:#34c759;--orange:#ff9500;--red:#ff3b30;--yellow:#fc0;--purple:#af52de;--border:#d2d2d7;--border-light:#e5e5ea;--shadow-sm:0 1px 3px #0000000a, 0 1px 2px #0000000f;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 12px 40px #0000001f;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--transition:all .2s cubic-bezier(.25, .1, .25, 1)}[data-theme=dark]{--bg:#1c1c1e;--bg-secondary:#2c2c2e;--bg-tertiary:#3a3a3c;--text-primary:#f5f5f7;--text-secondary:#a1a1a6;--text-tertiary:#6e6e73;--border:#48484a;--border-light:#38383a;--shadow-sm:0 1px 3px #0003;--shadow-md:0 4px 12px #0000004d;--shadow-lg:0 12px 40px #0006}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-secondary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5}input,select,textarea,button{font-family:inherit;font-size:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}.app{min-height:100vh;display:flex}.sidebar{background:var(--bg);border-right:1px solid var(--border-light);z-index:100;flex-direction:column;width:260px;padding:24px 0;transition:transform .3s;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-header{border-bottom:1px solid var(--border-light);margin-bottom:8px;padding:0 24px 24px}.sidebar-logo{letter-spacing:-.5px;color:var(--text-primary);font-size:20px;font-weight:700}.sidebar-logo span{color:var(--accent)}.sidebar-subtitle{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px;margin-top:4px;font-size:11px}.sidebar-nav{flex:1;padding:8px 12px;overflow-y:auto}.nav-item{border-radius:var(--radius-sm);color:var(--text-secondary);transition:var(--transition);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:12px;width:100%;padding:10px 12px;font-size:14px;font-weight:500;text-decoration:none;display:flex}.nav-item:hover{background:var(--bg-secondary);color:var(--text-primary)}.nav-item.active{background:var(--accent);color:#fff}.nav-item.active:hover{background:var(--accent-hover)}.nav-item svg{flex-shrink:0;width:20px;height:20px}.sidebar-footer{border-top:1px solid var(--border-light);padding:16px 24px}.user-info{align-items:center;gap:10px;display:flex}.user-avatar{background:var(--accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:600;display:flex}.user-name{font-size:13px;font-weight:600}.user-role{color:var(--text-tertiary);text-transform:capitalize;font-size:11px}.main-content{flex:1;min-height:100vh;margin-left:260px;padding:32px}.mobile-header{background:var(--bg);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border-light);z-index:99;justify-content:space-between;align-items:center;height:56px;padding:0 16px;display:none;position:fixed;top:0;left:0;right:0}.hamburger{cursor:pointer;color:var(--text-primary);background:0 0;border:none;padding:8px}.overlay{z-index:99;background:#0000004d;display:none;position:fixed;inset:0}.overlay.active{display:block}.main-content{transition:margin-left .3s}.sidebar-collapse-btn{cursor:pointer;color:var(--text-tertiary);border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;padding:6px;display:flex}.sidebar-collapse-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.sidebar-reopen-btn{z-index:95;background:var(--bg);border:1px solid var(--border-light);cursor:pointer;color:var(--text-primary);border-radius:10px;padding:8px;display:none;position:fixed;top:14px;left:14px}.sidebar-reopen-btn:hover{background:var(--bg-secondary)}@media (width>=769px){.app.sidebar-collapsed .sidebar{transform:translate(-100%)}.app.sidebar-collapsed .main-content{margin-left:0}.app.sidebar-collapsed .sidebar-reopen-btn{display:flex}}@media (width<=768px){.sidebar-collapse-btn{display:none}}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;display:flex}.page-title{letter-spacing:-.5px;font-size:28px;font-weight:700}.page-subtitle{color:var(--text-secondary);margin-top:2px;font-size:15px}.btn{border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);border:none;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);transform:scale(1.02)}.btn-secondary{background:var(--bg);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-secondary)}.btn-danger{background:var(--red);color:#fff}.btn-danger:hover{opacity:.9}.btn-sm{padding:6px 12px;font-size:13px}.btn-icon{border-radius:var(--radius-sm);padding:8px}.card{background:var(--bg);border-radius:var(--radius-lg);border:1px solid var(--border-light);transition:var(--transition);padding:24px}.card:hover{box-shadow:var(--shadow-md)}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px;display:grid}.stat-card{background:var(--bg);border-radius:var(--radius-lg);border:1px solid var(--border-light);transition:var(--transition);padding:20px 24px}.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.stat-label{color:var(--text-tertiary);margin-bottom:8px;font-size:13px;font-weight:500}.stat-value{letter-spacing:-1px;font-size:32px;font-weight:700}.table-container{background:var(--bg);border-radius:var(--radius-lg);border:1px solid var(--border-light);overflow:hidden}.table-header{border-bottom:1px solid var(--border-light);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:16px 24px;display:flex}.table-title{font-size:16px;font-weight:600}table{border-collapse:collapse;width:100%}th{text-align:left;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-light);background:var(--bg-secondary);padding:12px 24px;font-size:12px;font-weight:600}td{border-bottom:1px solid var(--border-light);padding:14px 24px;font-size:14px}tr:last-child td{border-bottom:none}tr:hover td{background:var(--bg-secondary)}.badge{border-radius:20px;align-items:center;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.badge-available{color:#2e7d32;background:#e8f5e9}.badge-deployed{color:#1565c0;background:#e3f2fd}.badge-maintenance{color:#e65100;background:#fff3e0}.badge-retired{color:#7b1fa2;background:#f3e5f5}.badge-disposed{color:#c62828;background:#fce4ec}.badge-admin{color:var(--accent);background:#e3f2fd}.badge-technician{color:#e65100;background:#fff3e0}.badge-viewer{background:var(--bg-secondary);color:var(--text-secondary)}[data-theme=dark] .badge-available{color:#66d97a;background:#1b3a1f}[data-theme=dark] .badge-deployed{color:#5ba3e6;background:#0d2137}[data-theme=dark] .badge-maintenance{color:#ffb84d;background:#3a2400}[data-theme=dark] .badge-retired{color:#c77dff;background:#2a1533}[data-theme=dark] .badge-disposed{color:#ff6b6b;background:#3a0f0f}[data-theme=dark] .badge-admin{color:#5ba3e6;background:#0d2137}[data-theme=dark] .badge-technician{color:#ffb84d;background:#3a2400}.form-group{margin-bottom:20px}.form-label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.form-input,.form-select{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;transition:var(--transition);background:var(--bg);color:var(--text-primary);padding:10px 14px;font-size:14px}.form-input:focus,.form-select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #0071e31a}.form-row{grid-template-columns:1fr 1fr;gap:16px;display:grid}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0006;justify-content:center;align-items:center;padding:16px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg);border-radius:var(--radius-xl);width:100%;max-width:560px;max-height:90vh;animation:.3s slideUp;overflow-y:auto}.modal-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-title{font-size:17px;font-weight:600}.modal-body{padding:24px}.modal-footer{border-top:1px solid var(--border-light);justify-content:flex-end;gap:8px;padding:16px 24px;display:flex}.close-btn{cursor:pointer;color:var(--text-tertiary);border-radius:var(--radius-sm);background:0 0;border:none;padding:4px}.close-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.search-box{position:relative}.search-box input{background:var(--bg-secondary);border:1px solid #0000;padding-left:36px}.search-box input:focus{background:var(--bg);border-color:var(--accent)}.search-box svg{color:var(--text-tertiary);width:16px;height:16px;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.filter-bar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.filter-bar select{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text-primary);padding:8px 12px;font-size:13px}.empty-state{text-align:center;color:var(--text-tertiary);padding:60px 24px}.empty-state svg{opacity:.3;margin-bottom:16px}.empty-state h3{color:var(--text-secondary);margin-bottom:8px;font-size:17px}.empty-state p{margin-bottom:20px;font-size:14px}.pagination{justify-content:center;align-items:center;gap:4px;padding:16px;display:flex}.pagination button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);cursor:pointer;transition:var(--transition);color:var(--text-primary);padding:8px 14px;font-size:13px;font-weight:500}.pagination button:hover{background:var(--bg-secondary)}.pagination button.active{background:var(--accent);color:#fff;border-color:var(--accent)}.pagination button:disabled{opacity:.4;cursor:not-allowed}.login-page{background:var(--bg-secondary);justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex}.login-card{background:var(--bg);border-radius:var(--radius-xl);width:100%;max-width:400px;box-shadow:var(--shadow-lg);padding:40px}.login-card h1{text-align:center;letter-spacing:-.5px;margin-bottom:4px;font-size:28px;font-weight:700}.login-card h1 span{color:var(--accent)}.login-subtitle{text-align:center;color:var(--text-tertiary);margin-bottom:32px;font-size:14px}.login-btn{background:var(--accent);color:#fff;border-radius:var(--radius-sm);cursor:pointer;width:100%;transition:var(--transition);border:none;padding:12px;font-size:15px;font-weight:600}.login-btn:hover{background:var(--accent-hover)}.login-error{color:#c62828;border-radius:var(--radius-sm);text-align:center;background:#fce4ec;margin-bottom:16px;padding:10px 14px;font-size:13px}.charts-grid{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;display:grid}.action-btns{gap:4px;display:flex}.action-btn{cursor:pointer;border-radius:var(--radius-sm);color:var(--text-tertiary);transition:var(--transition);background:0 0;border:none;padding:6px}.action-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.action-btn.danger:hover{color:var(--red)}.activity-list{list-style:none}.activity-item{border-bottom:1px solid var(--border-light);gap:12px;padding:12px 0;font-size:13px;display:flex}.activity-item:last-child{border-bottom:none}.activity-dot{background:var(--accent);border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-top:5px}.activity-time{color:var(--text-tertiary);margin-top:2px;font-size:12px}.toast-container{z-index:9999;flex-direction:column;gap:8px;display:flex;position:fixed;top:20px;right:20px}.toast{background:var(--text-primary);color:var(--bg);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);padding:12px 20px;font-size:14px;font-weight:500;animation:.3s slideUp}.toast-success{background:var(--green);color:#fff}.toast-error{background:var(--red);color:#fff}.global-search{position:relative}.global-search-input{border:1px solid var(--border-light);border-radius:var(--radius-sm);background:var(--bg-secondary);width:100%;color:var(--text-primary);transition:var(--transition);padding:10px 14px 10px 36px;font-size:14px}.global-search-input:focus{border-color:var(--accent);background:var(--bg);outline:none;box-shadow:0 0 0 3px #0071e31a}.global-search-results{background:var(--bg);border:1px solid var(--border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:200;max-height:400px;margin-top:4px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.search-section-title{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px;padding:10px 16px 4px;font-size:11px;font-weight:600}.search-result-item{cursor:pointer;transition:var(--transition);color:var(--text-primary);align-items:center;gap:10px;padding:10px 16px;text-decoration:none;display:flex}.search-result-item:hover{background:var(--bg-secondary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (width<=768px){.sidebar{width:280px;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.mobile-header{display:flex}.main-content{margin-left:0;padding:72px 16px 24px}.page-title{font-size:24px}.stats-grid{grid-template-columns:1fr 1fr}.stat-value{font-size:24px}.form-row,.charts-grid{grid-template-columns:1fr}table{font-size:13px}th,td{padding:10px 14px}.hide-mobile{display:none}.modal{border-radius:var(--radius-lg);max-width:100%}}@media (width<=480px){.page-header{flex-direction:column;align-items:flex-start}.stats-grid{grid-template-columns:1fr 1fr!important}}html,body,#root{max-width:100vw;overflow-x:hidden}.main-content{overflow-x:hidden}@media (width<=768px){.main-content{padding:72px 12px 24px!important}table{font-size:12px!important}th,td{padding:8px 10px!important}div[style*=gridTemplateColumns]{max-width:100%}span[style*=monospace]{word-break:break-all;font-size:10px!important}}@media (width<=480px){.main-content{padding:64px 8px 16px!important}.page-title{font-size:22px!important}}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:.9s linear infinite spin}