.dashboard,.dashboard-page{flex-direction:column;gap:24px;display:flex}@keyframes modalIn{0%{opacity:0;transform:translateY(18px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skeleton{0%{background-position:200% 0}to{background-position:-200% 0}}@media (width<=1400px){.dashboard-bottom{grid-template-columns:1fr}}@media (width<=1100px){.dashboard-middle{grid-template-columns:1fr}}@media (width<=900px){.page-header{flex-direction:column;align-items:flex-start}.modal{max-width:100%}}@media (width<=768px){.page-content{padding:18px}.stats-grid,.profile-grid,.form-grid{grid-template-columns:1fr}.table-actions{flex-wrap:wrap}.pagination{flex-direction:column;align-items:flex-start}}@media (width<=480px){.modal-header,.modal-body,.modal-footer,.card,.dashboard-card,.table-card{padding:18px}}.sidebar{color:#fff;background:linear-gradient(#0b1220 0%,#172033 100%);border-right:1px solid #ffffff0d;flex-direction:column;width:290px;min-width:290px;height:100vh;transition:width .25s,transform .25s;display:flex;position:sticky;top:0;left:0;overflow:hidden}.sidebar.collapsed{width:88px;min-width:88px}.sidebar-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:22px;display:flex}.brand{align-items:center;gap:14px;display:flex}.brand-icon{background:linear-gradient(135deg, var(--primary), #ef4444);color:#fff;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:50px;height:50px;font-size:22px;display:flex;box-shadow:0 12px 28px #dc262659}.brand h2{letter-spacing:.8px;color:#fff;font-size:19px;font-weight:700}.brand span{color:#94a3b8;letter-spacing:1px;margin-top:3px;font-size:12px;display:block}.collapse-btn{color:#fff;cursor:pointer;background:#1e293b;border:none;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .25s;display:flex}.collapse-btn:hover{background:var(--primary);transform:rotate(180deg)}.sidebar-menu{flex:1;padding:20px 14px;overflow-y:auto}.sidebar-menu::-webkit-scrollbar{width:6px}.sidebar-menu::-webkit-scrollbar-thumb{background:#334155;border-radius:999px}.menu-section{margin-bottom:28px}.section-title{color:#64748b;letter-spacing:1.2px;text-transform:uppercase;padding:0 14px 12px;font-size:11px;font-weight:700;display:block}.menu-item{color:#cbd5e1;border-radius:14px;align-items:center;gap:15px;margin-bottom:6px;padding:14px 16px;text-decoration:none;transition:background .25s,color .25s,transform .25s,box-shadow .25s;display:flex;position:relative}.menu-item:hover{color:#fff;background:#1f2b42;transform:translate(4px)}.menu-item.active{background:linear-gradient(90deg, var(--primary), #ef4444);color:#fff;box-shadow:0 12px 26px #dc262659}.menu-item.active:before{content:"";background:#fff;border-radius:999px;width:4px;height:76%;position:absolute;top:12%;left:-14px}.menu-icon{justify-content:center;align-items:center;width:22px;min-width:22px;font-size:18px;display:flex}.menu-label{white-space:nowrap;flex:1;font-size:15px;font-weight:500}.menu-badge{color:#fff;background:#ffffff26;border-radius:999px;justify-content:center;align-items:center;min-width:24px;height:24px;padding:0 8px;font-size:11px;font-weight:700;display:flex}.menu-item.active .menu-badge{background:#ffffff38}.sidebar-divider{background:#ffffff0f;height:1px;margin:16px 14px}.sidebar-bottom{border-top:1px solid #ffffff0f;padding:18px}.system-status{background:#1b263b;border-radius:14px;align-items:center;gap:12px;padding:14px;display:flex}.status-dot{background:#22c55e;border-radius:50%;flex-shrink:0;width:12px;height:12px;box-shadow:0 0 16px #22c55ecc}.system-status strong{color:#fff;font-size:14px;display:block}.system-status small{color:#94a3b8;margin-top:2px;font-size:12px;display:block}.quick-icons{grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0;display:grid}.quick-icons button{aspect-ratio:1;color:#fff;cursor:pointer;background:#1f2b42;border:none;border-radius:12px;justify-content:center;align-items:center;width:100%;font-size:17px;transition:all .25s;display:flex}.quick-icons button:hover{background:var(--primary);transform:translateY(-3px)}.version-card{background:#1b263b;border:1px solid #ffffff0d;border-radius:14px;padding:16px}.version-card strong{color:#fff;margin-bottom:4px;font-size:14px;display:block}.version-card span{color:#94a3b8;margin-bottom:8px;font-size:13px;display:block}.version-card small{color:#64748b;font-size:12px}.sidebar.collapsed .brand h2,.sidebar.collapsed .brand span,.sidebar.collapsed .section-title,.sidebar.collapsed .menu-label,.sidebar.collapsed .menu-badge,.sidebar.collapsed .system-status,.sidebar.collapsed .quick-icons,.sidebar.collapsed .version-card{display:none}.sidebar.collapsed .sidebar-header{flex-direction:column;justify-content:center;gap:16px}.sidebar.collapsed .brand{justify-content:center}.sidebar.collapsed .sidebar-menu{padding:20px 10px}.sidebar.collapsed .menu-item{justify-content:center;padding:15px 0}.sidebar.collapsed .menu-item.active:before{width:3px;left:0}.sidebar.collapsed .menu-icon{margin:0}.sidebar.collapsed .menu-item{position:relative}.sidebar.collapsed .menu-item:hover:after{content:attr(data-tooltip);color:#fff;white-space:nowrap;box-shadow:var(--shadow-md);z-index:9999;pointer-events:none;background:#0f172a;border-radius:10px;padding:8px 12px;font-size:13px;font-weight:500;position:absolute;top:50%;left:78px;transform:translateY(-50%)}.sidebar-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;visibility:hidden;z-index:998;background:#00000073;transition:all .25s;position:fixed;inset:0}.sidebar-overlay.show{opacity:1;visibility:visible}@media (width<=1200px){.sidebar{width:270px;min-width:270px}}@media (width<=992px){.sidebar{z-index:999;box-shadow:var(--shadow-lg);position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar.open{transform:translate(0)}}@media (width<=768px){.sidebar{width:300px;min-width:300px}}@media (width<=480px){.sidebar{width:100%;min-width:100%}}.menu-item,.collapse-btn,.quick-icons button{transition:background .25s,color .25s,transform .25s,box-shadow .25s}.menu-item:active{transform:scale(.98)}.quick-icons button:active,.collapse-btn:active{transform:scale(.95)}.topbar{z-index:900;background:var(--surface);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);justify-content:space-between;align-items:center;height:82px;padding:0 28px;transition:background .25s,border-color .25s;display:flex;position:sticky;top:0}.topbar-left{align-items:center;gap:18px;display:flex}.menu-btn{background:var(--card);width:46px;height:46px;color:var(--text);cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;font-size:18px;transition:all .25s;display:none}.menu-btn:hover{background:var(--primary);color:#fff}.search-box{background:var(--card);border:1px solid var(--border);border-radius:14px;align-items:center;gap:14px;width:430px;padding:14px 18px;transition:all .25s;display:flex}.search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #d904291f}.search-box svg{color:var(--text-light);font-size:16px}.search-box input{color:var(--text);background:0 0;border:none;flex:1;font-size:15px}.search-box input::placeholder{color:var(--text-light)}.topbar-right{align-items:center;gap:18px;display:flex}.network-status{background:var(--card);border:1px solid var(--border);border-radius:14px;align-items:center;gap:14px;padding:12px 18px;display:flex}.network-status svg{color:var(--success);font-size:22px}.network-status strong{color:var(--text);font-size:14px;display:block}.network-status small{color:var(--text-light);margin-top:2px;font-size:12px;display:block}.icon-btn{background:var(--card);width:48px;height:48px;color:var(--text);cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;font-size:18px;transition:all .25s;display:flex;position:relative}.icon-btn:hover{background:var(--primary);color:#fff;transform:translateY(-2px)}.icon-btn:active{transform:scale(.96)}.notification span{background:var(--danger);color:#fff;border-radius:999px;justify-content:center;align-items:center;min-width:18px;height:18px;font-size:10px;font-weight:700;display:flex;position:absolute;top:6px;right:6px}.profile{background:var(--card);border:1px solid var(--border);cursor:pointer;font:inherit;color:inherit;border-radius:14px;align-items:center;gap:14px;padding:10px 18px;transition:all .25s;display:flex}.profile:hover{border-color:var(--primary)}.profile-info{flex-direction:column;display:flex}.profile-info strong{color:var(--text);font-size:14px}.profile-info small{color:var(--text-light);font-size:12px}.profile svg:last-child{color:var(--text-light)}@media (width<=1200px){.search-box{width:320px}}@media (width<=992px){.network-status{display:none}.search-box{width:240px}}@media (width<=768px){.menu-btn{display:flex}.search-box,.profile-info{display:none}.topbar{padding:0 18px}}@media (width<=480px){.topbar{height:72px;padding:0 14px}.profile{padding:8px 12px}.avatar{font-size:36px}}.profile-menu{position:relative}.profile-menu__backdrop{z-index:40;position:fixed;inset:0}.profile-menu__dropdown{background:var(--card);border:1px solid var(--border);min-width:160px;box-shadow:var(--shadow-md);z-index:50;border-radius:12px;padding:6px;position:absolute;top:calc(100% + 8px);right:0}.profile-menu__logout{width:100%;color:var(--danger);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;padding:10px 12px;font-size:14px;font-weight:600;display:flex}.profile-menu__logout:hover{background:var(--surface2)}.layout{background:var(--bg);width:100%;min-height:100vh;display:flex;overflow:hidden}.layout-content{background:var(--bg);flex-direction:column;flex:1;min-width:0;transition:background .25s;display:flex}.page-content{background:var(--bg);flex:1;padding:28px;transition:background .25s,padding .25s;overflow:hidden auto}.page-content::-webkit-scrollbar{width:8px;height:8px}.page-content::-webkit-scrollbar-thumb{background:var(--primary);border-radius:999px}.page-content::-webkit-scrollbar-track{background:0 0}@media (width<=1200px){.page-content{padding:24px}}@media (width<=992px){.layout{position:relative}.layout-content{width:100%;min-width:0}.page-content{padding:20px}}@media (width<=768px){.layout{flex-direction:column}.page-content{padding:18px}}@media (width<=480px){.page-content{padding:14px}}.mds-btn{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border:none;outline:none;justify-content:center;align-items:center;gap:10px;min-width:fit-content;font-family:inherit;font-weight:600;transition:background .25s,color .25s,border-color .25s,transform .2s,box-shadow .25s;display:inline-flex;position:relative}.mds-btn--full{width:100%}.mds-btn.sm{border-radius:10px;height:36px;padding:0 16px;font-size:13px}.mds-btn.md{border-radius:12px;height:44px;padding:0 22px;font-size:14px}.mds-btn.lg{border-radius:14px;height:52px;padding:0 30px;font-size:15px}.mds-btn.primary{background:var(--primary);color:#fff}.mds-btn.primary:hover{filter:brightness(.95);box-shadow:var(--shadow-md);transform:translateY(-2px)}.mds-btn.secondary{background:var(--surface2);border:1px solid var(--border);color:var(--text)}.mds-btn.secondary:hover{border-color:var(--primary)}.mds-btn.success{background:var(--success);color:#fff}.mds-btn.success:hover{filter:brightness(.95)}.mds-btn.warning{background:var(--warning);color:#fff}.mds-btn.warning:hover{filter:brightness(.95)}.mds-btn.danger{background:var(--danger);color:#fff}.mds-btn.danger:hover{filter:brightness(.95)}.mds-btn.info{color:#fff;background:#2563eb}.mds-btn.info:hover{filter:brightness(.95)}.mds-btn.ghost{border:1px solid var(--border);color:var(--text);background:0 0}.mds-btn.ghost:hover{background:var(--surface2)}.mds-btn:active{transform:scale(.97)}.mds-btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.mds-btn--loading{pointer-events:none}.btn-icon{justify-content:center;align-items:center;font-size:15px;display:flex}.btn-icon--left{margin-right:2px}.btn-icon--right{margin-left:2px}.mds-btn__spinner{justify-content:center;align-items:center;display:flex}@media (width<=768px){.mds-btn--full{width:100%}}.login-page{background:var(--bg);box-sizing:border-box;justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-page *,.login-page :before,.login-page :after{box-sizing:border-box}.login-card{background:var(--card);border:1px solid var(--border);width:100%;max-width:400px;box-shadow:var(--shadow-lg);border-radius:22px;padding:36px}.login-brand{align-items:center;gap:14px;margin-bottom:28px;display:flex}.login-brand-icon{background:var(--primary);color:#fff;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;font-size:22px;font-weight:700;display:flex}.login-brand h1{color:var(--text);font-size:20px;font-weight:700}.login-brand p{color:var(--text-light);margin-top:2px;font-size:12px}.login-title{color:var(--text);margin-bottom:20px;font-size:22px;font-weight:700}.login-card .form-group{margin-bottom:18px}.login-submit{justify-content:center;width:100%;margin-top:8px}.dashboard-header{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;justify-content:space-between;align-items:center;gap:25px;padding:24px 28px;display:flex}.dashboard-left{flex-direction:column;gap:18px;display:flex}.dashboard-left h1{color:var(--text);font-size:32px;font-weight:700}.dashboard-left p{color:var(--text-light);margin-top:6px;font-size:15px}.dashboard-date{align-items:center;gap:18px;display:flex}.dashboard-date strong{font-size:14px}.dashboard-date span{background:var(--surface2);border-radius:12px;padding:8px 14px;font-size:13px;font-weight:600}.dashboard-right{align-items:center;gap:16px;display:flex}.header-status{gap:14px;display:flex}.status-card{background:var(--surface2);border-radius:14px;align-items:center;gap:12px;padding:14px 18px;display:flex}.status-card svg{color:#22c55e;font-size:22px}.status-card strong{font-size:14px;display:block}.status-card small{color:var(--text-light)}.header-icon{background:var(--surface2);cursor:pointer;width:48px;height:48px;color:var(--text);border:none;border-radius:14px;font-size:18px;transition:all .25s;position:relative}.header-icon:hover{background:var(--primary);color:#fff}.header-icon span{color:#fff;background:#ef4444;border-radius:20px;padding:2px 6px;font-size:10px;position:absolute;top:5px;right:5px}@media (width<=1200px){.dashboard-header{flex-direction:column;align-items:flex-start}.dashboard-right{flex-wrap:wrap;justify-content:space-between;width:100%}}@media (width<=768px){.header-status{display:none}.dashboard-left h1{font-size:26px}.dashboard-date{flex-direction:column;align-items:flex-start}}.header-icon .spin{animation:.8s linear infinite dashboardHeaderSpin}@keyframes dashboardHeaderSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.revenue-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:24px}.revenue-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px;display:flex}.revenue-title{align-items:center;gap:12px;display:flex}.revenue-title svg{color:var(--primary);font-size:22px}.revenue-title h2{font-size:22px;font-weight:700}.revenue-header small{color:var(--text-light)}.revenue-actions{align-items:center;gap:15px;display:flex}.period-switch{background:var(--surface2);border-radius:12px;display:flex;overflow:hidden}.period-switch button{cursor:pointer;color:var(--text);background:0 0;border:none;padding:10px 18px;transition:all .25s}.period-switch button.active{background:var(--primary);color:#fff}.revenue-summary{grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:25px;display:grid}.summary-card{background:var(--surface2);border-radius:16px;padding:18px}.summary-card span{color:var(--text-light);margin-bottom:8px;display:block}.summary-card h3{margin-bottom:10px;font-size:24px}.chart-container{width:100%;height:380px}.recharts-cartesian-grid-horizontal line,.recharts-cartesian-grid-vertical line{stroke:var(--border)}.recharts-tooltip-wrapper{outline:none}@media (width<=900px){.revenue-summary{grid-template-columns:1fr}.revenue-header{flex-direction:column;align-items:flex-start}.revenue-actions{justify-content:space-between;width:100%}}@media (width<=600px){.period-switch{width:100%}.period-switch button{flex:1}}.network-health-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;flex-direction:column;gap:24px;padding:24px;transition:all .3s;display:flex}.network-health-card:hover{box-shadow:var(--shadow-lg)}.network-health-header{justify-content:space-between;align-items:center;display:flex}.network-health-header h2{color:var(--text);margin-bottom:4px;font-size:22px;font-weight:700}.network-health-header small{color:var(--text-light)}.network-health-header button{cursor:pointer;background:var(--primary);color:#fff;border:none;border-radius:12px;padding:10px 18px;font-weight:600;transition:all .3s}.network-health-header button:hover{transform:translateY(-2px)}.network-health-body{grid-template-columns:320px 1fr;align-items:center;gap:30px;display:grid}.uptime-chart{width:100%;height:220px;position:relative}.uptime-center{text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.uptime-center h1{color:var(--primary);margin-bottom:6px;font-size:38px;font-weight:700}.uptime-center span{color:var(--text-light);font-size:13px}.device-list{flex-direction:column;gap:14px;display:flex}.device-item{background:var(--surface2);border-radius:14px;justify-content:space-between;align-items:center;padding:14px 16px;transition:all .3s;display:flex}.device-item:hover{transform:translate(6px)}.device-left{align-items:center;gap:14px;display:flex}.device-icon{width:46px;height:46px;color:var(--primary);background:#dc26261a;border-radius:12px;justify-content:center;align-items:center;font-size:18px;display:flex}.device-left strong{color:var(--text);margin-bottom:4px;display:block}.device-left small{color:var(--text-light)}.online-dot{color:#16a34a;font-size:12px}.resource-section{flex-direction:column;gap:18px;display:flex}.progress-item{flex-direction:column;gap:8px;display:flex}.progress-header{justify-content:space-between;align-items:center;display:flex}.progress-header span{color:var(--text-light);font-size:14px}.progress-header strong{color:var(--text)}.progress-bar{background:var(--surface2);border-radius:999px;width:100%;height:10px;overflow:hidden}.progress-fill{border-radius:999px;height:100%;transition:width .6s}.health-footer{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.metric{background:var(--surface2);border-radius:14px;align-items:center;gap:14px;padding:16px;display:flex}.metric svg{color:var(--primary);font-size:22px}.metric strong{color:var(--text);margin-bottom:4px;display:block}.metric span{color:var(--text-light);font-size:14px}@media (width<=1200px){.network-health-body{grid-template-columns:1fr}.uptime-chart{height:260px}}@media (width<=768px){.health-footer{grid-template-columns:1fr}.network-health-header{flex-direction:column;align-items:flex-start;gap:15px}.device-item{flex-direction:column;align-items:flex-start;gap:12px}.online-dot{align-self:flex-end}}.status-dot.online{color:#16a34a;font-size:12px}.status-dot.offline{color:#dc2626;font-size:12px}.status-dot.unknown{color:#64748b;font-size:12px}.network-health-empty{color:var(--text-light);padding:16px 0;font-size:14px}.quick-actions-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:24px}.quick-actions-header{margin-bottom:24px}.quick-actions-header h2{color:var(--text);margin-bottom:4px;font-size:22px}.quick-actions-header small{color:var(--text-light)}.quick-actions-grid{gap:14px;display:grid}.quick-action-item{cursor:pointer;background:var(--surface2);width:100%;color:var(--text);border:none;border-radius:16px;align-items:center;gap:16px;padding:16px;transition:all .25s;display:flex}.quick-action-item:hover{box-shadow:var(--shadow-sm);transform:translate(6px)}.quick-action-icon{color:#fff;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:54px;height:54px;font-size:20px;display:flex}.quick-action-content{text-align:left;flex:1}.quick-action-content strong{color:var(--text);margin-bottom:4px;font-size:15px;display:block}.quick-action-content small{color:var(--text-light);font-size:13px}.quick-arrow{color:var(--text-light);transition:all .25s}.quick-action-item:hover .quick-arrow{color:var(--primary);transform:translate(6px)}@media (width<=768px){.quick-action-item{padding:14px}.quick-action-icon{width:48px;height:48px;font-size:18px}}.recent-customers-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:24px}.recent-customers-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.recent-customers-header h2{color:var(--text);margin-bottom:4px;font-size:22px}.recent-customers-header small{color:var(--text-light)}.recent-customers-header button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:12px;align-items:center;gap:8px;padding:10px 18px;font-weight:600;transition:all .25s;display:flex}.recent-customers-header button:hover{transform:translateY(-2px)}.customers-table{overflow-x:auto}.customers-table table{border-collapse:collapse;width:100%}.customers-table th{text-align:left;color:var(--text-light);border-bottom:1px solid var(--border);padding:14px;font-size:13px}.customers-table td{border-bottom:1px solid var(--border);color:var(--text);padding:16px 14px}.customers-table tbody tr{transition:all .25s}.customers-table tbody tr:hover{background:var(--surface2)}.customer-info{align-items:center;gap:14px;display:flex}.avatar{color:var(--primary);font-size:42px}.customer-info strong{display:block}.customer-info small{color:var(--text-light)}.service{align-items:center;gap:8px;font-weight:600;display:flex}.service svg{color:var(--primary)}.uptime{align-items:center;gap:8px;display:flex}.status{border-radius:999px;justify-content:center;align-items:center;padding:6px 14px;font-size:13px;font-weight:600;display:inline-flex}.status.success{color:#166534;background:#dcfce7}.status.danger{color:#991b1b;background:#fee2e2}@media (width<=900px){.recent-customers-header{flex-direction:column;align-items:flex-start;gap:16px}.recent-customers-header button{justify-content:center;width:100%}}.activity-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:24px}.activity-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.activity-header h2{color:var(--text);margin-bottom:4px;font-size:22px}.activity-header small{color:var(--text-light)}.activity-header button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:12px;align-items:center;gap:8px;padding:10px 18px;font-weight:600;transition:all .25s;display:flex}.activity-header button:hover{transform:translateY(-2px)}.activity-list{flex-direction:column;gap:14px;display:flex}.activity-item{background:var(--surface2);border-radius:16px;grid-template-columns:60px 1fr auto;align-items:center;gap:18px;padding:16px;transition:all .25s;display:grid}.activity-item:hover{transform:translate(6px)}.activity-icon{color:#fff;border-radius:14px;justify-content:center;align-items:center;width:52px;height:52px;font-size:18px;display:flex}.customer{background:#2563eb}.payment{background:#16a34a}.hotspot{background:#f59e0b}.router{background:#8b5cf6}.ticket{background:#dc2626}.activity-details strong{color:var(--text);margin-bottom:6px;display:block}.activity-details p{color:var(--text-light);font-size:14px}.activity-meta{flex-direction:column;align-items:flex-end;gap:10px;display:flex}.activity-meta span{color:var(--text-light);font-size:13px}.activity-status{color:#16a34a;align-items:center;gap:6px;font-size:13px;font-weight:600;display:flex}.activity-status svg{font-size:9px}@media (width<=900px){.activity-item{grid-template-columns:1fr}.activity-meta{align-items:flex-start}}@media (width<=600px){.activity-header{flex-direction:column;align-items:flex-start;gap:15px}.activity-header button{justify-content:center;width:100%}}.activity-empty{color:var(--text-light);padding:16px 0;font-size:14px}.stat-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;align-items:center;gap:20px;padding:24px;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;position:relative;overflow:hidden}.stat-card:before{content:"";background:var(--primary);opacity:0;width:5px;height:100%;transition:all .25s;position:absolute;top:0;left:0}.stat-card:hover{box-shadow:var(--shadow-md);border-color:#d904292e;transform:translateY(-5px)}.stat-card:hover:before{opacity:1}.stat-icon{color:#fff;border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;width:70px;height:70px;font-size:30px;display:flex;box-shadow:0 12px 28px #0000002e}.stat-content{flex-direction:column;flex:1;justify-content:center;display:flex}.stat-title{letter-spacing:.4px;color:var(--text-light);margin-bottom:8px;font-size:13px;font-weight:600}.stat-value{color:var(--text);margin-bottom:10px;font-size:32px;font-weight:700;line-height:1.2}.stat-footer{color:var(--text-light);align-items:center;gap:8px;font-size:13px;display:flex}.stat-trend{align-items:center;gap:6px;font-weight:600;display:flex}.stat-trend.positive{color:var(--success)}.stat-trend.negative{color:var(--danger)}.stat-trend.warning{color:var(--warning)}.loading{pointer-events:none;opacity:.85}.stat-skeleton{background:linear-gradient(90deg, var(--surface2) 25%, #ffffff2e 50%, var(--surface2) 75%);background-size:200% 100%;border-radius:12px;animation:1.4s linear infinite stat-loading}.stat-skeleton.icon{width:70px;height:70px}.stat-skeleton.title{width:120px;height:14px;margin-bottom:12px}.stat-skeleton.value{width:150px;height:34px;margin-bottom:14px}.stat-skeleton.footer{width:100px;height:12px}@keyframes stat-loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (width<=768px){.stat-card{gap:16px;padding:18px}.stat-icon{width:60px;height:60px;font-size:24px}.stat-value{font-size:26px}}.dashboard-page{flex-direction:column;gap:24px;display:flex}.chart-wrapper,.health-wrapper{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;padding:22px}.stat-trend{align-items:center;gap:8px;margin-top:10px;font-size:13px;font-weight:600;display:flex}.positive{color:#16a34a}.negative{color:#dc2626}@media (width<=1400px){.dashboard-bottom{grid-template-columns:1fr}}@media (width<=1100px){.dashboard-middle{grid-template-columns:1fr}}@media (width<=768px){.stats-grid{grid-template-columns:1fr}}.customer-header{flex-direction:column;gap:28px;margin-bottom:28px;display:flex}.customer-header-top{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.breadcrumb{color:var(--text-light);align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600;display:flex}.customer-header h1{color:var(--text);margin-bottom:8px;font-size:34px;font-weight:700}.customer-header p{color:var(--text-light);max-width:650px;font-size:15px}.customer-header-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.customer-overview{grid-template-columns:repeat(5,1fr);gap:20px;display:grid}.overview-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;align-items:center;gap:16px;padding:20px;transition:all .25s;display:flex}.overview-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}.overview-icon{color:#fff;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;font-size:22px;display:flex}.red{background:#dc2626}.green{background:#16a34a}.orange{background:#f59e0b}.blue{background:#2563eb}.overview-card small{color:var(--text-light);margin-bottom:6px;font-size:13px;display:block}.overview-card h2{color:var(--text);font-size:26px;font-weight:700}.success{justify-content:center;position:relative}.status-dot{background:#22c55e;border-radius:50%;width:14px;height:14px;box-shadow:0 0 15px #22c55e}@media (width<=1400px){.customer-overview{grid-template-columns:repeat(2,1fr)}}@media (width<=900px){.customer-header-top{flex-direction:column}.customer-header-actions{justify-content:flex-start;width:100%}}@media (width<=768px){.customer-overview{grid-template-columns:1fr}.customer-header h1{font-size:28px}.customer-header-actions{grid-template-columns:1fr;width:100%;display:grid}}.customer-search-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.customer-search-box{background:var(--surface2);border:1px solid var(--border);border-radius:14px;flex:1;align-items:center;gap:14px;padding:14px 18px;transition:all .25s;display:flex}.customer-search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #dc262626}.search-icon{color:var(--text-light);font-size:16px}.customer-search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px}.customer-search-box input::placeholder{color:var(--text-light)}.search-shortcut{background:var(--surface2);border:1px solid var(--border);color:var(--text-light);white-space:nowrap;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.search-shortcut svg{color:var(--primary)}@media (width<=768px){.customer-search-card{flex-direction:column;align-items:stretch}.search-shortcut{justify-content:center}}.customer-filter-bar{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.customer-filter-left{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.customer-filter-right{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.filter-info{background:var(--surface2);border:1px solid var(--border);border-radius:12px;flex-direction:column;padding:10px 16px;display:flex}.filter-info strong{color:var(--text-light);margin-bottom:4px;font-size:12px}.filter-info span{color:var(--text);font-size:14px;font-weight:600}@media (width<=1100px){.customer-filter-bar{flex-direction:column;align-items:flex-start}.customer-filter-right{justify-content:space-between;width:100%}}@media (width<=768px){.filter-buttons{grid-template-columns:1fr 1fr;width:100%;display:grid}.customer-filter-right{grid-template-columns:1fr;width:100%;display:grid}}.confirm-dialog__backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;background:#0000008c;justify-content:center;align-items:center;padding:24px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.confirm-dialog{background:var(--card);border:1px solid var(--border);width:100%;max-width:460px;box-shadow:var(--shadow-lg);border-radius:22px;animation:.25s dialogIn;overflow:hidden}.confirm-dialog__header{border-bottom:1px solid var(--border);align-items:center;gap:14px;padding:22px 24px;display:flex}.confirm-dialog__icon{width:54px;height:54px;color:var(--danger);background:#dc26261f;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;font-size:24px;display:flex}.confirm-dialog__title{color:var(--text);margin:0;font-size:20px;font-weight:700}.confirm-dialog__body{padding:24px}.confirm-dialog__message{color:var(--text-light);margin:0;font-size:15px;line-height:1.7}.confirm-dialog__error{color:var(--danger);background:#dc26261f;border:1px solid #dc262633;border-radius:12px;margin-top:18px;padding:14px 16px;font-size:13px}.confirm-dialog__actions{border-top:1px solid var(--border);justify-content:flex-end;gap:12px;padding:22px 24px;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes dialogIn{0%{opacity:0;transform:translateY(18px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=768px){.confirm-dialog__backdrop{padding:18px}.confirm-dialog{max-width:100%}.confirm-dialog__header,.confirm-dialog__body{padding:18px}.confirm-dialog__actions{flex-direction:column-reverse;padding:18px}.confirm-dialog__actions .mds-btn{width:100%}}.mds-pagination{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-top:24px;padding:18px 0;display:flex}.mds-pagination__summary{color:var(--text-light);margin:0;font-size:14px;font-weight:500}.mds-pagination__controls{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.mds-pagination__pages{align-items:center;gap:8px;margin:0;padding:0;list-style:none;display:flex}.mds-pagination__page{border-radius:12px;justify-content:center;align-items:center;min-width:40px;height:40px;padding:0 12px;transition:all .25s;display:flex}.mds-pagination__page:hover{transform:translateY(-2px)}.mds-pagination__page.active{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}.mds-pagination__ellipsis{color:var(--text-light);padding:0 8px;font-weight:600}.mds-pagination__page-size{color:var(--text-light);align-items:center;gap:10px;font-size:14px;display:flex}.mds-pagination__page-size select{border:1px solid var(--border);background:var(--surface);min-width:80px;height:40px;color:var(--text);border-radius:12px;padding:0 12px;font-size:14px;transition:all .25s}.mds-pagination__page-size select:hover{border-color:var(--primary)}.mds-pagination__page-size select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #d904291f}.mds-pagination button:disabled{opacity:.5;cursor:not-allowed;transform:none}@media (width<=768px){.mds-pagination{flex-direction:column;align-items:flex-start}.mds-pagination__controls,.mds-pagination__page-size{justify-content:center;width:100%}}@media (width<=480px){.mds-pagination__pages{flex-wrap:wrap;justify-content:center}}.page-header-card{background:var(--card-bg,#fff);border:1px solid var(--border-color,#e5e7eb);border-radius:18px;justify-content:space-between;align-items:center;gap:2rem;margin-bottom:1.5rem;padding:1.5rem 2rem;display:flex;box-shadow:0 2px 10px #0000000a}.page-header-left{flex:1;align-items:center;gap:1.25rem;min-width:0;display:flex}.page-header-icon{background:linear-gradient(135deg, var(--primary-color,#2563eb), var(--primary-dark,#1d4ed8));color:#fff;border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;width:72px;height:72px;font-size:1.8rem;display:flex;box-shadow:0 8px 18px #2563eb40}.page-header-content{flex:1;min-width:0}.page-header-content h1{color:var(--text-primary,#111827);margin:0;font-size:1.75rem;font-weight:700}.page-header-content p{color:var(--text-secondary,#6b7280);margin:.4rem 0 0;font-size:.95rem;line-height:1.5}.page-header-meta{flex-wrap:wrap;gap:.85rem;margin-top:1rem;display:flex}.page-header-stat{background:var(--surface-secondary,#f8fafc);border:1px solid var(--border-color,#e5e7eb);color:var(--text-primary,#374151);border-radius:999px;align-items:center;gap:.5rem;padding:.45rem .85rem;font-size:.875rem;font-weight:600;transition:all .2s;display:inline-flex}.page-header-stat:hover{background:var(--hover-bg,#eef2ff);transform:translateY(-1px)}.page-header-stat-icon{color:var(--primary-color,#2563eb);justify-content:center;align-items:center;font-size:.95rem;display:flex}.page-header-stat-value{color:var(--text-primary,#111827);font-weight:700}.page-header-stat-label{color:var(--text-secondary,#6b7280)}.page-header-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.page-header-actions>*{flex-shrink:0}.page-header-stat.success{color:#15803d;background:#ecfdf5;border-color:#bbf7d0}.page-header-stat.success .page-header-stat-icon{color:#16a34a}.page-header-stat.warning{color:#b45309;background:#fffbeb;border-color:#fde68a}.page-header-stat.warning .page-header-stat-icon{color:#d97706}.page-header-stat.danger{color:#b91c1c;background:#fef2f2;border-color:#fecaca}.page-header-stat.danger .page-header-stat-icon{color:#dc2626}.page-header-stat.info{color:#1d4ed8;background:#eff6ff;border-color:#bfdbfe}.page-header-stat.info .page-header-stat-icon{color:#2563eb}@media (width<=992px){.page-header-card{flex-direction:column;align-items:stretch}.page-header-actions{justify-content:flex-start;margin-top:1rem}}@media (width<=768px){.page-header-left{flex-direction:column;align-items:flex-start}.page-header-icon{width:60px;height:60px;font-size:1.5rem}.page-header-content h1{font-size:1.5rem}.page-header-meta{gap:.6rem}.page-header-stat{justify-content:flex-start;width:100%}.page-header-actions{flex-direction:column;align-items:stretch}.page-header-actions>*{width:100%}}.sub-actions{position:relative}.sub-actions__trigger{border:1px solid var(--border);background:var(--card);width:36px;height:36px;color:var(--text-light);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;transition:all .2s;display:inline-flex}.sub-actions__trigger:hover:not(:disabled){color:var(--text);border-color:var(--accent)}.sub-actions__trigger:disabled{opacity:.4;cursor:not-allowed}.sub-actions__menu{z-index:40;border:1px solid var(--border);background:var(--card);border-radius:14px;width:290px;padding:6px;position:absolute;top:42px;right:0;box-shadow:0 18px 40px #00000059}.sub-actions__item{width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:10px;gap:12px;padding:10px 12px;display:flex}.sub-actions__item:hover{background:var(--surface2)}.sub-actions__item svg{color:var(--text-light);flex-shrink:0;margin-top:3px}.sub-actions__item strong{font-size:14px;display:block}.sub-actions__item small{color:var(--text-light);margin-top:2px;font-size:11.5px;line-height:1.35;display:block}.sub-actions__item.is-destructive{border-top:1px solid var(--border);border-radius:0 0 10px 10px;margin-top:4px}.sub-actions__item.is-destructive strong,.sub-actions__item.is-destructive svg{color:#dc2626}.sub-actions__backdrop{z-index:100;background:#0000008c;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.sub-actions__dialog{background:var(--card);border-top:4px solid var(--accent);border-radius:18px;width:min(460px,100%);padding:24px}.sub-actions__dialog.is-destructive{border-top-color:#dc2626}.sub-actions__dialog h3{color:var(--text);align-items:center;gap:10px;margin:0 0 6px;font-size:19px;display:flex}.sub-actions__dialog.is-destructive h3 svg{color:#dc2626}.sub-actions__who{color:var(--text);margin:0 0 12px;font-weight:600}.sub-actions__hint{color:var(--text-light);margin:0 0 18px;font-size:13.5px;line-height:1.5}.sub-actions__reason{color:var(--text);font-size:13px;font-weight:600;display:block}.sub-actions__reason textarea{border:1px solid var(--border);background:var(--surface2);width:100%;color:var(--text);font:inherit;resize:vertical;border-radius:12px;margin:8px 0 6px;padding:12px;display:block}.sub-actions__reason textarea:focus{border-color:var(--accent);outline:none}.sub-actions__reason small{color:var(--text-light);font-size:11.5px;font-weight:400}.sub-actions__error{color:#dc2626;background:#dc26261f;border-radius:10px;margin-top:14px;padding:10px 12px;font-size:13px}.sub-actions__buttons{justify-content:flex-end;gap:10px;margin-top:22px;display:flex}.sub-actions__buttons button{border:1px solid var(--border);color:var(--text);font:inherit;cursor:pointer;background:0 0;border-radius:10px;padding:10px 18px;font-weight:600}.sub-actions__buttons .is-primary{background:var(--accent);border-color:var(--accent);color:#fff}.sub-actions__buttons .is-destructive{color:#fff;background:#dc2626;border-color:#dc2626}.sub-actions__buttons button:disabled{opacity:.55;cursor:not-allowed}.sub-actions__result{z-index:30;text-align:left;border-radius:12px;align-items:flex-start;gap:8px;width:300px;padding:10px 12px;font-size:12.5px;line-height:1.45;display:flex;position:absolute;top:42px;right:0}.sub-actions__result.is-ok{color:#16a34a;background:#16a34a24}.sub-actions__result.is-warning{color:#dc2626;background:#dc262624}.sub-actions__result button{color:inherit;cursor:pointer;background:0 0;border:none;margin-left:auto;font-size:16px}@media (width<=640px){.sub-actions__menu,.sub-actions__result{width:260px}}.sub-actions__outcome{border-radius:12px;margin-top:16px;padding:12px 14px;font-size:13px;line-height:1.5}.sub-actions__outcome.is-ok{color:#16a34a;background:#16a34a1f}.sub-actions__outcome.is-warning{color:#dc2626;background:#dc26261f}.sub-actions__outcome strong{align-items:center;gap:8px;margin-bottom:6px;display:flex}.sub-actions__outcome p{margin:6px 0 0}.sub-actions__outcome-detail{opacity:.95;word-break:break-word;font-size:12px}.sub-actions__outcome code{background:#0003;border-radius:5px;padding:1px 5px;font-size:11.5px}.subscribers-page{flex-direction:column;gap:22px;padding:30px;display:flex}.subscribers-page__stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;display:grid}.subscribers-search{border:1px solid var(--border);background:var(--card);border-radius:16px;align-items:center;gap:14px;padding:16px 20px;transition:all .25s;display:flex}.subscribers-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}.subscribers-search svg{color:var(--text-light);flex-shrink:0;font-size:16px}.subscribers-search input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px}.subscribers-tabs{flex-wrap:wrap;gap:10px;display:flex}.subscribers-tab{border:1px solid var(--border);background:var(--card);color:var(--text-light);font:inherit;cursor:pointer;border-radius:999px;align-items:center;gap:9px;padding:11px 18px;font-weight:600;transition:all .2s;display:inline-flex}.subscribers-tab:hover{color:var(--text);border-color:var(--accent)}.subscribers-tab.is-active{background:var(--accent);border-color:var(--accent);color:#fff}.subscribers-tab__count{background:var(--surface2);color:var(--text);border-radius:999px;padding:2px 9px;font-size:12px}.subscribers-tab.is-active .subscribers-tab__count{color:#fff;background:#ffffff38}.subscribers-cell__sub{color:var(--text-light);margin-top:4px;font-size:12px}@media (width<=1100px){.subscribers-page__stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.subscribers-page{padding:20px}.subscribers-page__stats{grid-template-columns:1fr}}.subscribers-provision{border:1px solid var(--accent);color:var(--accent);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border-radius:10px;align-items:center;gap:8px;padding:8px 14px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex}.subscribers-provision:hover:not(:disabled){background:var(--accent);color:#fff}.subscribers-provision:disabled{opacity:.6;cursor:not-allowed}.subscribers-link{color:var(--text);font-weight:700;text-decoration:none}.subscribers-link:hover{color:var(--accent);text-decoration:underline}.leads-page{flex-direction:column;gap:20px;padding:30px;display:flex}.leads-summary{gap:18px;display:flex}.leads-summary>div{border:1px solid var(--border);background:var(--card);border-radius:16px;flex:0 0 220px;padding:18px 20px}.leads-summary strong{color:var(--text);font-size:28px;font-weight:700;display:block}.leads-summary span{color:var(--text-light);font-size:12.5px}.leads-summary>div.is-stale{border-color:var(--warning)}.leads-summary>div.is-stale strong{color:var(--warning)}.leads-search{border:1px solid var(--border);background:var(--card);border-radius:13px;align-items:center;gap:10px;height:46px;padding:0 16px;display:flex}.leads-search:focus-within{border-color:var(--primary)}.leads-search svg{color:var(--text-light)}.leads-search input{color:var(--text);font:inherit;background:0 0;border:0;outline:0;flex:1}.leads-list{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;display:grid}.lead-card{border:1px solid var(--border);background:var(--card);border-radius:16px;flex-direction:column;gap:14px;padding:18px 20px;display:flex}.lead-card__head{justify-content:space-between;align-items:center;gap:12px;display:flex}.lead-card__head a{color:var(--text);font-size:15px;font-weight:700;text-decoration:none}.lead-card__head a:hover{color:var(--primary);text-decoration:underline}.lead-card__contact{flex-direction:column;gap:7px;margin:0;display:flex}.lead-card__contact>div{align-items:center;gap:10px;font-size:13px;display:flex}.lead-card__contact dt{width:16px;color:var(--text-light);display:flex}.lead-card__contact dd{color:var(--text);word-break:break-word;margin:0}.lead-card__notes{background:var(--surface2);color:var(--text-light);border-radius:10px;margin:0;padding:10px 12px;font-size:12.5px;line-height:1.5}.lead-card__foot{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding-top:12px;display:flex}.lead-card__foot span{color:var(--text-light);font-size:11.5px}.leads-empty{color:var(--text-light)}.leads-empty-state{text-align:center;border:1px dashed var(--border);border-radius:18px;padding:60px 30px}.leads-empty-state svg{color:var(--text-light);margin-bottom:14px;font-size:32px}.leads-empty-state h3{color:var(--text);margin:0 0 8px}.leads-empty-state p{max-width:420px;color:var(--text-light);margin:0 auto;font-size:13.5px;line-height:1.6}.leads-error{color:var(--danger);background:#dc26261f;border-radius:12px;padding:12px 16px;font-size:13px}.leads-pager{justify-content:center;align-items:center;gap:16px;display:flex}.leads-pager span{color:var(--text-light);font-size:13px}.lead-card__open{background:var(--primary);color:var(--white);border-radius:9px;padding:7px 14px;font-size:12.5px;font-weight:700;text-decoration:none}.lead-card__open:hover{background:var(--primary-hover)}.detail-page{flex-direction:column;gap:20px;padding:30px;display:flex}.detail-back{color:var(--text-light);align-items:center;gap:8px;font-size:13px;font-weight:600;text-decoration:none;display:inline-flex}.detail-back:hover{color:var(--accent)}.detail-header{border:1px solid var(--border);background:var(--card);border-radius:18px;justify-content:space-between;align-items:flex-start;gap:20px;padding:26px 28px;display:flex}.detail-header h1{color:var(--text);margin:0 0 10px;font-size:30px}.detail-header__meta{color:var(--text-light);flex-wrap:wrap;align-items:center;gap:14px;font-size:13px;display:flex}.detail-flag{color:#dc2626;font-weight:600}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.detail-card{border:1px solid var(--border);background:var(--card);border-radius:18px;padding:22px 24px}.detail-card h2{text-transform:uppercase;letter-spacing:.04em;color:var(--text-light);align-items:center;gap:10px;margin:0 0 18px;font-size:15px;display:flex}.detail-card h2 svg{color:var(--accent)}.detail-figure{margin-bottom:18px}.detail-figure strong{color:var(--text);font-size:32px;font-weight:700;display:block}.detail-figure strong.is-owed{color:#dc2626}.detail-figure span{color:var(--text-light);font-size:13px}.detail-card dl{flex-direction:column;gap:10px;margin:0;display:flex}.detail-card dl>div{justify-content:space-between;gap:16px;font-size:13.5px;display:flex}.detail-card dt{color:var(--text-light)}.detail-card dd{color:var(--text);text-align:right;margin:0;font-weight:600}.detail-contact>div{align-items:center}.detail-contact dt{width:20px;color:var(--text-light);display:flex}.detail-contact dd{text-align:left;word-break:break-word;flex:1;font-weight:500}.detail-services{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;display:grid}.detail-service{border:1px solid var(--border);background:var(--surface2);border-radius:14px;padding:18px}.detail-service__head{align-items:center;gap:10px;margin-bottom:14px;display:flex}.detail-service__head svg{color:var(--accent)}.detail-service__name{color:var(--text);flex:1;align-items:center;gap:4px;font-weight:700;display:inline-flex}.detail-table{border-collapse:collapse;width:100%;font-size:13px}.detail-table td{border-bottom:1px solid var(--border);color:var(--text);padding:10px 8px}.detail-table tr:last-child td{border-bottom:none}.detail-timeline{flex-direction:column;gap:16px;margin:0;padding:0;list-style:none;display:flex}.detail-timeline li{gap:12px;display:flex}.detail-timeline__dot{background:var(--accent);border-radius:50%;flex-shrink:0;width:9px;height:9px;margin-top:6px}.detail-timeline strong{color:var(--text);text-transform:capitalize;font-size:13.5px;display:block}.detail-timeline p{color:var(--text-light);margin:4px 0;font-size:12.5px;font-style:italic}.detail-timeline small{color:var(--text-light);font-size:11.5px}.detail-empty{color:var(--text-light);margin:0;font-size:13.5px}.detail-nudge{color:#dc2626;background:#dc26261f;border-radius:14px;align-items:center;gap:10px;padding:14px 18px;font-size:13.5px;font-weight:600;display:flex}@media (width<=900px){.detail-grid{grid-template-columns:1fr}.detail-header{flex-direction:column}}.detail-strip{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;display:grid}.detail-strip__item{border:1px solid var(--border);background:var(--card);border-radius:16px;padding:18px 20px}.detail-strip__item strong{color:var(--text);margin:8px 0 12px;font-size:15px;display:block}.detail-strip__item dl{flex-direction:column;gap:8px;margin:0;display:flex}.detail-strip__item dd{justify-content:flex-end;align-items:center;gap:6px;display:flex}.detail-live{text-transform:uppercase;letter-spacing:.04em;align-items:center;gap:7px;font-size:12px;font-weight:700;display:inline-flex}.detail-live svg{font-size:8px}.detail-live.is-online{color:#16a34a}.detail-live.is-offline{color:var(--text-light)}.detail-copy{cursor:pointer;color:var(--text-light);background:0 0;border:none;padding:2px 4px;font-size:11px}.detail-copy:hover{color:var(--accent)}.detail-usage{border-bottom:1px solid var(--border);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px;margin-bottom:20px;padding-bottom:20px;display:grid}.detail-usage strong{color:var(--text);font-size:24px;font-weight:700;display:block}.detail-usage span{color:var(--text-light);font-size:12.5px}.detail-sessions th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--text-light);border-bottom:1px solid var(--border);padding:0 8px 8px;font-size:11px}.detail-sessions td{font-variant-numeric:tabular-nums}.detail-sessions tr.is-live td{background:#16a34a12}.detail-prepaid{border:1px solid var(--border);border-left:4px solid var(--text-light);background:var(--card);border-radius:18px;grid-template-columns:minmax(240px,1fr) minmax(240px,1fr);gap:22px;padding:22px 24px;display:grid}.detail-prepaid.is-ok{border-left-color:var(--success)}.detail-prepaid.is-low,.detail-prepaid.is-grace{border-left-color:var(--warning)}.detail-prepaid.is-out{border-left-color:var(--danger)}.detail-prepaid h2{text-transform:uppercase;letter-spacing:.04em;color:var(--text-light);align-items:center;gap:9px;margin:0 0 12px;font-size:13px;display:flex}.detail-prepaid h2 svg{color:var(--primary)}.detail-prepaid__main strong{color:var(--text);font-size:28px;font-weight:700;display:block}.detail-prepaid.is-out .detail-prepaid__main strong{color:var(--danger)}.detail-prepaid__main span{color:var(--text-light);margin-top:6px;font-size:12.5px;display:block}.detail-prepaid__rates{flex-direction:column;gap:9px;margin:0;display:flex}.detail-prepaid__rates>div{justify-content:space-between;gap:14px;font-size:13px;display:flex}.detail-prepaid__rates dt{color:var(--text-light)}.detail-prepaid__rates dd{color:var(--text);margin:0;font-weight:600}.detail-prepaid__history{grid-column:1/-1;margin-top:4px}.detail-prepaid__history th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--text-light);border-bottom:1px solid var(--border);padding:0 8px 8px;font-size:11px}@media (width<=800px){.detail-prepaid{grid-template-columns:1fr}}.router-search-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.router-search-box{background:var(--surface2);border:1px solid var(--border);border-radius:14px;flex:1;align-items:center;gap:14px;padding:14px 18px;transition:all .25s;display:flex}.router-search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #dc262626}.router-search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px}.router-search-box input::placeholder,.search-icon{color:var(--text-light)}.clear-btn{cursor:pointer;width:34px;height:34px;color:var(--text-light);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;transition:all .25s;display:flex}.clear-btn:hover{color:#fff;background:#dc2626}.router-search-module{color:#2563eb;white-space:nowrap;background:#2563eb14;border:1px solid #2563eb2e;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.router-search-shortcut{background:var(--surface2);border:1px solid var(--border);color:var(--text-light);white-space:nowrap;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}@media (width<=900px){.router-search-card{flex-direction:column;align-items:stretch}.router-search-module,.router-search-shortcut{justify-content:center}}.router-filter-bar{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.router-filter-left{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.filter-title{color:var(--text);white-space:nowrap;align-items:center;gap:10px;font-weight:700;display:flex}.filter-title svg{color:var(--primary)}.filter-buttons{flex-wrap:wrap;gap:12px;display:flex}.router-filter-right{flex-wrap:wrap;align-items:center;gap:12px;display:flex}@media (width<=992px){.router-filter-bar{flex-direction:column;align-items:flex-start}.router-filter-right{justify-content:flex-end;width:100%}}@media (width<=768px){.filter-buttons{grid-template-columns:repeat(2,1fr);width:100%;display:grid}.router-filter-right{width:100%}.router-filter-right .mds-btn{flex:1}}.tls-panel{border:1px solid var(--border);background:var(--surface2);border-radius:14px;margin-top:20px;padding:18px 20px}.tls-panel h4{color:var(--text);align-items:center;gap:9px;margin:0 0 10px;font-size:14px;display:flex}.tls-panel__state{margin:0 0 14px;font-size:13px;line-height:1.5}.tls-panel__state.is-trusted{color:#16a34a}.tls-panel__state.is-open{color:var(--text-light)}.tls-panel__cert{border:1px solid var(--border);background:var(--card);border-radius:12px;margin-bottom:14px;padding:14px}.tls-panel__cert dl{flex-direction:column;gap:8px;margin:0;display:flex}.tls-panel__cert dt{color:var(--text-light);text-transform:uppercase;letter-spacing:.04em;font-size:11.5px}.tls-panel__cert dd{color:var(--text);margin:2px 0 0;font-size:13px}.tls-panel__fingerprint{word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;line-height:1.5}.tls-panel__hint{color:var(--text-light);gap:8px;margin:12px 0 0;font-size:12px;line-height:1.5;display:flex}.tls-panel__hint svg{color:#f59e0b;flex-shrink:0;margin-top:2px}.tls-panel__error,.tls-panel__notice{border-radius:10px;margin-bottom:12px;padding:10px 12px;font-size:12.5px}.tls-panel__error{color:#dc2626;background:#dc26261f}.tls-panel__notice{color:#16a34a;background:#16a34a1f}.tls-panel__actions{flex-wrap:wrap;gap:10px;display:flex}.routers-page{box-sizing:border-box;padding:30px}.routers-page *,.routers-page :before,.routers-page :after{box-sizing:border-box}.retired-toggle{margin:4px 0 12px}.retired-toggle label{color:var(--text-light);cursor:pointer;align-items:center;gap:8px;font-size:13px;display:inline-flex}.retired-toggle input{cursor:pointer}.removal-notice{color:var(--text);background:#3b82f61f;border-radius:12px;align-items:center;gap:10px;margin-bottom:14px;padding:12px 16px;font-size:13.5px;display:flex}.removal-notice button{color:inherit;cursor:pointer;background:0 0;border:none;margin-left:auto;font-size:18px}.action-btn.restore{color:#16a34a;background:#16a34a26}.action-btn.restore:hover{color:#fff;background:#16a34a}.topology-header-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:22px;grid-template-columns:1.5fr 2fr auto;align-items:center;gap:28px;margin-bottom:30px;padding:28px;transition:border-color .25s,box-shadow .25s,transform .25s;display:grid}.topology-header-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.topology-header-left{align-items:center;gap:20px;display:flex}.topology-header-icon{color:#fff;background:linear-gradient(135deg,#dc2626,#ef4444);border-radius:20px;flex-shrink:0;justify-content:center;align-items:center;width:72px;height:72px;font-size:30px;display:flex;box-shadow:0 14px 30px #dc262647}.topology-header-left h1{color:var(--text);margin:0 0 8px;font-size:30px;font-weight:700}.topology-header-left p{color:var(--text-light);margin:0;font-size:14px;line-height:1.7}.topology-header-right{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.topology-stat{background:var(--surface2);border:1px solid var(--border);border-radius:18px;align-items:center;gap:14px;padding:18px;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex}.topology-stat:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:translateY(-3px)}.topology-stat-icon{width:52px;height:52px;color:var(--primary);background:#dc26261a;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;font-size:22px;display:flex}.topology-stat strong{color:var(--text);margin-bottom:4px;font-size:22px;font-weight:700;display:block}.topology-stat span{color:var(--text-light);font-size:13px;display:block}.topology-header-actions{flex-direction:column;justify-content:center;gap:14px;display:flex}.topology-header-actions .btn{justify-content:center;width:180px}.topology-header-actions .btn svg{margin-right:8px}.topology-stat:first-child{border-left:4px solid #16a34a}.topology-stat:nth-child(2){border-left:4px solid #2563eb}.topology-stat:nth-child(3){border-left:4px solid #f59e0b}.topology-stat:nth-child(4){border-left:4px solid #7c3aed}.topology-stat:hover .topology-stat-icon{transition:transform .25s;transform:scale(1.08)}.topology-stat:hover strong{color:var(--primary);transition:color .25s}@media (width<=1400px){.topology-header-card{grid-template-columns:1fr}.topology-header-actions{flex-direction:row;justify-content:flex-start}}@media (width<=992px){.topology-header-right{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.topology-header-card{gap:22px;padding:22px}.topology-header-left{flex-direction:column;align-items:flex-start}.topology-header-icon{width:64px;height:64px;font-size:26px}.topology-header-left h1{font-size:26px}.topology-header-right{grid-template-columns:1fr;gap:16px}.topology-header-actions{flex-direction:column;width:100%}.topology-header-actions .btn{width:100%}}@media (width<=480px){.topology-header-card{padding:18px}.topology-header-left h1{font-size:22px}.topology-header-left p{font-size:13px}.topology-stat{padding:16px}.topology-stat strong{font-size:20px}.topology-stat-icon{width:46px;height:46px;font-size:20px}}[data-theme=dark] .topology-header-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .topology-stat{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .topology-stat:hover{border-color:var(--primary)}[data-theme=dark] .topology-stat strong{color:var(--text)}[data-theme=dark] .topology-stat span{color:var(--text-light)}@media print{.topology-header-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc;grid-template-columns:1fr}.topology-header-actions{display:none}}.topology-stat:focus-within,.topology-header-actions .btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.topology-header-card,.topology-stat,.topology-stat-icon,.topology-header-actions .btn{transition:none}.topology-header-card:hover,.topology-stat:hover{transform:none}}.device-drawer-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:5000;background:#00000073;justify-content:flex-end;animation:.25s drawerFade;display:flex;position:fixed;inset:0}@keyframes drawerFade{0%{opacity:0}to{opacity:1}}.device-drawer{background:var(--card);border-left:1px solid var(--border);flex-direction:column;width:460px;max-width:100%;height:100vh;animation:.28s drawerSlide;display:flex;overflow-y:auto;box-shadow:-12px 0 32px #0000002e}@keyframes drawerSlide{0%{transform:translate(100%)}to{transform:translate(0)}}.device-drawer-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:24px;display:flex}.drawer-title{align-items:center;gap:18px;display:flex}.drawer-icon{color:#fff;background:linear-gradient(135deg,#dc2626,#ef4444);border-radius:18px;justify-content:center;align-items:center;width:64px;height:64px;font-size:28px;display:flex}.drawer-title h2{color:var(--text);margin:0 0 4px;font-size:24px;font-weight:700}.drawer-title p{color:var(--text-light);margin:0;font-size:14px}.drawer-close{background:var(--surface2);border:none;border:1px solid var(--border);cursor:pointer;width:42px;height:42px;color:var(--text);border-radius:12px;transition:all .25s}.drawer-close:hover{background:var(--primary);color:#fff}.device-status-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;display:flex}.device-status-row small{color:var(--text-light);font-size:13px;font-weight:500}.device-section{padding:24px}.device-section h3{color:var(--text);margin:0 0 18px;font-size:18px;font-weight:700}.device-details-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.device-detail{background:var(--surface2);border:1px solid var(--border);border-radius:16px;align-items:flex-start;gap:14px;padding:16px;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex}.device-detail:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:translateY(-3px)}.device-detail-icon{width:44px;height:44px;color:var(--primary);background:#dc26261a;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;display:flex}.device-detail span{color:var(--text-light);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.device-detail strong{color:var(--text);word-break:break-word;font-size:15px;font-weight:700;display:block}.device-drawer-footer{border-top:1px solid var(--border);background:var(--card);grid-template-columns:repeat(2,1fr);gap:16px;margin-top:auto;padding:24px;display:grid}.device-drawer-footer .btn{justify-content:center;width:100%}@media (width<=768px){.device-drawer{width:100%}.device-drawer-header,.device-section{padding:20px}.device-status-row{flex-direction:column;align-items:flex-start;padding:18px 20px}.device-details-grid{grid-template-columns:1fr}.drawer-title h2{font-size:22px}.drawer-icon{width:56px;height:56px;font-size:24px}}@media (width<=480px){.device-drawer-footer{grid-template-columns:1fr}.drawer-title{gap:14px}.drawer-title h2{font-size:20px}.drawer-title p{font-size:13px}.device-detail{padding:14px}}[data-theme=dark] .device-drawer{background:var(--card);border-left-color:var(--border)}[data-theme=dark] .device-detail{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .device-detail:hover{border-color:var(--primary)}[data-theme=dark] .drawer-close{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .device-drawer-footer{background:var(--card);border-top-color:var(--border)}@media print{.device-drawer-backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;position:static}.device-drawer{width:100%;height:auto;box-shadow:none;border:1px solid #ccc;animation:none}.drawer-close,.device-drawer-footer{display:none}}.drawer-close:focus-visible,.device-detail:focus-within,.device-drawer-footer .btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.device-drawer,.device-detail,.drawer-close{transition:none;animation:none}}.network-canvas{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:22px;overflow:hidden}.network-workspace{background:linear-gradient(#ffffff05 1px, transparent 1px), linear-gradient(90deg, #ffffff05 1px, transparent 1px), var(--surface);background-size:40px 40px;height:720px;position:relative;overflow:hidden}.network-links{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.fiber-line{stroke:#2563eb;stroke-width:.55px;fill:none;stroke-linecap:round;stroke-dasharray:3 2;opacity:.9;animation:5s linear infinite fiberFlow}@keyframes fiberFlow{0%{stroke-dashoffset:0}to{stroke-dashoffset:-24px}}.topology-device{z-index:2;cursor:pointer;flex-direction:column;align-items:center;gap:10px;transition:transform .25s,filter .25s;display:flex;position:absolute;transform:translate(-50%,-50%)}.topology-device:hover{transform:translate(-50%,-50%)scale(1.08)}.device-icon{color:#fff;background:linear-gradient(135deg,#2563eb,#3b82f6);border-radius:22px;justify-content:center;align-items:center;width:72px;height:72px;font-size:28px;display:flex;box-shadow:0 10px 28px #2563eb59}@keyframes devicePulse{0%{transform:scale(1);box-shadow:0 0 #22c55e73}70%{transform:scale(1.15);box-shadow:0 0 0 10px #22c55e00}to{transform:scale(1);box-shadow:0 0 #22c55e00}}.device-label{background:var(--card);border:1px solid var(--border);text-align:center;min-width:130px;color:var(--text);box-shadow:var(--shadow-sm);white-space:nowrap;border-radius:12px;padding:8px 14px;font-size:13px;font-weight:600}.device-status{border:3px solid var(--card);border-radius:50%;width:14px;height:14px;position:absolute;top:4px;right:4px}.device-status.online{background:#22c55e;animation:1.8s infinite devicePulse}.device-status.warning{background:#f59e0b;animation:1.8s infinite devicePulse}.device-status.offline{background:#ef4444}.topology-device.online .device-icon{background:linear-gradient(135deg,#16a34a,#22c55e);box-shadow:0 0 22px #22c55e73}.topology-device.warning .device-icon{background:linear-gradient(135deg,#f59e0b,#fbbf24);box-shadow:0 0 22px #f59e0b73}.topology-device.offline .device-icon{background:linear-gradient(135deg,#dc2626,#ef4444);box-shadow:0 0 22px #ef444473}.network-status{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000000b8;border:1px solid #ffffff14;border-radius:16px;gap:18px;padding:14px 18px;display:flex;position:absolute;bottom:24px;left:24px}.status-item{color:#fff;align-items:center;gap:8px;font-size:13px;font-weight:600;display:flex}.status-dot{border-radius:50%;width:12px;height:12px}.status-dot.online{background:#22c55e}.status-dot.warning{background:#f59e0b}.status-dot.offline{background:#ef4444}@media (width<=1400px){.network-workspace{height:640px}}@media (width<=1200px){.network-footer{flex-direction:column;align-items:stretch}.network-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.network-controls{justify-content:center}}@media (width<=768px){.network-workspace{height:560px}.device-icon{border-radius:18px;width:58px;height:58px;font-size:22px}.device-label{min-width:100px;padding:6px 10px;font-size:12px}.network-status{flex-wrap:wrap;justify-content:space-around;bottom:16px;left:16px;right:16px}.network-summary{grid-template-columns:1fr 1fr;gap:12px}.summary-card{padding:14px}.summary-card strong{font-size:22px}}@media (width<=480px){.network-workspace{height:500px}.network-summary{grid-template-columns:1fr}.network-controls{flex-wrap:wrap}.canvas-btn{flex:1;min-width:70px}}[data-theme=dark] .network-canvas,[data-theme=dark] .network-footer{background:var(--card);border-color:var(--border)}[data-theme=dark] .summary-card{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .summary-card:hover{border-color:var(--primary)}[data-theme=dark] .device-label{background:var(--card);border-color:var(--border)}@media print{.network-canvas{box-shadow:none;border:1px solid #ccc}.network-controls{display:none}.network-workspace{height:700px}}.canvas-btn:focus-visible,.summary-card:focus-within,.topology-device:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.fiber-line,.topology-device,.summary-card,.canvas-btn,.device-status{transition:none;animation:none}}.network-zoom-layer{transform-origin:50% 15%;transition:transform .15s;position:absolute;inset:0}.topology-device{font:inherit;cursor:pointer;background:0 0;border:none;padding:0}.network-canvas-loading{color:var(--text-light);z-index:5;background:#00000026;justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;inset:0}.device-status.unknown{background:#64748b}.topology-device.unknown .device-icon{background:linear-gradient(135deg,#475569,#64748b);box-shadow:0 0 14px #64748b59}.topology-sidebar{flex-direction:column;gap:24px;display:flex}.topology-sidebar-section{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:22px;transition:transform .25s,border-color .25s,box-shadow .25s}.topology-sidebar-section:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.topology-sidebar-section h3{color:var(--text);margin:0 0 20px;font-size:18px;font-weight:700}.topology-stat-card{background:var(--surface2);border:1px solid var(--border);border-radius:16px;align-items:center;gap:16px;margin-bottom:14px;padding:16px;transition:transform .25s,border-color .25s;display:flex}.topology-stat-card:last-child{margin-bottom:0}.topology-stat-card:hover{border-color:var(--primary);transform:translate(4px)}.topology-stat-icon{color:#fff;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;font-size:22px;display:flex}.topology-stat-card strong{color:var(--text);margin-bottom:4px;font-size:20px;font-weight:700;display:block}.topology-stat-card span{color:var(--text-light);font-size:13px;display:block}.topology-stat-card.primary .topology-stat-icon{background:#2563eb}.topology-stat-card.success .topology-stat-icon{background:#16a34a}.topology-stat-card.warning .topology-stat-icon{background:#f59e0b}.topology-stat-card.info .topology-stat-icon{background:#06b6d4}.health-list{flex-direction:column;gap:14px;display:flex}.health-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;justify-content:space-between;align-items:center;padding:14px 16px;transition:transform .25s,border-color .25s;display:flex}.health-item:hover{border-color:var(--primary);transform:translate(4px)}.health-left{align-items:center;gap:10px;display:flex}.health-online{color:#16a34a}.health-item span{color:var(--text);font-size:14px;font-weight:500}.health-item strong{color:var(--text);font-size:13px;font-weight:700}.availability-card{background:var(--surface2);border:1px solid var(--border);border-radius:18px;align-items:center;gap:18px;padding:18px;display:flex}.availability-circle{color:#16a34a;background:conic-gradient(#16a34a 0deg 359deg,#16a34a26 359deg);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:90px;height:90px;font-size:20px;font-weight:700;display:flex}.availability-details{flex-direction:column;gap:6px;display:flex}.availability-details span{color:var(--text-light);font-size:13px}.availability-details strong{color:var(--text);font-size:17px}.availability-details small{color:var(--text-light);font-size:12px}.service-list{flex-direction:column;gap:12px;display:flex}.service-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;justify-content:space-between;align-items:center;padding:14px 16px;transition:transform .25s,border-color .25s;display:flex}.service-item:hover{border-color:var(--primary);transform:translate(4px)}.service-item span{color:var(--text);font-size:14px}.service-item strong{color:var(--primary);font-size:14px;font-weight:700}.event-list{flex-direction:column;gap:14px;display:flex}.event-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;align-items:flex-start;gap:12px;padding:14px;display:flex}.event-dot{border-radius:50%;flex-shrink:0;width:12px;height:12px;margin-top:4px}.event-item.success .event-dot{background:#16a34a}.event-item.warning .event-dot{background:#f59e0b}.event-item strong{color:var(--text);margin-bottom:4px;font-size:14px;display:block}.event-item small{color:var(--text-light);font-size:12px}.topology-actions{grid-template-columns:1fr;gap:12px;display:grid}.topology-action-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;padding:14px 18px;font-size:14px;font-weight:600;transition:transform .25s,box-shadow .25s,background .25s;display:flex}.topology-action-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px #dc262640}.topology-action-btn:active{transform:scale(.98)}@media (width<=992px){.availability-card{text-align:center;flex-direction:column}.availability-details{align-items:center}}@media (width<=768px){.topology-sidebar-section{padding:18px}.topology-stat-card{padding:14px}.topology-stat-icon{width:46px;height:46px;font-size:20px}.topology-stat-card strong{font-size:18px}}@media (width<=480px){.health-item,.service-item{flex-direction:column;align-items:flex-start;gap:8px}.availability-circle{width:76px;height:76px;font-size:17px}.topology-action-btn{width:100%}}[data-theme=dark] .topology-sidebar-section{background:var(--card);border-color:var(--border)}[data-theme=dark] .topology-stat-card,[data-theme=dark] .health-item,[data-theme=dark] .service-item,[data-theme=dark] .event-item,[data-theme=dark] .availability-card{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .topology-stat-card:hover,[data-theme=dark] .health-item:hover,[data-theme=dark] .service-item:hover{border-color:var(--primary)}@media print{.topology-sidebar-section{box-shadow:none;break-inside:avoid;border:1px solid #ccc}.topology-action-btn{display:none}}.topology-action-btn:focus-visible,.health-item:focus-within,.service-item:focus-within,.event-item:focus-within{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.topology-sidebar-section,.topology-stat-card,.health-item,.service-item,.topology-action-btn{transition:none}.topology-sidebar-section:hover,.topology-stat-card:hover,.health-item:hover,.service-item:hover,.topology-action-btn:hover{transform:none}}.event-item-empty{color:var(--text-light);padding:10px 0;font-size:13px}.topology-legend{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:22px;transition:transform .25s,border-color .25s,box-shadow .25s}.topology-legend:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.topology-legend h3{color:var(--text);margin:0 0 22px;font-size:20px;font-weight:700}.legend-section{margin-bottom:28px}.legend-section:last-child{margin-bottom:0}.legend-section h4{color:var(--text-light);text-transform:uppercase;letter-spacing:.4px;margin:0 0 14px;font-size:15px;font-weight:700}.legend-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;align-items:center;gap:14px;margin-bottom:10px;padding:12px 14px;transition:transform .25s,border-color .25s;display:flex}.legend-item:last-child{margin-bottom:0}.legend-item:hover{border-color:var(--primary);transform:translate(4px)}.legend-icon{color:#fff;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;font-size:18px;display:flex}.legend-item span{color:var(--text);font-size:14px;font-weight:600}.status-legend-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;align-items:center;gap:12px;margin-bottom:10px;padding:10px 14px;transition:transform .25s,border-color .25s;display:flex}.status-legend-item:last-child{margin-bottom:0}.status-legend-item:hover{border-color:var(--primary);transform:translate(4px)}.status-circle{border-radius:50%;flex-shrink:0;width:14px;height:14px;box-shadow:0 0 12px #00000026}.status-legend-item span{color:var(--text);font-size:14px;font-weight:600}.link-legend{flex-direction:column;gap:12px;display:flex}.link-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;align-items:center;gap:14px;padding:12px 14px;display:flex}.fiber-line-demo,.wireless-line-demo,.inactive-line-demo{border-radius:999px;flex-shrink:0;width:60px;height:4px}.fiber-line-demo{background:#2563eb}.wireless-line-demo{background:repeating-linear-gradient(90deg,#06b6d4 0 8px,#0000 8px 12px)}.inactive-line-demo{background:#cbd5e1}.traffic-legend{flex-direction:column;gap:12px;display:flex}.traffic-item{background:var(--surface2);border:1px solid var(--border);border-radius:14px;align-items:center;gap:14px;padding:12px 14px;transition:transform .25s,border-color .25s;display:flex}.traffic-item:hover{border-color:var(--primary);transform:translate(4px)}.traffic-dot{border-radius:50%;flex-shrink:0;width:14px;height:14px}.traffic-dot.low{background:#22c55e}.traffic-dot.medium{background:#f59e0b}.traffic-dot.high{background:#ef4444}.traffic-item span{color:var(--text);font-size:14px;font-weight:600}@media (width<=768px){.topology-legend{padding:18px}.topology-legend h3{font-size:18px}.legend-item,.status-legend-item,.link-item,.traffic-item{padding:10px 12px}.legend-icon{width:38px;height:38px;font-size:16px}}@media (width<=480px){.legend-item,.status-legend-item,.link-item,.traffic-item{gap:10px}.fiber-line-demo,.wireless-line-demo,.inactive-line-demo{width:44px}}[data-theme=dark] .topology-legend{background:var(--card);border-color:var(--border)}[data-theme=dark] .legend-item,[data-theme=dark] .status-legend-item,[data-theme=dark] .link-item,[data-theme=dark] .traffic-item{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .legend-item:hover,[data-theme=dark] .status-legend-item:hover,[data-theme=dark] .traffic-item:hover{border-color:var(--primary)}@media print{.topology-legend{box-shadow:none;break-inside:avoid;border:1px solid #ccc}}.legend-item:focus-within,.status-legend-item:focus-within,.link-item:focus-within,.traffic-item:focus-within{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.topology-legend,.legend-item,.status-legend-item,.traffic-item{transition:none}.topology-legend:hover,.legend-item:hover,.status-legend-item:hover,.traffic-item:hover{transform:none}}.topology-minimap{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;padding:22px;transition:transform .25s,border-color .25s,box-shadow .25s}.topology-minimap:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.topology-minimap h3{color:var(--text);margin:0 0 20px;font-size:18px;font-weight:700}.minimap-canvas{border:1px solid var(--border);background:linear-gradient(#ffffff08 1px, transparent 1px), linear-gradient(90deg, #ffffff08 1px, transparent 1px), var(--surface);background-size:24px 24px;border-radius:18px;width:100%;height:220px;position:relative;overflow:hidden}.minimap-node{border-radius:50%;width:12px;height:12px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 12px #00000040}.minimap-node.online{background:#22c55e;animation:2s infinite minimapPulse}.minimap-node.warning{background:#f59e0b;animation:2s infinite minimapPulse}.minimap-node.offline{background:#ef4444}@keyframes minimapPulse{0%{transform:translate(-50%,-50%)scale(1)}50%{transform:translate(-50%,-50%)scale(1.35)}to{transform:translate(-50%,-50%)scale(1)}}.minimap-viewport{border:2px solid var(--primary);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;background:#dc262614;border-radius:12px;width:56%;height:48%;animation:2.5s ease-in-out infinite viewportGlow;position:absolute;top:20%;left:22%}.minimap-viewport span{background:var(--primary);color:#fff;white-space:nowrap;border-radius:8px;padding:4px 10px;font-size:11px;font-weight:600;position:absolute;top:-28px;left:0}@keyframes viewportGlow{0%{box-shadow:0 0 #dc262600}50%{box-shadow:0 0 16px #dc262659}to{box-shadow:0 0 #dc262600}}.minimap-footer{border-top:1px solid var(--border);text-align:center;margin-top:18px;padding-top:16px}.minimap-footer small{color:var(--text-light);font-size:12px;line-height:1.6;display:block}.minimap-canvas{cursor:pointer;transition:border-color .25s,box-shadow .25s}.minimap-canvas:hover{border-color:var(--primary);box-shadow:inset 0 0 0 1px #dc262626}.minimap-node:hover{transition:transform .2s;transform:translate(-50%,-50%)scale(1.5)}@media (width<=768px){.topology-minimap{padding:18px}.minimap-canvas{height:180px}.minimap-node{width:10px;height:10px}.minimap-viewport{width:62%;height:52%;left:18%}}@media (width<=480px){.minimap-canvas{height:150px}.minimap-viewport span{padding:3px 8px;font-size:10px}.minimap-footer small{font-size:11px}}[data-theme=dark] .topology-minimap{background:var(--card);border-color:var(--border)}[data-theme=dark] .minimap-canvas{border-color:var(--border)}[data-theme=dark] .minimap-canvas:hover{border-color:var(--primary)}@media print{.topology-minimap{box-shadow:none;break-inside:avoid;border:1px solid #ccc}.minimap-viewport,.minimap-node{animation:none}}.minimap-canvas:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.topology-minimap,.minimap-canvas,.minimap-node,.minimap-viewport{transition:none;animation:none}.topology-minimap:hover,.minimap-canvas:hover{transform:none}}.minimap-node.unknown{background:#64748b}.topology-page{box-sizing:border-box;flex-direction:column;gap:24px;padding:30px;display:flex}.topology-page *,.topology-page :before,.topology-page :after{box-sizing:border-box}.topology-layout{grid-template-columns:1fr 320px;align-items:start;gap:24px;display:grid}.topology-main{min-width:0}.topology-right{flex-direction:column;gap:20px;display:flex}@media (width<=1100px){.topology-layout{grid-template-columns:1fr}}@media (width<=1400px){.olt-header-card{grid-template-columns:1fr}.olt-header-actions{flex-direction:row;justify-content:flex-start}}@media (width<=992px){.olt-header-right{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.olt-header-card{gap:22px;padding:22px}.olt-header-left{flex-direction:column;align-items:flex-start}.olt-header-icon{width:64px;height:64px;font-size:26px}.olt-header-left h1{font-size:26px}.olt-header-right{grid-template-columns:1fr;gap:16px}.olt-header-actions{flex-direction:column;width:100%}.olt-header-actions .btn{width:100%}}@media (width<=480px){.olt-header-card{padding:18px}.olt-header-left h1{font-size:22px}.olt-header-left p{font-size:13px}.olt-stat{padding:16px}.olt-stat strong{font-size:20px}.olt-stat-icon{width:46px;height:46px;font-size:20px}}@media print{.olt-header-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc;grid-template-columns:1fr}.olt-header-actions{display:none}}@media (prefers-reduced-motion:reduce){.olt-header-card,.olt-stat,.olt-stat-icon,.olt-header-actions .btn{transition:none}.olt-header-card:hover,.olt-stat:hover{transform:none}}@media (width<=1200px){.olt-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.olt-stats-grid{grid-template-columns:1fr;gap:16px}.olt-stat-card{padding:18px}.olt-stat-card-icon{border-radius:16px;width:52px;height:52px;font-size:22px}.olt-stat-card-content strong{font-size:24px}}@media (width<=480px){.olt-stat-card{gap:14px;padding:16px}.olt-stat-card-icon{width:48px;height:48px;font-size:20px}.olt-stat-card-content span{font-size:12px}.olt-stat-card-content strong{font-size:22px}}@media print{.olt-stat-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc;transform:none!important}}@media (prefers-reduced-motion:reduce){.olt-stat-card,.olt-stat-card-icon{transition:none}.olt-stat-card:hover,.olt-stat-card:hover .olt-stat-card-icon{transform:none}}@media (width<=768px){.olt-search-card{margin:20px 0;padding:18px}.olt-search-box{gap:12px;padding:12px 16px}.olt-search-box input{font-size:14px}.olt-search-icon{font-size:16px}.olt-search-clear{width:34px;height:34px}}@media (width<=480px){.olt-search-card{padding:16px}.olt-search-box{padding:10px 14px}.olt-search-box input{font-size:13px}.olt-search-info{flex-direction:column;align-items:flex-start;gap:8px}}@media print{.olt-search-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}}@media (prefers-reduced-motion:reduce){.olt-search-card,.olt-search-box,.olt-search-clear,.olt-search-icon{transition:none}.olt-search-card:hover,.olt-search-clear:hover{transform:none}}@media (width<=1200px){.olt-filters-card{grid-template-columns:1fr 1fr}.olt-filter-actions{grid-column:1/-1;justify-content:flex-end}}@media (width<=768px){.olt-filters-card{grid-template-columns:1fr;gap:18px;padding:18px}.olt-filter-buttons{gap:8px}.olt-filter-buttons button{flex:1;min-width:100px}.olt-filter-actions{justify-content:stretch}.olt-reset-btn{width:100%}}@media (width<=480px){.olt-filters-card{padding:16px}.olt-filter-buttons{flex-direction:column}.olt-filter-buttons button{width:100%}}@media print{.olt-filters-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}.olt-reset-btn{display:none}}@media (prefers-reduced-motion:reduce){.olt-filters-card,.olt-filter-buttons button,.olt-filter-group select,.olt-reset-btn{transition:none}.olt-filters-card:hover,.olt-filter-buttons button:hover,.olt-reset-btn:hover{transform:none}}@media (width<=992px){.olt-table-footer{flex-direction:column;align-items:flex-start}.olt-footer-summary{flex-wrap:wrap;gap:12px}}@media (width<=768px){.olt-table th,.olt-table td{padding:14px 12px}.usage-bar{width:90px}.action-btn{width:34px;height:34px}}@media (width<=480px){.olt-table-footer{padding:16px}.olt-footer-summary{flex-direction:column;align-items:stretch;width:100%}.olt-footer-summary span{justify-content:center}}[data-theme=dark] .olt-table code,[data-theme=dark] .olt-footer-summary span{background:var(--surface2);border-color:var(--border)}@media print{.olt-table-card{box-shadow:none;border:1px solid #ccc;overflow:visible}.olt-table{min-width:100%}.action-btn{display:none}.olt-table-footer{break-inside:avoid}}@media (prefers-reduced-motion:reduce){.olt-table-card,.olt-table tbody tr,.usage-fill,.action-btn{transition:none}.olt-table-card:hover,.olt-table tbody tr:hover,.action-btn:hover{transform:none}}.pon-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin:24px 0;display:grid}.pon-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);cursor:pointer;border-radius:20px;transition:transform .25s,border-color .25s,box-shadow .25s;overflow:hidden}.pon-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.pon-card-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:20px;display:flex}.pon-card-header h3{color:var(--text);margin:0 0 6px;font-size:18px;font-weight:700}.pon-icon{color:var(--primary);font-size:28px}.pon-status{text-transform:uppercase;letter-spacing:.4px;border-radius:999px;align-items:center;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.pon-status.online{color:#16a34a;background:#16a34a1f}.pon-status.warning{color:#f59e0b;background:#f59e0b1f}.pon-status.offline{color:#ef4444;background:#ef44441f}.pon-card.online{border-left:4px solid #16a34a}.pon-card.warning{border-left:4px solid #f59e0b}.pon-card.offline{border-left:4px solid #ef4444}.pon-card-body{flex-direction:column;gap:16px;padding:20px;display:flex}.pon-metric{color:var(--text);align-items:center;gap:12px;font-size:14px;display:flex}.pon-metric svg{color:var(--primary);flex-shrink:0;font-size:16px}.pon-utilization{margin-top:6px}.pon-utilization-label{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.pon-utilization-label span{color:var(--text-light);font-size:13px;font-weight:600}.pon-utilization-label strong{color:var(--text);font-size:13px;font-weight:700}.pon-progress{background:var(--surface2);border:1px solid var(--border);border-radius:999px;width:100%;height:10px;overflow:hidden}.pon-progress-fill{background:linear-gradient(90deg,#2563eb,#3b82f6);border-radius:999px;height:100%;transition:width .4s}.pon-card-footer{border-top:1px solid var(--border);background:var(--surface2);justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;display:flex}.pon-footer-item{flex-direction:column;gap:6px;display:flex}.pon-footer-item small{color:var(--text-light);text-transform:uppercase;letter-spacing:.4px;font-size:12px;font-weight:600}.pon-footer-item strong{color:var(--text);font-size:15px;font-weight:700}.health-good{color:#16a34a}.health-warning{color:#f59e0b}.health-offline{color:#ef4444}.pon-card:hover .pon-icon{color:#2563eb;transition:transform .25s,color .25s;transform:scale(1.1)}.pon-card:hover .pon-progress-fill{filter:brightness(1.1)}.pon-card:hover .pon-status{transition:transform .25s;transform:scale(1.05)}.pon-card:hover .pon-footer-item strong{color:var(--primary);transition:color .25s}@media (width<=992px){.pon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.pon-grid{grid-template-columns:1fr;gap:18px}.pon-card-header,.pon-card-body,.pon-card-footer{padding:18px}.pon-card-header h3{font-size:17px}.pon-icon{font-size:24px}}@media (width<=480px){.pon-card-footer{flex-direction:column;align-items:flex-start;gap:14px}.pon-footer-item{width:100%}}[data-theme=dark] .pon-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .pon-card-header,[data-theme=dark] .pon-card-footer{border-color:var(--border)}[data-theme=dark] .pon-card-footer{background:var(--surface2)}[data-theme=dark] .pon-progress{background:var(--surface2);border-color:var(--border)}@media print{.pon-grid{grid-template-columns:repeat(2,1fr);gap:12px}.pon-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc;transform:none!important}}.pon-card:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.pon-card,.pon-icon,.pon-status,.pon-progress-fill{transition:none}.pon-card:hover,.pon-card:hover .pon-icon,.pon-card:hover .pon-status{transform:none}}.pon-grid-empty{border:1px dashed var(--border);border-radius:var(--radius-md);text-align:center;color:var(--text-light);padding:24px;font-size:14px;line-height:1.6}.pon-field-row{border-bottom:1px dashed var(--border);justify-content:space-between;gap:10px;padding:6px 0;font-size:13px;display:flex}.pon-field-row:last-child{border-bottom:none}.pon-field-row span{color:var(--text-light)}.onu-list-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;margin:24px 0;transition:transform .25s,border-color .25s,box-shadow .25s;overflow:hidden}.onu-list-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.onu-table{border-collapse:collapse;width:100%;min-width:1100px}.onu-table thead{background:var(--surface2)}.onu-table th{text-align:left;color:var(--text-light);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border);padding:18px 16px;font-size:13px;font-weight:700}.onu-table td{color:var(--text);border-bottom:1px solid var(--border);vertical-align:middle;padding:18px 16px;font-size:14px}.onu-table tbody tr{transition:background .25s}.onu-table tbody tr:hover{background:#dc26260a}.onu-table code{background:var(--surface2);border:1px solid var(--border);color:var(--primary);border-radius:8px;padding:4px 8px;font-size:12px}.signal-good{color:#16a34a;background:#16a34a1a;border-radius:999px;justify-content:center;align-items:center;padding:6px 10px;font-size:12px;font-weight:700;display:inline-flex}.signal-bad{color:#ef4444;background:#ef44441f;border-radius:999px;justify-content:center;align-items:center;padding:6px 10px;font-size:12px;font-weight:700;display:inline-flex}.onu-actions{align-items:center;gap:8px;display:flex}.onu-btn{cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;transition:transform .25s,background .25s,color .25s;display:flex}.onu-btn:hover{transform:translateY(-2px)}.onu-btn.view{color:#2563eb;background:#2563eb1a}.onu-btn.reboot{color:#f59e0b;background:#f59e0b1f}.onu-btn.config{color:#7c3aed;background:#7c3aed1a}.onu-btn.view:hover{color:#fff;background:#2563eb}.onu-btn.reboot:hover{color:#fff;background:#f59e0b}.onu-btn.config:hover{color:#fff;background:#7c3aed}.onu-table tbody tr:hover strong{color:var(--primary);transition:color .25s}.onu-table tbody tr:hover code{border-color:var(--primary)}@media (width<=992px){.onu-list-footer{flex-direction:column;align-items:flex-start}.onu-summary{flex-wrap:wrap}}@media (width<=768px){.onu-list-card{overflow-x:auto}.onu-table th,.onu-table td{padding:14px 12px}.onu-btn{width:34px;height:34px}}@media (width<=480px){.onu-list-footer{padding:16px}.onu-summary{flex-direction:column;align-items:stretch;gap:10px;width:100%}.onu-summary span{justify-content:center}}.onu-list-footer{background:var(--surface2);border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:20px;padding:18px 22px;display:flex}.onu-list-footer strong{color:var(--text);font-size:15px;font-weight:700}.onu-list-footer span{color:var(--text-light);font-size:13px}.onu-summary{align-items:center;gap:18px;display:flex}.onu-summary span{background:var(--card);border:1px solid var(--border);border-radius:10px;align-items:center;gap:6px;padding:8px 12px;font-weight:600;display:flex}@media (width<=992px){.onu-list-footer{flex-direction:column;align-items:flex-start}.onu-summary{flex-wrap:wrap}}@media (width<=768px){.onu-list-card{overflow-x:auto}.onu-table th,.onu-table td{padding:14px 12px}.onu-btn{width:34px;height:34px}}@media (width<=480px){.onu-list-footer{padding:16px}.onu-summary{flex-direction:column;align-items:stretch;gap:10px;width:100%}.onu-summary span{justify-content:center}}[data-theme=dark] .onu-list-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .onu-table thead{background:var(--surface2)}[data-theme=dark] .onu-table td,[data-theme=dark] .onu-table th{border-color:var(--border)}[data-theme=dark] .onu-table tbody tr:hover{background:#ffffff08}[data-theme=dark] .onu-table code,[data-theme=dark] .onu-summary span{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .onu-list-footer{background:var(--surface2);border-top-color:var(--border)}@media print{.onu-list-card{box-shadow:none;border:1px solid #ccc;overflow:visible}.onu-table{min-width:100%}.onu-btn{display:none}}.onu-btn:focus-visible,.onu-table tbody tr:focus-within{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){.onu-list-card,.onu-table tbody tr,.onu-btn{transition:none}.onu-list-card:hover,.onu-table tbody tr:hover,.onu-btn:hover{transform:none}}.onu-list-empty{border:1px dashed var(--border);border-radius:var(--radius-md);text-align:center;color:var(--text-light);justify-content:center;align-items:center;gap:8px;padding:24px;font-size:14px;line-height:1.6;display:flex}.onu-list{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;display:grid}.onu-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg);padding:14px 16px}.onu-card-header{color:var(--text);align-items:center;gap:8px;margin-bottom:10px;display:flex}.onu-field-row{border-bottom:1px dashed var(--border);justify-content:space-between;gap:10px;padding:5px 0;font-size:13px;display:flex}.onu-field-row:last-child{border-bottom:none}.onu-field-row span{color:var(--text-light)}.olt-profile-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:5000;background:#00000073;justify-content:flex-end;animation:.25s oltOverlayFade;display:flex;position:fixed;inset:0}@keyframes oltOverlayFade{0%{opacity:0}to{opacity:1}}.olt-profile{background:var(--card);border-left:1px solid var(--border);flex-direction:column;width:520px;max-width:100%;height:100vh;animation:.3s oltDrawerSlide;display:flex;overflow-y:auto;box-shadow:-12px 0 32px #0000002e}@keyframes oltDrawerSlide{0%{transform:translate(100%)}to{transform:translate(0)}}.olt-profile-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:24px;display:flex}.olt-profile-title{align-items:center;gap:18px;display:flex}.olt-profile-icon{color:#fff;background:linear-gradient(135deg,#dc2626,#ef4444);border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;width:68px;height:68px;font-size:30px;display:flex}.olt-profile-title h2{color:var(--text);margin:0 0 4px;font-size:24px;font-weight:700}.olt-profile-title p{color:var(--text-light);margin:0;font-size:14px}.olt-profile-close{background:var(--surface2);border:none;border:1px solid var(--border);width:42px;height:42px;color:var(--text);cursor:pointer;border-radius:12px;transition:background .25s,color .25s,transform .25s}.olt-profile-close:hover{background:var(--primary);color:#fff;transform:rotate(90deg)}.olt-profile-status{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;display:flex}.olt-profile-status small{color:var(--text-light);font-size:13px;font-weight:500}.olt-profile-section{padding:24px}.olt-profile-section h3{color:var(--text);margin:0 0 18px;font-size:18px;font-weight:700}.olt-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:24px;display:grid}.olt-info-card{background:var(--surface2);border:1px solid var(--border);border-radius:16px;align-items:flex-start;gap:14px;padding:16px;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex}.olt-info-card:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:translateY(-3px)}.olt-info-icon{width:46px;height:46px;color:var(--primary);background:#dc26261a;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;display:flex}.olt-info-card span{color:var(--text-light);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.olt-info-card strong{color:var(--text);word-break:break-word;font-size:15px;font-weight:700;display:block}.olt-profile-actions{border-top:1px solid var(--border);background:var(--card);grid-template-columns:repeat(2,1fr);gap:16px;margin-top:auto;padding:24px;display:grid}.olt-profile-actions .btn{justify-content:center;width:100%}@media (width<=768px){.olt-profile{width:100%}.olt-profile-header{padding:20px}.olt-profile-status{flex-direction:column;align-items:flex-start;gap:12px;padding:18px 20px}.olt-profile-grid{grid-template-columns:1fr;padding:20px}.olt-profile-section{padding:20px}.olt-profile-icon{width:60px;height:60px;font-size:26px}.olt-profile-title h2{font-size:22px}}@media (width<=480px){.olt-profile-actions{grid-template-columns:1fr}.olt-profile-header,.olt-profile-section,.olt-profile-grid{padding:18px}.olt-info-card{padding:14px}}[data-theme=dark] .olt-profile{background:var(--card);border-left-color:var(--border)}[data-theme=dark] .olt-profile-header,[data-theme=dark] .olt-profile-status,[data-theme=dark] .olt-profile-actions{border-color:var(--border)}[data-theme=dark] .olt-info-card{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .olt-info-card:hover{border-color:var(--primary)}[data-theme=dark] .olt-profile-close{background:var(--surface2);border-color:var(--border);color:var(--text)}[data-theme=dark] .olt-profile-close:hover{background:var(--primary);color:#fff}@media print{.olt-profile-overlay{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;position:static}.olt-profile{width:100%;height:auto;box-shadow:none;border:1px solid #ccc;animation:none}.olt-profile-actions,.olt-profile-close{display:none}}.olt-profile-close:focus-visible,.olt-profile-actions .btn:focus-visible,.olt-info-card:focus-within{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.olt-profile-overlay,.olt-profile,.olt-info-card,.olt-profile-close,.olt-profile-actions .btn{transition:none;animation:none}.olt-info-card:hover,.olt-profile-close:hover{transform:none}}.olt-page{flex-direction:column;gap:24px;padding:24px;display:flex}.monitor-header{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:22px;justify-content:space-between;align-items:center;gap:28px;margin-bottom:28px;padding:28px 32px;display:flex}.monitor-header-left{flex:1;align-items:center;gap:22px;display:flex}.monitor-icon{color:#fff;background:linear-gradient(135deg,#dc2626,#ef4444);border-radius:20px;flex-shrink:0;justify-content:center;align-items:center;width:74px;height:74px;font-size:34px;display:flex;box-shadow:0 15px 35px #dc26264d}.monitor-header-left h1{color:var(--text);margin-bottom:6px;font-size:32px;font-weight:700}.monitor-header-left p{color:var(--text-light);max-width:700px;font-size:15px;line-height:1.6}.monitor-header-right{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:16px;display:flex}.monitor-status-card{background:var(--surface2);border:1px solid var(--border);border-radius:16px;align-items:center;gap:14px;min-width:165px;padding:16px 18px;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex}.monitor-status-card:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:translateY(-4px)}.monitor-status-card svg{width:50px;height:50px;color:var(--primary);background:#dc26261f;border-radius:14px;flex-shrink:0;padding:13px}.monitor-status-card strong{color:var(--text);margin-bottom:4px;font-size:22px;font-weight:700;display:block}.monitor-status-card small{color:var(--text-light);font-size:13px;line-height:1.4;display:block}.monitor-status-card:nth-child(3) svg{color:#22c55e;background:#22c55e1f;animation:2s infinite livePulse}@keyframes livePulse{0%{transform:scale(1);box-shadow:0 0 #22c55e59}70%{transform:scale(1.08);box-shadow:0 0 0 12px #22c55e00}to{transform:scale(1);box-shadow:0 0 #22c55e00}}.monitor-header-right .mds-btn{min-width:140px;height:48px}.monitor-header-right .mds-btn--primary{box-shadow:0 12px 30px #dc262640}.monitor-header-right .mds-btn--primary:hover{transform:translateY(-2px)}.monitor-header-right .mds-btn--secondary{background:var(--surface2)}@media (width<=1400px){.monitor-header{flex-direction:column;align-items:flex-start}.monitor-header-right{justify-content:flex-start;width:100%}}@media (width<=992px){.monitor-header{padding:24px}.monitor-header-left{width:100%}.monitor-header-left h1{font-size:28px}.monitor-status-card{flex:1;min-width:180px}}@media (width<=768px){.monitor-header{gap:22px;padding:20px}.monitor-header-left{flex-direction:column;align-items:flex-start}.monitor-icon{width:64px;height:64px;font-size:28px}.monitor-header-left h1{font-size:24px}.monitor-header-left p{font-size:14px}.monitor-header-right{flex-direction:column;align-items:stretch;width:100%}.monitor-status-card,.monitor-header-right .mds-btn{width:100%}}@media (width<=480px){.monitor-header{padding:18px}.monitor-icon{border-radius:16px;width:56px;height:56px;font-size:24px}.monitor-header-left h1{font-size:22px}.monitor-status-card{padding:14px}.monitor-status-card svg{width:44px;height:44px;padding:11px}.monitor-status-card strong{font-size:18px}}[data-theme=dark] .monitor-header{background:var(--card)}[data-theme=dark] .monitor-status-card{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .monitor-status-card:hover{border-color:var(--primary)}[data-theme=dark] .monitor-icon{box-shadow:0 18px 40px #dc262673}@media print{.monitor-header{box-shadow:none;break-inside:avoid;border:1px solid #ccc}.monitor-header-right .mds-btn{display:none}}.network-overview{grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:24px;margin-bottom:30px;display:grid}.network-overview .stat-card{border:1px solid var(--border);background:var(--card);height:100%;min-height:170px;transition:transform .25s,box-shadow .25s,border-color .25s}.network-overview .stat-card:hover{box-shadow:var(--shadow-lg);border-color:var(--primary);transform:translateY(-6px)}.network-overview .stat-icon{border-radius:20px;flex-shrink:0;width:72px;height:72px}.network-overview .stat-value{color:var(--text);font-size:32px;font-weight:700}.network-overview .stat-title{color:var(--text-light);text-transform:uppercase;letter-spacing:.6px;font-size:13px;font-weight:600}.network-overview .stat-footer{margin-top:12px}.network-overview .stat-card:first-child .stat-icon{background:linear-gradient(135deg,#2563eb,#3b82f6)}.network-overview .stat-card:nth-child(2) .stat-icon{background:linear-gradient(135deg,#7c3aed,#8b5cf6)}.network-overview .stat-card:nth-child(3) .stat-icon{background:linear-gradient(135deg,#16a34a,#22c55e)}.network-overview .stat-card:nth-child(4) .stat-icon{background:linear-gradient(135deg,#ea580c,#f97316)}.network-overview .stat-card:nth-child(5) .stat-icon{background:linear-gradient(135deg,#0891b2,#06b6d4)}.network-overview .stat-card:nth-child(6) .stat-icon{background:linear-gradient(135deg,#0f766e,#14b8a6)}.network-overview .stat-card:nth-child(7) .stat-icon{background:linear-gradient(135deg,#dc2626,#ef4444)}.network-overview .stat-card:nth-child(8) .stat-icon{background:linear-gradient(135deg,#059669,#10b981)}.network-overview .stat-card{position:relative;overflow:hidden}.network-overview .stat-card:before{content:"";background:var(--primary);opacity:0;width:5px;height:100%;transition:opacity .25s;position:absolute;top:0;left:0}.network-overview .stat-card:hover:before{opacity:1}.network-overview .stat-icon{box-shadow:0 12px 28px #0000002e}.network-overview .stat-value{transition:color .25s}.network-overview .stat-card:hover .stat-value{color:var(--primary)}.network-overview .stat-footer span{color:var(--text-light);font-size:13px;font-weight:500}.network-overview .stat-footer .text-success{color:var(--success);font-weight:700}.network-overview .stat-footer .text-danger{color:var(--danger);font-weight:700}@media (width<=1400px){.network-overview{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=992px){.network-overview{gap:20px}.network-overview .stat-card{min-height:160px}.network-overview .stat-value{font-size:28px}}@media (width<=768px){.network-overview{grid-template-columns:1fr;gap:18px}.network-overview .stat-card{min-height:auto}.network-overview .stat-icon{border-radius:18px;width:64px;height:64px}.network-overview .stat-value{font-size:26px}}@media (width<=480px){.network-overview{gap:16px}.network-overview .stat-card{padding:18px}.network-overview .stat-icon{border-radius:16px;width:58px;height:58px}.network-overview .stat-title{font-size:12px}.network-overview .stat-value{font-size:22px}.network-overview .stat-footer span{font-size:12px}}[data-theme=dark] .network-overview .stat-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .network-overview .stat-card:hover{border-color:var(--primary)}[data-theme=dark] .network-overview .stat-title{color:var(--text-light)}[data-theme=dark] .network-overview .stat-value{color:var(--text)}@media print{.network-overview{grid-template-columns:repeat(2,1fr);gap:12px}.network-overview .stat-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}}.network-overview .stat-card:focus-within{outline:2px solid var(--primary);outline-offset:3px}.device-metrics-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:22px;margin-bottom:24px;padding:28px}.device-metrics-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px;display:flex}.device-metrics-header h2{color:var(--text);align-items:center;gap:10px;margin-bottom:4px;font-size:22px;font-weight:700;display:flex}.device-metrics-header p{color:var(--text-light);max-width:480px;font-size:14px}.device-metrics-picker{align-items:center;gap:10px;display:flex}.device-metrics-picker select{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text);min-width:220px;padding:10px 14px;font-size:14px}.metrics-empty{border:1px dashed var(--border);border-radius:var(--radius-md);text-align:center;color:var(--text-light);padding:28px;font-size:14px;line-height:1.6}.metrics-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-bottom:20px;display:grid}.metric-tile{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg);padding:16px 18px}.metric-tile .metric-name{color:var(--text-light);text-transform:uppercase;letter-spacing:.03em;font-size:13px;font-weight:600}.metric-tile .metric-value{color:var(--text);margin:6px 0 4px;font-size:24px;font-weight:700}.metric-tile .metric-time{color:var(--text-light);font-size:12px}.record-metric-form{border-top:1px solid var(--border);flex-wrap:wrap;align-items:flex-end;gap:12px;margin-top:6px;padding-top:18px;display:flex}.record-metric-form .form-group{flex:1;min-width:140px}.record-metric-form label{color:var(--text-light);margin-bottom:6px;font-size:13px;display:block}.record-metric-form input{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);padding:10px 12px;font-size:14px}.record-metric-error{width:100%;color:var(--danger);font-size:13px}.event-timeline-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:22px;margin-bottom:30px;padding:28px}.event-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px;display:flex}.event-header h2{color:var(--text);align-items:center;gap:12px;margin-bottom:6px;font-size:26px;font-weight:700;display:flex}.event-header p{color:var(--text-light);font-size:14px}.event-live{color:#16a34a;background:#22c55e1a;border-radius:999px;align-items:center;gap:10px;padding:10px 18px;font-size:13px;font-weight:700;display:flex}.event-live .live-dot{background:#22c55e;border-radius:50%;width:10px;height:10px;animation:1.5s infinite eventPulse}@keyframes eventPulse{0%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(1.4)}to{opacity:1;transform:scale(1)}}.event-list{flex-direction:column;gap:22px;margin-bottom:32px;display:flex;position:relative}.event-list:before{content:"";background:var(--border);width:2px;position:absolute;top:0;bottom:0;left:30px}.event-item{align-items:flex-start;gap:18px;display:flex;position:relative}.event-icon{color:#fff;z-index:2;border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;width:60px;height:60px;font-size:22px;display:flex;box-shadow:0 12px 28px #0000002e}.event-content{background:var(--surface2);border:1px solid var(--border);border-radius:18px;flex:1;padding:18px 22px;transition:transform .25s,box-shadow .25s,border-color .25s}.event-content:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:translateY(-3px)}.event-top{justify-content:space-between;align-items:center;gap:20px;margin-bottom:8px;display:flex}.event-top strong{color:var(--text);font-size:16px;font-weight:700}.event-top small{color:var(--text-light);white-space:nowrap;font-size:12px}.event-content p{color:var(--text-light);margin:0;font-size:14px;line-height:1.6}.event-icon.success{background:linear-gradient(135deg,#16a34a,#22c55e)}.event-icon.info{background:linear-gradient(135deg,#2563eb,#3b82f6)}.event-icon.primary{background:linear-gradient(135deg,#7c3aed,#8b5cf6)}.event-icon.warning{background:linear-gradient(135deg,#f59e0b,#fbbf24)}.event-icon.danger{background:linear-gradient(135deg,#dc2626,#ef4444)}.event-summary{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;display:grid}.event-summary-card{background:var(--surface2);border:1px solid var(--border);text-align:center;border-radius:16px;padding:18px;transition:transform .25s,border-color .25s,box-shadow .25s}.event-summary-card:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:translateY(-4px)}.event-summary-card strong{color:var(--text);margin-bottom:6px;font-size:26px;font-weight:700;display:block}.event-summary-card span{color:var(--text-light);font-size:13px;display:block}.event-summary-card.success{border-top:4px solid #16a34a}.event-summary-card.warning{border-top:4px solid #f59e0b}.event-summary-card.danger{border-top:4px solid #dc2626}.event-summary-card.info{border-top:4px solid #2563eb}.event-summary-card.primary{border-top:4px solid #7c3aed}@media (width<=1200px){.event-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=992px){.event-header{flex-direction:column;align-items:flex-start}.event-header h2{font-size:24px}}@media (width<=768px){.event-timeline-card{padding:20px}.event-list:before{left:26px}.event-icon{border-radius:16px;width:52px;height:52px;font-size:20px}.event-content{padding:16px}.event-top{flex-direction:column;align-items:flex-start;gap:6px}.event-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}@media (width<=480px){.event-timeline-card{padding:16px}.event-header h2{font-size:21px}.event-header p{font-size:13px}.event-item{gap:14px}.event-list:before{left:22px}.event-icon{border-radius:14px;width:44px;height:44px;font-size:18px}.event-summary{grid-template-columns:1fr}.event-summary-card{padding:15px}.event-summary-card strong{font-size:20px}}[data-theme=dark] .event-timeline-card{background:var(--card)}[data-theme=dark] .event-content,[data-theme=dark] .event-summary-card{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .event-content:hover,[data-theme=dark] .event-summary-card:hover{border-color:var(--primary)}[data-theme=dark] .event-list:before{background:var(--border)}@media print{.event-timeline-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}.event-live{display:none}}.event-content:focus-within,.event-summary-card:focus-within{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){.event-content,.event-summary-card,.event-live .live-dot{transition:none;animation:none}}.alert-item-top-row{justify-content:space-between;align-items:flex-start;gap:12px;width:100%;display:flex}.alert-badges{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.alert-device-tag{color:var(--text-light);font-size:12px}.alert-actions{gap:8px;margin-top:10px;display:flex}.alerts-feed-toolbar{justify-content:flex-end;margin-bottom:16px;display:flex}.live-monitoring{flex-direction:column;gap:30px;padding:30px;animation:.35s monitorFade;display:flex}@keyframes monitorFade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.live-monitoring-grid{grid-template-columns:2fr 1fr;align-items:start;gap:30px;display:grid}.live-monitoring-left,.live-monitoring-right{flex-direction:column;gap:30px;display:flex}.monitor-footer{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.monitor-footer-card{background:var(--card);border:1px solid var(--border);text-align:center;box-shadow:var(--shadow-sm);border-radius:20px;padding:22px;transition:transform .25s,box-shadow .25s,border-color .25s}.monitor-footer-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-5px)}.monitor-footer-card strong{color:var(--text);margin-bottom:8px;font-size:18px;font-weight:700;display:block}.monitor-footer-card span{color:var(--text-light);font-size:13px;line-height:1.5;display:block}.live-monitoring-left>*,.live-monitoring-right>*{width:100%}.live-monitoring-left>:last-child,.live-monitoring-right>:last-child{margin-bottom:0}.monitor-footer-card:first-child{border-top:4px solid #16a34a}.monitor-footer-card:nth-child(2){border-top:4px solid #2563eb}.monitor-footer-card:nth-child(3){border-top:4px solid #7c3aed}.monitor-footer-card:nth-child(4){border-top:4px solid #f59e0b}.monitor-footer-card:hover strong{color:var(--primary)}@media (width<=1400px){.live-monitoring-grid{grid-template-columns:1fr}}@media (width<=992px){.live-monitoring{gap:24px;padding:24px}.live-monitoring-grid,.live-monitoring-left,.live-monitoring-right{gap:24px}.monitor-footer{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.live-monitoring{gap:20px;padding:20px}.live-monitoring-grid,.live-monitoring-left,.live-monitoring-right{gap:20px}.monitor-footer{gap:16px}.monitor-footer-card{padding:18px}.monitor-footer-card strong{font-size:16px}}@media (width<=480px){.live-monitoring{padding:16px}.monitor-footer{grid-template-columns:1fr}.monitor-footer-card{padding:16px}.monitor-footer-card strong{font-size:15px}.monitor-footer-card span{font-size:12px}}[data-theme=dark] .live-monitoring{background:0 0}[data-theme=dark] .monitor-footer-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .monitor-footer-card:hover{border-color:var(--primary)}[data-theme=dark] .monitor-footer-card strong{color:var(--text)}[data-theme=dark] .monitor-footer-card span{color:var(--text-light)}@media print{.live-monitoring{gap:16px;padding:0}.live-monitoring-grid{grid-template-columns:1fr;gap:16px}.live-monitoring-left,.live-monitoring-right{gap:16px}.monitor-footer{grid-template-columns:repeat(2,1fr);gap:12px}.monitor-footer-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}}.monitor-footer-card:focus-within{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.live-monitoring{animation:none}.monitor-footer-card{transition:none}.monitor-footer-card:hover{transform:none}}.live-monitoring::-webkit-scrollbar{width:10px}.live-monitoring::-webkit-scrollbar-track{background:var(--surface2);border-radius:999px}.live-monitoring::-webkit-scrollbar-thumb{background:var(--primary);border-radius:999px}.live-monitoring::-webkit-scrollbar-thumb:hover{background:#b91c1c}.revenue-trend{border:1px solid var(--border);background:var(--card);border-radius:18px;padding:22px 24px}.revenue-trend header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px;display:flex}.revenue-trend h2{color:var(--text);align-items:center;gap:10px;margin:0;font-size:17px;display:flex}.revenue-trend h2 svg{color:var(--primary)}.revenue-trend header p{color:var(--text-light);margin:6px 0 0;font-size:12.5px}.revenue-trend__ranges{border:1px solid var(--border);background:var(--surface2);border-radius:12px;gap:4px;padding:4px;display:flex}.revenue-trend__ranges button{color:var(--text-light);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:9px;padding:7px 16px;font-size:13px;font-weight:600}.revenue-trend__ranges button:hover{color:var(--text)}.revenue-trend__ranges button.is-active{background:var(--primary);color:var(--white)}.revenue-trend__summary{border-bottom:1px solid var(--border);grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:18px;margin-bottom:22px;padding-bottom:20px;display:grid}.revenue-trend__summary strong{color:var(--text);font-size:22px;font-weight:700;display:block}.revenue-trend__summary span{color:var(--text-light);font-size:12px}.revenue-trend__chart{min-height:280px}.revenue-trend__empty{min-height:280px;color:var(--text-light);text-align:center;place-items:center;margin:0;font-size:13.5px;display:grid}.revenue-trend__error{color:var(--danger);background:#dc26261f;border-radius:10px;margin-bottom:16px;padding:11px 14px;font-size:13px}@keyframes billingShimmer{to{background-position:-200% 0}}@media (width<=1180px){.billing-stats{grid-template-columns:repeat(2,1fr)}.billing-toolbar{flex-direction:column;align-items:stretch}.billing-search{max-width:none}.billing-filters{overflow:auto}}@media (width<=760px){.billing-header{flex-direction:column}.billing-header__actions{justify-content:flex-start;width:100%}.billing-stats,.billing-form-grid,.payment-summary{grid-template-columns:1fr}.billing-filters{width:100%}.billing-page{gap:18px}}.ticket-header{flex-direction:column;gap:28px;margin-bottom:28px;display:flex}.ticket-header-top{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.ticket-header .breadcrumb{color:var(--text-light);align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600;display:flex}.ticket-header h1{color:var(--text);margin-bottom:8px;font-size:34px;font-weight:700}.ticket-header p{color:var(--text-light);max-width:650px;font-size:15px}.ticket-header-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.ticket-overview{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.ticket-overview .overview-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;align-items:center;gap:16px;padding:20px;transition:all .25s;display:flex}.ticket-overview .overview-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}.ticket-overview .overview-icon{color:#fff;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;font-size:22px;display:flex}.ticket-overview .red{background:#dc2626}.ticket-overview .green{background:#16a34a}.ticket-overview .orange{background:#f59e0b}.ticket-overview .blue{background:#2563eb}.ticket-overview .overview-card small{color:var(--text-light);margin-bottom:6px;font-size:13px;display:block}.ticket-overview .overview-card h2{color:var(--text);font-size:26px;font-weight:700}@media (width<=1400px){.ticket-overview{grid-template-columns:repeat(2,1fr)}}@media (width<=900px){.ticket-header-top{flex-direction:column}.ticket-header-actions{justify-content:flex-start;width:100%}}@media (width<=768px){.ticket-overview{grid-template-columns:1fr}.ticket-header h1{font-size:28px}.ticket-header-actions{grid-template-columns:1fr;width:100%;display:grid}}.ticket-search-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.ticket-search-box{background:var(--surface2);border:1px solid var(--border);border-radius:14px;flex:1;align-items:center;gap:14px;padding:14px 18px;transition:all .25s;display:flex}.ticket-search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #dc262626}.ticket-search-box .search-icon{color:var(--text-light);font-size:16px}.ticket-search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px}.ticket-search-box input::placeholder{color:var(--text-light)}.ticket-search-card .clear-btn{cursor:pointer;width:34px;height:34px;color:var(--text-light);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;transition:all .25s;display:flex}.ticket-search-card .clear-btn:hover{color:#fff;background:#dc2626}.ticket-search-card .search-shortcut{background:var(--surface2);border:1px solid var(--border);color:var(--text-light);white-space:nowrap;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.ticket-search-card .search-shortcut svg{color:var(--primary)}@media (width<=768px){.ticket-search-card{flex-direction:column;align-items:stretch}.ticket-search-card .search-shortcut{justify-content:center}}.ticket-filter-bar{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.ticket-filter-left{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.ticket-filter-bar .filter-title{color:var(--text);white-space:nowrap;align-items:center;gap:10px;font-weight:700;display:flex}.ticket-filter-bar .filter-title svg{color:var(--primary)}.ticket-filter-bar .filter-buttons{flex-wrap:wrap;gap:12px;display:flex}.ticket-filter-right{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.ticket-filter-bar .filter-info{background:var(--surface2);border:1px solid var(--border);border-radius:12px;flex-direction:column;padding:10px 16px;display:flex}.ticket-filter-bar .filter-info strong{color:var(--text-light);margin-bottom:4px;font-size:12px}.ticket-filter-bar .filter-info span{color:var(--text);font-size:14px;font-weight:600}@media (width<=1100px){.ticket-filter-bar{flex-direction:column;align-items:flex-start}.ticket-filter-right{justify-content:space-between;width:100%}}@media (width<=768px){.ticket-filter-bar .filter-buttons{grid-template-columns:1fr 1fr;width:100%;display:grid}.ticket-filter-right{grid-template-columns:1fr;width:100%;display:grid}}.package-header{flex-direction:column;gap:28px;margin-bottom:28px;display:flex}.package-header-top{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.package-header .breadcrumb{color:var(--text-light);align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600;display:flex}.package-header h1{color:var(--text);margin-bottom:8px;font-size:34px;font-weight:700}.package-header p{color:var(--text-light);max-width:650px;font-size:15px}.package-header-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.package-overview{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.package-overview .overview-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;align-items:center;gap:16px;padding:20px;transition:all .25s;display:flex}.package-overview .overview-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}.package-overview .overview-icon{color:#fff;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;font-size:22px;display:flex}.package-overview .red{background:#dc2626}.package-overview .green{background:#16a34a}.package-overview .orange{background:#f59e0b}.package-overview .blue{background:#2563eb}.package-overview .overview-card small{color:var(--text-light);margin-bottom:6px;font-size:13px;display:block}.package-overview .overview-card h2{color:var(--text);font-size:26px;font-weight:700}@media (width<=1400px){.package-overview{grid-template-columns:repeat(2,1fr)}}@media (width<=900px){.package-header-top{flex-direction:column}.package-header-actions{justify-content:flex-start;width:100%}}@media (width<=768px){.package-overview{grid-template-columns:1fr}.package-header h1{font-size:28px}.package-header-actions{grid-template-columns:1fr;width:100%;display:grid}}.package-search-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.package-search-box{background:var(--surface2);border:1px solid var(--border);border-radius:14px;flex:1;align-items:center;gap:14px;padding:14px 18px;transition:all .25s;display:flex}.package-search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #dc262626}.package-search-box .search-icon{color:var(--text-light);font-size:16px}.package-search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px}.package-search-box input::placeholder{color:var(--text-light)}.package-search-card .clear-btn{cursor:pointer;width:34px;height:34px;color:var(--text-light);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;transition:all .25s;display:flex}.package-search-card .clear-btn:hover{color:#fff;background:#dc2626}.package-search-card .search-shortcut{background:var(--surface2);border:1px solid var(--border);color:var(--text-light);white-space:nowrap;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.package-search-card .search-shortcut svg{color:var(--primary)}@media (width<=768px){.package-search-card{flex-direction:column;align-items:stretch}.package-search-card .search-shortcut{justify-content:center}}.package-filter-bar{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.package-filter-left{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.package-filter-bar .filter-title{color:var(--text);white-space:nowrap;align-items:center;gap:10px;font-weight:700;display:flex}.package-filter-bar .filter-title svg{color:var(--primary)}.package-filter-bar .filter-buttons{flex-wrap:wrap;gap:12px;display:flex}.package-filter-right{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.package-filter-bar .filter-info{background:var(--surface2);border:1px solid var(--border);border-radius:12px;flex-direction:column;padding:10px 16px;display:flex}.package-filter-bar .filter-info strong{color:var(--text-light);margin-bottom:4px;font-size:12px}.package-filter-bar .filter-info span{color:var(--text);font-size:14px;font-weight:600}@media (width<=1100px){.package-filter-bar{flex-direction:column;align-items:flex-start}.package-filter-right{justify-content:space-between;width:100%}}@media (width<=768px){.package-filter-bar .filter-buttons{grid-template-columns:1fr 1fr;width:100%;display:grid}.package-filter-right{grid-template-columns:1fr;width:100%;display:grid}}.campaign-header{flex-direction:column;gap:28px;margin-bottom:28px;display:flex}.campaign-header-top{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.campaign-header .breadcrumb{color:var(--text-light);align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600;display:flex}.campaign-header h1{color:var(--text);margin-bottom:8px;font-size:34px;font-weight:700}.campaign-header p{color:var(--text-light);max-width:650px;font-size:15px}.campaign-header-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.campaign-overview{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.campaign-overview .overview-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;align-items:center;gap:16px;padding:20px;transition:all .25s;display:flex}.campaign-overview .overview-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}.campaign-overview .overview-icon{color:#fff;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;font-size:22px;display:flex}.campaign-overview .red{background:#dc2626}.campaign-overview .green{background:#16a34a}.campaign-overview .orange{background:#f59e0b}.campaign-overview .blue{background:#2563eb}.campaign-overview .overview-card small{color:var(--text-light);margin-bottom:6px;font-size:13px;display:block}.campaign-overview .overview-card h2{color:var(--text);font-size:26px;font-weight:700}@media (width<=1400px){.campaign-overview{grid-template-columns:repeat(2,1fr)}}@media (width<=900px){.campaign-header-top{flex-direction:column}.campaign-header-actions{justify-content:flex-start;width:100%}}@media (width<=768px){.campaign-overview{grid-template-columns:1fr}.campaign-header h1{font-size:28px}.campaign-header-actions{grid-template-columns:1fr;width:100%;display:grid}}.campaign-search-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.campaign-search-box{background:var(--surface2);border:1px solid var(--border);border-radius:14px;flex:1;align-items:center;gap:14px;padding:14px 18px;transition:all .25s;display:flex}.campaign-search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #dc262626}.campaign-search-box .search-icon{color:var(--text-light);font-size:16px}.campaign-search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px}.campaign-search-box input::placeholder{color:var(--text-light)}.campaign-search-card .clear-btn{cursor:pointer;width:34px;height:34px;color:var(--text-light);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;transition:all .25s;display:flex}.campaign-search-card .clear-btn:hover{color:#fff;background:#dc2626}.campaign-search-card .search-shortcut{background:var(--surface2);border:1px solid var(--border);color:var(--text-light);white-space:nowrap;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.campaign-search-card .search-shortcut svg{color:var(--primary)}@media (width<=768px){.campaign-search-card{flex-direction:column;align-items:stretch}.campaign-search-card .search-shortcut{justify-content:center}}.campaign-filter-bar{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 22px;display:flex}.campaign-filter-left{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.campaign-filter-bar .filter-title{color:var(--text);white-space:nowrap;align-items:center;gap:10px;font-weight:700;display:flex}.campaign-filter-bar .filter-title svg{color:var(--primary)}.campaign-filter-bar .filter-buttons{flex-wrap:wrap;gap:12px;display:flex}.campaign-filter-right{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.campaign-filter-bar .filter-info{background:var(--surface2);border:1px solid var(--border);border-radius:12px;flex-direction:column;padding:10px 16px;display:flex}.campaign-filter-bar .filter-info strong{color:var(--text-light);margin-bottom:4px;font-size:12px}.campaign-filter-bar .filter-info span{color:var(--text);font-size:14px;font-weight:600}@media (width<=1100px){.campaign-filter-bar{flex-direction:column;align-items:flex-start}.campaign-filter-right{justify-content:space-between;width:100%}}@media (width<=768px){.campaign-filter-bar .filter-buttons{grid-template-columns:1fr 1fr;width:100%;display:grid}.campaign-filter-right{grid-template-columns:1fr;width:100%;display:grid}}.campaigns-page{box-sizing:border-box;padding:30px}.campaigns-page *,.campaigns-page :before,.campaigns-page :after{box-sizing:border-box}.campaign-profile__media{border:1px solid var(--border);background:var(--surface2);border-radius:14px;margin-bottom:24px;overflow:hidden}.campaign-profile__media img,.campaign-profile__media video{object-fit:contain;background:#000;width:100%;max-height:320px;display:block}.campaign-profile__media-placeholder{color:var(--text-light);flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:50px 20px;display:flex}.campaign-profile__media-placeholder svg{font-size:30px}.campaign-reward-toggle{cursor:pointer;align-items:center;gap:8px;display:flex}.campaign-reward-toggle input{width:16px;height:16px;accent-color:var(--primary)}.sessions{flex-direction:column;gap:10px;margin:0 0 20px;padding:0;list-style:none;display:flex}.sessions li{border:1px solid var(--border);background:var(--surface2);border-radius:12px;align-items:flex-start;gap:14px;padding:14px 16px;display:flex}.sessions li.is-current{border-color:var(--accent)}.sessions li svg{color:var(--text-light);flex-shrink:0;margin-top:3px}.sessions strong{color:var(--text);align-items:center;gap:10px;font-size:14px;display:flex}.sessions small{color:var(--text-light);margin-top:4px;font-size:12px;display:block}.sessions__badge{color:#16a34a;background:#16a34a29;border-radius:999px;align-items:center;gap:5px;padding:2px 9px;font-size:11px;font-weight:700;display:inline-flex}.sessions__badge svg{color:#16a34a;margin:0;font-size:7px}.sessions__empty{color:var(--text-light);font-size:13.5px}.sessions__error,.sessions__notice{border-radius:10px;margin-bottom:14px;padding:10px 14px;font-size:13px}.sessions__error{color:#dc2626;background:#dc26261f}.sessions__notice{color:#16a34a;background:#16a34a1f}.sessions__actions{justify-content:flex-end;display:flex}.settings-page{box-sizing:border-box;padding:30px}.settings-page *,.settings-page :before,.settings-page :after{box-sizing:border-box}.settings-page__header{margin-bottom:28px}.settings-page__header .breadcrumb{color:var(--text-light);align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600;display:flex}.settings-page__header h1{color:var(--text);margin-bottom:8px;font-size:34px;font-weight:700}.settings-page__header p{color:var(--text-light);max-width:650px;font-size:15px}.settings-layout{grid-template-columns:280px 1fr;align-items:start;gap:24px;display:grid}@media (width<=900px){.settings-layout{grid-template-columns:1fr}}.settings-nav{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;flex-direction:column;gap:6px;padding:12px;display:flex;position:sticky;top:24px}.settings-nav__item{text-align:left;cursor:pointer;background:0 0;border:none;border-radius:12px;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px;transition:all .2s;display:flex}.settings-nav__item strong{color:var(--text);font-size:14px}.settings-nav__item small{color:var(--text-light);font-size:12px}.settings-nav__item:hover{background:var(--surface2)}.settings-nav__item.active{background:var(--primary)}.settings-nav__item.active strong,.settings-nav__item.active small{color:#fff}.settings-content{min-width:0}.settings-panel{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;margin-bottom:24px;padding:26px}.settings-panel__header{margin-bottom:22px}.settings-panel__header h2{color:var(--text);margin-bottom:6px;font-size:20px;font-weight:700}.settings-panel__header p{color:var(--text-light);font-size:14px}.settings-panel__footer{border-top:1px solid var(--border);justify-content:flex-end;align-items:center;gap:14px;margin-top:24px;padding-top:20px;display:flex}.settings-panel__saved{color:var(--success);align-items:center;gap:6px;font-size:14px;font-weight:600;display:flex}.settings-toggle-list{flex-direction:column;gap:4px;display:flex}.settings-toggle-row{border-bottom:1px solid var(--border);cursor:pointer;justify-content:space-between;align-items:center;gap:20px;padding:16px 4px;display:flex}.settings-toggle-row:last-child{border-bottom:none}.settings-toggle-row strong{color:var(--text);align-items:center;gap:8px;font-size:14px;display:flex}.settings-toggle-row small{color:var(--text-light);margin-top:4px;font-size:13px;display:block}.settings-switch{flex-shrink:0;width:44px;height:26px;display:inline-block;position:relative}.settings-switch input{opacity:0;width:0;height:0}.settings-switch__track{background:var(--surface2);border:1px solid var(--border);border-radius:999px;transition:all .2s;position:absolute;inset:0}.settings-switch__track:before{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:all .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #00000040}.settings-switch input:checked+.settings-switch__track{background:var(--primary);border-color:var(--primary)}.settings-switch input:checked+.settings-switch__track:before{transform:translate(18px)}.settings-theme-options{gap:16px;display:flex}.settings-theme-option{border:2px solid var(--border);background:var(--surface2);color:var(--text);cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:10px;padding:24px 32px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.settings-theme-option svg{font-size:22px}.settings-theme-option:hover{border-color:var(--primary)}.settings-theme-option.active{border-color:var(--primary);background:var(--primary);color:#fff}.settings-subsection-title{color:var(--text);border-top:1px solid var(--border);align-items:center;gap:8px;margin:26px 0 14px;padding-top:18px;font-size:14px;font-weight:700;display:flex}.settings-subsection-title:first-of-type{border-top:none;margin-top:0;padding-top:0}.settings-subsection-title svg{color:var(--primary)}.settings-placeholder-hint{background:var(--surface2);border:1px solid var(--border);color:var(--text-light);border-radius:12px;align-items:flex-start;gap:10px;margin-bottom:16px;padding:12px 16px;font-size:13px;display:flex}.settings-placeholder-hint svg{color:var(--primary);flex-shrink:0;margin-top:2px}.settings-placeholder-hint code{background:var(--card);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:1px 6px;font-size:12px}.olt-header-card{background:#fff;border:1px solid #e5e7eb;border-radius:20px;grid-template-columns:auto 1fr;align-items:center;gap:32px;padding:28px;display:grid;box-shadow:0 8px 25px #0000000d}.olt-stat-icon{width:52px;height:52px;color:var(--primary);background:#dc26261a;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;font-size:22px;display:flex}.olt-stat strong{color:var(--text);margin-bottom:4px;font-size:22px;font-weight:700;display:block}.olt-stat span{color:var(--text-light);font-size:13px;display:block}.olt-header-actions{flex-direction:column;justify-content:center;gap:14px;display:flex}.olt-header-actions .btn{justify-content:center;width:180px}.olt-header-actions .btn svg{margin-right:8px}.olt-stat:first-child{border-left:4px solid #16a34a}.olt-stat:nth-child(2){border-left:4px solid #2563eb}.olt-stat:nth-child(3){border-left:4px solid #f59e0b}.olt-stat:nth-child(4){border-left:4px solid #7c3aed}.olt-stat:hover .olt-stat-icon{transition:transform .25s;transform:scale(1.08)}.olt-stat:hover strong{color:var(--primary);transition:color .25s}@media (width<=1400px){.olt-header-card{grid-template-columns:1fr}.olt-header-actions{flex-direction:row;justify-content:flex-start}}@media (width<=992px){.olt-header-right{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.olt-header-card{gap:22px;padding:22px}.olt-header-left{flex-direction:column;align-items:flex-start}.olt-header-icon{width:64px;height:64px;font-size:26px}.olt-header-left h1{font-size:26px}.olt-header-right{grid-template-columns:1fr;gap:16px}.olt-header-actions{flex-direction:column;width:100%}.olt-header-actions .btn{width:100%}}@media (width<=480px){.olt-header-card{padding:18px}.olt-header-left h1{font-size:22px}.olt-header-left p{font-size:13px}.olt-stat{padding:16px}.olt-stat strong{font-size:20px}.olt-stat-icon{width:46px;height:46px;font-size:20px}}[data-theme=dark] .olt-header-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .olt-stat{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .olt-stat:hover{border-color:var(--primary)}[data-theme=dark] .olt-stat strong{color:var(--text)}[data-theme=dark] .olt-stat span{color:var(--text-light)}@media print{.olt-header-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc;grid-template-columns:1fr}.olt-header-actions{display:none}}.olt-stat:focus-within,.olt-header-actions .btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.olt-header-card,.olt-stat,.olt-stat-icon,.olt-header-actions .btn{transition:none}.olt-header-card:hover,.olt-stat:hover{transform:none}}.olt-stats-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:28px 0;display:grid}.olt-stat-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;align-items:center;gap:18px;padding:22px;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex}.olt-stat-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.olt-stat-card-icon{color:#fff;border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;width:60px;height:60px;font-size:26px;display:flex}.olt-stat-card-content{flex:1}.olt-stat-card-content span{color:var(--text-light);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.olt-stat-card-content strong{color:var(--text);font-size:28px;font-weight:700;display:block}.olt-stat-card.primary .olt-stat-card-icon{background:linear-gradient(135deg,#2563eb,#3b82f6)}.olt-stat-card.success .olt-stat-card-icon{background:linear-gradient(135deg,#16a34a,#22c55e)}.olt-stat-card.warning .olt-stat-card-icon{background:linear-gradient(135deg,#f59e0b,#fbbf24)}.olt-stat-card.danger .olt-stat-card-icon{background:linear-gradient(135deg,#dc2626,#ef4444)}.olt-stat-card.info .olt-stat-card-icon{background:linear-gradient(135deg,#0891b2,#06b6d4)}.olt-stat-card:hover .olt-stat-card-icon{transition:transform .25s;transform:scale(1.08)}.olt-stat-card:hover .olt-stat-card-content strong{color:var(--primary);transition:color .25s}.olt-stat-card.primary{border-left:4px solid #2563eb}.olt-stat-card.success{border-left:4px solid #16a34a}.olt-stat-card.warning{border-left:4px solid #f59e0b}.olt-stat-card.danger{border-left:4px solid #ef4444}.olt-stat-card.info{border-left:4px solid #06b6d4}@media (width<=1200px){.olt-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=768px){.olt-stats-grid{grid-template-columns:1fr;gap:16px}.olt-stat-card{padding:18px}.olt-stat-card-icon{border-radius:16px;width:52px;height:52px;font-size:22px}.olt-stat-card-content strong{font-size:24px}}@media (width<=480px){.olt-stat-card{gap:14px;padding:16px}.olt-stat-card-icon{width:48px;height:48px;font-size:20px}.olt-stat-card-content span{font-size:12px}.olt-stat-card-content strong{font-size:22px}}[data-theme=dark] .olt-stat-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .olt-stat-card:hover{border-color:var(--primary)}[data-theme=dark] .olt-stat-card-content strong{color:var(--text)}[data-theme=dark] .olt-stat-card-content span{color:var(--text-light)}@media print{.olt-stat-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc;transform:none!important}}.olt-stat-card:focus-within{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.olt-stat-card,.olt-stat-card-icon{transition:none}.olt-stat-card:hover,.olt-stat-card:hover .olt-stat-card-icon{transform:none}}.olt-search-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;margin:24px 0;padding:22px;transition:transform .25s,border-color .25s,box-shadow .25s}.olt-search-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.olt-search-box{background:var(--surface2);border:1px solid var(--border);border-radius:16px;align-items:center;gap:14px;padding:14px 18px;transition:border-color .25s,box-shadow .25s;display:flex}.olt-search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #dc26261a}.olt-search-icon{color:var(--text-light);flex-shrink:0;font-size:18px}.olt-search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:15px;font-weight:500}.olt-search-box input::placeholder{color:var(--text-light)}.olt-search-clear{width:36px;height:36px;color:var(--text-light);cursor:pointer;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;transition:background .25s,color .25s,transform .25s;display:flex}.olt-search-clear:hover{color:var(--primary);background:#dc26261a;transform:rotate(90deg)}.olt-search-clear:active{transform:scale(.95)}.olt-search-info{justify-content:space-between;align-items:center;margin-top:14px;padding:0 4px;display:flex}.olt-search-info span{color:var(--text-light);font-size:13px;font-weight:500}.olt-search-info:before{content:"";background:#22c55e;border-radius:50%;width:8px;height:8px;margin-right:8px;box-shadow:0 0 10px #22c55e80}.olt-search-info{gap:8px}.olt-search-box:hover{border-color:var(--primary)}.olt-search-box:hover .olt-search-icon{color:var(--primary);transition:color .25s}.olt-search-box input:focus::placeholder{opacity:.6;transition:opacity .25s}@media (width<=768px){.olt-search-card{margin:20px 0;padding:18px}.olt-search-box{gap:12px;padding:12px 16px}.olt-search-box input{font-size:14px}.olt-search-icon{font-size:16px}.olt-search-clear{width:34px;height:34px}}@media (width<=480px){.olt-search-card{padding:16px}.olt-search-box{padding:10px 14px}.olt-search-box input{font-size:13px}.olt-search-info{flex-direction:column;align-items:flex-start;gap:8px}}[data-theme=dark] .olt-search-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .olt-search-box{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .olt-search-box:hover,[data-theme=dark] .olt-search-box:focus-within{border-color:var(--primary)}[data-theme=dark] .olt-search-box input{color:var(--text)}[data-theme=dark] .olt-search-box input::placeholder{color:var(--text-light)}@media print{.olt-search-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}}.olt-search-box:focus-within,.olt-search-clear:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.olt-search-card,.olt-search-box,.olt-search-clear,.olt-search-icon{transition:none}.olt-search-card:hover,.olt-search-clear:hover{transform:none}}.olt-filters-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;grid-template-columns:2fr 1fr 1fr auto;align-items:end;gap:20px;margin:24px 0;padding:22px;transition:transform .25s,border-color .25s,box-shadow .25s;display:grid}.olt-filters-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.olt-filter-group{flex-direction:column;gap:10px;display:flex}.olt-filter-group label{color:var(--text-light);text-transform:uppercase;letter-spacing:.4px;font-size:13px;font-weight:600}.olt-filter-buttons{flex-wrap:wrap;gap:10px;display:flex}.olt-filter-buttons button{border:1px solid var(--border);background:var(--surface2);color:var(--text);cursor:pointer;border-radius:12px;padding:10px 18px;font-size:14px;font-weight:600;transition:background .25s,border-color .25s,color .25s,transform .25s}.olt-filter-buttons button:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}.olt-filter-buttons button.active{background:var(--primary);border-color:var(--primary);color:#fff}.olt-filter-group select{border:1px solid var(--border);background:var(--surface2);width:100%;color:var(--text);cursor:pointer;border-radius:12px;outline:none;padding:12px 16px;font-size:14px;font-weight:500;transition:border-color .25s,box-shadow .25s,background .25s}.olt-filter-group select:hover{border-color:var(--primary)}.olt-filter-group select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #dc26261f}.olt-filter-actions{justify-content:flex-end;align-items:flex-end;display:flex}.olt-reset-btn{background:var(--primary);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:12px;padding:12px 22px;font-size:14px;font-weight:600;transition:background .25s,transform .25s,box-shadow .25s}.olt-reset-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px #dc262640}.olt-reset-btn:active{transform:scale(.97)}.olt-filter-group select option{color:var(--text);background:var(--card)}.olt-filter-buttons button:focus-visible,.olt-filter-group select:focus-visible,.olt-reset-btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px}@media (width<=1200px){.olt-filters-card{grid-template-columns:1fr 1fr}.olt-filter-actions{grid-column:1/-1;justify-content:flex-end}}@media (width<=768px){.olt-filters-card{grid-template-columns:1fr;gap:18px;padding:18px}.olt-filter-buttons{gap:8px}.olt-filter-buttons button{flex:1;min-width:100px}.olt-filter-actions{justify-content:stretch}.olt-reset-btn{width:100%}}@media (width<=480px){.olt-filters-card{padding:16px}.olt-filter-buttons{flex-direction:column}.olt-filter-buttons button{width:100%}}[data-theme=dark] .olt-filters-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .olt-filter-buttons button,[data-theme=dark] .olt-filter-group select{background:var(--surface2);border-color:var(--border);color:var(--text)}[data-theme=dark] .olt-filter-buttons button:hover,[data-theme=dark] .olt-filter-group select:hover,[data-theme=dark] .olt-filter-group select:focus{border-color:var(--primary)}[data-theme=dark] .olt-filter-buttons button.active{background:var(--primary);color:#fff}@media print{.olt-filters-card{box-shadow:none;break-inside:avoid;border:1px solid #ccc}.olt-reset-btn{display:none}}@media (prefers-reduced-motion:reduce){.olt-filters-card,.olt-filter-buttons button,.olt-filter-group select,.olt-reset-btn{transition:none}.olt-filters-card:hover,.olt-filter-buttons button:hover,.olt-reset-btn:hover{transform:none}}.olt-table-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:20px;margin:24px 0;transition:border-color .25s,box-shadow .25s,transform .25s;overflow:hidden}.olt-table-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.olt-table{border-collapse:collapse;width:100%}.olt-table thead{background:var(--surface2)}.olt-table th{text-align:left;text-transform:uppercase;letter-spacing:.5px;color:var(--text-light);border-bottom:1px solid var(--border);white-space:nowrap;padding:18px 16px;font-size:13px;font-weight:700}.olt-table td{border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle;padding:18px 16px;font-size:14px}.olt-table tbody tr{transition:background .25s}.olt-table tbody tr:hover{background:#dc26260a}.olt-name{flex-direction:column;gap:4px;display:flex}.olt-name strong{color:var(--text);font-size:15px;font-weight:700}.olt-name small{color:var(--text-light);font-size:12px}.olt-table code{background:var(--surface2);border:1px solid var(--border);color:var(--primary);border-radius:8px;padding:4px 8px;font-size:12px}.usage-bar{background:var(--surface2);border:1px solid var(--border);border-radius:999px;width:120px;height:10px;position:relative;overflow:hidden}.usage-fill{border-radius:999px;transition:width .35s;position:absolute;top:0;bottom:0;left:0}.usage-fill.cpu{background:linear-gradient(90deg,#2563eb,#3b82f6)}.usage-fill.memory{background:linear-gradient(90deg,#7c3aed,#8b5cf6)}.usage-bar span{color:var(--text);font-size:12px;font-weight:700;position:absolute;top:-24px;right:0}.temp-normal{color:#16a34a;background:#16a34a1a;border-radius:999px;justify-content:center;align-items:center;min-width:64px;padding:6px 10px;font-size:12px;font-weight:700;display:inline-flex}.temp-high{color:#ef4444;background:#ef44441f;border-radius:999px;justify-content:center;align-items:center;min-width:64px;padding:6px 10px;font-size:12px;font-weight:700;display:inline-flex}.olt-actions{align-items:center;gap:8px;display:flex}.action-btn{cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;transition:transform .2s,background .25s,color .25s;display:flex}.action-btn.view{color:#2563eb;background:#2563eb1a}.action-btn.edit{color:#f59e0b;background:#f59e0b1f}.action-btn.terminal{color:#7c3aed;background:#7c3aed1a}.action-btn.backup{color:#16a34a;background:#16a34a1a}.action-btn.terminal:hover{color:#fff;background:#7c3aed}.action-btn.backup:hover{color:#fff;background:#16a34a}.olt-empty{text-align:center;color:var(--text-light);font-size:15px;font-weight:600;padding:48px 24px!important}.olt-table-footer{background:var(--surface2);border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:20px;padding:18px 22px;display:flex}.olt-table-footer strong{color:var(--text);font-size:15px;font-weight:700}.olt-table-footer span{color:var(--text-light);font-size:13px}.olt-footer-summary{align-items:center;gap:20px;display:flex}.olt-footer-summary span{background:var(--card);border:1px solid var(--border);border-radius:10px;align-items:center;gap:6px;padding:8px 12px;font-weight:600;display:flex}.olt-table-card{overflow-x:auto}.olt-table{min-width:1250px}@media (width<=992px){.olt-table-footer{flex-direction:column;align-items:flex-start}.olt-footer-summary{flex-wrap:wrap;gap:12px}}@media (width<=768px){.olt-table th,.olt-table td{padding:14px 12px}.usage-bar{width:90px}.action-btn{width:34px;height:34px}}@media (width<=480px){.olt-table-footer{padding:16px}.olt-footer-summary{flex-direction:column;align-items:stretch;width:100%}.olt-footer-summary span{justify-content:center}}[data-theme=dark] .olt-table-card{background:var(--card);border-color:var(--border)}[data-theme=dark] .olt-table thead{background:var(--surface2)}[data-theme=dark] .olt-table tbody tr:hover{background:#ffffff08}[data-theme=dark] .olt-table td,[data-theme=dark] .olt-table th{border-color:var(--border)}[data-theme=dark] .olt-table code,[data-theme=dark] .olt-footer-summary span{background:var(--surface2);border-color:var(--border)}[data-theme=dark] .olt-table-footer{background:var(--surface2);border-top-color:var(--border)}@media print{.olt-table-card{box-shadow:none;border:1px solid #ccc;overflow:visible}.olt-table{min-width:100%}.action-btn{display:none}.olt-table-footer{break-inside:avoid}}.action-btn:focus-visible,.olt-table tbody tr:focus-within{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){.olt-table-card,.olt-table tbody tr,.usage-fill,.action-btn{transition:none}.olt-table-card:hover,.olt-table tbody tr:hover,.action-btn:hover{transform:none}}.staff-role-checkboxes{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;padding:12px;display:grid}.staff-role-checkbox{color:var(--text);cursor:pointer;align-items:center;gap:8px;font-size:14px;display:flex}.staff-role-checkbox input{width:16px;height:16px;accent-color:var(--primary)}.staff-page{flex-direction:column;gap:24px;padding:24px;display:flex}.olt-loading-text{text-align:center;color:var(--text-light);padding:24px}#root{background:var(--bg);min-height:100vh}.layout{background:var(--bg);min-height:100vh;display:flex}.layout-content{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.page-content{background:var(--bg);flex:1;padding:28px;overflow:auto}.page{flex-direction:column;gap:24px;display:flex}.page-header{justify-content:space-between;align-items:center;gap:20px;display:flex}.page-title{color:var(--text);font-size:32px;font-weight:700;line-height:1.2}.page-subtitle{color:var(--text-light);margin-top:8px;font-size:15px}.dashboard,.dashboard-page{flex-direction:column;gap:24px;display:flex}.dashboard-middle{grid-template-columns:2fr 1fr;gap:24px;display:grid}.dashboard-column{flex-direction:column;gap:24px;display:flex}.dashboard-card,.table-card,.card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:18px;padding:22px;transition:all .25s}.dashboard-card:hover,.table-card:hover,.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-header{justify-content:space-between;align-items:center;margin-bottom:22px;display:flex}.card-header h2{color:var(--text);font-size:18px;font-weight:700}.table th{text-align:left;color:var(--text-light);border-bottom:1px solid var(--border);padding:16px;font-size:13px;font-weight:700}.table td{color:var(--text);border-bottom:1px solid var(--border);padding:16px}.table tbody tr{transition:all .2s}.status{border-radius:999px;justify-content:center;align-items:center;min-width:90px;padding:7px 14px;font-size:12px;font-weight:700;display:inline-flex}.status.online{color:#22c55e;background:#22c55e26}.status.offline{color:#ef4444;background:#ef444426}.status.warning{color:#f59e0b;background:#f59e0b26}.form-group label{color:var(--text);font-size:14px;font-weight:600}.required{color:var(--danger)}.input-icon{background:var(--surface);border:1px solid var(--border);border-radius:14px;align-items:center;gap:12px;padding:0 14px;transition:all .25s;display:flex}.input-icon svg{color:var(--text-light);flex-shrink:0}.input-icon input,.input-icon textarea,.input-icon select{color:var(--text);background:0 0;border:none;flex:1;padding:14px 0;font-size:14px}.input-icon textarea{resize:vertical;min-height:110px}.form-group select{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:14px;padding:14px}.error-text{color:var(--danger);font-size:12px}.modal-overlay{z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal{background:var(--card);border:1px solid var(--border);width:100%;max-width:980px;max-height:92vh;box-shadow:var(--shadow-lg);border-radius:22px;animation:.25s modalIn;overflow:auto}.modal-header h2{color:var(--text);font-size:22px}.action-btn{cursor:pointer;color:#fff;border:none;border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;transition:all .2s;display:flex}.action-btn.view{background:#2563eb}.action-btn.edit{background:#f59e0b}.action-btn.success{background:#16a34a}.action-btn.warning{background:#f97316}.action-btn.delete{background:#dc2626}.action-btn:hover{opacity:.9;transform:translateY(-2px)}.profile-item{background:var(--surface2);border-radius:16px;align-items:flex-start;gap:14px;padding:18px;display:flex}.profile-item svg{color:var(--primary);margin-top:2px;font-size:18px}.profile-item strong{color:var(--text);font-size:15px}.profile-section__title{color:var(--text);margin-bottom:16px;font-size:18px}.profile-notes{background:var(--surface2);border-radius:16px;padding:18px}.profile-notes p{color:var(--text);line-height:1.7}.button-group{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.full-width{width:100%}.pagination{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;margin-top:24px;display:flex}.pagination-info{color:var(--text-light);font-size:14px}.pagination-controls{align-items:center;gap:10px;display:flex}.pagination-pages{gap:8px;display:flex}.pagination-page{border:1px solid var(--border);background:var(--surface);width:38px;height:38px;color:var(--text);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;transition:all .25s;display:flex}.pagination-page:hover{border-color:var(--primary)}.pagination-page.active{background:var(--primary);color:#fff;border-color:var(--primary)}.skeleton-line{background:linear-gradient(90deg, var(--surface2) 25%, #ffffff40 50%, var(--surface2) 75%);background-size:200% 100%;border-radius:999px;width:100%;height:16px;animation:1.4s linear infinite skeleton}.customer-row--skeleton td{padding:18px}.customer-table__empty{text-align:center;color:var(--text-light);padding:50px;font-size:15px}.text-center{text-align:center}.text-right{text-align:right}.mt-1{margin-top:6px}.mt-2{margin-top:12px}.mt-3{margin-top:18px}.mt-4{margin-top:24px}.mb-1{margin-bottom:6px}.mb-2{margin-bottom:12px}.mb-3{margin-bottom:18px}.mb-4{margin-bottom:24px}.hidden{display:none}@media (width<=1400px){.dashboard-bottom{grid-template-columns:1fr}}@media (width<=1100px){.dashboard-middle{grid-template-columns:1fr}}@media (width<=900px){.page-header{flex-direction:column;align-items:flex-start}.modal{max-width:100%}}@media (width<=768px){.page-content{padding:18px}.stats-grid,.profile-grid,.form-grid{grid-template-columns:1fr}.table-actions{flex-wrap:wrap}.pagination{flex-direction:column;align-items:flex-start}}@media (width<=480px){.modal-header,.modal-body,.modal-footer,.card,.dashboard-card,.table-card{padding:18px}}:root{--primary:#ef4444;--primary-dark:#dc2626;--sidebar-bg:#111827;--sidebar-hover:#1f2937;--page-bg:#f3f4f6;--card-bg:#fff;--table-header-bg:#f9fafb;--table-hover-bg:#f3f4f6;--text:#111827;--text-light:#6b7280;--white:#fff;--success:#22c55e;--warning:#f59e0b;--danger:#ef4444;--border:#e5e7eb;--shadow:0 4px 18px #00000014;--radius:12px}html,body,#root{width:100%;height:100%}body{background:var(--page-bg);color:var(--text);font-family:Segoe UI,Arial,sans-serif}.app{min-height:100vh;display:flex}.sidebar{background:var(--sidebar-bg);width:260px;min-height:100vh;color:var(--white);flex-direction:column;justify-content:space-between;padding:25px 18px;display:flex;box-shadow:2px 0 10px #00000014}.logo{text-align:center;margin-bottom:40px}.logo h2{color:var(--primary);letter-spacing:1px;font-size:34px;font-weight:800}.logo span{color:#cbd5e1;letter-spacing:8px;margin-top:8px;font-size:15px;display:block}.sidebar nav{flex-direction:column;gap:8px;display:flex}.menu-item{color:#d1d5db;border-radius:12px;align-items:center;gap:15px;padding:14px 18px;text-decoration:none;transition:background .25s,color .25s,transform .2s;display:flex}.menu-item:hover{background:var(--sidebar-hover);color:#fff;transform:translate(4px)}.menu-item.active{background:var(--primary);color:#fff;font-weight:600}.menu-item svg{width:22px;height:22px}.menu-item span{font-size:16px}.sidebar-footer{border-top:1px solid #ffffff14;margin-top:auto;padding-top:30px}.version{color:#9ca3af;text-align:center;font-size:13px}.dashboard{flex-direction:column;gap:30px;display:flex}.dashboard-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;display:flex}.dashboard-header h1{color:var(--text);font-size:2rem;font-weight:700}.dashboard-header p{color:var(--text-light);margin-top:8px}.primary-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:12px;align-items:center;gap:10px;padding:14px 22px;font-size:15px;font-weight:600;transition:all .25s;display:flex}.primary-btn:hover{background:#dc2626;transform:translateY(-2px)}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;display:grid}.dashboard-bottom{grid-template-columns:2fr 1fr;gap:25px;display:grid}.dashboard-card{background:#fff;border-radius:18px;padding:25px;box-shadow:0 8px 30px #0000000d}.dashboard-card h2{color:var(--text);margin-bottom:20px;font-size:22px}.table{border-collapse:collapse;width:100%}.table th{text-align:left;color:var(--text);background:#f3f4f6;padding:14px}.table td{border-bottom:1px solid #e5e7eb;padding:14px}.table tbody tr:hover{background:#f9fafb}.actions-grid{grid-template-columns:repeat(2,1fr);gap:15px;display:grid}.action-btn{cursor:pointer;background:#f9fafb;border:none;border-radius:15px;flex-direction:column;justify-content:center;align-items:center;gap:12px;height:110px;font-size:15px;font-weight:600;transition:all .25s;display:flex}.action-btn svg{color:#ef4444;font-size:28px}.action-btn:hover{color:#fff;background:#ef4444;transform:translateY(-4px)}.action-btn:hover svg{color:#fff}@media (width<=1100px){.dashboard-bottom{grid-template-columns:1fr}}@media (width<=768px){.dashboard-header{flex-direction:column;align-items:flex-start}.actions-grid{grid-template-columns:1fr}}:root{--accent:#ef4444;--accent-ring:#ef44441f;--border:#e5e7eb;--text-heading:#111827;--text-muted:#6b7280;--text-label:#374151}.customers-page{box-sizing:border-box;padding:30px}.customers-page *,.customers-page :before,.customers-page :after{box-sizing:border-box}.customer-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.customer-header h1{color:var(--text-heading);font-size:32px;font-weight:700}.customer-header p{color:var(--text-muted);margin-top:6px}.customer-search{margin-top:30px}.customer-search input{border:1px solid var(--border);border-radius:14px;width:100%;padding:16px 20px;font-size:15px;transition:all .25s}.customer-search input:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-ring);outline:none}.customer-filters{flex-wrap:wrap;gap:12px;margin-bottom:30px;display:flex}.modal-overlay{z-index:5000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#111827a6;justify-content:center;align-items:center;animation:.25s fadeIn;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:20px;width:900px;max-width:95%;max-height:92vh;animation:.25s pop;overflow:auto;box-shadow:0 30px 80px #0000004d}.modal-header{border-bottom:1px solid #ececec;justify-content:space-between;align-items:center;padding:24px 30px;display:flex}.modal-header h2{color:#16181d;margin:0;font-size:24px;font-weight:700}.modal-header h2 svg{vertical-align:-2px;color:var(--accent);margin-right:10px}.close-btn{cursor:pointer;color:var(--text-muted);background:0 0;border:none;font-size:22px;transition:all .2s}.close-btn:hover{color:var(--accent);transform:rotate(90deg)}.modal-body{padding:30px}.form-grid{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:var(--text-label);font-weight:600}.input-icon{border:1px solid var(--border);border-radius:12px;align-items:center;gap:12px;padding:14px 16px;transition:all .25s;display:flex}.input-icon:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}.input-icon svg{color:#9ca3af;font-size:17px}.input-icon input,.input-icon textarea{background:0 0;border:none;outline:none;flex:1;font-size:15px}.form-group select{border:1px solid var(--border);border-radius:12px;outline:none;padding:14px;font-size:15px;transition:all .25s}.form-group select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}.notes{margin-top:25px}.modal-footer{border-top:1px solid #ececec;justify-content:flex-end;gap:15px;padding:25px 30px;display:flex}@keyframes pop{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media (width<=768px){.customers-page{padding:20px}.customer-header{flex-direction:column;align-items:flex-start;gap:20px}.form-grid{grid-template-columns:1fr}.modal-footer{flex-direction:column}.modal{width:98%}}.required{color:#ef4444;margin-left:4px}.error-text{color:#dc2626;margin-top:4px;font-size:12px;font-weight:500}.billing-page{color:var(--text);flex-direction:column;gap:24px;display:flex}.billing-header{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.billing-header__eyebrow{letter-spacing:.14em;color:var(--primary);margin-bottom:8px;font-size:11px;font-weight:800;display:block}.billing-header h1{margin:0;font-size:32px;line-height:1.2}.billing-header p{color:var(--text-light);margin:8px 0 0}.billing-header__actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.billing-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;display:grid}.billing-stat{border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-sm);border-radius:18px;padding:20px;position:relative;overflow:hidden}.billing-stat:after{content:"";opacity:.06;background:currentColor;border-radius:50%;width:100px;height:100px;position:absolute;bottom:-38px;right:-24px}.billing-stat__top{align-items:center;gap:10px;margin-bottom:16px;display:flex}.billing-stat__icon{background:currentColor;border-radius:12px;place-items:center;width:38px;height:38px;display:grid}.billing-stat__icon svg{color:#fff}.billing-stat__label{color:var(--text-light);font-size:13px;font-weight:700}.billing-stat strong{color:var(--text);font-size:26px;display:block}.billing-stat small{color:var(--text-light);margin-top:7px;display:block}.billing-stat--blue{color:#2563eb}.billing-stat--green{color:#16a34a}.billing-stat--amber{color:#d97706}.billing-stat--red{color:#dc2626}.billing-workspace{flex-direction:column;gap:16px;display:flex}.billing-toolbar{justify-content:space-between;align-items:center;gap:16px;display:flex}.billing-search{border:1px solid var(--border);background:var(--card);border-radius:13px;flex:1;align-items:center;gap:10px;min-width:300px;max-width:480px;height:46px;padding:0 14px;display:flex}.billing-search:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #d904291c}.billing-search svg{color:var(--text-light)}.billing-search input{color:var(--text);background:0 0;border:0;outline:0;flex:1;font-size:14px}.billing-search button{color:var(--text-light);cursor:pointer;background:0 0;border:0}.billing-filters{border:1px solid var(--border);background:var(--card);border-radius:13px;gap:7px;padding:5px;display:flex}.billing-filters button{color:var(--text-light);cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:7px;padding:8px 11px;font-weight:700;display:flex}.billing-filters button span{background:var(--surface2);border-radius:99px;padding:2px 6px;font-size:11px}.billing-filters button.is-active{background:var(--primary);color:#fff}.billing-filters button.is-active span{background:#fff3}.billing-table-card{border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-sm);border-radius:18px;overflow:hidden}.billing-table-card__heading{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:19px 22px;display:flex}.billing-table-card__heading h2{margin:0;font-size:18px}.billing-table-card__heading p{color:var(--text-light);margin:5px 0 0;font-size:13px}.billing-table-card__heading>button{color:var(--text-light);cursor:pointer;background:0 0;border:0}.billing-table-wrap{overflow:auto}.billing-table{border-collapse:collapse;width:100%;min-width:1160px}.billing-table th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--text-light);background:var(--surface2);border-bottom:1px solid var(--border);padding:13px 16px;font-size:11px}.billing-table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:15px 16px;font-size:13px}.billing-table tbody tr:last-child td{border-bottom:0}.billing-table tbody tr:hover{background:var(--surface2)}.billing-table td>small,.billing-table td>strong+small{color:var(--text-light);margin-top:5px;display:block}.invoice-number{color:var(--primary)}.billing-customer{align-items:center;gap:10px;display:flex}.billing-customer>span{width:36px;height:36px;color:var(--primary);background:#d904291a;border-radius:11px;place-items:center;font-weight:800;display:grid}.billing-customer strong,.billing-customer small{display:block}.billing-customer small{color:var(--text-light);margin-top:3px}.balance-due{color:#dc2626}.balance-clear{color:#16a34a}.billing-row-actions{gap:7px;display:flex}.billing-row-actions button{border:1px solid var(--border);background:var(--card);width:34px;height:34px;color:var(--text-light);cursor:pointer;border-radius:9px;place-items:center;display:grid}.billing-row-actions button:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}.billing-row-actions button.danger:hover{color:#dc2626;border-color:#dc2626}.billing-row-actions button:disabled{opacity:.35;cursor:not-allowed}.billing-empty{color:var(--text-light);text-align:center!important;padding:48px!important}.billing-skeleton td{padding:18px}.billing-skeleton span{background:linear-gradient(90deg,var(--surface2),var(--border),var(--surface2));background-size:200% 100%;border-radius:8px;height:16px;animation:1.2s infinite billingShimmer;display:block}.billing-modal{width:760px}.billing-modal--payment{width:680px}.modal-header p{color:var(--text-light);margin:6px 0 0;font-size:13px}.billing-modal__close{color:var(--text-light);cursor:pointer;background:0 0;border:0;font-size:18px}.billing-modal__body{flex-direction:column;gap:20px;display:flex}.billing-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.billing-form-grid label,.billing-form-notes{flex-direction:column;gap:7px;display:flex}.billing-form-grid label>span,.billing-form-notes>span{font-size:13px;font-weight:700}.billing-form-grid input,.billing-form-grid select,.billing-form-notes input,.billing-form-notes select,.billing-form-notes textarea{border:1px solid var(--border);background:var(--card);width:100%;color:var(--text);font:inherit;border-radius:11px;outline:none;padding:12px 13px}.billing-form-grid input:focus,.billing-form-grid select:focus,.billing-form-notes textarea:focus,.billing-form-notes select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #d904291a}.billing-form-grid label>small{color:#dc2626}.payment-summary{border:1px solid var(--border);background:var(--surface2);border-radius:14px;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px;display:grid}.payment-summary div span,.payment-summary div strong{display:block}.payment-summary div span{text-transform:uppercase;color:var(--text-light);margin-bottom:5px;font-size:11px}.billing-form-error{color:#dc2626;background:#dc26261a;border-radius:10px;padding:11px 13px;font-size:13px}@media (width<=1180px){.billing-stats{grid-template-columns:repeat(2,1fr)}.billing-toolbar{flex-direction:column;align-items:stretch}.billing-search{max-width:none}.billing-filters{overflow:auto}}@media (width<=760px){.billing-header{flex-direction:column}.billing-header__actions{justify-content:flex-start;width:100%}.billing-stats,.billing-form-grid,.payment-summary{grid-template-columns:1fr}.billing-filters{width:100%}.billing-page{gap:18px}}.tickets-page{box-sizing:border-box;padding:30px}.tickets-page *,.tickets-page :before,.tickets-page :after{box-sizing:border-box}.ticket-comments{margin-top:8px}.ticket-comment{border:1px solid var(--border);background:var(--surface2);border-radius:10px;margin-bottom:10px;padding:10px 14px}.ticket-comment strong{color:var(--text);font-size:13px}.ticket-comment span{float:right;color:var(--text-light);font-size:12px}.ticket-comment p{color:var(--text);clear:both;margin:6px 0 0;font-size:14px}.ticket-comment-form{flex-direction:column;gap:8px;margin-top:12px;display:flex}.ticket-comment-form textarea{border:1px solid var(--border);background:var(--surface2);width:100%;color:var(--text);resize:vertical;box-sizing:border-box;border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14px}.ticket-comment-form button{align-self:flex-end}.ticket-comment-count{color:var(--text-light);font-weight:600}.ticket-comment-count svg{vertical-align:-1px}.packages-page{box-sizing:border-box;padding:30px}.packages-page *,.packages-page :before,.packages-page :after{box-sizing:border-box}.card{background:#fff;border-radius:16px;flex-direction:column;gap:14px;padding:22px;display:flex;box-shadow:0 8px 25px #0000000d}.card-header{justify-content:space-between;align-items:center;display:flex}.card-title{color:#6b7280;margin:0;font-size:14px;font-weight:600}.card-icon{color:#374151;background:#f3f4f6;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;display:flex}.card-value{color:#111827;margin:0;font-size:28px;font-weight:700}.table-card{background:var(--card);border-radius:18px;padding:8px;overflow-x:auto;box-shadow:0 8px 25px #0000000d}.customer-table,.invoice-table,.ticket-table,.package-table,.campaign-table{border-collapse:collapse;width:100%;min-width:720px}.customer-table th,.invoice-table th,.ticket-table th,.package-table th{text-align:left;background:var(--surface2);color:var(--text);text-transform:uppercase;letter-spacing:.03em;padding:14px 16px;font-size:13px;font-weight:600}.customer-table td,.invoice-table td,.ticket-table td,.package-table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:14px 16px;font-size:14px}.customer-row:hover,.ticket-row:hover,.package-row:hover,.campaign-row:hover{background:var(--surface2)}.customer-cell-wrapper,.ticket-cell-wrapper,.package-cell-wrapper,.campaign-cell-wrapper{cursor:pointer}.ticket-cell,.customer-cell{align-items:center;gap:12px;display:flex}.customer-avatar{color:#fff;background:#ef4444;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:13px;font-weight:700;display:flex}.customer-table__empty,.ticket-table__empty,.package-table__empty,.campaign-table__empty{text-align:center;color:var(--text-light);padding:40px 0}.table-actions{gap:8px;display:flex}.row-action-btn{border:1px solid var(--border);background:var(--card);width:34px;height:34px;color:var(--text-light);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;transition:all .2s;display:inline-flex}.row-action-btn:hover{background:var(--surface2)}.row-action-btn:disabled{opacity:.4;cursor:not-allowed}.row-action-btn--view:hover{color:#2563eb;border-color:#2563eb}.row-action-btn--edit:hover,.row-action-btn--pay:hover{color:#16a34a;border-color:#16a34a}.row-action-btn--delete:hover{color:#dc2626;border-color:#dc2626}@media (width<=768px){.table-card{border-radius:12px}}.mds-btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:12px 22px;font-size:15px;font-weight:600;transition:all .25s;display:inline-flex}.mds-btn:hover{transform:translateY(-2px)}.primary{color:#fff;background:#ef4444}.primary:hover{background:#dc2626}.success{color:#fff;background:#16a34a}.success:hover{background:#15803d}.warning{color:#fff;background:#f59e0b}.warning:hover{background:#d97706}.danger{color:#fff;background:#dc2626}.danger:hover{background:#b91c1c}.secondary{color:#374151;background:#fff;border:1px solid #e5e7eb}.secondary:hover{background:#f3f4f6}.sm{padding:8px 14px;font-size:13px}.md{padding:12px 22px}.lg{padding:15px 28px;font-size:16px}.btn-icon{align-items:center;display:flex}.mds-input{background:#fff;border:1px solid #e5e7eb;border-radius:12px;align-items:center;gap:12px;padding:14px 18px;transition:all .25s;display:flex}.mds-input:focus-within{border-color:#ef4444;box-shadow:0 0 0 3px #ef444426}.mds-input input{background:0 0;border:none;outline:none;flex:1;font-size:15px}.input-icon{color:#9ca3af}.mds-badge{white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;padding:6px 12px;font-size:12px;font-weight:600;display:inline-flex}.mds-badge.primary{color:#dc2626;background:#fee2e2}.mds-badge.success{color:#15803d;background:#dcfce7}.mds-badge.warning{color:#b45309;background:#fef3c7}.mds-badge.danger{color:#991b1b;background:#fee2e2}.mds-badge.info{color:#1d4ed8;background:#dbeafe}.mds-card{background:#fff;border-radius:18px;margin-bottom:25px;padding:24px;box-shadow:0 8px 25px #0000000d}.mds-card-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.mds-card-header h2{margin:0;font-size:20px;font-weight:700}.mds-card-header p{color:#6b7280;margin-top:6px;font-size:14px}.mds-card-body{width:100%}.ghost{color:#374151;background:0 0;border:1px solid #0000}.ghost:hover{background:#f3f4f6}.mds-badge.secondary,.mds-badge.neutral{color:#4b5563;background:#f3f4f6}.customer-search__clear{color:#9ca3af;cursor:pointer;background:0 0;border:none;align-items:center;padding:4px;transition:color .2s;display:flex}.customer-search__clear:hover{color:#ef4444}.profile-section{margin-bottom:24px}.profile-section__title{text-transform:uppercase;letter-spacing:.04em;color:var(--text-light);margin-bottom:14px;font-size:13px;font-weight:700}.profile-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.profile-item{background:var(--surface2,#f9fafb);border:1px solid var(--border);border-radius:12px;align-items:flex-start;gap:12px;padding:14px 16px;display:flex}.profile-item svg{color:var(--primary);flex-shrink:0;margin-top:2px;font-size:15px}.profile-item span{color:var(--text-light);margin-bottom:4px;font-size:12px;display:block}.profile-item strong{color:var(--text);word-break:break-word;font-size:14px}.profile-notes{background:var(--surface2,#f9fafb);border:1px solid var(--border);border-radius:12px;padding:16px}.profile-notes h3{text-transform:uppercase;letter-spacing:.04em;color:var(--text-light);align-items:center;gap:8px;margin-bottom:10px;font-size:13px;font-weight:700;display:flex}.profile-notes p{color:var(--text);font-size:14px;line-height:1.6}.ticket-profile__badges,.customer-profile .mds-badge{gap:8px;margin-top:8px;display:flex}@media (width<=640px){.profile-grid{grid-template-columns:1fr}}.action-btn{background:var(--surface2,#f3f4f6);width:34px;height:34px;color:var(--text-light);cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;transition:all .2s;display:inline-flex}.action-btn:hover{transform:translateY(-2px)}.action-btn.view:hover{color:#fff;background:#2563eb}.action-btn.edit:hover{color:#fff;background:#f59e0b}.action-btn.delete:hover{color:#fff;background:#dc2626}.skeleton-line{background:linear-gradient(90deg, var(--surface2,#f3f4f6) 25%, #0000000a 50%, var(--surface2,#f3f4f6) 75%);background-size:200% 100%;border-radius:6px;height:14px;animation:1.4s linear infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.form-group.full-width{grid-column:1/-1}.customers-page__error,.tickets-page__error,.packages-page__error,.settings-page__error,.campaigns-page__error,.pppoe-page__error,.hotspot-page__error,.billing-page__error,.routers-page__error{color:#991b1b;background:#fee2e2;border-radius:12px;margin-bottom:20px;padding:14px 18px;font-size:14px;font-weight:500}.campaign-upload__dropzone{border:2px dashed var(--border);background:var(--surface2);color:var(--text-light);cursor:pointer;text-align:center;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:36px 20px;transition:all .2s;display:flex}.campaign-upload__dropzone:hover{border-color:var(--primary);color:var(--primary)}.campaign-upload__dropzone svg{margin-bottom:4px;font-size:26px}.campaign-upload__dropzone span{color:var(--text);font-size:14px;font-weight:600}.campaign-upload__preview{border:1px solid var(--border);background:var(--surface2);border-radius:14px;position:relative;overflow:hidden}.campaign-upload__preview img,.campaign-upload__preview video{object-fit:contain;background:#000;width:100%;max-height:260px;display:block}.branding-upload__preview img{object-fit:contain;background:var(--surface2);max-height:160px;padding:20px}.campaign-upload__remove{color:#fff;cursor:pointer;background:#000000a6;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;display:flex;position:absolute;top:10px;right:10px}.branding-color-picker{border:1px solid var(--border);background:var(--surface2);border-radius:12px;align-items:center;gap:12px;padding:10px 14px;display:flex}.branding-color-picker input[type=color]{cursor:pointer;background:0 0;border:none;border-radius:8px;width:40px;height:40px;padding:0}.branding-color-picker span{color:var(--text);text-transform:uppercase;font-size:14px;font-weight:600}.router-backup-banner{color:#166534;background:#dcfce7;border-radius:12px;align-items:center;margin-bottom:20px;padding:14px 18px;font-size:14px;font-weight:500;display:flex}.field-hint{color:var(--text-light);margin-top:4px;font-size:12px;display:block}.quick-add-customer-link{border:1px dashed var(--primary);color:var(--primary);cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:6px;margin-bottom:16px;padding:8px 14px;font-size:13px;font-weight:600;display:inline-flex}.quick-add-customer-link:hover{background:var(--surface2)}.inline-retry-link{color:inherit;cursor:pointer;background:0 0;border:none;padding:0;font-weight:700;text-decoration:underline}.invoice-line-items{margin:18px 0}.invoice-line-items__header,.invoice-line-items__row{grid-template-columns:2fr .7fr 1fr .7fr 32px;align-items:center;gap:10px;display:grid}.invoice-line-items__header{color:var(--text-light);text-transform:uppercase;letter-spacing:.03em;padding:0 4px 6px;font-size:12px;font-weight:700}.invoice-line-items__row{margin-bottom:8px}.invoice-line-items__row input{border:1px solid var(--border);background:var(--surface2);width:100%;color:var(--text);box-sizing:border-box;border-radius:8px;padding:9px 10px;font-size:14px}.invoice-line-items__remove{width:32px;height:32px;color:var(--danger);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;display:flex}.invoice-line-items__remove:hover:not(:disabled){background:var(--surface2)}.invoice-line-items__remove:disabled{opacity:.35;cursor:not-allowed}.invoice-line-items__add{border:1px dashed var(--primary);color:var(--primary);cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:6px;margin:4px 0 16px;padding:8px 14px;font-size:13px;font-weight:600;display:inline-flex}.invoice-line-items__add:hover{background:var(--surface2)}.invoice-line-items__totals{border-top:1px solid var(--border);max-width:260px;margin-left:auto;padding-top:12px}.invoice-line-items__totals>div{color:var(--text-light);justify-content:space-between;padding:4px 0;font-size:14px;display:flex}.invoice-line-items__total{border-top:1px solid var(--border);margin-top:6px;color:var(--text)!important;padding-top:8px!important;font-size:16px!important}.invoice-line-items__total strong{color:var(--primary)}.router-profile__notice{background:var(--surface2);border:1px solid var(--border);border-radius:10px;align-items:flex-start;gap:10px;margin-top:16px;padding:12px 14px;display:flex}.router-profile__notice svg{color:var(--text-light);flex-shrink:0;margin-top:2px}.router-profile__notice p{color:var(--text-light);margin:0;font-size:13px;line-height:1.5}.mini-table{border-collapse:collapse;width:100%;font-size:13px}.mini-table th{text-align:left;color:var(--text-light);border-bottom:1px solid var(--border-color,#e5e7eb);padding:8px 10px;font-weight:600}.mini-table td{color:#1f2937;border-bottom:1px solid var(--border-color,#e5e7eb);padding:8px 10px}.mini-table tr:last-child td{border-bottom:none}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:Inter,sans-serif;transition:all .3s;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;transition:var(--transition);border:none;outline:none;font-family:inherit}input,select,textarea{background:var(--surface);color:var(--text);border:1px solid var(--border);outline:none;font-family:inherit;transition:all .25s}input:focus,textarea:focus,select:focus{border-color:var(--primary)}img{max-width:100%;display:block}ul{list-style:none}.app{background:var(--bg);min-height:100vh;display:flex}.content{flex:1;padding:30px;overflow:auto}.card{background:var(--card);box-shadow:var(--shadow-sm);border:1px solid var(--border);border-radius:18px;padding:20px}.grid{gap:20px;display:grid}.flex{align-items:center;display:flex}.space-between{justify-content:space-between;align-items:center;display:flex}.text-primary{color:var(--primary)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.text-warning{color:var(--warning)}.badge{border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600}.badge.success{color:#166534;background:#dcfce7}.badge.warning{color:#92400e;background:#fef3c7}.badge.danger{color:#991b1b;background:#fee2e2}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--primary);border-radius:20px}::-webkit-scrollbar-track{background:0 0}:root{--primary:#b45309;--primary-hover:#d97706;--success:#16a34a;--warning:#f59e0b;--danger:#dc2626;--radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:18px;--radius-xl:22px;--transition:.25s ease;--shadow-sm:0 2px 10px #00000014;--shadow-md:0 8px 24px #0000001f;--shadow-lg:0 18px 45px #0000002e;--white:#fff;--sidebar-hover:#ffffff14;--danger-color:var(--danger);--primary-color:var(--primary);--primary-dark:var(--primary-hover);--accent:var(--primary);--accent-ring:var(--primary)}[data-theme=light]{--bg:#faf9f7;--surface:#fff;--surface2:#f2f0ed;--sidebar:#1c1917;--text:#16181d;--text-light:#6b7280;--text-primary:var(--text);--text-secondary:var(--text-light);--text-heading:var(--text);--text-label:var(--text-light);--text-muted:var(--text-light);--text-h:var(--text);--border-color:var(--border);--surface-secondary:var(--surface2);--hover-bg:var(--surface2);--page-bg:var(--bg);--sidebar-bg:var(--sidebar);--border:#e5e1db;--card:#fff;--card-bg:var(--card)}[data-theme=dark]{--bg:#1c1917;--surface:#262220;--surface2:#2e2a27;--sidebar:#141110;--text:#fff;--text-light:#9ca3af;--text-primary:var(--text);--text-secondary:var(--text-light);--text-heading:var(--text);--text-label:var(--text-light);--text-muted:var(--text-light);--text-h:var(--text);--border-color:var(--border);--surface-secondary:var(--surface2);--hover-bg:var(--surface2);--page-bg:var(--bg);--sidebar-bg:var(--sidebar);--border:#3a3532;--card:#262220;--card-bg:var(--card)}