:root{--primary:#34495e;--primary-dark:#2c3e50;--accent:#3498db;--accent-hover:#2e86c1;--bg-light:#f4f7fb;--bg-white:#fff;--text-main:#2c3e50;--text-soft:#7f8c8d;--border-soft:#e5eaf0}*{box-sizing:border-box}html,body,#root{background:var(--bg-light);height:100%;color:var(--text-main);margin:0;padding:0;font-family:Inter,Segoe UI,Arial,sans-serif}body{overflow:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;border-radius:6px;height:28px;padding:0 10px;font-family:inherit;font-size:12px}.app-shell{flex-direction:column;height:100dvh;display:flex}.app-main{flex:1;min-height:0;display:flex}.app-content{background:var(--bg-light);flex:1;min-width:0;min-height:0;padding:20px;overflow:auto}.app-header{background:var(--primary);color:#fff;flex-shrink:0;justify-content:space-between;align-items:center;height:54px;padding:0 14px;display:flex}.header-left,.header-right{align-items:center;gap:10px;display:flex}.brand-logo-img{object-fit:cover;border-radius:50%;width:42px;height:42px;display:block}.brand-title{color:#fff;margin:0;font-size:22px;font-weight:700}.header-btn{background:var(--accent);color:#fff}.header-btn:hover{background:var(--accent-hover)}.header-btn-outline{color:#fff;background:0 0;border:1px solid #ffffff59}.header-btn-outline:hover{background:#ffffff14}.app-sidebar{background:var(--primary-dark);color:#fff;flex-direction:column;width:210px;min-width:210px;min-height:0;padding:14px 12px;transition:width .25s,min-width .25s,padding .25s;display:flex;overflow:visible}.app-sidebar.collapsed{width:72px;min-width:72px;padding:14px 8px}.sidebar-top{flex-shrink:0;justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.sidebar-section-title{color:#ecf0f1;margin:0;font-size:14px;font-weight:600}.sidebar-toggle-btn{color:#fff;background:#ffffff14;border:1px solid #ffffff24;border-radius:6px;width:28px;min-width:28px;height:28px;padding:0}.sidebar-toggle-btn:hover{background:#ffffff24}.sidebar-scroll{flex:1;min-height:0;padding-right:4px;overflow:visible auto}.sidebar-scroll::-webkit-scrollbar{width:6px}.sidebar-scroll::-webkit-scrollbar-thumb{background:#fff3;border-radius:6px}.sidebar-scroll::-webkit-scrollbar-thumb:hover{background:#ffffff59}.sidebar-block{margin-bottom:14px}.sidebar-menu{margin:0;padding:0;list-style:none}.sidebar-menu li{margin-bottom:8px;position:relative;overflow:visible}.sidebar-link,.sidebar-link:hover,.sidebar-link:focus,.sidebar-link:active,.sidebar-link:visited{text-decoration:none}.sidebar-link{color:#fffffff5;white-space:nowrap;border-radius:8px;align-items:center;gap:10px;height:34px;min-height:34px;padding:0 12px;font-size:13px;font-weight:500;transition:background .2s,color .2s;display:flex;overflow:visible}.sidebar-link:hover{color:#fff;background:#3f5873}.sidebar-link.active{background:var(--accent);color:#fff;font-weight:500}.menu-item{align-items:center;width:100%;display:flex;position:relative}.menu-icon{flex-shrink:0;justify-content:center;align-items:center;width:18px;min-width:18px;font-size:14px;display:inline-flex}.menu-text{text-overflow:ellipsis;overflow:hidden}.sidebar-accordion-btn{color:#ffffffe0;cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;justify-content:space-between;align-items:center;width:100%;height:34px;min-height:34px;margin-bottom:8px;padding:0 10px;font-size:12px;font-weight:600;display:flex;position:relative;overflow:visible}.sidebar-accordion-btn:hover{background:#ffffff14}.sidebar-accordion-btn.open{color:#fff;background:#ffffff1a}.sidebar-accordion-title-wrap{align-items:center;gap:8px;display:inline-flex}.sidebar-accordion-title-icon{justify-content:center;align-items:center;width:16px;min-width:16px;font-size:12px;display:inline-flex}.sidebar-accordion-icon-only{justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;display:inline-flex}.accordion-icon{justify-content:center;align-items:center;font-size:11px;display:inline-flex}.app-sidebar.collapsed .sidebar-link{justify-content:center;align-items:center;gap:0;width:100%;height:34px;min-height:34px;padding:0;overflow:visible}.app-sidebar.collapsed .menu-item{justify-content:center;align-items:center;width:100%}.app-sidebar.collapsed .menu-icon{justify-content:center;align-items:center;width:100%;min-width:100%;font-size:15px}.app-sidebar.collapsed .menu-text{display:none}.app-sidebar.collapsed .sidebar-accordion-btn{justify-content:center;align-items:center;width:100%;height:34px;min-height:34px;padding:0}.menu-tooltip{color:#fff;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;z-index:9999;background:#2c3e50f5;border-radius:10px;padding:8px 12px;font-size:12px;font-weight:600;line-height:1;transition:opacity .18s,transform .18s,visibility .18s;position:absolute;top:50%;left:calc(100% + 10px);transform:translateY(-50%)translate(-6px);box-shadow:0 12px 24px #00000029,0 4px 10px #00000014}.menu-tooltip-arrow{background:#2c3e50f5;width:10px;height:10px;position:absolute;top:50%;left:-6px;transform:translateY(-50%)rotate(45deg)}.app-sidebar.collapsed .sidebar-link:hover .menu-tooltip,.app-sidebar.collapsed .sidebar-accordion-btn:hover .menu-tooltip{opacity:1;visibility:visible;transform:translateY(-50%)translate(0)}.app-footer{background:var(--primary);color:#fff;flex-shrink:0;justify-content:center;align-items:center;height:42px;padding:0 10px;font-size:11px;display:flex}@media (width<=768px){.app-header{flex-direction:column;align-items:flex-start;gap:8px;height:auto;padding:10px}.header-right{flex-wrap:wrap;justify-content:flex-start;width:100%}.app-content{padding:10px}}@media (width<=480px){.brand-title{font-size:13px}.app-content{padding:8px}}.modal-open-custom{overflow:hidden}.app-modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2000;background:#121e2d61;animation:.18s appModalFadeIn;position:fixed;inset:0}.app-modal-layer{z-index:2010;justify-content:center;align-items:center;padding:20px;animation:.18s appModalFadeIn;display:flex;position:fixed;inset:0}.app-modal-dialog{width:100%;max-width:440px;animation:.22s appModalSlideUp}.app-modal-content{background:#fffffff5;border:1px solid #ffffff8c;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px #11253a38,0 8px 24px #11253a1f}.app-modal-header{border-bottom:1px solid var(--border-soft);background:linear-gradient(#f8fbfe 0%,#f1f6fb 100%);justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.app-modal-title{color:var(--primary-dark);margin:0;font-size:18px;font-weight:700}.app-modal-close{width:32px;height:32px;color:var(--primary-dark);cursor:pointer;background:#34495e14;border:none;border-radius:8px;justify-content:center;align-items:center;font-size:20px;line-height:1;transition:all .18s;display:inline-flex}.app-modal-close:hover{background:#34495e24;transform:none}.app-modal-body{color:var(--text-main);padding:22px 18px 16px;font-size:14px;line-height:1.6}.app-modal-message{color:var(--text-main);margin:0;font-size:16px}.app-modal-footer{border-top:1px solid var(--border-soft);background:#fcfdff;justify-content:flex-end;gap:10px;padding:14px 18px 18px;display:flex}.app-modal-btn{cursor:pointer;border:none;border-radius:10px;min-width:110px;height:38px;padding:0 16px;font-size:13px;font-weight:600;transition:all .18s}.app-modal-btn:hover{transform:translateY(-1px)}.app-modal-btn-secondary{color:var(--primary-dark);background:#eef3f8}.app-modal-btn-secondary:hover{background:#e2ebf4}.app-modal-btn-danger{color:#fff;background:linear-gradient(135deg,#e74c3c,#d63031);box-shadow:0 10px 22px #e74c3c2e}.app-modal-btn-danger:hover{background:linear-gradient(135deg,#d94333,#c62828)}@keyframes appModalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes appModalSlideUp{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=576px){.app-modal-layer{padding:14px}.app-modal-dialog{max-width:100%}.app-modal-content{border-radius:16px}.app-modal-header{padding:14px 16px}.app-modal-title{font-size:16px}.app-modal-body{padding:18px 16px 14px}.app-modal-footer{flex-direction:column-reverse;padding:12px 16px 16px}.app-modal-btn{width:100%}}.app-modal-btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-hover));color:#fff;box-shadow:0 10px 22px #3498db2e}.app-modal-btn-primary:hover{background:linear-gradient(135deg, var(--accent-hover), #2877b2)}.app-modal-btn-success{color:#fff;background:linear-gradient(135deg,#27ae60,#1f8b4d);box-shadow:0 10px 22px #27ae602e}.app-modal-btn-success:hover{background:linear-gradient(135deg,#239b56,#1b7f46)}.app-modal-btn-warning{color:#fff;background:linear-gradient(135deg,#f39c12,#d68910);box-shadow:0 10px 22px #f39c122e}.app-modal-btn-warning:hover{background:linear-gradient(135deg,#e67e22,#ca6f1e)}.auth-page{background:radial-gradient(circle at 100% 0,#ffffff14,#0000 28%),radial-gradient(circle at 0 100%,#ffffff14,#0000 26%),linear-gradient(135deg,#355f82 0%,#2f5576 45%,#3c84c6 100%);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffffff5;border:1px solid #ffffff73;border-radius:24px;width:100%;max-width:430px;padding:34px 32px 28px;box-shadow:0 18px 50px #12263f2e,0 6px 18px #12263f1a}.auth-header{justify-content:center;align-items:center;gap:16px;margin-bottom:28px;display:flex}.auth-logo-wrap{background:linear-gradient(145deg,#fff,#eef5fb);border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;width:92px;height:92px;display:flex;box-shadow:inset 0 1px #ffffffe6,0 10px 24px #34495e1f}.auth-logo-inline{object-fit:cover;width:92px;height:92px;image-rendering:-webkit-optimize-contrast;border-radius:50%;display:block}.auth-brand-text{text-align:left}.auth-title{letter-spacing:.6px;color:var(--primary-dark);margin:0;font-size:30px;font-weight:800;line-height:1}.auth-subtitle{color:var(--text-soft);letter-spacing:.2px;margin:8px 0 0;font-size:13px}.auth-form{text-align:left}.auth-form-group{margin-bottom:18px}.auth-form-group label{color:var(--primary-dark);letter-spacing:.2px;margin-bottom:8px;font-size:13px;font-weight:700;display:block}.auth-input{width:100%;height:48px;color:var(--text-main);background:#fbfdff;border:1px solid #d8e1ea;border-radius:12px;outline:none;padding:0 14px;font-size:14px;transition:all .22s}.auth-input::placeholder{color:#96a3b0}.auth-input:hover{border-color:#c6d6e5}.auth-input:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px #3498db1f}.auth-btn{background:linear-gradient(135deg, var(--accent), #2f86c8);color:#fff;border:none;border-radius:12px;width:100%;height:46px;margin-top:4px;font-size:16px;font-weight:700;transition:all .2s;box-shadow:0 10px 22px #3498db38}.auth-btn:hover{background:linear-gradient(135deg, var(--accent-hover), #2877b2);transform:translateY(-1px)}.auth-btn:active{transform:translateY(0)}.auth-links{text-align:center;margin-top:18px}.auth-links a{color:var(--accent);font-size:14px;font-weight:600;transition:color .2s}.auth-links a:hover{color:var(--accent-hover);text-decoration:underline}.auth-error{color:#c0392b;background:#fff2f2;border:1px solid #ffd2d2;border-radius:10px;margin:0 0 12px;padding:10px 12px;font-size:12px;font-weight:500}.auth-success{color:#1e8449;background:#eefbf3;border:1px solid #cdeed8;border-radius:10px;margin:0 0 12px;padding:10px 12px;font-size:12px;font-weight:500}.auth-caption{text-align:center;color:var(--text-soft);margin-top:14px;font-size:12px}@media (width<=576px){.auth-page{padding:16px}.auth-card{border-radius:18px;padding:24px 20px 22px}.auth-header{gap:12px;margin-bottom:22px}.auth-logo-wrap{border-radius:16px;width:62px;height:62px}.auth-logo-inline{width:50px;height:50px}.auth-title{font-size:24px}.auth-subtitle{font-size:12px}.auth-input{height:44px;font-size:13px}.auth-btn{height:44px;font-size:15px}}