:root{--primary-color: #426241;--primary-light: #B9D0B9;--secondary-color: #667eea;--accent-color: #764ba2;--gradient-start: #667eea;--gradient-end: #764ba2}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.6;color:#333;background:#f5f5f5}.app{min-height:100vh;background:#f5f5f5}.header{background-color:#2c3e50;color:#ecf0f1;box-shadow:0 2px 10px #0000001a;position:sticky;top:0;z-index:1000}.headerContent{max-width:1450px;margin:0 auto;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.brand{display:flex;align-items:center;gap:.75rem;flex-shrink:0}.logoContainer{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:#fff;border-radius:8px;overflow:hidden;flex-shrink:0}.logoImage{max-width:100%;max-height:100%;object-fit:contain}.appName{font-size:clamp(.9rem,2vw,1.2rem);font-weight:700;color:#fff;white-space:nowrap}.nav{display:flex;align-items:center;gap:.25rem;flex:1;justify-content:center;overflow-x:auto;padding:0 .5rem}.userSection{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.userRoleBadge{padding:.2rem .5rem;background-color:#3498db;color:#fff;font-size:clamp(.7rem,1.2vw,.8rem);font-weight:700;text-transform:uppercase;border-radius:20px;letter-spacing:.5px;white-space:nowrap}.logoutButton{background:none;border:none;color:#ecf0f1;font-size:1rem;cursor:pointer;padding:.5rem 1rem;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;background-color:#ffffff1a;white-space:nowrap}.logoutButton:hover{background-color:#e74c3c!important}.mobileMenuToggle{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.5rem;border-radius:4px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:#ffffff1a;flex-shrink:0}.mobileMenu{padding:.5rem;background-color:#1a252f;border-top:1px solid rgba(255,255,255,.1);max-height:calc(100vh - 60px);overflow-y:auto}.mobileMenuItem{display:flex;align-items:center;gap:1rem;width:100%;padding:1rem;background:none;border:none;color:#ecf0f1;font-size:1rem;cursor:pointer;text-align:left;border-radius:8px;transition:background .3s ease}.mobileMenuItem:hover{background-color:#ffffff1a!important}.mobileMenuItemIcon{font-size:1.2rem;min-width:24px}.mobileMenuDivider{height:1px;background-color:#ffffff1a;margin:.5rem 0}.mobileUserInfo{padding:1rem;display:flex;flex-direction:column;gap:.25rem}.mobileUserName{font-size:1rem;font-weight:700;color:#fff}.mobileUserRole{font-size:.85rem;color:#ffffffb3;text-transform:uppercase}.main{flex:1;padding:clamp(.5rem,2vw,2rem);background-color:#f5f5f5}.contentWrapper{max-width:1400px;margin:0 auto}.pageContent{background-color:#fff;border-radius:10px;padding:clamp(1rem,3vw,2rem);box-shadow:0 2px 5px #0000000d;min-height:calc(100vh - 180px)}.footer{background-color:#fff;border-top:1px solid #e9ecef;padding:.75rem 1rem}.footerContent{max-width:1400px;margin:0 auto}.footerInfo{display:flex;align-items:center;justify-content:center;flex-wrap:wrap}.versionBadge{font-weight:700;background-color:#e9ecef;padding:.25rem .75rem;border-radius:20px;font-size:clamp(.75rem,1.5vw,.85rem)}.environmentBadge{padding:.25rem .75rem;border-radius:20px;font-size:clamp(.75rem,1.5vw,.85rem);color:#fff}.statusBadge{padding:.25rem .75rem;border-radius:20px;font-size:clamp(.75rem,1.5vw,.85rem);font-weight:700}.loaderContainer{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background-color:#f5f5f5}.spinner{width:50px;height:50px;border:3px solid #f3f3f3;border-top:3px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.loaderText{font-size:18px;color:#333;margin-bottom:10px}.loaderSubtext{font-size:14px;color:#666}.errorContainer{display:flex;align-items:center;justify-content:center;min-height:100vh;background-color:#f8d7da;padding:20px}.errorContent{text-align:center;max-width:500px;padding:30px;background-color:#fff;border-radius:10px;box-shadow:0 2px 10px #0000001a}.errorTitle{color:#721c24;margin-bottom:15px}.errorMessage{color:#856404;margin-bottom:20px}.reloadButton{padding:10px 20px;background-color:#dc3545;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px;transition:background .3s ease}.reloadButton:hover{background-color:#c82333!important}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:767px){.mobileMenuToggle{display:block}.main,.pageContent{padding:16px}.footer{flex-direction:column;gap:12px;text-align:center}}@media(max-width:640px){.brand{gap:.5rem}.logoContainer{width:32px;height:32px}.mobileMenuToggle{width:36px;height:36px;font-size:1.2rem}.appName{font-size:.9rem}}@media(min-width:1024px){.headerContent{padding:.75rem 2rem}.nav{gap:.5rem}}nav::-webkit-scrollbar{display:none}nav{scrollbar-width:none}