:root{font-family:system-ui,sans-serif;color:#e7edf6;background:#0b1220}*{box-sizing:border-box}body{margin:0}header{height:58px;padding:0 7%;display:flex;gap:22px;align-items:center;background:#111c30;border-bottom:1px solid #223451}header>a{font-weight:800;color:#7dd3fc;text-decoration:none}header span,.muted,small{color:#a8b7cf}nav{margin-left:auto;display:flex;align-items:center;gap:18px}nav a{color:#d9e6f8;text-decoration:none}button{border:0;border-radius:7px;padding:10px 14px;cursor:pointer;background:#243653;color:white}nav button{padding:6px 10px;background:transparent}nav form{margin:0}main{max-width:1050px;margin:40px auto;padding:0 22px}.card{background:#142139;border:1px solid #263b5d;border-radius:10px;padding:20px}.actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.actions a{text-decoration:none;color:#ecf5ff;display:flex;flex-direction:column;gap:7px}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:15px;align-items:end}label{display:grid;gap:6px;font-size:.9rem;color:#c1d0e7}input,select{background:#0b1220;border:1px solid #40567d;border-radius:6px;color:white;padding:10px;font:inherit}.primary{background:#087ea4}.danger{background:#b42318}.warning{color:#fbbf24}.error{border-color:#c23a4b;color:#ffb4bb}pre{white-space:pre-wrap;overflow:auto;background:#07101d;border:1px solid #263b5d;border-radius:9px;padding:17px;color:#d9e6f8}.login{max-width:400px;margin:80px auto}.login form{display:grid;gap:15px}
.table-search{width:100%;margin:8px 0 16px}.ont-port{margin:22px 0}.ont-port h3{margin:0;padding:12px 15px;background:#142139;border-radius:8px 8px 0 0;font-size:1rem}.ont-port h3 span{float:right;color:#7dd3fc;font-weight:400}.table-wrap{overflow:auto;border:1px solid #263b5d;border-radius:0 0 8px 8px}table{width:100%;border-collapse:collapse;font-size:.86rem}th,td{padding:10px 12px;text-align:left;border-bottom:1px solid #263b5d;white-space:nowrap}th{color:#9dc3e9;background:#101c30}tr:last-child td{border-bottom:0}.state{font-weight:700}.state.online{color:#4ade80}.state.offline{color:#fb7185}details{margin-top:20px}summary{cursor:pointer;color:#7dd3fc}
.empty-pon{margin:0;padding:13px 15px;color:#a8b7cf;background:#101b2e;border:1px solid #263b5d;border-top:0;border-radius:0 0 8px 8px}
.filters{display:flex;gap:14px;align-items:end;margin:8px 0 18px;padding:14px;background:#142139;border:1px solid #263b5d;border-radius:9px}.filters label{min-width:170px}.filters .filter-search{flex:1}.filters input{width:100%}@media(max-width:650px){.filters{display:grid}.filters label{min-width:0}}