@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@300;400;500;600&display=swap";:root{--navy:#0f1d35;--navy2:#162440;--navy3:#1e3154;--navy4:#243a63;--accent:#3b82f6;--accent2:#60a5fa;--danger:#ef4444;--warning:#f59e0b;--success:#10b981;--text:#f1f5f9;--text2:#94a3b8;--text3:#64748b;--border:#94a3b81f;--border2:#94a3b833;--card:#ffffff0a;--card2:#ffffff12;--mono:"IBM Plex Mono", monospace;--sans:"IBM Plex Sans", sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--sans);background:var(--navy);color:var(--text);min-height:100vh;overflow-x:hidden}.ecc-shell{height:100vh;display:flex;overflow:hidden}.ecc-sidebar{background:var(--navy2);border-right:1px solid var(--border);z-index:10;flex-direction:column;width:220px;min-width:220px;display:flex}.ecc-main{flex-direction:column;flex:1;display:flex;overflow-y:auto}.brand{border-bottom:1px solid var(--border);padding:20px 18px 16px}.brand-app{color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;font-size:10px;font-family:var(--mono);margin-bottom:4px}.brand-module{font-size:14px;font-weight:600}.brand-sub{color:var(--text2);margin-top:2px;font-size:11px}.sync-status{font-size:11px;font-family:var(--mono);border-radius:8px;align-items:center;gap:7px;margin:12px 14px;padding:7px 10px;display:flex}.sync-online{color:#34d399;background:#10b9811f;border:1px solid #10b9814d}.sync-offline{color:#f87171;background:#ef44441f;border:1px solid #ef44444d}.sync-pending{color:#fbbf24;background:#f59e0b1f;border:1px solid #f59e0b4d}.sync-dot{background:currentColor;border-radius:50%;flex-shrink:0;width:7px;height:7px}.sync-count{background:#f59e0b40;border-radius:4px;padding:1px 5px}.nav{flex:1;padding:8px 10px}.nav-section{color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;font-size:9px;font-family:var(--mono);padding:12px 8px 6px}.nav-item{cursor:pointer;color:var(--text2);border:1px solid #0000;border-radius:7px;align-items:center;gap:9px;margin-bottom:1px;padding:8px 10px;font-size:13px;text-decoration:none;transition:all .15s;display:flex}.nav-item:hover{background:var(--card2);color:var(--text)}.nav-item.active{color:var(--accent2);background:#3b82f626;border-color:#3b82f640}.nav-icon{text-align:center;width:18px;font-size:15px}.nav-badge{background:var(--danger);color:#fff;font-size:9px;font-family:var(--mono);border-radius:4px;margin-left:auto;padding:1px 5px;font-weight:600}.nav-badge.warn{background:var(--warning)}.sidebar-bottom{border-top:1px solid var(--border);padding:14px}.user-row{align-items:center;gap:9px;display:flex}.user-avatar{width:30px;height:30px;color:var(--accent2);background:#3b82f633;border:1px solid #3b82f666;border-radius:50%;justify-content:center;align-items:center;font-size:11px;font-weight:600;display:flex}.user-name{font-size:12px;font-weight:500}.user-role{color:var(--text3);font-size:10px}.topbar{background:var(--navy2);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.page-title{font-size:16px;font-weight:600}.page-sub{color:var(--text3);font-size:11px;font-family:var(--mono);margin-top:1px}.topbar-actions{align-items:center;gap:8px;display:flex}.offline-bar{color:#f87171;font-size:11px;font-family:var(--mono);background:#ef44441a;border-bottom:1px solid #ef444433;align-items:center;gap:8px;padding:6px 20px;display:flex}.content{flex:1;padding:20px 24px}.btn{border:1px solid var(--border2);background:var(--card2);color:var(--text);font-size:12px;font-family:var(--sans);cursor:pointer;border-radius:7px;align-items:center;gap:6px;padding:7px 14px;font-weight:500;text-decoration:none;transition:all .15s;display:inline-flex}.btn:hover{background:#ffffff1a}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:#2563eb}.btn-danger{color:#f87171;background:#ef444426;border-color:#ef444466}.btn-warning{color:#fbbf24;background:#f59e0b26;border-color:#f59e0b66}.btn-sm{border-radius:5px;padding:4px 10px;font-size:11px}.card{background:var(--card);border:1px solid var(--border);border-radius:10px}.card-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.card-title{font-size:13px;font-weight:600}.card-sub{color:var(--text3);font-size:11px;font-family:var(--mono)}.card-body{padding:16px}.kpi-grid{grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;display:grid}.kpi-card{background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:14px 16px;position:relative;overflow:hidden}.kpi-card:before{content:"";height:2px;position:absolute;top:0;left:0;right:0}.kpi-card.blue:before{background:var(--accent)}.kpi-card.green:before{background:var(--success)}.kpi-card.red:before{background:var(--danger)}.kpi-card.amber:before{background:var(--warning)}.kpi-label{color:var(--text3);letter-spacing:.8px;text-transform:uppercase;font-size:10px;font-family:var(--mono);margin-bottom:8px}.kpi-value{font-size:28px;font-weight:300;font-family:var(--mono);line-height:1}.kpi-card.red .kpi-value{color:#f87171}.kpi-card.green .kpi-value{color:#34d399}.kpi-card.amber .kpi-value{color:#fbbf24}.kpi-card.blue .kpi-value{color:var(--accent2)}.kpi-meta{color:var(--text3);margin-top:6px;font-size:10px}.alert{border-radius:8px;align-items:center;gap:10px;margin-bottom:14px;padding:10px 14px;font-size:12px;display:flex}.alert-danger{color:#f87171;background:#ef44441a;border:1px solid #ef44444d}.alert-warning{color:#fbbf24;background:#f59e0b1a;border:1px solid #f59e0b4d}.alert-info{color:var(--accent2);background:#3b82f61a;border:1px solid #3b82f64d}.alert-success{color:#34d399;background:#10b9811a;border:1px solid #10b9814d}.pill{font-size:10px;font-family:var(--mono);border-radius:4px;padding:2px 7px;font-weight:600}.pill-ok{color:#34d399;background:#10b9811f}.pill-warn{color:#fbbf24;background:#f59e0b1f}.pill-danger{color:#f87171;background:#ef444426}.pill-open{color:var(--accent2);background:#3b82f61f}.pill-closed{color:#34d399;background:#10b9811f}.pill-suspended{color:#f87171;background:#ef44441f}.gas{font-size:10px;font-family:var(--mono);border-radius:4px;padding:2px 6px;font-weight:500}.gas-ok{color:#34d399;background:#10b9811f;border:1px solid #10b98140}.gas-warn{color:#fbbf24;background:#f59e0b1f;border:1px solid #f59e0b40}.gas-danger{color:#f87171;background:#ef444426;border:1px solid #ef44444d}.gases{flex-wrap:wrap;gap:3px;display:flex}.form-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.form-grid-3{grid-template-columns:1fr 1fr 1fr;gap:14px;display:grid}.form-full{grid-column:1/-1}.form-group{flex-direction:column;gap:5px;display:flex}.form-label{color:var(--text3);font-size:11px;font-family:var(--mono);letter-spacing:.5px;text-transform:uppercase}.form-label .req{color:#f87171}.form-input,.form-select,.form-textarea{border:1px solid var(--border2);color:var(--text);font-size:13px;font-family:var(--sans);background:#00000040;border-radius:7px;outline:none;width:100%;padding:8px 11px;transition:border-color .15s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:#3b82f680}.form-select option{background:var(--navy2)}.form-textarea{resize:vertical;min-height:70px}.form-section-title{color:var(--text3);letter-spacing:1px;text-transform:uppercase;font-size:11px;font-family:var(--mono);border-bottom:1px solid var(--border);margin-top:4px;margin-bottom:14px;padding-bottom:8px}.gas-grid{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}.gas-input-card{border:1px solid var(--border);text-align:center;background:#0003;border-radius:8px;padding:10px}.gas-input-name{font-size:12px;font-weight:600;font-family:var(--mono);margin-bottom:2px}.gas-input-unit{color:var(--text3);font-size:9px;font-family:var(--mono);margin-bottom:6px}.gas-input-field{border:1px solid var(--border2);width:100%;color:var(--text);font-size:15px;font-family:var(--mono);text-align:center;background:#0000004d;border-radius:5px;outline:none;padding:6px;font-weight:500;transition:all .15s}.gas-input-field:focus{border-color:#3b82f680}.gas-result{font-size:10px;font-family:var(--mono);border-radius:3px;min-height:18px;margin-top:5px;padding:2px 5px}.gr-ok{color:#34d399}.gr-warn{color:#fbbf24}.gr-danger{color:#f87171}.threshold-table{border-collapse:collapse;width:100%;font-size:11px;font-family:var(--mono)}.threshold-table th,.threshold-table td{border:1px solid var(--border);text-align:center;padding:5px 10px}.threshold-table th{color:var(--text3);background:#0003;font-weight:400}.th-ok{color:#34d399}.th-warn{color:#fbbf24}.th-danger{color:#f87171}.headcount-bar{background:var(--card2);border:1px solid var(--border);border-radius:10px;align-items:center;gap:20px;margin-bottom:16px;padding:14px 18px;display:flex}.hc-stat{text-align:center}.hc-value{font-size:32px;font-weight:300;font-family:var(--mono);line-height:1}.hc-label{color:var(--text3);text-transform:uppercase;letter-spacing:.8px;font-size:10px;font-family:var(--mono);margin-top:3px}.hc-divider{background:var(--border2);width:1px;height:50px}.hc-info{flex:1}.person-control-card{background:var(--card);border:1px solid var(--border);border-radius:10px;align-items:center;gap:12px;padding:12px 14px;transition:border-color .15s;display:flex}.person-control-card.inside{border-left:3px solid var(--success)}.person-control-card.outside{border-left:3px solid var(--border2);opacity:.8}.person-control-card.overtime{border-left:3px solid var(--warning)}.pc-av-lg{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:13px;font-weight:600;display:flex}.pc-av-inside{color:#34d399;background:#10b98126;border:1.5px solid #10b98166}.pc-av-outside{color:var(--text3);background:#64748b26;border:1.5px solid #64748b4d}.pc-av-overtime{color:#fbbf24;background:#f59e0b26;border:1.5px solid #f59e0b66}.pc-info{flex:1}.pc-person-name{margin-bottom:2px;font-size:13px;font-weight:600}.pc-person-meta{color:var(--text3);font-size:11px}.pc-time-info{text-align:right;flex-direction:column;align-items:flex-end;gap:3px;margin-right:8px;display:flex}.pc-entry-time{font-size:11px;font-family:var(--mono);color:#34d399}.pc-exit-time{font-size:11px;font-family:var(--mono);color:var(--text3)}.pc-duration{font-size:11px;font-family:var(--mono)}.pc-duration.overtime{color:#fbbf24;font-weight:600}.btn-entrada{color:#34d399;cursor:pointer;font-size:12px;font-weight:600;font-family:var(--sans);white-space:nowrap;text-align:center;background:#10b9811f;border:1px solid #10b98166;border-radius:7px;min-width:90px;padding:8px 14px;transition:all .15s}.btn-entrada:hover{background:#10b98138}.btn-salida{color:#f87171;cursor:pointer;font-size:12px;font-weight:600;font-family:var(--sans);white-space:nowrap;text-align:center;background:#ef44441a;border:1px solid #ef444459;border-radius:7px;min-width:90px;padding:8px 14px;transition:all .15s}.btn-salida:hover{background:#ef444433}.log-row{border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:7px 0;font-size:12px;display:flex}.log-row:last-child{border-bottom:none}.log-type-entrada{width:60px;font-size:10px;font-family:var(--mono);color:#34d399;text-align:center;background:#10b9811a;border-radius:4px;padding:2px 6px;font-weight:600}.log-type-salida{width:60px;font-size:10px;font-family:var(--mono);color:#f87171;text-align:center;background:#ef44441a;border-radius:4px;padding:2px 6px;font-weight:600}.log-time{font-family:var(--mono);color:var(--text3);width:44px;font-size:11px}.log-name{color:var(--text2);flex:1}.log-rp{color:var(--text3);font-size:10px;font-family:var(--mono)}.log-pending{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b4d;border-radius:3px;padding:1px 5px;font-size:9px}.modal-overlay{z-index:100;background:#0009;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-overlay.open{display:flex}.modal-box{background:var(--navy2);border:1px solid var(--border2);border-radius:12px;width:440px;max-width:95vw;padding:24px}.modal-title{margin-bottom:4px;font-size:15px;font-weight:600}.modal-sub{color:var(--text3);font-size:11px;font-family:var(--mono);margin-bottom:16px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.epi-check-row{border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:6px 0;font-size:12px;display:flex}.epi-check-row:last-child{border-bottom:none}.epi-check-row input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}.med-tl-item{border-bottom:1px solid var(--border);gap:12px;padding:10px 0;display:flex}.med-tl-item:last-child{border-bottom:none}.tl-time{font-family:var(--mono);color:var(--text3);flex-shrink:0;width:42px;padding-top:2px;font-size:11px}.tl-body{flex:1}.tl-result{margin-bottom:4px;font-size:11px;font-weight:600}.tl-gases{flex-wrap:wrap;gap:4px;margin-top:5px;display:flex}.tl-who{color:var(--text3);margin-top:4px;font-size:10px}.tl-obs{color:var(--text3);margin-top:4px;font-size:11px;font-style:italic}.data-table{border-collapse:collapse;width:100%;font-size:12px}.data-table th{text-align:left;color:var(--text3);font-size:10px;font-family:var(--mono);letter-spacing:.5px;text-transform:uppercase;border-bottom:1px solid var(--border);background:#00000026;padding:8px 12px;font-weight:400}.data-table td{border-bottom:1px solid var(--border);color:var(--text2);padding:9px 12px}.data-table tr:hover td{background:var(--card);cursor:pointer}.data-table tr:last-child td{border-bottom:none}.personal-table{border-collapse:collapse;width:100%;font-size:12px}.personal-table th{text-align:left;color:var(--text3);font-size:10px;font-family:var(--mono);letter-spacing:.5px;text-transform:uppercase;border-bottom:1px solid var(--border);padding:6px 10px;font-weight:400}.personal-table td{border-bottom:1px solid var(--border);color:var(--text2);padding:7px 10px}.personal-table tr:last-child td{border-bottom:none}.sq-row{border-bottom:1px solid var(--border);align-items:center;gap:9px;padding:6px 0;font-size:11px;display:flex}.sq-row:last-child{border-bottom:none}.sq-icon{width:20px;height:20px;font-size:10px;font-family:var(--mono);border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.sq-pend{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b4d}.sq-sync{color:#34d399;background:#10b9811f;border:1px solid #10b98140}.sq-error{color:#f87171;background:#ef44441f;border:1px solid #ef444440}.sq-text{color:var(--text2);flex:1}.sq-ts{color:var(--text3);font-size:10px;font-family:var(--mono)}.permiso-card{background:var(--card);border:1px solid var(--border);border-radius:10px;transition:border-color .2s;overflow:hidden}.permiso-card:hover{border-color:var(--border2)}.permiso-card.p-danger{border-color:#ef444459}.permiso-card.p-warning{border-color:#f59e0b40}.pc-header{border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:11px 14px;display:flex}.pc-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.dot-ok{background:var(--success);box-shadow:0 0 0 3px #10b98133}.dot-warn{background:var(--warning);box-shadow:0 0 0 3px #f59e0b33}.dot-danger{background:var(--danger);animation:1s ease-in-out infinite blink;box-shadow:0 0 0 3px #ef444433}@keyframes blink{0%,to{opacity:1}50%{opacity:.4}}.pc-name{flex:1;font-size:13px;font-weight:600}.pc-buque{color:var(--text3);font-size:11px;font-family:var(--mono)}.pc-tipo{font-size:10px;font-family:var(--mono);border-radius:4px;padding:2px 7px;font-weight:500}.tipo-a{color:var(--accent2);background:#3b82f626;border:1px solid #3b82f640}.tipo-b{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b40}.pc-body{grid-template-columns:1fr 1.4fr 1fr;display:grid}.pc-section{border-right:1px solid var(--border);padding:10px 14px}.pc-section:last-child{border-right:none}.pc-slabel{color:var(--text3);letter-spacing:1px;text-transform:uppercase;font-size:9px;font-family:var(--mono);margin-bottom:6px}.pc-footer{border-top:1px solid var(--border);background:#00000026;justify-content:space-between;align-items:center;padding:8px 14px;display:flex}.pf-time{color:var(--text3);font-size:10px;font-family:var(--mono)}.pf-actions{gap:6px;display:flex}.avatars{display:flex}.av{border:1.5px solid var(--navy);width:24px;height:24px;color:var(--accent2);background:#3b82f633;border-radius:50%;justify-content:center;align-items:center;margin-left:-5px;font-size:8px;font-weight:600;display:flex}.av:first-child{margin-left:0}.av-more{background:var(--card2);color:var(--text3)}.section-label{color:var(--text3);font-size:11px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.8px;margin-bottom:10px}.section-gap{margin-top:16px}.two-col{grid-template-columns:1fr 1fr;gap:12px;display:grid}.three-col{grid-template-columns:1fr 1fr 1fr;gap:12px;display:grid}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}@media (width<=850px){.ecc-sidebar{transition:left .3s;position:fixed;top:0;bottom:0;left:-220px;box-shadow:10px 0 30px #00000080}.ecc-sidebar.open{left:0}.ecc-shell{height:100dvh}.topbar{padding:10px 16px}.mobile-menu-btn{display:block!important}.content{padding:14px 16px}.kpi-grid{grid-template-columns:1fr 1fr;gap:8px}.kpi-card{padding:12px}.kpi-value{font-size:22px}.pc-body{grid-template-columns:1fr}.pc-section{border-right:none;border-bottom:1px solid var(--border)}.pc-section:last-child{border-bottom:none}.two-col,.three-col,.form-grid,.form-grid-3{grid-template-columns:1fr!important}.gas-grid{grid-template-columns:repeat(3,1fr)!important}.gas-input-card{padding:8px 4px}.gas-input-name{font-size:11px}.gas-input-field{padding:4px;font-size:13px}}@media (width<=480px){.gas-grid{grid-template-columns:repeat(2,1fr)!important}.topbar-actions{flex-direction:column;align-items:stretch;gap:6px;width:100%;margin-top:10px}.topbar{flex-direction:column;align-items:flex-start;height:auto}}.mobile-menu-btn{color:var(--text);cursor:pointer;background:0 0;border:none;margin-right:12px;font-size:20px;display:none}