:root{--blue:#1b4fd8;--blue-dk:#1240b0;--amber:#f59e0b;--amber-dk:#d97706;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-400:#9ca3af;--gray-700:#374151;--gray-900:#111827;--red:#dc2626;--green:#16a34a;--font:"Inter", system-ui, sans-serif;--radius:6px;--shadow:0 1px 3px #0000001f, 0 1px 2px #00000014}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--gray-50);color:var(--gray-900);min-height:100vh}.topbar{background:var(--blue);color:#fff;justify-content:space-between;align-items:center;height:52px;padding:0 1.25rem;display:flex;box-shadow:0 2px 4px #0003}.topbar-brand{letter-spacing:-.01em;font-size:1.1rem;font-weight:700}.brand-mark{color:var(--amber);margin-right:.3rem}.topbar-actions{gap:.5rem;display:flex}.topbar-status{align-items:center;gap:.75rem;font-size:.85rem;display:flex}.btn-primary{background:var(--blue);color:#fff;border-radius:var(--radius);font-size:.9rem;font-family:var(--font);cursor:pointer;border:none;padding:.5rem 1rem;font-weight:500;transition:background .15s}.btn-primary:hover{background:var(--blue-dk)}.btn-secondary{background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-200);border-radius:var(--radius);font-size:.9rem;font-family:var(--font);cursor:pointer;padding:.5rem 1rem;font-weight:500}.btn-danger{background:var(--red);color:#fff;border-radius:var(--radius);font-size:.85rem;font-family:var(--font);cursor:pointer;border:none;padding:.4rem .9rem;font-weight:500}.btn-danger:hover{opacity:.9}.btn-icon{color:#fff;cursor:pointer;border-radius:var(--radius);background:0 0;border:none;padding:.3rem;font-size:1.1rem}.btn-icon:hover{background:#ffffff26}.btn-sm{padding:.35rem .75rem;font-size:.8rem}.login-page{justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;display:flex}.login-card{box-shadow:var(--shadow);background:#fff;border-radius:12px;width:100%;max-width:400px;padding:2.5rem 2rem}.brand{text-align:center;margin-bottom:2rem}.brand-icon{font-size:2.5rem}.brand-name{color:var(--blue);margin-top:.5rem;font-size:1.5rem;font-weight:700}.brand-sub{color:var(--gray-400);margin-top:.2rem;font-size:.85rem}.login-form{flex-direction:column;gap:.75rem;display:flex}.login-form label{color:var(--gray-700);font-size:.85rem;font-weight:500}.login-form textarea{border:1px solid var(--gray-200);border-radius:var(--radius);resize:vertical;width:100%;color:var(--gray-900);padding:.6rem .75rem;font-family:monospace;font-size:.8rem}.login-form textarea:focus{outline:2px solid var(--blue);border-color:#0000}.hint{color:var(--gray-400);font-size:.75rem}.main-layout{flex-direction:column;min-height:100vh;display:flex}.content{flex:1;padding:1.5rem}.section-title{color:var(--gray-900);margin-bottom:1rem;font-size:1.1rem;font-weight:600}.ticket-bar{align-items:center;gap:.75rem;margin-bottom:1.25rem;display:flex}.ticket-bar label{color:var(--gray-700);white-space:nowrap;font-size:.85rem;font-weight:500}.ticket-bar input{border:1px solid var(--gray-200);border-radius:var(--radius);width:140px;font-size:.9rem;font-family:var(--font);padding:.45rem .7rem}.equipos-grid{flex-direction:column;gap:.75rem;display:flex}.equipo-card{border:1px solid var(--gray-200);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;align-items:center;gap:1rem;padding:.9rem 1rem;display:flex}.equipo-card.offline{opacity:.7}.equipo-status{border-radius:50%;flex-shrink:0;width:10px;height:10px}.dot-green{background:var(--green);box-shadow:0 0 0 3px #16a34a33}.dot-gray{background:var(--gray-400)}.equipo-info{flex:1}.equipo-hostname{font-size:.95rem;font-weight:600}.equipo-meta{color:var(--gray-400);margin-top:.1rem;font-size:.8rem}.badge-unattended{background:var(--amber);color:#000;border-radius:3px;margin-top:.25rem;padding:.1rem .4rem;font-size:.7rem;font-weight:600;display:inline-block}.offline-label{color:var(--gray-400);font-size:.85rem}.modal{z-index:100;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal.hidden{display:none}.modal-card{background:#fff;border-radius:10px;width:90%;max-width:380px;padding:1.5rem}.modal-card h3{margin-bottom:.75rem;font-size:1.1rem;font-weight:600}.modal-card p{color:var(--gray-700);margin-bottom:1.25rem;font-size:.9rem}.modal-actions{justify-content:flex-end;gap:.75rem;display:flex}.session-layout{flex-direction:column;height:100vh;display:flex}.session-body{flex:1;display:flex;overflow:hidden}.canvas-container{background:#000;flex:1;justify-content:center;align-items:center;display:flex;position:relative}#remote-screen{max-width:100%;max-height:100%;display:block}.canvas-overlay{color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:1rem;display:flex;position:absolute;inset:0}.canvas-overlay.hidden{display:none}.spinner{border:3px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.context-panel{border-left:1px solid var(--gray-200);background:#fff;flex-direction:column;gap:1rem;width:240px;padding:1rem;display:flex;overflow-y:auto}.context-panel h3{color:var(--gray-700);font-size:.9rem;font-weight:600}.context-section{border-bottom:1px solid var(--gray-100);padding-bottom:.75rem}.context-section .label{text-transform:uppercase;letter-spacing:.05em;color:var(--gray-400);margin-bottom:.15rem;font-size:.7rem;font-weight:500}.context-section .value{font-size:.9rem;font-weight:500}.chat-section{flex-direction:column;flex:1;gap:.5rem;min-height:120px;display:flex}.chat-section h4{color:var(--gray-700);font-size:.85rem;font-weight:600}.chat-messages{border:1px solid var(--gray-200);border-radius:var(--radius);background:var(--gray-50);flex-direction:column;flex:1;gap:.3rem;max-height:160px;padding:.5rem;font-size:.8rem;display:flex;overflow-y:auto}.chat-form{gap:.4rem;display:flex}.chat-form input{border:1px solid var(--gray-200);border-radius:var(--radius);font-size:.8rem;font-family:var(--font);flex:1;padding:.35rem .5rem}.status-badge{border-radius:999px;padding:.2rem .6rem;font-size:.8rem;font-weight:500}.status-connecting{color:#fff;background:#fff3}.status-connected{background:var(--green);color:#fff}.status-disconnected{background:var(--red);color:#fff}.latency-badge{color:#ffffffd9;font-size:.8rem}.latency-badge.hidden{display:none}.duration-badge{font-variant-numeric:tabular-nums;color:#ffffffd9;font-size:.8rem}.admin-badge{background:var(--amber);color:#000;border-radius:3px;margin-left:.4rem;padding:.1rem .4rem;font-size:.7rem;font-weight:700}.admin-tabs{border-bottom:2px solid var(--gray-200);background:#fff;gap:0;padding:0 1.25rem;display:flex}.tab-btn{font-size:.9rem;font-family:var(--font);color:var(--gray-400);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px;padding:.75rem 1rem;font-weight:500}.tab-btn.active{color:var(--blue);border-bottom-color:var(--blue)}.tab-btn:hover:not(.active){color:var(--gray-700)}.data-table{border-collapse:collapse;width:100%;margin-top:1rem;font-size:.85rem}.data-table th{text-align:left;background:var(--gray-50);border-bottom:2px solid var(--gray-200);text-transform:uppercase;letter-spacing:.04em;color:var(--gray-700);padding:.6rem .75rem;font-size:.75rem;font-weight:600}.data-table td{border-bottom:1px solid var(--gray-100);padding:.6rem .75rem}.data-table tr:hover td{background:var(--gray-50)}.mono{font-family:monospace;font-size:.8rem}.tipo-select{border:1px solid var(--gray-200);border-radius:var(--radius);font-family:var(--font);padding:.3rem .5rem;font-size:.85rem}.dot-green-inline{background:var(--green);border-radius:50%;width:8px;height:8px;margin-right:.3rem;display:inline-block}.dot-gray-inline{background:var(--gray-400);border-radius:50%;width:8px;height:8px;margin-right:.3rem;display:inline-block}.audit-filters{align-items:center;gap:.75rem;margin-bottom:.5rem;display:flex}.filter-input{border:1px solid var(--gray-200);border-radius:var(--radius);font-size:.85rem;font-family:var(--font);padding:.4rem .7rem}.hidden{display:none!important}.loading,.empty{text-align:center;color:var(--gray-400);padding:2rem;font-size:.9rem}.error{color:var(--red);font-size:.85rem}
