.app-layout{background:var(--bg);height:100vh;color:var(--text);display:flex;position:relative;overflow:hidden}.menu-toggle{z-index:110;border:1px solid var(--primary);background:var(--sidebar);cursor:pointer;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;padding:0;transition:background .15s;display:none;position:fixed;top:14px;left:14px}.menu-toggle span{background:#fff;border-radius:1px;width:20px;height:2px;transition:transform .2s;display:block}.sidebar-backdrop{z-index:90;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0006;border:none;display:none;position:fixed;inset:0}.sidebar-backdrop.visible{display:block}.sidebar{background:var(--sidebar);z-index:100;border-right:1px solid #ffffff14;flex-direction:column;flex-shrink:0;width:260px;height:100vh;padding:20px 14px;display:flex;position:sticky;top:0;overflow-y:auto}.sidebar-close{color:#fff9;cursor:pointer;background:#ffffff14;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-size:18px;transition:background .15s,color .15s;display:none;position:absolute;top:14px;right:14px}.sidebar-close:hover{color:#fff;background:#ffffff1f}.sidebar-logo{color:#fff;align-items:center;gap:10px;margin-bottom:24px;padding:4px 8px;font-size:1.2rem;font-weight:800;display:flex}.sidebar-logo-img{object-fit:contain;border-radius:6px;width:28px;height:28px}.user-card{border-bottom:1px solid #ffffff14;align-items:center;gap:10px;margin-bottom:16px;padding:12px 8px 16px;display:flex}.user-avatar{color:#fff;background:linear-gradient(135deg,#2563eb 0%,#10b981 100%);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:15px;font-weight:800;display:flex;overflow:hidden}.user-avatar img{object-fit:cover;width:100%;height:100%}.user-info{min-width:0}.user-name{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:700;overflow:hidden}.user-role{color:#93c5fd;margin-top:2px;font-size:11px;font-weight:600}.sidebar-nav{flex-direction:column;flex:1;gap:2px;min-height:0;display:flex;overflow-y:auto}.nav-link{color:#fff9;border-radius:10px;align-items:center;gap:10px;padding:10px 12px;font-size:14px;font-weight:500;text-decoration:none;transition:background .15s,color .15s;display:flex}.nav-icon{text-align:center;flex-shrink:0;width:22px;font-size:16px}.nav-label{white-space:nowrap}.sidebar-footer{border-top:1px solid #ffffff14;margin-top:auto;padding-top:12px}.btn-logout{color:#ef4444;cursor:pointer;background:#b91c1c14;border:1px solid #b91c1c4d;border-radius:10px;width:100%;padding:10px;font-size:13px;font-weight:600;transition:background .15s,border-color .15s}.btn-logout:hover{background:#b91c1c26;border-color:#b91c1c80}.main-content{flex-direction:column;flex:1;min-width:0;height:100vh;display:flex;overflow:hidden}.topbar{background:var(--surface);border-bottom:1px solid var(--border);z-index:50;flex-shrink:0;justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex;position:sticky;top:0}.topbar h3{color:var(--primary);letter-spacing:-.01em;margin:0;font-size:.95rem;font-weight:700}.topbar-right{align-items:center;gap:14px;display:flex}.topbar-user{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;max-width:200px;font-size:.8rem;overflow:hidden}.page-content{flex:1;padding:0;overflow:auto}.notif-bell-wrap{position:relative}.notif-bell-btn{border:1px solid var(--border);background:var(--surface);width:36px;height:36px;color:var(--muted);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;transition:background .15s,color .15s,border-color .15s;display:flex;position:relative}.notif-bell-btn:hover{background:var(--primary-soft);color:var(--primary)}.notif-bell-btn.has-unread{border-color:var(--primary);color:var(--primary)}.notif-badge{background:var(--danger);color:#fff;border:2px solid var(--surface);border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 5px;font-size:10px;font-weight:700;line-height:1;display:flex;position:absolute;top:-4px;right:-4px}.notif-panel{background:var(--surface);border:1px solid var(--border);z-index:200;border-radius:14px;width:340px;max-height:420px;animation:.15s ease-out notifSlideIn;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 12px 40px #0000001f}@keyframes notifSlideIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.notif-panel-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.notif-panel-title{color:var(--text);font-size:14px;font-weight:700}.notif-mark-read{color:var(--primary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:12px;font-weight:600;transition:background .15s}.notif-mark-read:hover{background:var(--primary-soft)}.notif-list{max-height:340px;overflow-y:auto}.notif-empty{text-align:center;color:var(--muted);padding:32px 16px;font-size:13px}.notif-item{border-bottom:1px solid var(--border);align-items:flex-start;gap:10px;padding:12px 16px;transition:background .1s;display:flex}.notif-item:last-child{border-bottom:none}.notif-item.unread{background:var(--primary-soft)}.notif-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-top:6px}.notif-item.unread .notif-dot{background:var(--primary)}.notif-item:not(.unread) .notif-dot{background:var(--border)}.notif-content{flex:1;min-width:0}.notif-title{color:var(--text);margin-bottom:2px;font-size:13px;font-weight:700}.notif-message{color:var(--text-secondary);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.4;display:-webkit-box;overflow:hidden}.notif-time{color:var(--muted);margin-top:4px;font-size:11px}::-webkit-scrollbar{width:6px}.page-content{animation:.2s ease-out pageFadeIn}@keyframes pageFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (width<=860px){.menu-toggle,.sidebar-close{display:flex}.sidebar{flex-direction:column;height:100dvh;transition:transform .25s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:8px 0 32px #0000004d}.sidebar.open{transform:translate(0)}.sidebar-nav{flex:1;min-height:0;padding-right:4px;overflow-y:auto}.sidebar-footer{border-top:1px solid #ffffff14;flex-shrink:0;margin-top:auto;padding-top:12px}.topbar{padding-left:64px}.topbar-user{display:none}.notif-panel{width:auto;max-height:50vh;position:fixed;top:auto;left:8px;right:8px}.notif-bell-btn{width:40px;height:40px}}@media (width<=480px){.topbar{height:50px;padding-left:60px;padding-right:10px}.topbar h3{font-size:.85rem}.kpi-grid{grid-template-columns:1fr 1fr;gap:10px}.kpi-card{padding:14px}.kpi-icon{width:40px;height:40px;font-size:18px}.kpi-card p{font-size:1.4rem}.filters-row{grid-template-columns:1fr}}:root{--primary:#176b63;--primary-hover:#10564f;--primary-soft:#e7f3f0;--bg:#f4f7f6;--surface:#fff;--sidebar:#102c2b;--text:#172b2a;--text-secondary:#536866;--muted:#829390;--border:#e2eae8;--border-focus:#4a9d91;--success:#16734c;--success-bg:#e5f4eb;--warning:#a76213;--warning-bg:#fff3dc;--danger:#b23b43;--danger-bg:#fcebed;--info:#26758a;--info-bg:#e6f3f7;--accent:#176b63;--accent-hover:#10564f;--accent-soft:#e7f3f0;--card:#fff;--card-bg:#fff;--radius-card:18px;--shadow-card:0 8px 28px #1634310e}html{background:var(--bg)}body{letter-spacing:-.01em;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif}button,input,select,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}:focus-visible{outline-offset:2px;outline:3px solid #4a9d916b}.app-layout{background:var(--bg)}.sidebar{background:var(--sidebar);border:0;width:270px;padding:24px 16px 18px;box-shadow:8px 0 30px #102c2b0f}.sidebar-logo{letter-spacing:-.04em;margin-bottom:8px;padding:4px 10px;font-size:1.35rem}.sidebar-logo span{color:#b3e3d6}.sidebar-logo-img{border-radius:10px;width:34px;height:34px}.sidebar-section-label{color:#8da9a4;letter-spacing:.14em;padding:8px 10px 3px;font-size:9px;font-weight:800}.user-card{border-bottom-color:#ffffff1c;margin:8px 0 16px;padding:12px 8px 17px}.user-avatar{background:linear-gradient(145deg,#2d9a87,#5fc4a6);border-radius:13px;width:40px;height:40px}.user-name{font-size:13px}.user-role{color:#9bcfc1;letter-spacing:.02em;font-size:10px}.sidebar-nav{gap:4px;padding:0 1px 8px}.nav-link{color:#b0c3bf;border-radius:11px;gap:12px;min-height:43px;padding:9px 12px;font-size:12.5px;font-weight:550}.nav-link:hover{color:#fff;background:#ffffff13}.nav-link.active{color:#fff;background:#5bbea32b;font-weight:700;box-shadow:inset 3px 0 #70d0b4}.nav-icon{color:#92b6ad;place-items:center;width:22px;height:22px;display:grid}.nav-link.active .nav-icon{color:#83dec2}.nav-label{white-space:normal;line-height:1.3}.sidebar-footer{border-color:#ffffff1c}.btn-logout{color:#d7e4e1;background:#ffffff0d;border-color:#ffffff1f;justify-content:center;align-items:center;gap:9px;display:flex}.btn-logout svg{opacity:.72;width:16px;height:16px}.btn-logout:hover{color:#fff;background:#ffffff1a;border-color:#fff3}.main-content{background:var(--bg)}.topbar{border-color:var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffeb;height:70px;padding:0 30px}.topbar-brand{align-items:center;gap:11px;display:flex}.topbar-mark{background:var(--primary-soft);border-radius:12px;place-items:center;width:38px;height:38px;display:grid;overflow:hidden}.topbar-mark img{object-fit:contain;width:26px;height:26px}.topbar-brand h3{color:var(--text);letter-spacing:-.025em;font-size:14px}.topbar-caption{color:var(--muted);margin-top:2px;font-size:10px;font-weight:550;display:block}.topbar-right{gap:13px}.topbar-user{color:var(--text-secondary);font-size:12px;font-weight:600}.topbar-avatar{border:1px solid var(--border);background:var(--primary-soft);width:34px;height:34px;color:var(--primary);border-radius:50%;place-items:center;font-size:13px;font-weight:750;display:grid;overflow:hidden}.topbar-avatar img{object-fit:cover;width:100%;height:100%}.page-content{background:var(--bg);padding:0}.menu-toggle{background:var(--sidebar);border:1px solid #ffffff24;border-radius:12px;width:42px;height:42px;top:13px;left:14px;box-shadow:0 5px 16px #102c2b29}.menu-toggle:hover{background:#1b4541}.sidebar-close{border:1px solid #ffffff1f}.sidebar-close span,.sidebar-close span:after{background:#d6e7e3;width:15px;height:1.5px;display:block;transform:rotate(45deg)}.sidebar-close span:after{content:"";transform:rotate(90deg)}[class*=card],.stat-card,.panel,.section-card,.table-container,.chart-card,.kpi-card{border-color:var(--border)}.kpi-card,.stat-card,.panel,.section-card,.chart-card{border-radius:var(--radius-card);box-shadow:var(--shadow-card)}input:not([type=checkbox]):not([type=radio]),select,textarea{border:1px solid var(--border);min-height:42px;color:var(--text);background:#fff;border-radius:10px;padding:9px 12px}input:focus,select:focus,textarea:focus{border-color:var(--border-focus);outline:none;box-shadow:0 0 0 3px #4a9d911f}button:not(.menu-toggle):not(.sidebar-close):not(.sidebar-backdrop):not(.notif-bell-btn):not(.notif-mark-read){transition:transform .16s,box-shadow .16s,background-color .16s}button:active{transform:translateY(1px)}h1,h2,h3{letter-spacing:-.035em}a{text-underline-offset:3px}@media (width<=860px){.sidebar{width:min(310px,88vw);padding-top:max(24px, env(safe-area-inset-top));padding-bottom:max(18px, env(safe-area-inset-bottom))}.topbar{height:64px;padding-left:68px;padding-right:max(14px, env(safe-area-inset-right))}.topbar-mark,.topbar-caption{display:none}.page-content{overflow-x:hidden}.menu-toggle{top:max(10px, env(safe-area-inset-top))}}@media (width<=560px){.topbar{height:58px;padding-left:64px}.topbar-brand h3{font-size:13px}.topbar-right{gap:8px}.topbar-avatar{width:32px;height:32px}.notif-panel{right:max(8px, env(safe-area-inset-right));left:max(8px, env(safe-area-inset-left));width:auto}.page-content>*{max-width:100%}.filters-row{gap:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}.kpi-icon{color:var(--primary);letter-spacing:-.04em;border-radius:13px;font-size:10px;font-weight:850;position:relative}.kpi-icon-good{color:var(--success)}.kpi-icon-warning{color:var(--warning)}.kpi-icon-danger{color:var(--danger)}.kpi-section-title{border-bottom:1px solid var(--border);gap:0;padding-bottom:9px}.table-container,.table-wrapper,.table-responsive{-webkit-overflow-scrolling:touch;max-width:100%;overflow-x:auto}@media (width<=560px){.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-card{gap:10px;min-width:0;padding:13px}.kpi-icon{flex:0 0 34px;width:34px;height:34px}.kpi-card h3{overflow-wrap:anywhere}}.dashboard-page .kpi-card{box-shadow:var(--shadow-card);border-radius:17px;padding:18px}.dashboard-page .kpi-card:hover{border-color:#b8d6d0;box-shadow:0 12px 30px #16343117}.dashboard-page .kpi-icon{letter-spacing:-.04em;border-radius:13px;font-size:10px;font-weight:850}.dashboard-page .dash-cta{background:var(--primary);border-radius:11px;box-shadow:0 5px 13px #176b6321}.dashboard-page .dash-cta:hover{background:var(--primary-hover);box-shadow:0 9px 20px #176b6333}.dashboard-page .kpi-section-title{color:var(--text);font-size:1rem}@media (width<=560px){.dashboard-page .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.dashboard-page .kpi-card{gap:9px;padding:12px}.dashboard-page .kpi-icon{flex:0 0 34px;width:34px;height:34px}.dashboard-page .kpi-card h3{font-size:11px}}:root{--primary:#2563eb;--primary-hover:#1d4ed8;--primary-soft:#dbeafe;--bg:#f8fafc;--surface:#fff;--sidebar:#0f172a;--text:#0f172a;--text-secondary:#475569;--muted:#94a3b8;--border:#e2e8f0;--border-focus:#60a5fa;--success:#15803d;--success-bg:#dcfce7;--warning:#b45309;--warning-bg:#fef3c7;--danger:#b91c1c;--danger-bg:#fee2e2;--info:#0369a1;--info-bg:#e0f2fe;--accent:#2563eb;--accent-hover:#1d4ed8;--accent-soft:#dbeafe;--card:#fff;--card-bg:#fff}*,:before,:after{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}.route-loading{min-height:100vh;color:var(--text-secondary);place-items:center;padding:24px;font-size:.95rem;display:grid}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Segoe UI,system-ui,-apple-system,sans-serif}#root{text-align:left;border:none;max-width:none}a{color:inherit}button{font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--muted)}