*{box-sizing:border-box}:root{--sidebar-width:220px}html,body{color:#f5f7fa;background:#0d0f13;min-height:100%;margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}.sidebar{width:var(--sidebar-width);z-index:100;background:#101319;border-right:1px solid #252b35;padding:24px 14px;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.mobile-menu-button{display:none}.main-content{margin-left:var(--sidebar-width);background:#0d0f13;min-height:100vh;padding:36px 38px}.auth-page{background:radial-gradient(circle at 20% 15%,#1b2736 0,#0000 30%),#0d0f13;place-items:center;min-height:100vh;padding:24px;display:grid}.auth-main{min-height:100vh}.auth-panel{background:#12171f;border:1px solid #293342;border-radius:10px;width:min(100%,390px);padding:34px;box-shadow:0 24px 70px #00000047}.auth-brand{align-items:center;gap:12px;margin-bottom:42px;display:flex}.auth-title{margin:0;font-size:26px;font-weight:500}.auth-subtitle{color:#74839a;margin:7px 0 26px;font-size:12px}.auth-form{gap:17px;display:grid}.auth-form label{color:#aeb9ca;gap:8px;font-size:12px;display:grid}.auth-form input{color:#f5f7fa;width:100%;font:inherit;background:#0d1117;border:1px solid #2b3442;border-radius:6px;outline:none;padding:11px 12px}.auth-form input:focus{border-color:#6b7f9c}.auth-form button{color:#11161d;background:#e8edf4;width:100%;margin-top:5px;font-weight:600}.auth-form button:hover{background:#fff}.auth-form button:disabled{cursor:wait;opacity:.65}.auth-error{color:#ff9da7;background:#27171b;border:1px solid #713c43;border-radius:6px;padding:10px 12px;font-size:12px}.auth-loading{color:#74839a;background:#0d0f13;place-items:center;min-height:100vh;font-size:13px;display:grid}.logout-button{color:#b9a5aa;width:100%;margin-top:26px}.brand{align-items:center;gap:12px;margin-bottom:34px;padding:0 10px;display:flex}.brand-logo{color:#111;background:#f5f5f5;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;font-size:17px;font-weight:700;display:flex}.brand-name{letter-spacing:.2px;font-size:19px;font-weight:600;line-height:1.2}.brand-subtitle{color:#66758d;margin-top:3px;font-size:10px}.sidebar-nav{flex-direction:column;gap:4px;display:flex}.nav-item{color:#9ba8bd;border-radius:6px;align-items:center;min-height:38px;padding:0 12px;font-size:13px;text-decoration:none;transition:background-color .15s,color .15s;display:flex}.nav-item:hover{color:#f1f4f8;background:#181d26}.nav-item.active{color:#fff;background:#202733}.page{width:100%;max-width:1400px;margin:0 auto}.page-title{letter-spacing:-.4px;margin:0;font-size:28px;font-weight:500}.page-subtitle{color:#66758d;margin:6px 0 0;font-size:12px}button,.button{color:#e8edf4;cursor:pointer;background:#151a22;border:1px solid #2b3442;border-radius:6px;padding:9px 13px;font-size:12px;transition:background-color .15s,border-color .15s}button:hover,.button:hover{background:#1c222c;border-color:#394556}.back-button{color:#c5cfdd;background:#151a22;border:1px solid #2b3442;border-radius:6px;align-items:center;margin-bottom:24px;padding:8px 12px;font-size:12px;text-decoration:none;display:inline-flex}.back-button:hover{background:#1c222c}.cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.card{background:#12161c;border:1px solid #272e39;border-radius:7px;min-height:105px;padding:18px}.card-label{color:#71829a;text-transform:uppercase;letter-spacing:.8px;font-size:10px;font-weight:500}.card-value{color:#f3f6fa;margin-top:10px;font-size:27px;font-weight:500}.card-description{color:#607089;margin-top:7px;font-size:10px}.panel{background:#12161c;border:1px solid #272e39;border-radius:7px;margin-top:18px;overflow:hidden}.panel-header{border-bottom:1px solid #272e39;justify-content:space-between;align-items:center;padding:17px 18px;display:flex}.panel-title{margin:0;font-size:14px;font-weight:600}.panel-subtitle{color:#64738b;margin-top:5px;font-size:10px}.table-wrapper{overflow-x:auto}table{border-collapse:collapse;width:100%}th{color:#71829a;text-align:left;text-transform:uppercase;letter-spacing:.7px;background:#10141a;border-bottom:1px solid #272e39;padding:11px 18px;font-size:9px;font-weight:500}td{color:#dce2ea;border-bottom:1px solid #222832;padding:12px 18px;font-size:11px}tbody tr:hover{background:#161b22}tbody tr:last-child td{border-bottom:none}.status:before{content:"";background:#75839a;border-radius:50%;width:6px;height:6px}.status.online:before{background:#36d98b}.status.offline:before{background:#e46b75}.badge{color:#aebbd0;background:#171d26;border:1px solid #2b3442;border-radius:4px;padding:3px 7px;font-size:9px;display:inline-block}@media (max-width:900px){:root{--sidebar-width:190px}.sidebar{width:var(--sidebar-width)}.main-content{margin-left:var(--sidebar-width);padding:28px 24px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:650px){.sidebar{display:none}.sidebar.mobile-open{border-bottom:0;border-right:1px solid #252b35;width:min(78vw,260px);height:100vh;padding:20px 14px;display:block;position:fixed;top:0;bottom:0;left:0;box-shadow:18px 0 40px #00000059}.mobile-menu-button{z-index:110;justify-content:center;align-items:center;width:38px;height:34px;padding:0;font-size:18px;line-height:1;display:flex;position:fixed;top:12px;left:auto;right:12px}.main-content{margin-left:0;padding:58px 12px 32px}.cards{grid-template-columns:1fr}.page-header{flex-direction:column;gap:15px}}.audit-summary{grid-template-columns:repeat(4,minmax(0,1fr))}.audit-error{color:#f08a91;background:#24161a;border:1px solid #49252c;border-radius:6px;margin-bottom:18px;padding:12px 14px;font-size:12px}.gap-count{color:#8d9ab0;font-size:11px}.gap-item{border-bottom:1px solid #222832;justify-content:space-between;align-items:center;min-height:62px;padding:12px 18px;display:flex}.gap-ip{color:#dce2ea;font-family:monospace;font-size:11px;font-weight:600}.gap-description{color:#66758d;margin-top:4px;font-size:10px}.audit-empty-state{color:#68778e;text-align:center;padding:28px 18px;font-size:11px}.ip-address{color:#cbd5e3;font-family:monospace;font-size:11px}@media (max-width:1000px){.audit-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:650px){.audit-summary,.gap-grid{grid-template-columns:1fr}.gap-item:nth-child(odd){border-right:none}}.audit-toolbar{border-bottom:1px solid #252b35;align-items:center;gap:10px;padding:16px;display:flex}.audit-toolbar input,.audit-toolbar select{color:#e8edf5;background:#11151b;border:1px solid #2a303b;border-radius:6px;outline:none;height:38px;padding:0 12px;font-size:13px}.audit-toolbar input{width:320px}.audit-toolbar select{width:150px}.audit-toolbar input::placeholder{color:#687386}.audit-toolbar input:focus,.audit-toolbar select:focus{border-color:#465267}.clear-filter{color:#c8d0dc;cursor:pointer;background:#181d25;border:1px solid #2a303b;border-radius:6px;height:38px;padding:0 14px}.clear-filter:hover{background:#202632}.audit-result-info{color:#718096;border-bottom:1px solid #252b35;padding:10px 16px;font-size:12px}.audit-result-info strong{color:#cbd5e1}.ip-audit-page{box-sizing:border-box;width:100%;max-width:1280px;margin:0 auto;padding:28px 36px 60px}.page-header{justify-content:space-between;align-items:flex-start;margin-bottom:26px;display:flex}.page-header h1{margin:22px 0 4px;font-size:28px}.page-header p{color:#71809a;margin:0;font-size:13px}.back-button,.refresh-button{color:#dce5f2;cursor:pointer;background:#11151b;border:1px solid #293241;border-radius:6px;align-items:center;height:34px;padding:0 12px;font-size:12px;text-decoration:none;display:inline-flex}.refresh-button{margin-top:4px}.back-button:hover,.refresh-button:hover{background:#1b222d}.audit-summary{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px;display:grid}.audit-card{box-sizing:border-box;background:#11151b;border:1px solid #29313d;border-radius:7px;min-height:94px;padding:17px}.audit-card span{color:#7890ae;letter-spacing:.08em;margin-bottom:7px;font-size:10px;display:block}.audit-card strong{color:#edf3fa;font-size:25px;font-weight:500;display:block}.audit-card small{color:#62748f;margin-top:5px;font-size:10px;display:block}.online-value{color:#27df87!important}.offline-value{color:#f5ad35!important}.audit-section{background:#11151b;border:1px solid #29313d;border-radius:7px;margin-bottom:16px;overflow:hidden}.section-header{box-sizing:border-box;border-bottom:1px solid #29313d;justify-content:space-between;align-items:center;min-height:66px;padding:13px 16px;display:flex}.section-header h2{color:#edf3fa;margin:0 0 4px;font-size:14px}.section-count{color:#8da5c3;font-size:11px}.conflict-list{flex-direction:column;display:flex}.conflict-item{box-sizing:border-box;border-bottom:1px solid #202832;grid-template-columns:180px 1fr auto;align-items:center;gap:20px;min-height:65px;padding:10px 16px;display:grid}.conflict-item:last-child{border-bottom:0}.conflict-ip{color:#f1f5fb;font-family:monospace;font-size:12px;font-weight:600}.conflict-customers{flex-wrap:wrap;gap:7px;display:flex}.customer-badge{color:#aebed1;background:#171d25;border:1px solid #343e4c;border-radius:4px;padding:5px 8px;font-size:10px}.conflict-badge{color:#ff6d7b;border:1px solid #69333b;border-radius:4px;padding:4px 7px;font-size:9px}.gap-grid{grid-template-columns:1fr 1fr;display:grid}.gap-item{box-sizing:border-box;border-bottom:1px solid #202832;justify-content:space-between;align-items:center;min-height:58px;padding:10px 16px;display:flex}.gap-item:nth-child(odd){border-right:1px solid #202832}.gap-item strong{color:#edf3fa;font-family:monospace;font-size:11px;display:block}.gap-item small{color:#617895;margin-top:3px;font-size:9px;display:block}.empty-badge{color:#8497b0;border:1px solid #303b4a;border-radius:4px;padding:4px 7px;font-size:9px}.ip-table{width:100%}.table-header,.table-row{grid-template-columns:1.1fr 1fr 1.2fr 1.2fr;align-items:center;display:grid}.table-header{box-sizing:border-box;color:#7287a2;letter-spacing:.08em;border-bottom:1px solid #29313d;min-height:38px;padding:0 16px;font-size:9px}.table-row{box-sizing:border-box;color:#c4d0df;border-bottom:1px solid #202832;min-height:47px;padding:0 16px;font-size:11px}.table-row strong{color:#edf3fa;font-family:monospace;font-size:11px}.status i{background:#71829a;border-radius:50%;width:6px;height:6px}.status.empty{color:#71829a}.status.empty i{background:#71829a}@media (max-width:900px){.audit-summary{grid-template-columns:repeat(2,1fr)}.conflict-item{grid-template-columns:1fr;gap:8px}.gap-grid{grid-template-columns:1fr}.gap-item:nth-child(odd){border-right:0}}@media (max-width:650px){.ip-audit-page{padding:20px 15px 40px}.audit-summary{grid-template-columns:1fr}.page-header{gap:15px}.table-header,.table-row{grid-template-columns:110px 90px 130px 100px;width:530px}.ip-table{overflow-x:auto}}.traffic-page{width:100%;max-width:1400px;margin:0 auto;padding:32px 40px 60px}.traffic-header{justify-content:space-between;align-items:flex-start;margin-bottom:28px;display:flex}.traffic-header h1{margin:0;font-size:28px;font-weight:600}.traffic-header p{color:#6f8bad;margin:6px 0 0;font-size:13px}.refresh-button{color:#dce8f7;cursor:pointer;background:#12171e;border:1px solid #283445;border-radius:6px;padding:9px 15px}.refresh-button:hover{background:#1a212b}.refresh-button:disabled{opacity:.5;cursor:not-allowed}.error-box{color:#ff6878;background:#1c1115;border:1px solid #71343d;border-radius:6px;margin-bottom:20px;padding:13px 15px;font-size:13px}.traffic-summary{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;display:grid}.traffic-card{background:#11161c;border:1px solid #28313d;border-radius:7px;min-height:110px;padding:20px}.traffic-card span{color:#7592b4;letter-spacing:.08em;margin-bottom:8px;font-size:10px;display:block}.traffic-card strong{color:#e8f0fb;font-size:26px;font-weight:500;display:block}.traffic-card small{color:#607b9d;margin-top:5px;font-size:10px;display:block}.traffic-card .rx-value{color:#39e28b}.traffic-card .tx-value{color:#55a8ff}.traffic-section{background:#11161c;border:1px solid #28313d;border-radius:7px;overflow:hidden}.section-header{border-bottom:1px solid #28313d;justify-content:space-between;align-items:center;padding:18px 20px;display:flex}.section-header h2{margin:0;font-size:15px;font-weight:600}.section-header p{color:#6682a3;margin:5px 0 0;font-size:11px}.section-header>span{color:#78a5d4;font-size:11px}.traffic-table{width:100%}.table-row{color:#d7e2f0;border-bottom:1px solid #222b35;grid-template-columns:60px 1.5fr 1fr 1.3fr 1.3fr;align-items:center;min-height:54px;padding:0 20px;font-size:12px;display:grid}.table-row:last-child{border-bottom:none}.table-head{color:#6d88a8;letter-spacing:.08em;min-height:42px;font-size:9px}.interface-name{color:#edf4fc;font-weight:500}.status{align-items:center;gap:7px;font-size:10px;display:inline-flex}.status i{border-radius:50%;width:6px;height:6px;display:inline-block}.status.online{color:#32e58a}.status.online i{background:#32e58a}.status.offline{color:#ff6575}.status.offline i{background:#ff6575}.rate{font-family:monospace;font-size:11px}.rate.rx{color:#42df8c}.rate.tx{color:#5baaff}.empty-state{text-align:center;color:#6682a3;padding:50px 20px;font-size:12px}@media (max-width:900px){.traffic-summary{grid-template-columns:repeat(2,1fr)}.traffic-page{padding:25px 20px 50px}}@media (max-width:650px){.traffic-summary{grid-template-columns:1fr}.table-row{grid-template-columns:40px 1fr 80px;gap:10px}.table-row>div:nth-child(4),.table-row>div:nth-child(5){display:none}}