:root{--calipso: #5de1e6;--navy: #0e1958;--onix: #3c3c3b;--bg: #f7f8fa;--line: #e6e8ef;--ink: #1a1f3a;--muted: #6b7280;--green: #10b981;--red: #ef4444;--amber: #f59e0b}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit;font-size:14px}.layout{display:grid;grid-template-columns:clamp(240px,18vw,300px) 1fr;min-height:100vh}.sidebar{background:var(--navy);color:#fff;padding:18px 0;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:hidden}.sidebar .brand{padding:0 20px 18px;border-bottom:1px solid rgba(255,255,255,.1);flex:0 0 auto}.sidebar .brand h1{font-size:18px;margin:0}.sidebar .brand .sub{font-size:12px;opacity:.75;margin-top:2px}.sidebar nav{padding:10px 0;flex:1 1 auto;overflow-y:auto}.nav-group-header{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;color:#c3cae6;padding:11px 22px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;font-weight:700}.nav-group-header:hover{color:#fff;background:#ffffff0a}.nav-group-title{display:flex;align-items:center;gap:9px}.nav-group-icon{font-size:15px;opacity:.95}.chevron{font-size:16px;line-height:1;transition:transform .18s ease;opacity:.7}.chevron.open{transform:rotate(90deg)}.nav-group-items{padding-bottom:8px}.sidebar nav a{display:block;padding:10px 22px 10px 44px;color:#d3d8ec;text-decoration:none;font-size:15px;border-left:3px solid transparent}.sidebar nav a:hover{background:#ffffff0f;color:#fff}.sidebar nav a.active{background:#5de1e61f;color:var(--calipso);border-left:3px solid var(--calipso);font-weight:600}.sidebar .user{flex:0 0 auto;padding:14px 16px 16px;border-top:1px solid rgba(255,255,255,.12)}.user-name{font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-email{font-size:11px;color:#9aa3c4;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{display:inline-block;margin-top:8px;padding:3px 10px;border-radius:999px;background:#5de1e624;color:var(--calipso);font-size:11px;font-weight:600}.user-role:empty{display:none}.user-actions{margin-top:12px;display:flex;flex-direction:column;gap:4px}.user-action{display:block;width:100%;text-align:left;cursor:pointer;padding:8px 10px;border:0;border-radius:8px;background:#ffffff0f;color:#d3d8ec;font-size:13px;text-decoration:none}.user-action:hover{background:#ffffff1f;color:#fff}.user-action.active{background:#5de1e624;color:var(--calipso)}.user-action.logout{background:none;color:#aeb6d4}.user-action.logout:hover{background:#ef444429;color:#fecaca}.content{padding:24px 30px;overflow-y:auto;min-width:0}.content h1{margin:0 0 18px;font-size:22px;color:var(--navy)}.mobile-topbar,.sidebar-overlay{display:none}.hamburger{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;width:40px;height:40px;padding:8px;background:none;border:0}.hamburger span{display:block;height:2px;width:100%;background:#fff;border-radius:2px}.login-page{display:grid;place-items:center;min-height:100vh;background:linear-gradient(135deg,#0e1958,#1e2a72)}.login-card{background:#fff;padding:38px 36px;border-radius:12px;width:380px;box-shadow:0 20px 60px #0003}.login-card h1{color:var(--navy);margin:0 0 4px;font-size:22px}.login-card .sub{color:var(--muted);font-size:12px;margin-bottom:22px}.login-card label{display:block;margin-bottom:14px;font-size:12px;font-weight:600;color:var(--ink)}.login-card input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:6px;margin-top:4px}.login-card button{width:100%;padding:11px;background:var(--navy);color:#fff;border:0;border-radius:6px;font-weight:600;margin-top:4px}.login-card button:disabled{opacity:.6;cursor:not-allowed}.login-card .error{color:var(--red);font-size:12px;margin:8px 0 0}.btn{padding:8px 14px;background:#fff;border:1px solid var(--line);border-radius:6px;font-size:13px;color:var(--ink)}.btn:hover{background:#f1f3f8}.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy)}.btn.primary:hover{background:#1a275f}.btn.danger{background:var(--red);color:#fff;border-color:var(--red)}.btn.success{background:var(--green);color:#fff;border-color:var(--green)}.btn.sm{padding:4px 10px;font-size:12px}.btn.ghost{background:transparent;border-color:transparent}.row{display:flex;gap:10px;align-items:center}.row.between{justify-content:space-between}.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:16px}.card h2{font-size:16px;margin:0 0 14px;color:var(--navy)}.muted{color:var(--muted)}.chip{display:inline-block;padding:2px 9px;border-radius:12px;background:#eef0f6;color:var(--ink);font-size:11px}.chip.green{background:#d1fae5;color:#065f46}.chip.red{background:#fee2e2;color:#991b1b}.chip.amber{background:#fef3c7;color:#92400e}.chip.blue{background:#dbeafe;color:#1e3a8a}table{width:100%;border-collapse:collapse}table th{text-align:left;padding:10px 12px;background:#f1f3f8;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}table td{padding:10px 12px;border-top:1px solid var(--line);font-size:13px}table tr:hover td{background:#fafbfd}.form-grid{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}.form-grid label{display:block;font-size:12px;font-weight:600}.form-grid input,.form-grid select,.form-grid textarea{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:6px;margin-top:4px}.full-row{grid-column:span 2}.error-box{padding:14px;background:#fee2e2;color:#991b1b;border-radius:8px;border-left:4px solid var(--red)}.perm-matrix{width:100%;border-collapse:collapse}.perm-matrix th,.perm-matrix td{padding:8px 10px;border:1px solid var(--line);font-size:12px;text-align:center}.perm-matrix th.resource{background:#f1f3f8;text-align:left;font-weight:600;color:var(--ink);text-transform:none;letter-spacing:normal;font-size:13px}.perm-matrix th.action-header{background:var(--navy);color:#fff;font-size:11px}.perm-matrix td.resource-cell{background:#fafbfd;text-align:left;font-weight:600;color:var(--navy);padding-left:14px}.perm-matrix input[type=checkbox]{transform:scale(1.2);cursor:pointer}.perm-matrix td.disabled{background:#f8f8f8}.modal-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#0e195899;display:grid;place-items:center;z-index:100}.modal{background:#fff;padding:30px 32px;border-radius:12px;width:420px;max-width:90vw;max-height:90vh;overflow-y:auto}.modal h2{color:var(--navy);margin:0 0 4px}.chip.finalizado{background:#d1fae5;color:#065f46}.chip.pendiente{background:#fee2e2;color:#991b1b}.chip.en-curso{background:#fef3c7;color:#92400e}.chip.critica{background:#fecaca;color:#7f1d1d}.table{width:100%;border-collapse:collapse}.table th{text-align:left;padding:10px 12px;background:#f1f3f8;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}.table td{padding:10px 12px;border-top:1px solid var(--line);font-size:13px;vertical-align:top}.table tr:hover td{background:#fafbfd}.table .codigo,.table .mono{font-family:ui-monospace,JetBrains Mono,Menlo,monospace}.modal{width:480px}.modal h2{font-size:18px;margin-bottom:8px}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:12px;margin-bottom:16px}.kpi-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 18px}.kpi-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:6px}.kpi-value{font-size:30px;font-weight:800;color:var(--navy);line-height:1.1}.kpi-sub{font-size:11px;color:var(--muted);margin-top:3px}.kpi-card.danger .kpi-value{color:var(--red)}.kpi-card.ok .kpi-value{color:var(--green)}.kpi-card.warn .kpi-value{color:var(--amber)}.progress-wrap{background:#e5e7eb;border-radius:6px;height:7px;overflow:hidden;min-width:80px}.progress-fill{height:100%;border-radius:6px;background:var(--calipso)}.progress-fill.low{background:var(--red)}.progress-fill.mid{background:var(--amber)}.progress-fill.high{background:var(--green)}.sema{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:3px 9px;border-radius:5px}.sema:before{content:"●";font-size:9px}.sema.critico{background:#fee2e2;color:#991b1b}.sema.alto{background:#fef3c7;color:#92400e}.sema.medio{background:#fef9c3;color:#854d0e}.sema.ok{background:#d1fae5;color:#065f46}.alert-item{padding:12px 14px;border-radius:8px;border-left:4px solid var(--line);margin-bottom:8px;background:#fff;border:1px solid var(--line);display:flex;gap:12px;align-items:flex-start}.alert-item.critico{border-left:4px solid var(--red)}.alert-item.alto{border-left:4px solid var(--amber)}.alert-item.medio{border-left:4px solid var(--calipso)}.chart-wrap{width:100%;overflow-x:auto}.tab-bar{display:flex;border-bottom:2px solid var(--line);margin-bottom:20px}.tab-btn{background:none;border:none;padding:8px 18px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px}.tab-btn.active{color:var(--navy);border-bottom-color:var(--calipso)}.tab-btn:hover:not(.active){color:var(--ink)}.search-row{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap}.search-row input,.search-row select{padding:7px 10px;border:1px solid var(--line);border-radius:6px;font-size:13px}.search-row input{min-width:220px;flex:1}.toast-stack{position:fixed;top:16px;right:16px;z-index:200;display:flex;flex-direction:column;gap:10px;max-width:min(380px,calc(100vw - 32px));pointer-events:none}.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:10px;background:#fff;color:var(--ink);cursor:pointer;box-shadow:0 12px 32px #0e195833;border-left:4px solid var(--muted);animation:toast-in .22s ease}.toast-error{border-left-color:var(--red)}.toast-success{border-left-color:var(--green)}.toast-info{border-left-color:var(--calipso)}.toast-warn{border-left-color:var(--amber)}.toast-icon{font-size:15px;line-height:1.35;font-weight:700}.toast-error .toast-icon{color:var(--red)}.toast-success .toast-icon{color:var(--green)}.toast-info .toast-icon{color:#0891b2}.toast-warn .toast-icon{color:var(--amber)}.toast-msg{flex:1;font-size:13px;line-height:1.4}.toast-close{background:none;border:0;color:var(--muted);font-size:18px;line-height:1;padding:0 2px}.toast-close:hover{color:var(--ink)}@keyframes toast-in{0%{opacity:0;transform:translate(14px)}to{opacity:1;transform:translate(0)}}.confirm-modal{width:420px}.confirm-msg{color:var(--onix);font-size:14px;line-height:1.5;margin:6px 0 22px}.confirm-actions{display:flex;justify-content:flex-end;gap:10px}.empty-row td{text-align:center;padding:32px;color:var(--muted);font-style:italic}.role-grid{display:grid;grid-template-columns:260px 1fr;gap:16px}@media(max-width:1200px){.content{padding:22px}}@media(max-width:900px){.layout{grid-template-columns:1fr}.mobile-topbar{display:flex;align-items:center;gap:6px;position:sticky;top:0;z-index:60;background:var(--navy);color:#fff;padding:6px 10px}.mobile-title{font-size:15px;font-weight:700}.sidebar{position:fixed;top:0;left:0;z-index:80;width:288px;max-width:86vw;height:100vh;transform:translate(-100%);transition:transform .25s ease;box-shadow:4px 0 24px #0000004d}.sidebar.open{transform:translate(0)}.sidebar-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:#0e195880}.content{padding:16px 14px}.content h1{font-size:19px}.card{overflow-x:auto;-webkit-overflow-scrolling:touch}.table,table{min-width:560px}.role-grid,.form-grid{grid-template-columns:1fr}.full-row{grid-column:span 1}.modal{width:94vw!important;max-width:94vw;padding:22px 18px;overflow-x:auto}.search-row{flex-direction:column;align-items:stretch}.search-row input,.search-row select{min-width:0;width:100%}.row.between{flex-wrap:wrap;gap:8px}}@media(max-width:560px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.kpi-value{font-size:24px}.content{padding:14px 10px}.btn{padding:7px 11px}.login-card{width:92vw;padding:30px 22px}}.success-box{padding:14px 16px;background:#d1fae5;color:#065f46;border-radius:8px;margin-bottom:16px}.warn-box{padding:10px 12px;background:#fef3c7;border:1px solid #fde68a;border-left:4px solid var(--amber);border-radius:6px;color:#92400e;font-size:12px}.info-box{padding:10px 12px;background:#eef2ff;border-left:4px solid var(--navy);border-radius:6px;color:var(--navy);font-size:12px}
