@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@400;500;600;700;800;900&display=swap";:root{--color-background:#222428;--color-orange:#e6873e;--color-red:#aa2823;--color-blue:#1d4f88;--color-green:#3a8350;--color-yellow:#fdf051;--color-dark:#0f1012;--color-dark-elevated:#2a2c30;--color-text-primary:#fff;--color-text-secondary:#b8bac0;--color-text-muted:#6b6d73;--gradient-fire:linear-gradient(135deg, #e6873e 0%, #aa2823 100%);--gradient-tech:linear-gradient(135deg, #1d4f88 0%, #3a8350 50%, #fdf051 100%);--gradient-hero:linear-gradient(180deg, #0f1012 0%, #222428 50%, #0f1012 100%);--font-display:"Outfit", sans-serif;--font-primary:"Inter", sans-serif;--text-6xl:4rem;--text-5xl:3rem;--text-4xl:2.5rem;--text-3xl:2rem;--text-2xl:1.5rem;--text-xl:1.25rem;--text-base:1rem;--text-sm:.875rem;--text-xs:.75rem;--space-xs:.5rem;--space-sm:1rem;--space-md:1.5rem;--space-lg:2rem;--space-xl:3rem;--space-2xl:4rem;--space-3xl:6rem}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-primary);background-color:var(--color-background);color:var(--color-text-primary)}.layout{background:var(--color-background);min-height:100vh;color:var(--color-text-primary);overflow-x:hidden}.layout-body{display:flex}.main-content{box-sizing:border-box;flex:1;min-height:calc(100vh - 73px);margin-top:73px;margin-left:220px;padding:2rem;transition:margin-left .25s}.main-content.sidebar-collapsed{margin-left:68px}@media (width<=768px){.main-content{margin-bottom:80px;margin-left:0;padding:1rem;margin-left:0!important}}.header-title{font-family:var(--font-display);background:var(--gradient-fire);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:800}.user-avatar{border:2px solid var(--color-orange);border-radius:50%;width:40px;height:40px}.sidebar-toggle{cursor:pointer;z-index:101;width:22px;height:48px;color:var(--color-text-secondary);background:#14161afa;border:1px solid #ffffff14;border-left:none;border-radius:0 8px 8px 0;position:absolute;top:50%;right:-22px;transform:translateY(-50%)}.sidebar-toggle:hover{color:var(--color-orange);background:#ff6b001f}.nav-item{color:var(--color-text-secondary);white-space:nowrap;cursor:pointer;border-radius:.75rem;align-items:center;gap:.875rem;padding:.75rem .875rem;font-size:.9rem;font-weight:500;text-decoration:none;transition:background .2s,color .2s;display:flex;overflow:hidden}.nav-item:hover{color:var(--color-text-primary);background:#e6873e1a}.nav-item.active{background:var(--gradient-fire);color:#fff}.nav-label{opacity:1;transition:opacity .15s}.sidebar.collapsed .nav-label{opacity:0;pointer-events:none;width:0}.sidebar.collapsed .nav-item{justify-content:center;gap:0;padding:.75rem}.sidebar.collapsed .nav-item:after{content:attr(data-label);color:var(--color-text-primary);white-space:nowrap;opacity:0;pointer-events:none;z-index:200;background:#141923f2;border:1px solid #ffffff1a;border-radius:.5rem;padding:.35rem .75rem;font-size:.8rem;font-weight:600;transition:opacity .15s;position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%)}.sidebar.collapsed .nav-item:hover:after{opacity:1}.alert-badge{background:var(--color-red);color:#fff;text-align:center;border-radius:999px;min-width:18px;padding:.15rem .45rem;font-size:.7rem;font-weight:700;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.sidebar.collapsed .alert-badge{min-width:14px;font-size:.6rem;top:4px;right:4px;transform:none}.page-header{margin-bottom:var(--space-lg);justify-content:space-between;align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.page-header-left{align-items:center;gap:.75rem;display:flex}.page-icon{color:var(--color-orange)}.page-title{font-family:var(--font-display);color:var(--color-text-primary);margin:0;font-size:1.75rem;font-weight:700}.page-subtitle{color:var(--color-text-secondary);margin:.15rem 0 0;font-size:.875rem}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.page-content{animation:.3s ease-out fadeInUp}.card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--space-md);background:#2a2c3099;border:1px solid #ffffff1a;border-radius:1rem;transition:transform .2s,border-color .2s,box-shadow .2s}.card:hover{border-color:#e6873e4d;transform:translateY(-2px);box-shadow:0 8px 32px #0000004d}.card-header{margin-bottom:var(--space-sm);justify-content:space-between;align-items:center;display:flex}.card-title{font-family:var(--font-display);color:var(--color-text-primary);font-size:1rem;font-weight:600}.card-badge{border-radius:999px;padding:.2rem .6rem;font-size:.75rem;font-weight:600}.status-badge{border-radius:999px;align-items:center;gap:.35rem;padding:.25rem .65rem;font-size:.75rem;font-weight:600;display:inline-flex}.status-badge.online{color:var(--color-green);background:#3a835033}.status-badge.warning{color:var(--color-yellow);background:#fdf05126}.status-badge.error{color:var(--color-red);background:#aa282333}.status-badge.offline{color:var(--color-text-muted);background:#6b6d7333}.grid{gap:var(--space-lg);display:grid}.grid-1{grid-template-columns:1fr}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media (width<=1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}.btn{font-size:var(--text-base);font-family:var(--font-display);cursor:pointer;border:none;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;transition:transform .2s,box-shadow .2s,background .2s,border .2s;display:inline-flex}.btn-primary{background:var(--gradient-fire);color:#fff;box-shadow:0 4px 14px #e6873e66}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #e6873e99}.btn-secondary{color:#fff;border:1px solid var(--color-orange);background:0 0}.btn-secondary:hover{background:var(--color-orange);color:#fff}.form-input{width:100%;color:var(--color-text-primary);font-family:var(--font-primary);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.5rem;padding:.75rem 1rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}.form-input:focus{border-color:var(--color-orange);outline:none;box-shadow:0 0 0 2px #e6873e33}.form-label{font-family:var(--font-primary);color:var(--color-text-secondary);margin-bottom:.5rem;font-size:.875rem;font-weight:500;display:block}.form-group{margin-bottom:var(--space-md)}.auth-container{min-height:100vh;padding:var(--space-md);justify-content:center;align-items:center;display:flex}.auth-card{width:100%;max-width:440px}@media (width<=768px){.sidebar{z-index:105;border-top:1px solid #ffffff14;position:fixed;bottom:0;border-right:none!important;flex-direction:row!important;width:100%!important;height:auto!important;top:auto!important}.sidebar-nav{justify-content:space-around;width:100%;flex-direction:row!important;padding:.5rem!important}.nav-item{border-radius:.5rem!important;flex-direction:column!important;justify-content:center!important;gap:0!important;padding:.6rem!important}.nav-label,.sidebar-toggle{display:none!important}}