*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f172a;--bg-card:#1e293b;--bg-input:#334155;--border:#475569;--text:#e2e8f0;--text-muted:#94a3b8;--primary:#3b82f6;--primary-hover:#2563eb;--green:#34d399;--red:#f87171;--orange:#fbbf24;--sidebar-w:200px;--navbar-h:56px}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,sans-serif}.navbar{height:var(--navbar-h);background:var(--bg-card);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:0 1.5rem;display:flex}.navbar-brand{align-items:center;gap:.5rem;font-size:1.2rem;font-weight:600;display:flex}.navbar-logo{color:var(--primary);font-size:1.4rem}.btn-logout{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:6px;padding:.4rem .8rem;font-size:.85rem}.btn-logout:hover{border-color:var(--red);color:var(--red)}.app-layout{min-height:100vh}.app-content{min-height:calc(100vh - var(--navbar-h));display:flex}.sidebar{width:var(--sidebar-w);background:var(--bg-card);border-right:1px solid var(--border);padding:1rem 0}.sidebar-link{color:var(--text-muted);padding:.6rem 1.5rem;font-size:.9rem;text-decoration:none;display:block}.sidebar-link:hover,.sidebar-link.active{color:var(--text);background:#3b82f61a}.main-content{flex:1;padding:2rem;overflow-y:auto}.login-container{justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;width:100%;max-width:400px;padding:2.5rem}.login-header{text-align:center;margin-bottom:2rem}.login-logo{color:var(--primary);margin-bottom:.5rem;font-size:2.5rem;display:block}.login-header h1{margin-bottom:.25rem;font-size:1.5rem}.login-header p{color:var(--text-muted);font-size:.9rem}.form-group{margin-bottom:1rem}.form-group label{color:var(--text-muted);margin-bottom:.3rem;font-size:.85rem;display:block}.form-group input{background:var(--bg-input);border:1px solid var(--border);width:100%;color:var(--text);border-radius:6px;padding:.6rem .8rem;font-size:.95rem}.form-group input:focus{border-color:var(--primary);outline:none}.form-error{color:var(--red);margin-bottom:.8rem;font-size:.85rem}.btn-primary{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;width:100%;margin-top:.5rem;padding:.7rem;font-size:.95rem}.btn-primary:hover{background:var(--primary-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.dashboard h2{margin-bottom:1.5rem;font-size:1.4rem}.clients-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem;display:grid}.client-card{background:var(--bg-card);border:1px solid var(--border);cursor:pointer;border-radius:10px;padding:1.2rem;transition:border-color .2s}.client-card:hover{border-color:var(--primary)}.client-card-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.client-card-header h3{font-size:1.05rem}.client-card-body{gap:2rem;display:flex}.client-stat{flex-direction:column;display:flex}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem}.stat-value{font-size:1.3rem;font-weight:600}.stat-na{color:var(--text-muted)}.stat-alert{color:var(--orange)}.badge{border-radius:9999px;padding:.2rem .6rem;font-size:.75rem;font-weight:500}.badge-green{color:var(--green);background:#34d39926}.badge-red{color:var(--red);background:#f8717126}.badge-gray{color:var(--text-muted);background:#94a3b826}.btn-back{color:var(--text-muted);cursor:pointer;background:0 0;border:none;margin-bottom:1rem;font-size:.9rem}.btn-back:hover{color:var(--text)}.client-detail-header{align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.client-detail-header h2{font-size:1.4rem}.detail-section{margin-bottom:2rem}.detail-section h3{margin-bottom:.8rem;font-size:1.1rem}.data-table{border-collapse:collapse;width:100%}.data-table th,.data-table td{text-align:left;border-bottom:1px solid var(--border);padding:.6rem .8rem;font-size:.85rem}.data-table th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:500}.mono{font-family:monospace}.severity{border-radius:4px;padding:.15rem .5rem;font-size:.8rem}.severity-critical{color:var(--red);background:#f8717126}.severity-warning{color:var(--orange);background:#fbbf2426}.severity-info{color:var(--primary);background:#3b82f626}.page-loading,.page-error,.no-data{color:var(--text-muted);text-align:center;padding:2rem}.ps-container{background:var(--bg);justify-content:center;align-items:flex-start;min-height:100vh;padding:2rem 1rem;display:flex}.ps-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;width:100%;max-width:580px;overflow:hidden}.ps-header{text-align:center;padding:2rem 2rem 1rem}.ps-header h1{color:var(--text);margin-bottom:.25rem;font-size:1.5rem}.ps-subtitle{color:var(--text-muted);font-size:.9rem}.ps-indicator{border:1px solid;border-radius:12px;align-items:center;gap:1rem;margin:0 1.5rem 1.5rem;padding:1.2rem 1.5rem;display:flex}.ps-dot{font-size:2rem;line-height:1}.ps-status-label{font-size:1rem;font-weight:600}.ps-score{color:var(--text-muted);margin-top:.2rem;font-size:.85rem}.ps-services{padding:0 1.5rem 1rem}.ps-service-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.7rem 0;display:flex}.ps-service-row:last-child{border-bottom:none}.ps-service-name{color:var(--text);font-size:.9rem}.ps-service-badge{background:0 0;border:1px solid;border-radius:6px;align-items:center;gap:.35rem;padding:.2rem .6rem;font-size:.8rem;display:inline-flex}.ps-service-icon{font-weight:700}.ps-updated{text-align:center;color:var(--text-muted);padding:.8rem 1.5rem;font-size:.75rem}.ps-footer{text-align:center;border-top:1px solid var(--border);color:var(--text-muted);letter-spacing:.05em;padding:1rem;font-size:.7rem}.ps-loading{color:var(--text-muted);text-align:center;padding:4rem 2rem}.ps-error{color:var(--red);text-align:center;padding:4rem 2rem;font-size:1.1rem}@media (width<=480px){.ps-container{padding:.5rem}.ps-card{border-radius:12px}.ps-indicator{text-align:center;flex-direction:column;gap:.5rem;margin:0 1rem 1rem}.ps-header h1{font-size:1.3rem}}
