:root{--ink:#0d1b2a;--muted:#667587;--line:#dce3ea;--bg:#f4f7f9;--green:#159a5b;--red:#d93845;--amber:#cc8a00;--nav:#101b26}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 Inter,Segoe UI,Arial,sans-serif;letter-spacing:0}aside{position:fixed;inset:0 auto 0 0;width:232px;background:var(--nav);color:#fff;padding:28px 18px;display:flex;flex-direction:column}.brand img{width:154px;filter:brightness(0) invert(1)}.brand span{display:block;font-size:10px;letter-spacing:2px;color:#64d99b;margin:7px 0 32px 3px}nav{display:grid;gap:6px}nav a{color:#aebbc7;text-decoration:none;padding:11px 13px;border-radius:6px}nav a:hover,nav a.on{background:#1b2c3a;color:#fff}.aside-foot{margin-top:auto;border-top:1px solid #2b3a47;padding-top:18px;display:flex;justify-content:space-between;align-items:center}.aside-foot button{background:none;border:0;color:#9eacb8;cursor:pointer}main{margin-left:232px;padding:32px 38px 60px;max-width:1800px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}h1{font-size:28px;margin:3px 0}h2{margin:0;font-size:18px}.eyebrow{text-transform:uppercase;font-size:11px;font-weight:700;color:#708093;letter-spacing:1.4px;margin:0}.live{background:#fff;border:1px solid var(--line);padding:9px 13px;border-radius:6px;color:#405064}.live i,.assets i,.wan i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:7px}.summary{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:7px;margin-bottom:30px}.summary div{padding:20px 24px;border-right:1px solid var(--line)}.summary div:last-child{border:0}.summary span{display:block;color:var(--muted);font-size:12px}.summary b{font-size:27px}.green{color:var(--green)}.amber{color:var(--amber)}.red{color:var(--red)}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}.section-title p{margin:3px 0;color:var(--muted)}button{border:0;border-radius:5px;background:var(--ink);color:#fff;padding:10px 15px;font-weight:650;cursor:pointer}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.site{background:#fff;border:1px solid var(--line);border-top:3px solid var(--green);border-radius:7px;overflow:hidden}.site.offline{border-top-color:var(--red)}.site.unknown{border-top-color:var(--amber)}.site-head{display:flex;justify-content:space-between;padding:20px 22px 15px}.site-head p{margin:0 0 2px;color:var(--muted)}.badge{height:26px;padding:4px 9px;border-radius:4px;background:#e3f7ed;color:#087440;font-weight:700;font-size:12px}.badge.offline{background:#fde9eb;color:#b82231}.badge.unknown{background:#fff3d7;color:#916100}.wan-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));border-block:1px solid var(--line);background:#f9fbfc}.wan{padding:13px 16px;border-right:1px solid var(--line)}.wan:last-child{border:0}.wan span,.wan strong,.wan small{display:block}.wan span{font-weight:700}.wan strong{font-size:12px;margin-top:3px;color:var(--muted)}.wan small{color:#8795a4}.wan.active i{background:var(--green)}.wan.standby i{background:var(--amber)}.wan.offline i{background:var(--red)}.wan.unknown i{background:#8996a5}.metrics{display:grid;grid-template-columns:repeat(3,1fr);padding:17px 22px 8px;gap:14px}.metrics span{display:block;color:var(--muted);font-size:11px}.metrics b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chart{display:block;width:calc(100% - 44px);margin:6px 22px 13px;background:#fbfcfd;border-bottom:1px solid #edf1f4}.assets{border-top:1px solid var(--line);padding:6px 22px}.assets>div{display:grid;grid-template-columns:16px 1fr auto;align-items:center;padding:8px 0;border-bottom:1px solid #edf1f4}.assets>div:last-child{border:0}.assets small{color:var(--muted)}.assets i.offline{background:var(--red)}.assets i.unknown{background:#8996a5}.site footer{padding:11px 22px;background:#fafcfd;color:#8492a1;font-size:11px}.notice,.admin-panel{background:#fff;border:1px solid var(--line);padding:24px;border-radius:7px}.login{min-height:100vh;display:grid;grid-template-columns:1.2fr .8fr;background:#fff}.login-brand{background:#111f2c;color:#fff;padding:10vh 9vw;display:flex;flex-direction:column;justify-content:space-between}.login-brand img{width:230px;filter:brightness(0) invert(1)}.login-brand h1{font-size:44px;max-width:590px;margin:12px 0}.login-brand span{color:#aebbc7;font-size:17px}.login-box{align-self:center;width:min(380px,80%);margin:auto}.login-box h2{font-size:25px}.login-box p{color:var(--muted);margin-bottom:25px}.login-box label{display:block;font-weight:650;margin:14px 0}.login-box input,.new-user input,.new-user select,td input{width:100%;margin-top:6px;padding:12px;border:1px solid #cfd8e1;border-radius:5px}.login-box button{width:100%;margin-top:10px}.login-box small{display:block;text-align:center;color:#8996a5;margin-top:18px}.error{background:#fde9eb;color:#a92834;padding:10px;border-radius:5px}.new-user{display:grid;grid-template-columns:1fr 1fr 1fr 1.5fr auto;gap:10px;margin:22px 0}.new-user>*{margin:0!important}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}td form{display:flex;gap:8px}td input{margin:0;padding:9px}@media(max-width:1000px){.grid{grid-template-columns:1fr}.summary{grid-template-columns:repeat(2,1fr)}.new-user{grid-template-columns:1fr 1fr}}@media(max-width:700px){aside{position:static;width:auto;height:auto;padding:16px}.brand span,nav{display:none}.aside-foot{position:absolute;right:16px;top:8px;border:0}main{margin:0;padding:22px 14px}.live{display:none}.summary{grid-template-columns:1fr 1fr}.summary div{padding:14px}.metrics{grid-template-columns:repeat(2,1fr)}.login{grid-template-columns:1fr}.login-brand{padding:35px 25px}.login-brand h1{font-size:28px}.login-box{padding:35px 0}.new-user{grid-template-columns:1fr}.admin-panel{overflow:auto}}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.panel-head p{margin:4px 0 0;color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 13px;border:1px solid transparent;border-radius:5px;text-decoration:none;font-weight:650;font-size:13px;white-space:nowrap;cursor:pointer}.btn.primary{background:var(--ink);color:#fff}.btn.secondary{background:#fff;color:#263747;border-color:#cfd8e1}.btn.danger{background:#fff;color:#bd2836;border-color:#efc8cd}.btn:hover{filter:brightness(.97)}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:6px}.user-table{width:100%;min-width:0;table-layout:fixed}.user-table th{background:#f7f9fb;color:#657486;font-size:11px;text-transform:uppercase}.user-table td{vertical-align:middle}.user-table td>strong,.user-table td>small{display:block}.user-table td>small{color:var(--muted);margin-top:3px}.sites-cell{max-width:420px;color:#47586a}.right{text-align:right}.actions{display:flex;justify-content:flex-end;gap:7px;flex-wrap:wrap}.actions form{margin:0}.role{display:inline-block;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:700;background:#edf1f5;color:#445466}.role.admin{background:#e4f6ec;color:#087440}.form-panel{background:#fff;border:1px solid var(--line);border-radius:7px;padding:25px;max-width:820px}.form-panel.narrow{max-width:560px}.account-form{display:grid;gap:18px}.account-form>label{display:grid;gap:6px;font-weight:650}.account-form input,.account-form select{width:100%;padding:11px 12px;border:1px solid #cfd8e1;border-radius:5px;background:#fff;color:var(--ink);font:inherit}.account-form fieldset{border:1px solid var(--line);border-radius:6px;padding:15px}.account-form legend{padding:0 7px;color:var(--muted);font-size:12px;font-weight:700}.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.checks label{display:flex;align-items:center;gap:9px;padding:10px;border:1px solid var(--line);border-radius:5px;cursor:pointer}.checks input{width:16px;margin:0}.form-actions{display:flex;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding-top:18px}.success{background:#e4f6ec;color:#087440;border:1px solid #bde8d1;padding:11px 14px;border-radius:5px;margin-bottom:16px}
@media(max-width:700px){.admin-panel,.form-panel{padding:16px}.panel-head{align-items:flex-start}.checks{grid-template-columns:1fr}.form-actions{flex-direction:column-reverse}.form-actions .btn{width:100%}}

.user-table th:nth-child(1){width:20%}.user-table th:nth-child(2){width:18%}.user-table th:nth-child(3){width:35%}.user-table th:nth-child(4){width:27%}.user-table td{overflow-wrap:anywhere}
@media(max-width:700px){.user-table{min-width:680px}}