:root{--bg-0:#22222a;--bg-1:#2a2a34;--bg-2:#32323e;--bg-3:#3c3c4a;--border:#44445a;--text:#f5f5ff;--text-muted:#8e8ea2;--accent:#9147e9;--accent-hover:#7b3bc7;--accent-glow:#cd77ff80;--accent-soft:#9147e91f;--accent-border:#c18dff;--link:#2575fc;--danger:#ef4444;--success:#10b981;--warning:#f59e0b;--info:#3b82f6;--radius:10px;--radius-sm:6px;--radius-lg:14px;--sidebar-w:240px;--sidebar-collapsed:64px;--topbar-h:56px;--font-heading:"Exo", sans-serif;--font-body:"Blinker", sans-serif;--font-mono:"JetBrains Mono", monospace}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-body);background:var(--bg-0);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;overflow:hidden}a{color:var(--link);text-decoration:none}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pageLoad{to{left:100%}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-600px 0}to{background-position:600px 0}}@keyframes pulseMetric{0%,to{opacity:1}50%{opacity:.65}}@keyframes rippleEffect{to{opacity:0;transform:scale(4)}}@keyframes fadeInPage{0%{opacity:0}to{opacity:1}}.anim-fade-in{animation:.4s ease-out both fadeInUp}.anim-delay-1{animation-delay:50ms}.anim-delay-2{animation-delay:.1s}.anim-delay-3{animation-delay:.15s}.anim-delay-4{animation-delay:.2s}.anim-delay-5{animation-delay:.25s}.anim-pulse{animation:2.5s cubic-bezier(.4,0,.6,1) infinite pulseMetric}.anim-page{animation:.25s ease-out fadeInPage}.loading-screen{height:100vh;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.loading-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}.page-loader{justify-content:center;align-items:center;height:60vh;display:flex}.page-loader-bar{background:var(--bg-3);border-radius:2px;width:120px;height:3px;position:relative;overflow:hidden}.page-loader-bar:after{content:"";background:var(--accent);border-radius:2px;width:40%;height:100%;animation:1s ease-in-out infinite pageLoad;position:absolute;top:0;left:-40%}.skeleton{background:linear-gradient(90deg, var(--bg-2) 25%, var(--bg-3) 50%, var(--bg-2) 75%);border-radius:var(--radius);background-size:600px 100%;animation:1.5s infinite shimmer}.skeleton-card{border-radius:var(--radius);height:200px}.skeleton-line{border-radius:4px;height:14px;margin-bottom:10px}.skeleton-line.w-60{width:60%}.skeleton-line.w-40{width:40%}.skeleton-line.w-80{width:80%}.skeleton-circle{border-radius:50%;width:40px;height:40px}.app-layout{height:100vh;display:flex;overflow:hidden}.sidebar{width:var(--sidebar-w);background:var(--bg-1);border-right:1px solid var(--border);z-index:100;flex-direction:column;flex-shrink:0;height:100vh;transition:width .2s;display:flex;position:relative}.sidebar.collapsed{width:var(--sidebar-collapsed)}.sidebar-brand{border-bottom:1px solid var(--border);justify-content:center;align-items:center;min-height:64px;padding:16px;display:flex}.brand-mark{flex-direction:column;align-items:center;gap:3px;display:flex}.brand-mark-logo{object-fit:contain;width:auto;height:28px;display:block}.brand-mark-tag{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.2em;color:var(--text-muted);font-size:8px;font-weight:600;line-height:1}.brand-mark-tag span{color:var(--accent)}.brand-mark--lg{gap:8px;margin-bottom:24px}.brand-mark--lg .brand-mark-logo{height:60px}.brand-mark--lg .brand-mark-tag{letter-spacing:.25em;color:var(--text);font-size:13px}.sidebar.collapsed .brand-mark-tag{display:none}.sidebar-nav{flex-direction:column;flex:1;gap:2px;padding:12px 8px;display:flex;overflow-y:auto}.nav-item{border-radius:var(--radius-sm);color:var(--text-muted);font-family:var(--font-body);white-space:nowrap;align-items:center;gap:10px;padding:10px 12px;font-size:14px;font-weight:500;text-decoration:none;transition:all .15s;display:flex}.nav-item:hover{color:var(--text);background:var(--bg-2)}.nav-item.active{color:var(--accent);background:var(--accent-soft);font-weight:600}.nav-icon{text-align:center;flex-shrink:0;justify-content:center;align-items:center;width:20px;font-size:16px;display:flex}.nav-label{text-overflow:ellipsis;overflow:hidden}.sidebar-footer{border-top:1px solid var(--border);align-items:center;gap:8px;padding:12px;display:flex}.user-info{flex:1;align-items:center;gap:8px;display:flex;overflow:hidden}.user-avatar{background:var(--bg-3);width:28px;height:28px;color:var(--accent);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.user-email{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.btn-logout{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;padding:6px;font-size:15px;display:flex}.btn-logout:hover{color:var(--danger);background:#ef444414}.btn-collapse{background:var(--bg-2);border:1px solid var(--border);width:24px;height:24px;color:var(--text-muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:11px;transition:all .15s;display:flex;position:absolute;top:50%;right:-12px;transform:translateY(-50%)}.btn-collapse:hover{color:var(--text);background:var(--bg-3)}.sidebar-overlay{display:none}.main-area{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.topbar{height:var(--topbar-h);border-bottom:1px solid var(--border);background:var(--bg-1);flex-shrink:0;align-items:center;gap:12px;padding:0 28px;display:flex}.topbar-title{font-family:var(--font-heading);font-size:16px;font-weight:600}.btn-hamburger{color:var(--text);cursor:pointer;background:0 0;border:none;padding:4px;font-size:20px;display:none}.main-content{flex:1;padding:28px;overflow-y:auto}.btn-primary{background:var(--accent);color:#fff;border:1px solid var(--accent-border);border-radius:var(--radius);font-family:var(--font-heading);cursor:pointer;box-shadow:0 0 13px 4px var(--accent-glow);padding:12px 24px;font-size:14px;font-weight:600;transition:all .2s;position:relative;overflow:hidden}.btn-primary:hover:not(:disabled){background:var(--accent-hover);box-shadow:0 0 20px 6px var(--accent-glow);transform:translateY(-1px)}.btn-primary:active:not(:disabled){box-shadow:0 0 8px 2px var(--accent-glow);transform:scale(.98)translateY(0)}.btn-primary:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.btn-primary .ripple,.btn-secondary .ripple{pointer-events:none;background:#ffffff4d;border-radius:50%;width:20px;height:20px;animation:.4s ease-out rippleEffect;position:absolute;transform:scale(0)}.btn-secondary{background:var(--bg-1);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);font-family:var(--font-heading);cursor:pointer;padding:12px 24px;font-size:14px;font-weight:500;transition:all .2s;position:relative;overflow:hidden}.btn-secondary:hover{background:var(--bg-2);border-color:var(--text-muted)}.btn-secondary:active{transform:scale(.98)}.btn-full{width:100%}.btn-lg{border-radius:var(--radius);padding:14px 28px;font-size:15px}.text-muted{color:var(--text-muted)}.login-page{background:radial-gradient(ellipse at 50% 0%, #9147e914 0%, var(--bg-0) 70%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{width:100%;max-width:400px;animation:.5s ease-out fadeInUp}.login-brand{text-align:center;flex-direction:column;align-items:center;margin-bottom:40px;display:flex}.login-sub{color:var(--text-muted);margin-top:8px;font-size:14px}.login-form{flex-direction:column;gap:18px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:600}.form-group input{background:var(--bg-1);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:var(--font-body);outline:none;padding:13px 16px;font-size:15px;transition:all .2s}.form-group input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.form-error{color:var(--danger);border-radius:var(--radius);background:#ef44440f;padding:10px 14px;font-size:13px}.login-footer{text-align:center;color:var(--text-muted);font-size:12px;font-family:var(--font-body);margin-top:40px}.dashboard-page{max-width:1060px}.dashboard-header{margin-bottom:32px}.dashboard-header h2{font-family:var(--font-heading);margin-bottom:6px;font-size:26px;font-weight:700}.module-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.module-card{background:linear-gradient(135deg, var(--bg-1) 0%, #32323e80 100%);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text);cursor:pointer;padding:24px;text-decoration:none;transition:all .25s;position:relative;overflow:hidden}.module-card:before{content:"";background:var(--mod-color);opacity:0;height:3px;transition:opacity .25s;position:absolute;top:0;left:0;right:0}.module-card:after{content:"";opacity:0;background:radial-gradient(circle at 50% 0,#9147e90a 0%,#0000 70%);transition:opacity .3s;position:absolute;inset:0}.module-card:hover{border-color:var(--mod-color);transform:translateY(-4px);box-shadow:0 8px 32px #0000004d,0 0 0 1px #9147e91a}.module-card:hover:before,.module-card:hover:after{opacity:1}.module-card:active{transform:translateY(-2px)}.module-card-header{z-index:1;justify-content:space-between;align-items:center;margin-bottom:14px;display:flex;position:relative}.module-icon{font-size:28px}.module-status{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.04em;border-radius:12px;padding:4px 12px;font-size:10px;font-weight:700}.status-active{color:var(--success);background:#10b9811f;border:1px solid #10b98140}.status-new{background:var(--accent-soft);color:var(--accent);border:1px solid #9147e940}.module-name{font-family:var(--font-heading);z-index:1;margin-bottom:8px;font-size:18px;font-weight:700;position:relative}.module-desc{color:var(--text-muted);z-index:1;margin-bottom:18px;font-size:13px;line-height:1.6;position:relative}.module-stats{border-top:1px solid var(--border);z-index:1;gap:24px;padding-top:14px;display:flex;position:relative}.module-stat-value{font-family:var(--font-heading);color:var(--text);font-size:20px;font-weight:700}.module-stat-label{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;font-size:10px}.module-cta{color:var(--accent);z-index:1;align-items:center;gap:6px;margin-top:16px;font-size:13px;font-weight:600;transition:gap .2s;display:flex;position:relative}.module-card:hover .module-cta{gap:10px}.placeholder-page{text-align:center;padding:60px 20px}.placeholder-icon{margin-bottom:16px;font-size:48px}.placeholder-page h2{margin-bottom:8px;font-size:22px}.triagem-page{max-width:800px;margin:0 auto}.triagem-hero{text-align:center;padding:20px 0 40px}.triagem-badge{font-family:var(--font-heading);text-transform:uppercase;background:var(--accent-soft);color:var(--accent);letter-spacing:.05em;border:1px solid #9147e933;border-radius:20px;margin-bottom:16px;padding:5px 14px;font-size:10px;font-weight:700;display:inline-block}.triagem-hero h2{font-family:var(--font-heading);margin-bottom:12px;font-size:28px;font-weight:800}.triagem-sub{color:var(--text-muted);max-width:500px;margin:0 auto 24px;font-size:15px;line-height:1.6}.triagem-hero-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.triagem-steps{background:linear-gradient(135deg, var(--bg-1), var(--bg-2));border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:36px;padding:28px}.steps-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;display:grid}.step-card{background:var(--bg-2);border-radius:var(--radius);padding:18px;transition:transform .2s}.step-card:hover{transform:translateY(-2px)}.step-num{background:var(--accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;margin-bottom:10px;font-size:12px;font-weight:700;display:flex}.step-card h4{margin-bottom:4px;font-size:14px}.step-card p{color:var(--text-muted);font-size:13px;line-height:1.5}.triagem-features{margin-bottom:36px}.triagem-features h3,.triagem-flow h3,.triagem-types h3{font-family:var(--font-heading);margin-bottom:16px;font-size:18px;font-weight:700}.features-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;display:grid}.feature-card{background:var(--bg-1);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;transition:all .2s}.feature-card:hover{border-color:var(--accent-border);transform:translateY(-2px)}.feature-icon{color:var(--accent);margin-bottom:12px;font-size:22px;display:block}.feature-card h4{margin-bottom:6px;font-size:14px;font-weight:600}.feature-card p{color:var(--text-muted);font-size:13px;line-height:1.5}.triagem-flow{margin-bottom:36px}.flow-steps{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;display:flex}.flow-step{text-align:center;background:var(--bg-1);border:1px solid var(--border);border-radius:var(--radius-lg);min-width:150px;padding:22px;transition:all .2s}.flow-step:hover{border-color:var(--accent-border);transform:translateY(-2px)}.flow-icon{justify-content:center;margin-bottom:10px;font-size:28px;display:flex}.flow-label{margin-bottom:3px;font-size:14px;font-weight:700}.flow-desc{color:var(--text-muted);font-size:12px}.flow-arrow{color:var(--text-muted);font-size:20px}.triagem-types{margin-bottom:36px}.types-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.type-card{background:linear-gradient(135deg, var(--bg-1), var(--bg-2));border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px;transition:all .2s}.type-card:hover{border-color:var(--accent-border);transform:translateY(-2px)}.type-card h4{margin-bottom:8px;font-size:15px;font-weight:700}.type-card p{color:var(--text-muted);margin-bottom:12px;font-size:13px;line-height:1.5}.type-tag{font-family:var(--font-heading);background:var(--accent-soft);color:var(--accent);border:1px solid #9147e933;border-radius:12px;padding:4px 12px;font-size:10px;font-weight:600;display:inline-block}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-3);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--border)}@media (width<=768px){.sidebar{z-index:200;transition:transform .3s;position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar.mobile-open{transform:translate(0)}.sidebar.collapsed{width:var(--sidebar-w)}.sidebar-overlay{z-index:199;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;display:block;position:fixed;inset:0}.btn-hamburger{align-items:center;display:flex}.btn-collapse{display:none}.main-content{padding:20px 16px}.module-grid,.types-grid{grid-template-columns:1fr}.triagem-hero h2{font-size:22px}.btn-primary,.btn-secondary{min-height:44px;padding:14px 24px}.form-group input{min-height:44px;padding:14px 16px}.nav-item{min-height:44px;padding:12px 14px}}@media (width>=769px) and (width<=1024px){.module-grid{grid-template-columns:repeat(2,1fr)}}.sidebar,.module-card,.loading-spinner{will-change:transform}.page-loader-bar:after{will-change:left}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
