/* WNNET MANAGER v3.2.1 - Windows 11 Explorer Shell
 * Visual shell only. RouterOS, Hotspot, Voucher, PPP, Billing, Finance and report logic stay in PHP.
 */
:root{
  --wn321-sidebar:220px;
  --wn321-topbar:58px;
  --wn321-status:31px;
  --wn321-bg:#f6f9fd;
  --wn321-panel:#ffffff;
  --wn321-soft:#f8fbff;
  --wn321-border:#e3eaf2;
  --wn321-border2:#d4dee9;
  --wn321-text:#16243a;
  --wn321-muted:#74859a;
  --wn321-blue:#1677e8;
  --wn321-blue-soft:#e4f1ff;
  --wn321-green:#10a64a;
  --wn321-red:#f02d46;
  --wn321-orange:#ff7d20;
  --wn321-purple:#7447f5;
  --wn321-shadow:0 5px 18px rgba(24,54,87,.055);
}
html,body{margin:0!important;background:var(--wn321-bg)!important;color:var(--wn321-text)!important;font-family:"Segoe UI Variable","Segoe UI",Tahoma,Arial,sans-serif!important;font-size:13px!important;line-height:1.35!important}
html *{box-sizing:border-box}
body{min-height:100vh!important;overflow-x:hidden!important}
body,.wrapper,#main,.main-container{background:var(--wn321-bg)!important}
a{text-decoration:none}

/* retire previous visual shells; feature scripts can remain */
#navbar.navbar,#wnWbSessionStrip,#wnWbStatusBar,#wnexStatusBar{display:none!important}
.wnn-global-backbar{display:none!important}

/* Fresh top command bar */
#wn321Topbar{
  position:fixed;z-index:5000;left:0;right:0;top:0;height:var(--wn321-topbar);
  display:grid;grid-template-columns:var(--wn321-sidebar) minmax(300px,1fr) minmax(260px,430px) auto;
  align-items:center;gap:10px;padding:0 12px 0 8px;
  background:rgba(248,251,255,.98);border-bottom:1px solid var(--wn321-border);box-shadow:0 1px 8px rgba(23,45,70,.055);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--wn321-text)
}
.wn321-brand-zone{height:100%;display:flex;align-items:center;gap:8px;min-width:0}
#wn321Toggle{width:39px;height:39px;min-width:39px;border:1px solid var(--wn321-border);border-radius:9px;background:#fff;color:#223b59;display:grid;place-items:center;cursor:pointer;font-size:17px;box-shadow:0 1px 3px rgba(22,45,70,.04)}
#wn321Toggle:hover{background:#edf5ff;color:var(--wn321-blue);border-color:#cddff3}
.wn321-brand{display:flex;align-items:center;gap:9px;min-width:0;color:#15263c;font-weight:700;white-space:nowrap}
.wn321-brand-logo{width:36px;height:36px;display:grid;place-items:center;color:#1294eb;font-size:29px;line-height:1}.wn321-brand-logo i{transform:scaleX(1.08)}
.wn321-brand-copy{display:flex;flex-direction:column;min-width:0}
.wn321-brand-copy strong{font-size:15px;line-height:16px;letter-spacing:-.15px;overflow:hidden;text-overflow:ellipsis}
.wn321-brand-copy small{font-size:9px;line-height:12px;color:#8493a6;font-weight:500;letter-spacing:.02em}
.wn321-nav-zone{min-width:0;display:flex;align-items:center;gap:7px}
.wn321-navbtn{width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:#263b55;display:grid;place-items:center;cursor:pointer;font-size:14px}
.wn321-navbtn:hover{background:#e9f2fc}.wn321-navbtn:disabled{opacity:.35;cursor:default}
.wn321-breadcrumb{height:38px;min-width:0;flex:1;display:flex;align-items:center;gap:8px;padding:0 13px;border:1px solid var(--wn321-border);border-radius:9px;background:#fff;color:#2a3c53;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.wn321-breadcrumb i{color:#2c4869;font-size:14px}.wn321-breadcrumb .sep{color:#9aa7b7;font-size:16px}.wn321-breadcrumb span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wn321-breadcrumb .current{font-weight:600;color:#192b42}
.wn321-search-zone{position:relative;min-width:0}
.wn321-search-zone>i{position:absolute;left:13px;top:12px;color:#58708d;font-size:14px;z-index:2}
#wn321Search{width:100%;height:38px;border:1px solid var(--wn321-border);border-radius:9px;background:#fff;padding:0 70px 0 37px!important;color:#1f324b!important;font:13px "Segoe UI",sans-serif!important;outline:none!important;box-shadow:none!important}
#wn321Search:focus{border-color:#9cc7f4!important;box-shadow:0 0 0 3px rgba(22,119,232,.08)!important}
.wn321-search-zone kbd{position:absolute;right:8px;top:9px;border:1px solid #d7e0ea;background:#f9fbfd;border-radius:5px;padding:2px 6px;font:10px "Segoe UI",sans-serif;color:#7d8b9b}
#wn321SearchResults{display:none;position:absolute;left:0;right:0;top:43px;max-height:330px;overflow:auto;padding:6px;background:#fff;border:1px solid var(--wn321-border);border-radius:10px;box-shadow:0 18px 44px rgba(20,45,72,.17);z-index:5200}
#wn321SearchResults.open{display:block}.wn321-search-hit{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:7px;color:#23374f;font-size:12px}.wn321-search-hit:hover,.wn321-search-hit.active{background:#eaf4ff;color:#0f66c8}.wn321-search-hit i{width:20px;text-align:center;color:#3a5878}.wn321-search-empty{padding:15px 10px;text-align:center;color:#8795a5;font-size:12px}
.wn321-user-zone{display:flex;align-items:center;justify-content:flex-end;gap:4px;position:relative}
#wn321Bell{width:38px;height:38px;border:0;border-radius:9px;background:transparent;color:#223954;font-size:17px;cursor:pointer;position:relative}#wn321Bell:hover{background:#eaf3fc}#wn321Bell .dot{position:absolute;right:7px;top:6px;width:8px;height:8px;background:#ef3340;border-radius:50%;border:2px solid #fff}
#wn321User{height:40px;border:0;border-radius:9px;background:transparent;padding:3px 8px 3px 4px;display:flex;align-items:center;gap:8px;color:#1e324a;font:600 13px "Segoe UI",sans-serif;cursor:pointer}#wn321User:hover{background:#eaf3fc}.wn321-avatar{width:31px;height:31px;border-radius:50%;background:#dbeeff;color:#1677e8;display:grid;place-items:center;font-size:15px}.wn321-chevron{font-size:9px;color:#76879a;margin-left:2px}
#wn321UserMenu{display:none;position:absolute;right:0;top:48px;width:220px;padding:7px;background:#fff;border:1px solid var(--wn321-border);border-radius:11px;box-shadow:0 18px 44px rgba(20,45,72,.17);z-index:5200}#wn321UserMenu.open{display:block}#wn321UserMenu .title{padding:7px 9px 5px;color:#8795a5;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}#wn321UserMenu a{display:flex;align-items:center;gap:9px;min-height:35px;padding:7px 9px;border-radius:7px;color:#24384f;font-size:12px}#wn321UserMenu a:hover{background:#edf5fd;color:#0c66ca}#wn321UserMenu hr{border:0;border-top:1px solid #edf1f5;margin:6px 5px}

/* Sidebar: keep every original PHP feature / href intact */
#sidenav.sidenav{
  position:fixed!important;z-index:4200!important;top:var(--wn321-topbar)!important;bottom:var(--wn321-status)!important;left:0!important;width:var(--wn321-sidebar)!important;height:auto!important;
  overflow-y:auto!important;overflow-x:hidden!important;padding:10px 8px 16px!important;margin:0!important;background:#f7fafe!important;border:0!important;border-right:1px solid var(--wn321-border)!important;box-shadow:none!important;color:#25384f!important;
  transition:transform .18s ease!important;scrollbar-width:thin;scrollbar-color:#cbd7e4 transparent
}
#sidenav::-webkit-scrollbar{width:6px}#sidenav::-webkit-scrollbar-thumb{background:#cbd7e4;border-radius:99px}
#sidenav .wnn-router-identity,#sidenav .wnn-side-brand{display:none!important}
#sidenav .wncc-nav-title{margin:12px 9px 4px!important;padding:0!important;height:auto!important;min-height:0!important;border:0!important;background:transparent!important;color:#8a98a9!important;box-shadow:none!important}.wncc-nav-title span{font-size:9px!important;letter-spacing:.08em!important;font-weight:700!important}
#sidenav a.menu,#sidenav .dropdown-btn,#sidenav .dropdown-container>a{
  position:relative!important;float:none!important;display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;min-height:37px!important;height:auto!important;
  margin:1px 0!important;padding:8px 10px!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#263950!important;font:500 12.5px/18px "Segoe UI",sans-serif!important;text-align:left!important;box-shadow:none!important;cursor:pointer!important;white-space:normal!important
}
#sidenav a.menu>i:first-child,#sidenav .dropdown-btn>i:first-child,#sidenav .dropdown-container>a>i:first-child{position:static!important;float:none!important;width:20px!important;min-width:20px!important;margin:0!important;text-align:center!important;color:#2f4b6c!important;font-size:15px!important}
#sidenav a.menu:hover,#sidenav .dropdown-btn:hover,#sidenav .dropdown-container>a:hover{background:#edf5fd!important;color:#0c65c9!important}
#sidenav a.active,#sidenav .dropdown-btn.active{background:#dcecff!important;color:#0c6fdc!important;font-weight:650!important}#sidenav a.active>i:first-child,#sidenav .dropdown-btn.active>i:first-child{color:#0c77e8!important}
#sidenav .dropdown-btn>.fa-caret-down{position:absolute!important;right:10px!important;top:12px!important;color:#748396!important;font-size:11px!important}
#sidenav .dropdown-container{margin:1px 0 5px 12px!important;padding:1px 0 1px 7px!important;border:0!important;border-left:1px solid #dce5ef!important;background:transparent!important;box-shadow:none!important}
#sidenav .dropdown-container>a{min-height:33px!important;padding:6px 9px!important;font-size:11.8px!important}.wnex-nav-label{display:contents!important}
body.wn321-sidebar-hidden #sidenav{transform:translateX(-101%)!important}

/* Main document surface */
#main,html.wn-density-modern-winbox #main{
  position:relative!important;margin:0 0 0 var(--wn321-sidebar)!important;padding:var(--wn321-topbar) 0 var(--wn321-status)!important;min-height:100vh!important;width:auto!important;max-width:none!important;background:var(--wn321-bg)!important;transition:margin-left .18s ease!important
}
body.wn321-sidebar-hidden #main,body.wn321-sidebar-hidden html.wn-density-modern-winbox #main{margin-left:0!important}
.main-container,html.wn-density-modern-winbox .main-container{width:100%!important;max-width:none!important;margin:0!important;padding:14px 16px 20px!important;border:0!important;background:var(--wn321-bg)!important;box-shadow:none!important;color:var(--wn321-text)!important}
#loading{top:72px!important}

/* Generic page surfaces, forms and tables */
.main-container .card,.main-container .box,.main-container .panel,.main-container .form-group,.main-container .table-responsive{border-color:var(--wn321-border)!important;box-shadow:none}
.main-container .card{border:1px solid var(--wn321-border)!important;border-radius:10px!important;background:#fff!important;overflow:hidden!important;box-shadow:var(--wn321-shadow)!important}.main-container .card-header{background:#fbfdff!important;border-bottom:1px solid var(--wn321-border)!important;color:#1c2f46!important;padding:10px 12px!important}.main-container .card-body{background:#fff!important;color:#24364d!important}
.main-container table:not(.wnex-table):not(.wnex-activity-list){background:#fff!important;border-collapse:collapse!important;border-radius:8px!important;color:#26384f!important}.main-container table:not(.wnex-table):not(.wnex-activity-list) th{background:#f5f8fc!important;color:#24384f!important;border-color:#e4ebf3!important;font-weight:600!important}.main-container table:not(.wnex-table):not(.wnex-activity-list) td{border-color:#e8eef5!important;color:#2d4057!important}.main-container table:not(.wnex-table):not(.wnex-activity-list) tr:hover td{background:#f5f9ff!important}
.main-container input:not([type=checkbox]):not([type=radio]),.main-container select,.main-container textarea{border:1px solid #d7e1ec!important;border-radius:7px!important;background:#fff!important;color:#21364e!important;box-shadow:none!important;outline:none!important}.main-container input:focus,.main-container select:focus,.main-container textarea:focus{border-color:#91bff1!important;box-shadow:0 0 0 3px rgba(22,119,232,.08)!important}
.main-container .btn,.main-container button,.main-container input[type=submit],.main-container input[type=button]{border-radius:7px!important;box-shadow:none!important}
.wn-smart-table-tools{display:flex!important;align-items:center!important;gap:7px!important;padding:8px!important;background:#f8fbff!important;border:1px solid var(--wn321-border)!important;border-bottom:0!important;border-radius:9px 9px 0 0!important}.wn-smart-table-tools input,.wn-smart-table-tools select,.wn-smart-table-tools button{height:32px!important;margin:0!important}

/* Dashboard: tuned to the approved visual reference */
.wnex-dashboard{max-width:none!important;margin:0!important;color:var(--wn321-text)!important}
.wnex-dashboard-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:14px!important;margin:0 0 11px!important}.wnex-dashboard-title h1{margin:0!important;font:700 25px/30px "Segoe UI",sans-serif!important;letter-spacing:-.45px!important;color:#111d2d!important}.wnex-dashboard-title p{margin:2px 0 0!important;color:#75869a!important;font-size:12px!important}.wnex-date-card{min-height:40px!important;padding:8px 12px!important;border:1px solid var(--wn321-border)!important;border-radius:9px!important;background:#fff!important;box-shadow:var(--wn321-shadow)!important;display:flex!important;align-items:center!important;gap:9px!important;color:#54677e!important;font-size:10.5px!important;white-space:nowrap!important}.wnex-date-card i{color:#2a4969!important}.wnex-date-card b{padding-left:8px!important;border-left:1px solid #e8edf3!important;color:#42566e!important;font-weight:600!important}
.wnex-kpis{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important;margin:0 0 11px!important}.wnex-kpi{min-width:0!important;min-height:93px!important;padding:12px 11px!important;border:1px solid var(--wn321-border)!important;border-radius:10px!important;background:#fff!important;box-shadow:var(--wn321-shadow)!important;display:grid!important;grid-template-columns:45px minmax(0,1fr)!important;align-items:center!important;gap:9px!important;color:#20344d!important;text-decoration:none!important;overflow:hidden!important}.wnex-kpi:hover{transform:translateY(-1px);border-color:#cbdced!important;box-shadow:0 8px 22px rgba(28,61,96,.08)!important}.wnex-kpi-icon{width:45px!important;height:45px!important;border-radius:10px!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:20px!important}.wnex-kpi.blue .wnex-kpi-icon{background:#1479ed!important}.wnex-kpi.green .wnex-kpi-icon{background:#0db14b!important}.wnex-kpi.orange .wnex-kpi-icon{background:#ff8121!important}.wnex-kpi.purple .wnex-kpi-icon{background:#7448f3!important}.wnex-kpi.red .wnex-kpi-icon{background:#f0324b!important}.wnex-kpi.slate .wnex-kpi-icon{background:#51667f!important}.wnex-kpi-label{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#506178!important;font-size:10.5px!important;line-height:14px!important}.wnex-kpi-value{display:block!important;margin-top:1px!important;color:#16253a!important;font-size:21px!important;font-weight:700!important;line-height:24px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.wnex-kpi-sub{display:block!important;margin-top:2px!important;color:#8291a2!important;font-size:9.7px!important;line-height:12px!important;white-space:normal!important}
.wnex-main-grid{display:grid!important;grid-template-columns:minmax(0,1fr) 282px!important;gap:11px!important;margin-bottom:11px!important}.wnex-panel{border:1px solid var(--wn321-border)!important;border-radius:10px!important;background:#fff!important;box-shadow:var(--wn321-shadow)!important;overflow:hidden!important}.wnex-panel-head{min-height:57px!important;padding:8px 11px!important;border-bottom:1px solid var(--wn321-border)!important;background:#fff!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:9px!important}.wnex-panel-title{display:flex!important;align-items:center!important;gap:8px!important;min-width:190px!important}.wnex-panel-title>i{color:#1479ed!important;font-size:19px!important}.wnex-panel-title h3,.wnex-detail-head h3{margin:0!important;color:#17273a!important;font:700 13px/17px "Segoe UI",sans-serif!important}.wnex-panel-title p{margin:1px 0 0!important;color:#7e8ea0!important;font-size:9.5px!important;line-height:12px!important}.wnex-toolbar{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;min-width:0!important}.wnex-toolbar-search{position:relative!important;width:min(265px,31vw)!important;min-width:155px!important}.wnex-toolbar-search i{position:absolute!important;left:9px!important;top:9px!important;color:#72859a!important;font-size:11px!important}.wnex-toolbar-search input{height:32px!important;width:100%!important;padding:0 8px 0 27px!important;border:1px solid #d7e1ec!important;border-radius:7px!important;background:#fff!important;font-size:10.5px!important}.wnex-mini-btn{height:32px!important;min-height:32px!important;margin:0!important;padding:0 9px!important;border:1px solid #d7e1ec!important;border-radius:7px!important;background:#fff!important;color:#263950!important;font:500 10.5px/30px "Segoe UI",sans-serif!important;white-space:nowrap!important}.wnex-mini-btn.primary{background:#1479ed!important;border-color:#1479ed!important;color:#fff!important;font-weight:600!important}.wnex-table-wrap{overflow:auto!important}.wnex-table{width:100%!important;border:0!important;border-collapse:collapse!important;background:#fff!important;table-layout:auto!important}.wnex-table th{height:31px!important;padding:6px 7px!important;border:0!important;border-bottom:1px solid #dfe7f0!important;background:#f5f8fc!important;color:#253950!important;font-size:10px!important;font-weight:600!important;text-align:left!important;white-space:nowrap!important}.wnex-table td{height:31px!important;padding:5px 7px!important;border:0!important;border-bottom:1px solid #ebf0f5!important;background:#fff!important;color:#2a3d54!important;font-size:10.3px!important;white-space:nowrap!important}.wnex-table tbody tr:hover td{background:#f4f9ff!important}.wnex-table tbody tr.selected td{background:#dfeeff!important}.wnex-check{display:inline-block!important;width:14px!important;height:14px!important;border:1px solid #b9c8d8!important;border-radius:4px!important;background:#fff!important}.wnex-state{font-weight:500!important}.wnex-status-dot{display:inline-block!important;width:7px!important;height:7px!important;margin-right:5px!important;border-radius:50%!important;background:#a7b3c0!important}.wnex-status-dot.online{background:#10ad4d!important}.wnex-status-dot.offline{background:#f02c46!important}.wnex-status-dot.isolir{background:#ff8b1f!important}.wnex-due.bad{color:#e52d43!important}.wnex-row-action{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:28px!important;height:24px!important;border-radius:6px!important;color:#1d5ba8!important;font-size:15px!important;font-weight:700!important}.wnex-row-action:hover{background:#d9eaff!important}
.wnex-detail{min-width:0!important}.wnex-detail-head{height:49px!important;padding:8px 11px!important;border-bottom:1px solid var(--wn321-border)!important;display:flex!important;align-items:center!important;justify-content:space-between!important}.wnex-detail-head h3{display:flex!important;align-items:center!important;gap:7px!important}.wnex-detail-profile{position:relative!important;padding:12px 11px 9px!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) auto!important;align-items:center!important;gap:9px!important}.wnex-detail-avatar{width:44px!important;height:44px!important;border-radius:50%!important;background:#dbeeff!important;color:#1677e8!important;display:grid!important;place-items:center!important;font-size:20px!important}.wnex-detail-name{font-size:13px!important;font-weight:700!important;color:#17263a!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.wnex-detail-user{margin-top:1px!important;color:#7d8c9f!important;font-size:9.8px!important}.wnex-badge{padding:4px 7px!important;border-radius:6px!important;font-size:9.5px!important;font-weight:600!important}.wnex-badge.online{background:#ddf6e5!important;color:#13863d!important}.wnex-badge.offline{background:#ffe3e7!important;color:#d52b40!important}.wnex-badge.isolir{background:#fff0d9!important;color:#bd6410!important}.wnex-detail-kv{display:grid!important;grid-template-columns:85px minmax(0,1fr)!important;row-gap:5px!important;column-gap:7px!important;padding:6px 12px 10px!important;color:#52677f!important;font-size:9.9px!important}.wnex-detail-kv>span:nth-child(even){color:#253950!important;overflow:hidden!important;text-overflow:ellipsis!important}.wnex-detail-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;padding:0 11px 11px!important}.wnex-detail-actions a{min-height:34px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;border:1px solid #dce4ee!important;border-radius:8px!important;background:#f8fafc!important;color:#2b4058!important;font-size:10px!important;font-weight:600!important}.wnex-detail-actions a.red{background:#fff0f2!important;border-color:#ffc8d0!important;color:#df2940!important}.wnex-detail-actions a.green{background:#e8f8ee!important;border-color:#c8eed6!important;color:#11843c!important}.wnex-detail-actions a.blue{background:#eaf3ff!important;border-color:#cfe3fb!important;color:#1470d4!important}.wnex-detail-actions a.purple{background:#f2edff!important;border-color:#ddd1ff!important;color:#6a42d7!important}.wnex-detail-actions a.orange{background:#fff3e8!important;border-color:#ffdcbf!important;color:#d86810!important}
.wnex-lower-grid{display:grid!important;grid-template-columns:minmax(360px,1.05fr) minmax(320px,.98fr) 255px!important;gap:11px!important}.wnex-lower-panel{min-height:210px!important}.wnex-tabs{height:38px!important;display:flex!important;align-items:end!important;gap:10px!important;padding:0 10px!important;border-bottom:1px solid var(--wn321-border)!important;background:#fbfdff!important}.wnex-tabs a{height:37px!important;display:flex!important;align-items:center!important;gap:6px!important;padding:0 9px!important;border-bottom:2px solid transparent!important;color:#5d6f84!important;font-size:10.5px!important}.wnex-tabs a.active{border-color:#1479ed!important;color:#1479ed!important;font-weight:600!important}.wnex-map{position:relative!important;height:170px!important;overflow:hidden!important;background:linear-gradient(135deg,#edf3f7,#f8fbfd 46%,#eef4f9)!important}.wnex-map:before{content:"";position:absolute;inset:0;background-image:linear-gradient(24deg,transparent 47%,rgba(163,187,208,.23) 48%,rgba(163,187,208,.23) 50%,transparent 51%),linear-gradient(151deg,transparent 47%,rgba(169,192,211,.18) 48%,rgba(169,192,211,.18) 50%,transparent 51%);background-size:170px 95px,140px 90px;opacity:.8}.wnex-map-svg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}.wnex-map-line{stroke:#2e9ae9!important;stroke-width:.7!important;vector-effect:non-scaling-stroke!important}.wnex-map-node{position:absolute!important;width:10px!important;height:10px!important;margin:-5px 0 0 -5px!important;border:3px solid #0dac4b!important;border-radius:50%!important;background:#fff!important;z-index:4!important}.wnex-map-node.offline{border-color:#ef3047!important}.wnex-map-node.router,.wnex-map-node.odp,.wnex-map-node.odc{border:2px solid #1677e8!important;border-radius:3px!important;background:#1677e8!important}.wnex-map-legend{position:absolute!important;right:12px!important;top:12px!important;z-index:5!important;padding:8px 10px!important;border:1px solid #e0e8f0!important;border-radius:9px!important;background:rgba(255,255,255,.94)!important;box-shadow:0 5px 16px rgba(30,59,88,.1)!important;color:#354a62!important;font-size:9.7px!important}.wnex-map-legend div{display:flex!important;align-items:center!important;gap:7px!important;margin:3px 0!important}.wnex-map-legend b{width:8px!important;height:8px!important;border-radius:50%!important;background:#11ad4d!important}.wnex-map-legend b.r{background:#f02d46!important}.wnex-map-legend b.b{border-radius:2px!important;background:#1677e8!important}.wnex-map-link{position:absolute!important;left:10px!important;bottom:9px!important;z-index:5!important;padding:5px 8px!important;border-radius:6px!important;background:rgba(255,255,255,.92)!important;color:#1d6ec7!important;font-size:9.5px!important}.wnex-activity-head,.wnex-billing-head{height:39px!important;padding:0 11px!important;border-bottom:1px solid var(--wn321-border)!important;background:#fff!important;display:flex!important;align-items:center!important;justify-content:space-between!important;color:#1f3148!important;font-size:11px!important;font-weight:700!important}.wnex-activity-list{width:100%!important;border-collapse:collapse!important}.wnex-activity-list td{height:29px!important;padding:5px 8px!important;border-bottom:1px solid #edf1f5!important;color:#34485e!important;font-size:9.7px!important}.wnex-activity-dot{display:inline-block!important;width:7px!important;height:7px!important;margin-right:6px!important;border-radius:50%!important;background:#1677e8!important}.wnex-activity-dot.green{background:#10ad4d!important}.wnex-activity-dot.red{background:#f02d46!important}.wnex-billing-panel{padding-bottom:7px!important}.wnex-billing-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;gap:7px!important;padding:6px 10px!important;color:#5f7187!important;font-size:9.7px!important}.wnex-billing-row b{color:#25384f!important;font-size:9.8px!important}.wnex-billing-row em{min-width:28px!important;color:#11a24a!important;font-style:normal!important;text-align:right!important}.wnex-health-mini{font-size:9.2px!important;color:#6e8093!important}.wnex-health-mini .dot{display:inline-block!important;width:7px!important;height:7px!important;border-radius:50%!important;background:#0eac4b!important;margin-right:5px!important}

/* Fixed status line */
#wn321Status{
  position:fixed;z-index:4900;left:0;right:0;bottom:0;height:var(--wn321-status);display:flex;align-items:center;gap:0;background:rgba(250,252,255,.98);border-top:1px solid var(--wn321-border);color:#4f6176;font-size:10px;box-shadow:0 -1px 5px rgba(22,43,65,.025)
}
.wn321-status-cell{height:100%;display:flex;align-items:center;gap:6px;padding:0 12px;border-right:1px solid #edf1f5;white-space:nowrap}.wn321-status-cell i{color:#31506f}.wn321-status-cell .dot{width:8px;height:8px;border-radius:50%;background:#0fac4b}.wn321-status-spacer{flex:1}.wn321-status-ok{color:#138b41;font-weight:600}.wn321-status-version{font-weight:600;color:#384d64}

/* Remove old magenta/WinBox visual traces aggressively */
body #main .wb304-menu,body #main .wb304-safe,body #main .wb304-session,body #main .wb304-indicator{display:none!important}
body .bg-pink,body .bg-red-gradient{background-image:none!important}

/* medium desktop */
@media(max-width:1180px){
  :root{--wn321-sidebar:205px}
  #wn321Topbar{grid-template-columns:var(--wn321-sidebar) minmax(250px,1fr) minmax(210px,330px) auto}
  .wn321-brand-copy strong{font-size:13px}.wn321-brand-copy small{display:none}.wn321-brand-logo{width:31px;height:31px;font-size:25px}
  .wnex-kpi{grid-template-columns:39px minmax(0,1fr)!important;padding:10px 8px!important}.wnex-kpi-icon{width:39px!important;height:39px!important;font-size:17px!important}.wnex-kpi-value{font-size:18px!important}.wnex-kpi-label{font-size:9.7px!important}.wnex-kpi-sub{font-size:8.8px!important}
  .wnex-main-grid{grid-template-columns:minmax(0,1fr) 255px!important}.wnex-lower-grid{grid-template-columns:minmax(330px,1fr) minmax(290px,.9fr)!important}.wnex-billing-panel{grid-column:1/-1!important;min-height:0!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important}.wnex-billing-head{grid-column:1/-1!important}.wnex-billing-row{display:flex!important;flex-direction:column!important;gap:2px!important;border-right:1px solid #edf1f5!important}.wnex-billing-panel>div:last-child{display:none!important}
}

/* 1366x768 browser viewport optimization */
@media(min-width:1000px) and (max-height:720px){
  :root{--wn321-topbar:52px;--wn321-status:27px;--wn321-sidebar:195px}
  #wn321Topbar{grid-template-columns:var(--wn321-sidebar) minmax(260px,1fr) minmax(220px,390px) auto;padding-right:8px}.wn321-brand-logo{width:31px;height:31px;font-size:25px}.wn321-brand-copy strong{font-size:13px}.wn321-brand-copy small{display:none}#wn321Toggle{width:35px;height:35px;min-width:35px}.wn321-breadcrumb,#wn321Search{height:34px}.wn321-search-zone>i{top:10px}.wn321-search-zone kbd{top:7px}.wn321-navbtn{width:30px;height:30px}#wn321Bell{width:34px;height:34px}#wn321User{height:36px}
  #sidenav.sidenav{padding-top:7px!important}#sidenav a.menu,#sidenav .dropdown-btn,#sidenav .dropdown-container>a{min-height:32px!important;padding:6px 8px!important;font-size:11px!important}#sidenav .dropdown-container>a{min-height:29px!important;font-size:10.4px!important}#sidenav .dropdown-btn>.fa-caret-down{top:10px!important}.main-container,html.wn-density-modern-winbox .main-container{padding:10px 10px 14px!important}.wnex-dashboard-head{margin-bottom:7px!important}.wnex-dashboard-title h1{font-size:20px!important;line-height:24px!important}.wnex-dashboard-title p{font-size:10px!important}.wnex-date-card{min-height:34px!important;padding:6px 9px!important}.wnex-kpis{gap:7px!important;margin-bottom:8px!important}.wnex-kpi{min-height:78px!important;padding:8px 7px!important;grid-template-columns:37px minmax(0,1fr)!important}.wnex-kpi-icon{width:37px!important;height:37px!important;font-size:16px!important}.wnex-kpi-value{font-size:17px!important;line-height:20px!important}.wnex-kpi-label{font-size:9px!important}.wnex-kpi-sub{font-size:8.2px!important;line-height:10px!important}.wnex-main-grid{gap:8px!important;margin-bottom:8px!important;grid-template-columns:minmax(0,1fr) 270px!important}.wnex-panel-head{min-height:48px!important;padding:6px 9px!important}.wnex-panel-title h3,.wnex-detail-head h3{font-size:11.5px!important}.wnex-panel-title p{font-size:8.5px!important}.wnex-toolbar-search{width:240px!important}.wnex-toolbar-search input,.wnex-mini-btn{height:29px!important;min-height:29px!important;line-height:27px!important;font-size:9.6px!important}.wnex-table th,.wnex-table td{height:28px!important;padding:4px 6px!important;font-size:9.3px!important}.wnex-detail-head{height:42px!important}.wnex-detail-profile{padding:8px 9px 6px!important;grid-template-columns:38px minmax(0,1fr) auto!important}.wnex-detail-avatar{width:38px!important;height:38px!important;font-size:17px!important}.wnex-detail-name{font-size:11.5px!important}.wnex-detail-kv{row-gap:3px!important;padding:4px 10px 7px!important;font-size:8.9px!important}.wnex-detail-actions{gap:4px!important;padding:0 9px 8px!important}.wnex-detail-actions a{min-height:29px!important;font-size:9px!important}.wnex-lower-grid{gap:8px!important}.wnex-lower-panel{min-height:177px!important}.wnex-tabs{height:33px!important}.wnex-tabs a{height:32px!important;font-size:9.4px!important}.wnex-map{height:143px!important}.wnex-activity-head,.wnex-billing-head{height:34px!important}.wnex-activity-list td{height:25px!important;padding:4px 6px!important;font-size:8.8px!important}.wnex-billing-row{padding:5px 8px!important;font-size:8.8px!important}.wn321-status-cell{padding:0 8px;font-size:9px}
}

/* phone/tablet: Explorer drawer */
@media(max-width:860px){
  :root{--wn321-sidebar:245px;--wn321-topbar:55px}
  #wn321Topbar{grid-template-columns:auto minmax(0,1fr) auto!important;gap:5px!important;padding:0 7px!important}.wn321-brand-zone{grid-column:1}.wn321-brand-copy{display:none}.wn321-brand-logo{width:31px;height:31px;font-size:25px}.wn321-nav-zone{grid-column:2}.wn321-navbtn{display:none}.wn321-breadcrumb{padding:0 9px;font-size:11px}.wn321-breadcrumb .root,.wn321-breadcrumb .sep:first-of-type{display:none}.wn321-search-zone{display:none}.wn321-user-zone{grid-column:3}#wn321User>span:not(.wn321-avatar),#wn321User .wn321-chevron{display:none}#wn321User{padding:3px}#wn321Bell{width:34px}
  #sidenav.sidenav{transform:translateX(-101%)!important;box-shadow:12px 0 32px rgba(24,49,76,.14)!important}body.wn321-mobile-open #sidenav{transform:translateX(0)!important}body.wn321-sidebar-hidden #sidenav{transform:translateX(-101%)!important}body.wn321-mobile-open.wn321-sidebar-hidden #sidenav{transform:translateX(0)!important}
  #main,html.wn-density-modern-winbox #main,body.wn321-sidebar-hidden #main{margin-left:0!important}.main-container,html.wn-density-modern-winbox .main-container{padding:10px!important}.wnex-dashboard-head{align-items:center!important}.wnex-date-card span{display:none}.wnex-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}.wnex-main-grid{grid-template-columns:1fr!important}.wnex-detail{order:-1}.wnex-lower-grid{grid-template-columns:1fr!important}.wnex-billing-panel{grid-column:auto!important;display:block!important}.wnex-toolbar{flex-wrap:wrap!important}.wnex-toolbar-search{width:100%!important}.wnex-table-wrap{overflow-x:auto!important}.wnex-table{min-width:760px!important}#wn321Status .wn321-status-cell{display:none}.wn321-status-cell:first-child,.wn321-status-ok,.wn321-status-version{display:flex!important}.wn321-status-spacer{display:block!important}.wn321-status-version{padding-right:7px!important}
}
@media(max-width:520px){.wnex-kpis{grid-template-columns:1fr!important}.wnex-dashboard-title h1{font-size:20px!important}.wnex-dashboard-title p{display:none}.wnex-date-card{padding:6px 8px!important}.wnex-main-grid{gap:8px!important}.wnex-detail-actions{grid-template-columns:1fr 1fr!important}}

@media print{#wn321Topbar,#sidenav,#wn321Status,#navbar,#wnWbSessionStrip,#wnWbStatusBar{display:none!important}#main,html.wn-density-modern-winbox #main{margin:0!important;padding:0!important}.main-container,html.wn-density-modern-winbox .main-container{padding:0!important;background:#fff!important}.wnex-dashboard{max-width:none!important}.wnex-kpis,.wnex-detail,.wnex-lower-grid{break-inside:avoid}}