*{box-sizing:border-box}:root{--bg:#f3f6fb;--panel:#fff;--soft:#f8fafc;--text:#0f172a;--muted:#64748b;--border:#e2e8f0;--blue:#2563eb;--blue-dark:#1d4ed8;--green:#22c55e;--red:#ef4444;--orange:#f59e0b;--purple:#7c3aed;--cyan:#06b6d4;--navy:#061426;--shadow:0 12px 28px #0f172a14}body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font-family:inherit}button{cursor:pointer}.app-shell{grid-template-columns:230px minmax(0,1fr);min-height:100vh;display:grid}.app-shell.sidebar-closed{grid-template-columns:78px minmax(0,1fr)}.sidebar{color:#fff;background:linear-gradient(#061426 0%,#08203c 100%);min-height:100vh;padding:22px 16px;position:sticky;top:0;overflow:hidden}.brand{align-items:center;gap:12px;margin-bottom:34px;display:flex}.brand-icon{background:linear-gradient(135deg,#0ea5e9,#2563eb);border-radius:16px;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.brand strong{font-size:19px;display:block}.brand span{color:#bfdbfe;font-size:13px;display:block}.sidebar-nav{flex-direction:column;gap:8px;display:flex}.sidebar-nav button{color:#dbeafe;text-align:left;background:0 0;border:0;border-radius:14px;align-items:center;gap:12px;height:48px;padding:0 14px;font-weight:800;display:flex}.sidebar-nav button:hover,.sidebar-nav button.active{color:#fff;background:#2563eb59}.system-box{background:#ffffff0f;border:1px solid #ffffff1a;border-radius:18px;padding:16px;position:absolute;bottom:22px;left:16px;right:16px}.system-box div{align-items:center;gap:8px;display:flex}.system-box p{color:#86efac;margin:8px 0;font-weight:900}.system-box small{color:#cbd5e1}.system-dot{background:var(--green);border-radius:999px;width:11px;height:11px}.main-content{min-width:0;padding:22px}.topbar{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:22px;align-items:center;gap:18px;margin-bottom:22px;padding:16px 20px;display:flex}.menu-button,.icon-button{width:42px;height:42px;color:var(--blue);background:#eff6ff;border:0;border-radius:14px;justify-content:center;align-items:center;display:inline-flex;position:relative}.icon-button span{background:var(--blue);color:#fff;border-radius:999px;justify-content:center;align-items:center;min-width:20px;height:20px;font-size:12px;display:inline-flex;position:absolute;top:-6px;right:-6px}.topbar-title{flex:1}.topbar-title h1{margin:0;font-size:25px}.topbar-title p{color:var(--muted);margin:5px 0 0}.topbar-user{align-items:center;gap:14px;display:flex}.admin-chip{align-items:center;gap:10px;display:flex}.avatar{color:#fff;background:#0f172a;border-radius:999px;justify-content:center;align-items:center;width:42px;height:42px;font-weight:900;display:inline-flex}.admin-chip strong,.admin-chip small{display:block}.admin-chip small{color:var(--muted);font-size:12px}.message{color:#1e40af;background:#eff6ff;border:1px solid #bfdbfe;border-radius:16px;margin-bottom:20px;padding:14px 18px;font-weight:800}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:20px;display:grid}.kpi-card{background:var(--panel);border:1px solid var(--border);border-left:5px solid var(--blue);box-shadow:var(--shadow);border-radius:20px;justify-content:space-between;gap:14px;min-height:125px;padding:18px;display:flex}.kpi-card span{color:var(--muted);font-weight:900}.kpi-card strong{margin:8px 0 4px;font-size:31px;display:block}.kpi-card small{color:var(--muted);font-weight:800}.kpi-icon{width:48px;height:48px;color:var(--blue);background:#eff6ff;border-radius:18px;justify-content:center;align-items:center;display:inline-flex}.kpi-card.green{border-left-color:var(--green)}.kpi-card.green .kpi-icon{color:#16a34a;background:#dcfce7}.kpi-card.red{border-left-color:var(--red)}.kpi-card.red .kpi-icon{color:#dc2626;background:#fee2e2}.kpi-card.orange{border-left-color:var(--orange)}.kpi-card.orange .kpi-icon{color:#d97706;background:#fef3c7}.kpi-card.purple{border-left-color:var(--purple)}.kpi-card.purple .kpi-icon{color:#7c3aed;background:#ede9fe}.kpi-card.cyan{border-left-color:var(--cyan)}.kpi-card.cyan .kpi-icon{color:#0891b2;background:#cffafe}.panel{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:22px;min-width:0;padding:22px}.panel-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;display:flex}.panel-header h2{margin:0;font-size:20px}.panel-header p{color:var(--muted);margin:5px 0 0}.panel-header button,.form button,.filters button,.scanner-form button,.scanner-link-form button,.inline-actions button,.drawer-actions button,.drawer-actions a,.drawer-buttons button{background:var(--blue);color:#fff;border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:0 14px;font-weight:900;text-decoration:none;display:inline-flex}button:hover,.drawer-actions a:hover{filter:brightness(.95)}button:disabled{opacity:.6;cursor:not-allowed}.dashboard-grid{grid-template-columns:minmax(0,1.6fr) minmax(340px,.8fr);gap:20px;margin-bottom:20px;display:grid}.dashboard-bottom{grid-template-columns:minmax(0,1fr) minmax(420px,.8fr);gap:20px;display:grid}.chart-box{height:310px}.donut-content{grid-template-columns:minmax(0,1fr) 130px;align-items:center;gap:12px;display:grid}.donut-legend{flex-direction:column;gap:12px;display:flex}.donut-legend div{grid-template-columns:12px 1fr auto;align-items:center;gap:8px;display:grid}.donut-legend span{border-radius:999px;width:11px;height:11px}.donut-legend small{color:var(--muted);font-weight:900}.page-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px;display:grid}.form,.two-columns,.filters,.scanner-form,.scanner-link-form,.drawer-form{gap:14px;display:grid}.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}.full-field{grid-column:1/-1}label{color:#334155;font-size:13px;font-weight:900}input,select{background:#fff;border:1px solid #cbd5e1;border-radius:13px;outline:none;width:100%;min-height:42px;margin-top:7px;padding:0 13px}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #2563eb1f}.check-label{align-items:center;gap:9px;display:flex}.check-label input{width:auto;min-height:auto;margin:0}.olt-summary-list{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;display:grid}.olt-summary-card{background:var(--soft);border:1px solid var(--border);border-radius:18px;padding:16px}.olt-summary-top{justify-content:space-between;gap:12px;margin-bottom:12px;display:flex}.olt-summary-card h3{margin:0}.olt-summary-card p{color:#334155;margin:8px 0}.inline-actions{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.inline-actions button{min-height:34px;padding:0 10px;font-size:12px}.danger,.inline-actions .danger{background:var(--red)!important}.secondary{color:#334155!important;background:#e2e8f0!important}.method-badge,.access-badge,.access-link,.status-pill{border-radius:999px;justify-content:center;align-items:center;padding:5px 9px;font-size:12px;font-weight:900;text-decoration:none;display:inline-flex}.method-badge,.access-badge,.access-link{color:#1d4ed8;background:#dbeafe}.access-badges{flex-wrap:wrap;gap:6px;display:flex}.status-pill{color:#334155;background:#e2e8f0}.status-pill.online{color:#166534;background:#dcfce7}.status-pill.offline{color:#991b1b;background:#fee2e2}.status-pill.unknown{color:#334155;background:#e2e8f0}.mini-onu-list{gap:10px;display:grid}.mini-onu-row{background:var(--soft);border:1px solid var(--border);border-radius:14px;grid-template-columns:1fr auto 42px;align-items:center;gap:12px;padding:12px;display:grid}.mini-onu-row strong,.mini-onu-row small{display:block}.mini-onu-row small{color:var(--muted)}.mini-onu-row button,.kebab-button{border:1px solid var(--border);color:#334155;background:#fff;border-radius:12px;justify-content:center;align-items:center;width:38px;height:38px;display:inline-flex}.filters{grid-template-columns:minmax(260px,1.6fr) 150px 150px 180px 100px;align-items:end;margin-bottom:16px}.scanner-form{grid-template-columns:minmax(180px,1fr) minmax(260px,1.7fr) 120px 120px 90px 140px;align-items:end;margin-bottom:14px}.scanner-link-form{grid-template-columns:minmax(250px,1fr) minmax(330px,1.5fr) 160px;align-items:end;margin-bottom:16px}.table-wrap{border:1px solid var(--border);border-radius:18px;width:100%;max-height:calc(100vh - 260px);overflow:auto}.scanner-table{max-height:calc(100vh - 340px)}table{border-collapse:collapse;width:100%;min-width:1120px}th{z-index:2;color:#334155;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;background:#f8fafc;padding:12px 14px;font-size:13px;position:sticky;top:0}td{vertical-align:middle;border-bottom:1px solid #eef2f7;padding:12px 14px;font-size:14px}tbody tr:hover{background:#f8fafc}td strong,td small{display:block}td small{color:var(--muted);margin-top:4px;font-size:12px}.bad-row{background:#fff7ed}.bad-rx{color:#dc2626;font-weight:900}.empty-state{text-align:center;color:var(--muted);padding:60px 20px}.drawer-backdrop{z-index:1000;background:#0f172a59;justify-content:flex-end;display:flex;position:fixed;inset:0}.drawer{background:#fff;width:420px;max-width:96vw;height:100vh;padding:22px;overflow-y:auto;box-shadow:-20px 0 60px #0f172a38}.drawer-header{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:20px;display:flex}.drawer-header h2{margin:0}.drawer-header p{color:var(--muted);margin:5px 0 0}.drawer-header button{color:#334155;background:#f1f5f9;border:0;border-radius:12px;width:38px;height:38px}.drawer-actions{gap:12px;display:grid}.drawer-actions button,.drawer-actions a{justify-content:center;width:100%}.drawer-form{gap:16px}.drawer-buttons{gap:10px;margin-top:8px;display:flex}@media (width<=1400px){.dashboard-grid,.dashboard-bottom,.page-grid{grid-template-columns:1fr}.scanner-form{grid-template-columns:repeat(3,1fr)}.scanner-link-form{grid-template-columns:1fr 1fr}.scanner-link-form button{grid-column:1/-1}}@media (width<=1000px){.app-shell,.app-shell.sidebar-open,.app-shell.sidebar-closed{grid-template-columns:1fr}.sidebar{min-height:auto;position:relative}.system-box{margin-top:20px;position:static}.filters,.scanner-form,.scanner-link-form,.two-columns{grid-template-columns:1fr}.topbar{flex-wrap:wrap}.topbar-user{margin-left:auto}}@media (width<=700px){.main-content{padding:14px}.kpi-grid{grid-template-columns:1fr}.admin-chip{display:none}.panel{padding:16px}.topbar-title h1{font-size:20px}}.app-shell{width:100vw;max-width:none}.main-content{width:100%;max-width:none;overflow-x:hidden}.topbar,.kpi-grid,.dashboard-grid,.dashboard-bottom,.page-grid,.panel{width:100%;max-width:none}@media (width<=1600px){.kpi-grid{grid-template-columns:repeat(3,minmax(220px,1fr))}}@media (width<=1000px){.kpi-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}}@media (width<=650px){.kpi-grid{grid-template-columns:1fr}}.table-actions{align-items:center;gap:8px;display:flex}.manage-button{color:#fff;cursor:pointer;white-space:nowrap;background:#2563eb;border:0;border-radius:12px;min-height:38px;padding:0 14px;font-weight:900}.manage-button:hover{background:#1d4ed8}.table-wrap table{min-width:1420px}td:nth-child(2),td:nth-child(3),td:nth-child(4){white-space:nowrap}td small{text-overflow:ellipsis;max-width:230px;overflow:hidden}.drawer-pppoe-info{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;margin-bottom:6px;padding:14px}.drawer-pppoe-info h3{margin:0 0 10px;font-size:16px}.drawer-pppoe-info p{color:#334155;margin:6px 0;font-size:14px}.drawer-pppoe-info strong{color:#0f172a}.filters{grid-template-columns:minmax(260px,1.7fr) 140px 140px 170px 150px 110px}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(175px,1fr))}@media (width<=1200px){.filters{grid-template-columns:repeat(3,minmax(180px,1fr))}.filters button{grid-column:span 1}}@media (width<=750px){.filters{grid-template-columns:1fr}}.pppoe-manual-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:10px;margin:8px 0;padding:14px;display:grid}.pppoe-manual-card h3{color:#0f172a;margin:0;font-size:16px}.pppoe-manual-card label{color:#475569;gap:5px;font-size:13px;font-weight:700;display:grid}.pppoe-manual-card input{border:1px solid #cbd5e1;border-radius:12px;outline:none;width:100%;padding:10px 12px;font-size:14px}.pppoe-manual-card input:focus{border-color:#2563eb}.pppoe-manual-actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.pppoe-manual-actions button{min-height:38px}.pppoe-manual-actions .danger{color:#991b1b;background:#fee2e2;border-color:#fecaca}.pppoe-selector-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;gap:10px;padding:12px;display:grid}.pppoe-selector-actions{grid-template-columns:1fr 110px;gap:8px;display:grid}.pppoe-selector-box input{border:1px solid #cbd5e1;border-radius:12px;width:100%;padding:10px 12px;font-size:14px}.pppoe-candidate-list{gap:6px;max-height:260px;display:grid;overflow:auto}.pppoe-candidate-list button{text-align:left;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:12px;gap:3px;padding:10px;display:grid}.pppoe-candidate-list button:hover{background:#eff6ff;border-color:#2563eb}.pppoe-candidate-list strong{color:#0f172a;font-size:14px}.pppoe-candidate-list span{color:#64748b;font-size:12px}.management-lookup-panel{background:#fff;border:1px solid #e2e8f0;border-radius:22px;gap:14px;margin:18px 0;padding:18px;display:grid;box-shadow:0 10px 25px #0f172a0a}.management-lookup-panel h2{color:#0f172a;margin:0}.management-lookup-panel p{color:#64748b;margin:4px 0 0}.management-lookup-form{grid-template-columns:1fr 130px;gap:10px;display:grid}.management-lookup-form input{border:1px solid #cbd5e1;border-radius:14px;outline:none;padding:12px 14px;font-size:15px}.management-lookup-form input:focus{border-color:#2563eb}.management-lookup-form button{color:#fff;cursor:pointer;background:#2563eb;border:0;border-radius:14px;font-weight:800}.management-lookup-result{background:#f8fafc;border:1px solid #e2e8f0;border-radius:18px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;padding:14px;display:grid}.management-lookup-result.linked{background:#f0fdf4;border-color:#bbf7d0}.management-lookup-result.unlinked{background:#fff7ed;border-color:#fed7aa}.management-lookup-result div{gap:3px;display:grid}.management-lookup-result span{color:#64748b;text-transform:uppercase;font-size:12px;font-weight:800}.management-lookup-result strong{color:#0f172a;word-break:break-word;font-size:14px}.lookup-warning{background:#ffedd5;border:1px solid #fed7aa;border-radius:14px;grid-column:1/-1;padding:10px 12px;font-weight:700;color:#9a3412!important}@media (width<=700px){.management-lookup-form{grid-template-columns:1fr}.management-lookup-form button{min-height:42px}}.reprovision-progress-card{background:#0f172a0f;border:1px solid #94a3b859;border-radius:14px;margin:10px 0;padding:12px}.reprovision-progress-card strong{margin-bottom:6px;display:block}.reprovision-progress-card p{margin:0 0 8px;font-size:13px}.reprovision-progress-card small{opacity:.75;margin-top:6px;display:block}.reprovision-progress-bar{background:#94a3b859;border-radius:999px;width:100%;height:9px;overflow:hidden}.reprovision-progress-bar span{background:linear-gradient(90deg,#0ea5e9,#22c55e);border-radius:999px;height:100%;transition:width .4s;display:block}.pppoe-duplicates-panel{background:#0f172a0a;border:1px solid #94a3b859;border-radius:16px;margin:14px 0;padding:14px}.pppoe-duplicates-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.pppoe-duplicates-header p{opacity:.75;margin:4px 0 0;font-size:13px}.pppoe-duplicates-ok{background:#22c55e1f;border:1px solid #22c55e47;border-radius:12px;margin-top:10px;padding:10px;font-size:13px}.pppoe-duplicates-alert{background:#f59e0b1f;border:1px solid #f59e0b52;border-radius:12px;margin-top:10px;padding:10px}.pppoe-duplicate-item{border-top:1px solid #94a3b84d;margin-top:10px;padding-top:10px}.pppoe-duplicate-item small{opacity:.75;margin-top:2px;display:block}.pppoe-duplicate-item ul{margin:8px 0 0;padding-left:18px}.pppoe-duplicate-item li{margin:3px 0;font-size:13px}.offline-cleanup-panel{background:#0f172a0a;border:1px solid #94a3b859;border-radius:16px;margin:14px 0;padding:14px}.offline-cleanup-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.offline-cleanup-header p{opacity:.75;margin:4px 0 0;font-size:13px}.offline-cleanup-actions{flex-wrap:wrap;align-items:end;gap:8px;display:flex}.offline-cleanup-actions label{flex-direction:column;gap:4px;font-size:12px;display:flex}.offline-cleanup-actions input{width:72px}.danger-button{background:#ef44441f!important;border-color:#ef444473!important}.offline-cleanup-empty{background:#94a3b81f;border:1px solid #94a3b847;border-radius:12px;margin-top:10px;padding:10px;font-size:13px}.offline-cleanup-ok{background:#22c55e1f;border:1px solid #22c55e47;border-radius:12px;margin-top:10px;padding:10px;font-size:13px}.offline-cleanup-alert{background:#ef44441a;border:1px solid #ef44444d;border-radius:12px;margin-top:10px;padding:10px}.offline-cleanup-alert ul{margin:8px 0 0;padding-left:18px}.offline-cleanup-alert li{margin:3px 0;font-size:13px}.offline-cleanup-alert small{opacity:.75;margin-top:8px;display:block}.audit-panel{background:#0f172a0a;border:1px solid #94a3b859;border-radius:16px;margin:14px 0;padding:14px}.audit-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.audit-header h3{margin:0}.audit-header p{opacity:.75;margin:4px 0 0;font-size:13px}.audit-empty{background:#94a3b81f;border:1px solid #94a3b847;border-radius:12px;margin-top:10px;padding:10px;font-size:13px}.audit-list{gap:8px;margin-top:10px;display:grid}.audit-item{background:#ffffff8c;border:1px solid #94a3b840;border-radius:12px;grid-template-columns:1fr auto;gap:8px;padding:10px;display:grid}.audit-item small{opacity:.7;margin-top:2px;display:block}.audit-item p{grid-column:1/-1;margin:0;font-size:13px}.audit-ok,.audit-error{font-size:12px;font-weight:700}.audit-ok{color:#16a34a}.audit-error{color:#dc2626}html,body,#root{width:100%;min-width:100%;min-height:100vh;margin:0;padding:0}body{background:#f3f6fb;overflow-x:hidden}@media (width<=768px){html,body,#root{width:100%;min-height:100%;overflow-x:hidden}body{background:#eef3f8}.app,.app-layout,.layout,.main-layout,.dashboard-layout{width:100%!important;max-width:100%!important;display:block!important;overflow-x:hidden!important}aside,.sidebar,.side-menu,.app-sidebar{border-radius:0 0 26px 26px!important;width:100%!important;min-width:100%!important;max-width:100%!important;height:auto!important;min-height:auto!important;padding:22px 18px!important;position:relative!important}aside nav,.sidebar nav,.side-menu nav{grid-template-columns:repeat(2,1fr)!important;gap:10px!important;display:grid!important}aside a,aside button,.sidebar a,.sidebar button,.nav-item{border-radius:16px!important;justify-content:flex-start!important;width:100%!important;min-height:52px!important;font-size:15px!important}.main,main,.content,.main-content,.page-content{width:100%!important;margin-left:0!important;padding:14px!important;overflow-x:hidden!important}header,.header,.topbar,.page-header{border-radius:22px!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:12px!important;width:100%!important;margin:12px 0!important;padding:18px!important;display:grid!important}header h1,.header h1,.page-header h1{word-break:normal!important;font-size:25px!important;line-height:1.05!important}header p,.header p,.page-header p{font-size:15px!important;line-height:1.25!important}.dashboard-grid,.cards-grid,.stats-grid,.grid-kpi,.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;display:grid!important}.card,.kpi,.panel,.dashboard-card{border-radius:20px!important;width:100%!important;min-width:0!important;padding:16px!important}.card .value,.kpi .value,.stat-value{font-size:28px!important}table{min-width:720px!important}.table-scroll,.table-wrapper,.responsive-table{-webkit-overflow-scrolling:touch!important;width:100%!important;overflow-x:auto!important}iframe{border-radius:18px!important;width:100%!important;min-height:75vh!important}button,input,select{font-size:16px!important}.floating-sync,.sync-all-button,button[style*=fixed]{z-index:9999!important;max-width:calc(100vw - 28px)!important;bottom:18px!important;right:14px!important}}@media (width<=430px){.dashboard-grid,.cards-grid,.stats-grid,.grid-kpi,.kpi-grid,aside nav,.sidebar nav,.side-menu nav{grid-template-columns:1fr!important}header,.header,.topbar,.page-header{grid-template-columns:1fr auto!important}header h1,.header h1,.page-header h1{font-size:24px!important}}