@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&display=swap";:root{--color-bg: #050505;--color-surface: #121212;--color-text: #f0f0f0;--color-text-dim: #a0a0a0;--color-primary: #39ff14;--color-secondary: #00f3ff;--color-accent: #6200ea;--font-main: "Outfit", sans-serif;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 8rem;--border-radius: 12px;--transition-fast: .2s ease;--transition-smooth: .4s cubic-bezier(.25, 1, .5, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-main);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none;transition:color var(--transition-fast)}button{cursor:pointer;border:none;outline:none;font-family:inherit}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-sm)}.flex-center{display:flex;justify-content:center;align-items:center}.text-gradient{background:linear-gradient(to right,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;background-clip:text;color:transparent}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .8s var(--transition-smooth) forwards}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:none;justify-content:center;align-items:center;z-index:2000;padding:1rem}.modal-overlay.active{display:flex!important;animation:fadeIn .2s ease-out}.modal{background:#1a1a1a;border:2px solid rgba(57,255,20,.3);padding:2rem;border-radius:var(--border-radius);width:90%;max-width:450px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #000c;position:relative}.modal h3{color:var(--color-primary);margin-bottom:1.5rem;font-size:1.4rem}.modal-overlay.active .modal{transform:translateY(0)}.input-field{width:100%;padding:1rem;margin:var(--spacing-sm) 0;background:#2a2a2a;border:2px solid rgba(255,255,255,.2);border-radius:8px;color:var(--color-text);font-family:var(--font-main);font-size:1rem;outline:none;transition:all var(--transition-fast)}select.input-field{background-color:#2a2a2a;color:#fff}select.input-field option{background-color:#1a1a1a;color:#fff;padding:10px}.input-field:focus{border-color:var(--color-primary);background:#333;box-shadow:0 0 0 3px #39ff141a}.btn-primary{width:100%;padding:1rem;background:var(--color-primary);color:var(--color-bg);font-weight:700;border-radius:8px;font-size:1rem;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 15px #39ff1466}.btn-secondary{background:transparent;color:var(--color-text-dim);border:1px solid rgba(255,255,255,.2);padding:.8rem 1.5rem;border-radius:8px;transition:all var(--transition-fast)}.btn-secondary:hover{border-color:var(--color-text);color:var(--color-text)}.btn-primary.small{padding:.5rem 1rem;font-size:.9rem}select.btn-secondary{background-color:var(--color-surface);color:var(--color-text)}select.btn-secondary option{background-color:#000;color:#fff}.dashboard-layout{display:flex;height:100vh;width:100vw;overflow:hidden}.sidebar{width:260px;background:var(--color-surface);border-right:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;padding:var(--spacing-md)}.brand{margin-bottom:var(--spacing-lg)}.badge{font-size:.7rem;background:#ffffff1a;padding:.2rem .5rem;border-radius:4px;color:var(--color-text-dim);margin-top:.5rem;display:inline-block;text-transform:uppercase}.nav-item{display:block;padding:.8rem 1rem;margin-bottom:.5rem;border-radius:8px;color:var(--color-text-dim);font-weight:500;transition:all var(--transition-fast)}.nav-item:hover,.nav-item.active{background:#39ff141a;color:var(--color-primary)}.user-profile{margin-top:auto;display:flex;align-items:center;gap:1rem;padding-top:var(--spacing-md);border-top:1px solid rgba(255,255,255,.05)}.avatar{width:40px;height:40px;background:var(--color-accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700}.main-content{flex:1;padding:var(--spacing-lg);overflow-y:auto}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg)}.grid-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--spacing-md)}.card{background:var(--color-surface);padding:var(--spacing-md);border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.05);box-shadow:0 4px 6px #0003}.module-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.table-container{background:var(--color-surface);border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.05);overflow:hidden}.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:1rem}.data-table{width:100%;border-collapse:collapse;white-space:nowrap}.data-table th,.data-table td{padding:.75rem;text-align:left;border-bottom:1px solid rgba(255,255,255,.05)}.data-table th{background:#ffffff05;color:var(--color-text-dim);font-weight:600;font-size:.9rem}.row-warning{background:#ffeb3b0d}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.status-dot.green{background:var(--color-primary)}.status-dot.red{background:#f44}.flex-row{display:flex;align-items:center}.gap-sm{gap:1rem}.icon-btn{background:transparent;width:32px;height:32px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:background .2s}.icon-btn:hover{background:#ffffff1a}.kpi-value{font-size:2.5rem;font-weight:800;margin:.5rem 0}.kpi-value.warn{color:#ffeb3b}.kpi-value.good{color:var(--color-primary)}.text-sm{font-size:.85rem}.text-dim{color:var(--color-text-dim)}.text-center{text-align:center}.font-bold{font-weight:700}.hover-text:hover{color:var(--color-text);text-decoration:underline}.modal,.btn-primary,.btn-secondary,.nav-item{will-change:transform,opacity;transform:translateZ(0)}.table-container{content-visibility:auto;contain-intrinsic-size:1px 500px}.skeleton{background:linear-gradient(90deg,#ffffff0d 25%,#ffffff1a,#ffffff0d 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px;display:inline-block}.skeleton-text{height:1em;width:100%;margin-bottom:.5rem}.skeleton-row{height:3rem;width:100%;margin-bottom:.5rem}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.fade-in{animation:fadeIn .3s ease-out forwards}.mobile-header,.mobile-only,.mobile-user-info,.close-btn,.sidebar-overlay{display:none}@media(max-width:768px){.dashboard-layout{flex-direction:column;height:auto;overflow-y:auto}.mobile-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:#121212;border-bottom:1px solid rgba(255,255,255,.05);position:sticky;top:0;z-index:50;width:100%;height:60px}.avatar-small{width:36px;height:36px;background:var(--color-accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem}.sidebar{position:fixed;top:0;left:0;height:100vh;height:100svh;width:100%!important;z-index:1000;transform:translate(-100%);transition:transform .3s cubic-bezier(.25,1,.5,1);display:flex!important;flex-direction:column;background:var(--color-bg);padding:1rem;will-change:transform;overscroll-behavior:contain}.sidebar.active{transform:translate(0)}.modal-overlay{align-items:center!important;justify-content:center!important;padding:1rem}.modal{width:95%;max-width:500px;max-height:80vh;overflow-y:auto;padding:1.5rem;background:#1a1a1a;border:2px solid rgba(57,255,20,.3);margin:auto}.modal h3{margin-bottom:1.25rem;font-size:1.3rem;color:var(--color-primary)}.modal .flex-row{flex-direction:column;align-items:stretch;gap:.75rem}.modal .flex-row>*{width:100%!important;flex:none!important}.modal .input-field{background:#ffffff14;border:1px solid rgba(255,255,255,.15);font-size:16px;padding:1rem;min-height:50px}.modal .input-field:focus{background:#ffffff1f;border-color:var(--color-primary)}.modal textarea.input-field{min-height:100px}.modal .btn-primary,.modal .btn-secondary{min-height:50px;font-size:1rem;font-weight:600}.sidebar-overlay,.modal-overlay.sidebar-overlay{display:none!important;opacity:0!important;pointer-events:none!important}.sidebar-header{width:100%;height:60px;border-bottom:1px solid rgba(255,255,255,.05);margin-bottom:1rem;display:flex!important;flex-direction:row!important;justify-content:space-between!important;align-items:center!important}.sidebar-header h2{font-size:1.25rem;font-weight:600}.mobile-user-info{display:flex;align-items:center;gap:1rem;padding:1rem;background:#ffffff08;border-radius:12px;margin-bottom:1.5rem}.nav-item{padding:1rem;margin-bottom:.5rem;border-radius:8px;font-size:1.1rem;font-weight:500;display:flex;align-items:center}.nav-item:not(:last-child){border-bottom:1px solid rgba(255,255,255,.02)}.close-btn{position:static;color:var(--color-text-dim);padding:.5rem;width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.desktop-only,.desktop-only-group{display:none!important}.mobile-only{display:block!important}.icon-btn{width:44px!important;height:44px!important}.flex-row{flex-wrap:wrap;gap:.75rem}.gap-sm{gap:.75rem}.main-content{padding:1rem;padding-bottom:100px;overflow-y:auto;overflow-x:hidden;height:auto;-webkit-overflow-scrolling:touch}.grid-layout{grid-template-columns:1fr;gap:1rem;display:block}.grid-layout>.card{margin-bottom:1rem}h1{font-size:1.4rem;line-height:1.3}h2{font-size:1.2rem}h3{font-size:1.1rem}p{font-size:.95rem}.kpi-value{font-size:2rem;margin:.25rem 0}.card{padding:1.25rem;margin-bottom:1rem;border:1px solid rgba(255,255,255,.05)}.task-card{padding:1rem!important}.task-card .flex-row{flex-wrap:wrap;gap:.5rem}.task-card h4{font-size:1rem!important;line-height:1.4}.task-card .text-sm{font-size:.85rem}.task-card .text-xs{font-size:.75rem}.task-card .btn-primary{min-width:80px;padding:.5rem 1rem!important;font-size:.9rem!important}.table-container{border-radius:8px;margin:0 -.5rem;width:calc(100% + 1rem);border:none;background:transparent}.data-table{width:100%;border-collapse:separate;border-spacing:0 .5rem}.data-table thead{display:none}.data-table thead{display:table-header-group}.data-table th,.data-table td{padding:1rem .75rem;font-size:.9rem;border-bottom:1px solid rgba(255,255,255,.05)}.input-field{font-size:16px;padding:.8rem;min-height:48px}}
