:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#183a35;background:#f3f5f1;font-size:15px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:0;border-radius:9px;padding:12px 18px;background:#146759;color:white;font-weight:650}button:hover{filter:brightness(.94)}button:disabled{opacity:.5;cursor:wait}.secondary{background:#e8eee8;color:#244a41}.danger{background:#a34536}a{color:#146759}input,select{padding:11px;border:1px solid #cdd8cf;border-radius:8px;background:#fff;min-width:0}label{display:grid;gap:7px;font-size:13px;color:#577066}h1,h2,h3,p{margin-top:0}h1{font-size:30px;letter-spacing:-1px}h2{font-size:21px}h3{font-size:15px}p{line-height:1.6}.muted{color:#6a7c72}.shell{display:grid;grid-template-columns:230px 1fr;min-height:100vh}.sidebar{background:#123a36;color:#fff;padding:32px 20px;display:flex;flex-direction:column;gap:12px}.brand{font-size:30px;font-weight:750;letter-spacing:-1px;margin-bottom:8px}.brand span{color:#b5dc75}.tagline{font-size:12px;color:#adcbc2;margin-bottom:30px}.nav{width:100%;text-align:left;background:transparent;color:#bbd1c8}.nav.active{background:#28524a;color:#fff}.sidebar .foot{margin-top:auto;font-size:12px;color:#b5c9be;line-height:1.7}main{padding:35px 42px;max-width:1600px;width:100%}.top{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:26px}.top h1{margin-bottom:6px}.badge{display:inline-block;border-radius:20px;background:#e5efdc;color:#366d35;font-size:12px;padding:6px 10px}.badge.warn{background:#fff0d8;color:#975c16}.badge.error{background:#f8e2df;color:#9f4436}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:24px 0}.card,.panel{background:#fff;border:1px solid #e1e7dd;border-radius:14px;padding:24px}.card strong{display:block;font-size:32px;margin:14px 0 8px}.grid{display:grid;grid-template-columns:1.1fr 1fr;gap:22px}.panel{margin-bottom:22px}.actions,.filters{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.filters{margin:16px 0}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;background:#f6f8f3;color:#6a7c72;font-weight:550}th,td{padding:13px 12px;border-bottom:1px solid #edf0e9;white-space:nowrap}td.wrap{white-space:normal;min-width:200px}.big-button{font-size:20px;width:100%;padding:24px;margin:20px 0}.timeline{display:grid;gap:0}.step{display:flex;justify-content:space-between;padding:17px 0;border-bottom:1px solid #eef1e9}.step b{color:#146759}.notice{padding:14px 18px;background:#fff3dd;border-radius:9px;font-size:13px;line-height:1.6;margin:14px 0}.login{max-width:460px;margin:8vh auto;background:white;border:1px solid #dce5db;border-radius:20px;padding:40px}.login .brand{color:#123a36}.login form{display:grid;gap:18px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.formgrid .full{grid-column:1/-1}dialog{border:1px solid #dce5db;border-radius:16px;max-width:650px;width:92%;padding:28px}dialog::backdrop{background:#123a3680}#toast{position:fixed;bottom:24px;right:24px;max-width:450px;background:#123a36;color:white;border-radius:12px;padding:16px 22px;display:none;z-index:10}video{width:100%;max-height:300px;border-radius:10px;background:#173c37}.empty{padding:35px;text-align:center;color:#79897b}.clock{font-size:48px;letter-spacing:-2px;margin:20px 0}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#6d8375}.chart{display:flex;height:10px;border-radius:5px;overflow:hidden;background:#e9eee4;margin:12px 0}.chart span{background:#a8cc72}.hidden{display:none!important}@media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{padding:18px;flex-direction:row;flex-wrap:wrap;align-items:center}.tagline,.sidebar .foot{display:none}.brand{margin:0 15px 0 0}.nav{width:auto;padding:10px}.cards{grid-template-columns:repeat(2,1fr)}main{padding:24px 18px}.grid{grid-template-columns:1fr}.top{align-items:flex-start}.formgrid{grid-template-columns:1fr}}
.identity{display:flex;gap:22px;align-items:center;margin:22px 0}.identity h2{margin:8px 0}.identity p{margin-bottom:0}.portrait{width:130px;height:150px;flex-shrink:0;background:#edf1e9;border:1px solid #d5dfd1;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#7b8774;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:contain}.visual-confirm{display:flex;align-items:center;gap:10px;padding:15px;background:#edf4e5;border-radius:10px}.visual-confirm input{width:20px;height:20px}.credential{max-width:430px;padding:25px;margin:24px auto;background:white;border:1px solid #d8e1d5;border-radius:15px;text-align:center;break-inside:avoid}.credential .identity{text-align:left}.credential .brand{color:#123a36}.credential .uuid{font:11px monospace;overflow-wrap:anywhere}.credential .qr-image{max-width:100%;height:auto}dialog{max-height:90vh;overflow:auto}@media print{body{background:white}body:has(dialog[open]) #app,body:has(dialog[open]) #toast,body:has(dialog[open]) dialog .top{display:none!important}.sidebar,.top,.no-print,.filters,.panel>h2,.panel>p,#toast{display:none!important}.shell,main,.panel{display:block;padding:0;border:0;margin:0}dialog[open]{position:static;max-height:none;overflow:visible;border:0;padding:0;max-width:none;width:100%;margin:0}dialog::backdrop{background:transparent}.credential{margin:0 auto;width:90mm;color:#000;border:1px solid #999}.credential .identity{gap:12px}.credential .portrait{width:28mm;height:34mm}.credential h2{font-size:16px}.credential p{font-size:12px}.credential .brand{display:block}.actions{display:none!important}}
.check{display:flex;align-items:center;gap:8px;font-size:13px}.check input{width:18px;height:18px}.rowactions{display:flex;gap:6px;flex-wrap:wrap}.rowactions button,td button{padding:8px 12px}.panel label.check{margin:12px 0}[role=alert]{color:#a34536}.sidebar .nav{padding-top:10px;padding-bottom:10px}
/* Credencial física vertical: 55 mm ancho × 85 mm alto. */
@page{size:55mm 85mm;margin:0}
.credential{box-sizing:border-box;width:55mm;height:85mm;max-width:55mm;padding:3mm;border-radius:3mm;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow:hidden}
.credential .brand{font-size:16px;line-height:6mm;margin:0;flex-shrink:0}
.credential .identity{width:100%;gap:2mm;margin:2mm 0;align-items:center;min-height:22mm;flex-shrink:0}
.credential .identity>div:last-child{min-width:0;flex:1}
.credential .portrait{width:14mm;height:calc(18mm + 5px);border-radius:2mm;font-size:8px;text-align:center}
.credential .eyebrow{font-size:7px;letter-spacing:0;line-height:1.2}
.credential h2{font-size:10px;line-height:1.15;margin:1mm 0;overflow-wrap:anywhere}
.credential p{font-size:8px;line-height:1.2;margin:1mm 0}
.credential .qr-image{width:28mm;height:28mm;max-width:28mm;flex-shrink:0;margin:1mm 0;object-fit:contain}
.credential .uuid{font:6.5px/1.2 monospace;width:100%;margin:1mm 0;overflow-wrap:anywhere}
@media print{
 html,body{width:55mm;margin:0!important;padding:0!important}
 .credential{width:55mm;height:85mm;max-width:55mm;margin:0!important;padding:3mm;border:0;border-radius:0;box-sizing:border-box;break-inside:avoid;print-color-adjust:exact;-webkit-print-color-adjust:exact}
 .credential .identity{gap:2mm;margin:2mm 0;min-height:22mm}
 .credential .portrait{width:14mm;height:calc(18mm + 5px)}
 .credential h2{font-size:10px}
 .credential p{font-size:8px}
 .credential .brand{font-size:16px;line-height:6mm}
 dialog[open]{width:55mm!important;min-width:0!important;margin:0!important}
 #credentialResult{margin:0;padding:0}
}
textarea{font:inherit;padding:11px;border:1px solid #cdd8cf;border-radius:8px;min-height:100px;resize:vertical;max-width:100%}.navgroup{border-top:1px solid #32534d;padding-top:8px}.navgroup summary{cursor:pointer;font-size:13px;color:#d5e6df;font-weight:650;padding:8px 4px}.navgroup .nav{padding-left:18px}.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;align-self:start;gap:8px}.sidebar .tagline{margin-bottom:12px}main{min-width:0}.filters{flex-wrap:wrap}@media(max-width:800px){.sidebar{position:static;height:auto;max-height:none}.navgroup{width:100%}.navgroup .nav{width:auto}.sidebar .foot{width:100%}.filters input{max-width:100%}}

/* Identidad de empresa; conserva credenciales verticales de 55 × 85 mm. */
.company-brand{display:flex;align-items:center;gap:10px;min-width:0;font-size:22px;line-height:1.2}.company-brand img{max-width:65px;max-height:45px;object-fit:contain;flex-shrink:0}.company-name{overflow-wrap:anywhere;min-width:0}.sidebar .company-brand{margin-bottom:12px}.login .company-brand{justify-content:center}.credential .company-brand{display:flex;height:10mm;max-height:10mm;font-size:10pt;line-height:1.1;gap:2mm;overflow:hidden}.credential .company-brand img{max-width:14mm;max-height:9mm}.credential .company-name{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.credential .company-brand>span{line-height:1.1}#companyPreview{max-width:360px;padding:18px;background:#f4f7f6;border-radius:10px}

/* Registro continuo: vista de cámara y resultado persistente accesible. */
.qr-camera-window{margin:16px 0;background:#122a29;border-radius:14px;overflow:hidden;color:white}.qr-camera-window video{display:block;width:100%;max-height:200px;aspect-ratio:16/9;object-fit:cover}.qr-camera-window video.hidden{display:none}.qr-camera-window p{padding:12px;margin:0;font-size:14px}.capture-result{margin:18px 0;padding:18px;border:2px solid;border-radius:12px;min-height:92px}.capture-result strong{display:block;font-size:20px}.capture-result p{margin:8px 0;overflow-wrap:anywhere}.capture-result.success{background:#dcfce7;border-color:#15803d;color:#14532d}.capture-result.warning{background:#ffedd5;border-color:#c2410c;color:#7c2d12}.capture-result.failure{background:#fee2e2;border-color:#b91c1c;color:#7f1d1d}.capture-result.waiting{background:#f1f5f9;border-color:#64748b;color:#334155}@media(max-width:600px){.qr-camera-window video{max-height:180px}.capture-result{padding:14px}.capture-result strong{font-size:18px}}

@media(max-width:700px){body.qr-reading .sidebar,body.qr-reading .top{display:none}body.qr-reading main{padding:12px}body.qr-reading .qr-registration>#findemployee,body.qr-reading #lookupstatus,body.qr-reading .qr-registration>label,body.qr-reading .qr-registration>.eyebrow,body.qr-reading .qr-registration>h2,body.qr-reading #camera{display:none}body.qr-reading .qr-registration{padding:16px}body.qr-reading .capture-result{margin-top:0}body.qr-reading .qr-registration .portrait{width:90px;height:100px}body.qr-reading .qr-registration .identity{gap:14px;margin:14px 0}body.qr-reading .qr-registration .identity h2{font-size:20px}body.qr-reading .qr-registration .clock{font-size:32px}}

.credential .qr-error{color:#991b1b;background:#fee2e2;border:1px solid #b91c1c;padding:2mm;font-size:9px}

/* Visibilidad de contraseña: botón accesible que no envía el formulario. */
.password-control{position:relative;width:100%}.password-control input{width:100%;padding-right:52px;box-sizing:border-box}.password-control .password-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;margin:0;border:0;background:transparent;color:#315850;cursor:pointer;border-radius:8px}.password-control .password-toggle:hover{background:#e7efeb}.password-control .password-toggle:focus-visible{outline:2px solid #126c5f;outline-offset:-2px}.password-toggle svg{pointer-events:none}

/* Reloj y distribución del lector: captura izquierda, resultado y movimientos derecha. */
.qr-reader-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start}.qr-reader-grid>.panel{min-width:0}.reader-clock{margin:0 0 24px;padding:22px 12px;text-align:center;background:#123a36;color:#f0f7e8;border-radius:14px}.reader-clock .eyebrow{color:#c1dc9c}.reader-clock time{display:block;margin:8px 0;font-size:clamp(38px,5vw,64px);line-height:1.1;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:2px}.reader-clock-zone{margin-top:8px;font-size:12px;opacity:.8;overflow-wrap:anywhere}.qr-result-panel .capture-result{margin-top:16px}.qr-result-panel .identity{gap:18px}.qr-result-panel .identity>div:last-child{min-width:0;overflow-wrap:anywhere}.qr-result-panel .timeline-heading{padding-top:24px;margin-top:24px;border-top:1px solid #d8e1d5}.qr-result-panel .portrait{width:100px;height:120px}@media(max-width:900px){.qr-reader-grid{grid-template-columns:minmax(0,1fr)}.reader-clock time{font-size:48px}}@media(max-width:700px){body.qr-reading .reader-clock{margin-bottom:16px;padding:16px 10px}.qr-result-panel .identity{gap:12px}.qr-result-panel .portrait{width:85px;height:105px}.qr-result-panel .identity h2{font-size:20px}}

.credential .credential-personal{font-size:7px;line-height:1.15;margin:0.5mm 0 0;flex-shrink:0}

.import-success{background:#e8f5e6;border:1px solid #b6d8b0;color:#174d35}.import-templates{gap:10px;margin:16px 0}.import-templates a{display:inline-flex;padding:10px 14px;border:1px solid #c5d7ca;border-radius:8px;text-decoration:none}

.session-toolbar{position:sticky;top:0;z-index:12;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;background:#f4f7f2}.session-toolbar button{flex-shrink:0}.session-toolbar .badge{white-space:normal}@media(max-width:700px){.session-toolbar{top:0;padding:8px 0}.session-toolbar button{padding:10px 12px}}

.import-example{white-space:pre-wrap;overflow-wrap:anywhere;background:#f2f5f1;border:1px solid #dce6df;border-radius:10px;padding:16px;font-size:12px}.import-templates{flex-wrap:wrap}#import-guide{margin:20px 0}#import-guide summary{cursor:pointer;font-weight:700}#cameraFacing{min-width:135px}

/* Iconos de las secciones principales; conserva la navegación nativa por teclado. */
.nav-icon{width:19px;height:19px;flex:0 0 19px;vertical-align:middle}.navgroup summary{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;border-radius:8px;padding:10px 6px;transition:background-color .15s,color .15s}.navgroup summary::-webkit-details-marker{display:none}.navgroup-heading{display:flex;align-items:center;gap:10px;min-width:0;line-height:1.35}.navgroup-heading>.nav-icon{color:#b6df79}.navgroup summary:hover,.navgroup[open]>summary{background:#ffffff09;color:#e0efce}.navgroup summary:focus-visible{outline:2px solid #b6df79;outline-offset:2px}.nav-chevron{width:14px;height:14px;flex-basis:14px;color:#9fbbae;transition:transform .18s}.navgroup[open]>summary>.nav-chevron{transform:rotate(90deg)}.sidebar>.nav,.nav-api{display:flex;align-items:center;gap:10px}.nav-api{margin-top:6px;text-decoration:none}.nav-api>.nav-icon{width:17px;height:17px;flex-basis:17px}@media(prefers-reduced-motion:reduce){.navgroup summary,.nav-chevron{transition:none}}

.nfc-reader{margin-top:24px;padding-top:16px;border-top:1px solid #d7dfd3}.nfc-reader input,.nfc-reader select{max-width:100%}.nfc-reader form{display:grid;gap:12px}

/* Mobile capture confirmation: independent of the camera and page scroll. */
.mobile-capture-feedback{width:calc(100% - 32px);max-width:430px;max-height:calc(100dvh - 32px);padding:20px;border:0;border-radius:18px;color:#183a35;box-shadow:0 20px 60px #0005}.mobile-capture-feedback::backdrop{background:#071c18a6}.mobile-capture-feedback .capture-result{margin:0;padding:18px;text-align:center;min-height:0}.mobile-capture-feedback .capture-result h2{font-size:24px;margin:8px 0}.mobile-capture-feedback .capture-result p{margin-bottom:0}.mobile-capture-symbol{font-size:44px;font-weight:800;line-height:1}.mobile-capture-feedback .mobile-capture-event{font-size:20px}.mobile-capture-feedback .identity{gap:14px;margin:18px 0}.mobile-capture-feedback .portrait{width:86px;height:108px}.mobile-capture-feedback .identity>div:last-child{min-width:0;overflow-wrap:anywhere}.mobile-capture-feedback .identity h2{font-size:20px}.mobile-capture-feedback .identity p{font-size:13px}.mobile-capture-feedback .mobile-capture-note{font-size:13px;margin-bottom:16px}.mobile-capture-feedback>button{width:100%;min-height:48px}