:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f3f6f4;color:#18392d;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}.layout{min-height:100dvh;display:flex;flex-direction:column}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #61b58a;outline-offset:2px}
.header{background:#fff;border-bottom:1px solid #e1ebe4;padding:14px clamp(17px,4vw,55px);min-height:73px;display:flex;align-items:center;justify-content:space-between;gap:20px}.identity{display:flex;gap:11px;align-items:center}.symbol{background:#205c49;color:white;display:grid;place-items:center;border-radius:11px;width:41px;height:41px;font-size:28px}.identity strong{display:block;font-size:17px;letter-spacing:-.5px}.identity small{display:block;font-size:11px;color:#82968a;margin-top:3px}.account{display:flex;gap:12px;align-items:center;font-size:12px;font-weight:750}.subtle-btn{background:#edf5ef;border:0;border-radius:9px;color:#255e44;padding:9px 13px;font-size:12px;font-weight:850}
.main{width:min(1080px,calc(100% - 30px));margin:32px auto 55px;flex:1}.auth-panel{background:#fff;padding:clamp(23px,5vw,45px);max-width:470px;margin:30px auto;border:1px solid #dfe9e2;border-radius:21px;box-shadow:0 18px 50px #20503908}.eyebrow{font-size:11px;color:#408765;letter-spacing:1.3px;font-weight:900}.auth-panel h1,.main-heading h1{font-size:clamp(27px,5vw,37px);letter-spacing:-1.3px;line-height:1.2;margin:10px 0}.auth-panel p{font-size:13px;line-height:1.55;color:#718678}.auth-panel label,.form-grid label,.filter-bar label{display:block;font-size:12px;font-weight:800;color:#415f50;margin-top:15px}.auth-panel input,.form-grid input,.form-grid textarea,.filter-bar input,.filter-bar select{display:block;width:100%;padding:13px;border:1px solid #cbd9cf;border-radius:10px;background:#fff;color:#213c30;margin-top:7px;min-height:45px}
.primary-btn{padding:13px 18px;border:0;border-radius:11px;background:#24684c;color:#fff;font-weight:850;min-height:47px}.primary-btn:hover{background:#2e7b59}.auth-panel .primary-btn{width:100%;margin-top:22px}.link-btn{border:0;background:none;color:#256b4b;font-size:12px;text-decoration:underline;padding:12px 0;margin-top:12px}.help{border-top:1px solid #e8eee9;padding-top:15px}.message{padding:13px 17px;background:#e2f1e7;border:1px solid #bdddc8;color:#255b3f;border-radius:12px;margin:15px auto;max-width:100%;white-space:pre-wrap;line-height:1.5;font-size:13px}.message.error{background:#fff0eb;border-color:#f3c7b6;color:#9b4335}.message[hidden],[hidden]{display:none!important}
.main-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:23px}.tag{background:#e8f3e9;color:#3c825b;font-size:12px;font-weight:750;padding:10px 13px;border-radius:25px}.navigation{display:flex;gap:10px;border-bottom:1px solid #d9e7de;padding-bottom:15px;overflow-x:auto;margin-bottom:23px}.nav-item{padding:12px 17px;background:#fff;border:1px solid #dfe9e2;border-radius:11px;color:#63806f;font-weight:850;white-space:nowrap;font-size:13px}.nav-item.active{background:#24684c;border-color:#24684c;color:#fff}.card{border:1px solid #dfe8e1;background:#fff;border-radius:18px;padding:22px;margin:16px 0;box-shadow:0 9px 27px #144c2707}.card h2,.card h3{font-size:18px;letter-spacing:-.4px;margin:0 0 17px}.card p{color:#74897b;font-size:13px;line-height:1.65}.hero-card{background:linear-gradient(140deg,#e0f2e8,#fafdfb);border:1px solid #d2e8d8;border-radius:21px;padding:26px;text-align:center}.hero-card .overline{color:#3b8061;font-size:12px;font-weight:800}.timer{font-size:clamp(45px,9vw,67px);font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-3px;margin:20px 0 5px}.hero-card p{margin:0;color:#688c75}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.actions button{min-height:53px}.actions button:last-child:not(:first-child){background:#fff;color:#2d6149;border:1px solid #cfdfd5}.activity-row{display:flex;gap:13px;align-items:center;padding:13px 5px;border-bottom:1px solid #e5eee7;font-size:13px}.activity-row:last-child{border-bottom:0}.activity-row time{font-weight:850;font-variant-numeric:tabular-nums;min-width:60px}.activity-row .pin{width:9px;height:9px;border:2px solid #378a65;border-radius:50%}.muted{font-size:12px;color:#819689}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.stat{padding:19px 15px;border:1px solid #dfe8e1;background:#fff;border-radius:16px}.stat .small{font-size:11px;font-weight:800;color:#85988b}.stat .number{font-size:34px;font-weight:900;margin-top:8px}.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.person{border:1px solid #e0ebe2;background:#fff;border-radius:14px;padding:17px}.person strong{display:block;margin-bottom:6px}.person small{color:#829488}.status-pill{display:inline-block;padding:7px 9px;border-radius:10px;background:#e7f3e9;color:#347354;font-size:11px;font-weight:850;margin-top:10px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 15px}.full{grid-column:1/-1}.form-grid .primary-btn{margin-top:16px}.filter-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.filter-bar label{flex:1;min-width:135px;margin:0}.filter-bar button{margin-bottom:1px}.table-wrap{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:12px}.data-table th{text-align:left;color:#738878;font-size:11px;letter-spacing:.2px}.data-table td,.data-table th{padding:13px 10px;border-bottom:1px solid #e4ede6}.data-table tr:last-child td{border-bottom:0}.data-table th{white-space:nowrap}.badge-time{font-variant-numeric:tabular-nums;font-weight:850}.secondary-btn{background:#edf4ee;color:#246447;border:0;border-radius:9px;padding:10px 12px;font-weight:800;font-size:12px}.danger-btn{background:#fff2ed;color:#a04430;border:1px solid #f1d4ca;border-radius:8px;font-size:11px;padding:9px;font-weight:850}.separator{border:0;border-top:1px solid #e6eee7;margin:24px 0}.info{background:#eef6f0;border-radius:12px;color:#5c7867;padding:13px;font-size:12px;line-height:1.5}.warning{background:#fff6e7;color:#84652b;padding:14px;border-radius:12px;line-height:1.55;font-size:12px}.guide-item{display:flex;gap:15px;border-bottom:1px solid #e8f0eb;padding:18px 0}.guide-index{height:42px;width:42px;flex-shrink:0;display:grid;place-items:center;background:#e9f5eb;color:#277553;border-radius:11px;font-weight:900}.guide-item b{display:block;margin:0 0 5px}.guide-item p{margin:0}.invitation{padding:16px;background:#f0f6f1;border:1px solid #dce7de;border-radius:11px;overflow-wrap:anywhere;font-size:12px;margin:14px 0}.invitation code{display:block;margin:8px 0;color:#256947;font-weight:800}.day{padding:16px;border:1px solid #e4eee5;border-radius:13px;margin:10px 0;background:white}.day-head{display:flex;justify-content:space-between;gap:8px;align-items:center}.day-head strong{font-size:13px}.day-head span{font-weight:900;color:#25714f;font-variant-numeric:tabular-nums}textarea{resize:vertical}footer{font-size:11px;color:#93a39a;text-align:center;margin-top:auto;padding:24px 14px 29px}
@media(max-width:700px){.main{margin:18px auto 40px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.people,.form-grid{grid-template-columns:1fr}.actions{grid-template-columns:1fr}.navigation{gap:7px}.nav-item{padding:12px 12px}.main-heading h1{font-size:28px}.header{padding:12px 16px}.account{max-width:46%;justify-content:end}.account span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card{padding:17px}.hero-card{padding:20px}.timer{font-size:52px}.auth-panel{margin:8px auto}.filter-bar label{flex-basis:43%}}

/* Ajustes de recordatorios: controles de fácil lectura en teléfono y PC. */
.reminder-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-top:12px}
.reminder-days label{display:flex;align-items:center;gap:7px;border:1px solid #dce8de;border-radius:10px;padding:10px 12px;background:#fff;cursor:pointer}
.reminder-days input{width:18px;height:18px;accent-color:#205c49}
#reminder-form input[type="checkbox"]{accent-color:#205c49}
#account-box{flex-wrap:wrap}
@media(max-width:450px){#account-box{gap:7px}#account-box button{padding:8px 10px}.reminder-days{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Avisos comprensibles sin interferir con las tarjetas ni los fichajes. */
.compliance-alert{border-left:4px solid #d39b4b;padding:13px 16px;margin:10px 0;background:#fffaf0;border-radius:8px}
.compliance-alert strong{display:block;font-weight:700;font-size:14px;color:#644614}
.compliance-alert p{margin:7px 0;line-height:1.5}
.compliance-alert-info{border-left-color:#63899b;background:#f4f8fa}
.compliance-alert-info strong{color:#315d70}

/* Incident explanation: only employee UI, touch-friendly and keyboard accessible. */
.incident-dialog{width:min(92vw,480px);max-height:88dvh;overflow:auto;border:1px solid #dce8de;border-radius:17px;padding:0;box-shadow:0 18px 60px #10291a66;color:#18392d}
.incident-dialog::backdrop{background:rgba(12,29,20,.64)}
.incident-form{display:grid;gap:13px;padding:24px}
.incident-form h2{font-size:22px;margin:0}
.incident-form p{margin:0;line-height:1.48}
.incident-form label{display:grid;gap:7px;font-weight:700}
.incident-form textarea{width:100%;min-height:112px;padding:12px;border:1px solid #9cb5a4;border-radius:9px;font-weight:400}
.incident-buttons{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.incident-buttons button{min-height:44px}
@media(max-width:450px){.incident-form{padding:19px}.incident-buttons button{flex:1}}

/* Consulta voluntaria de incidencias exclusivamente en la interfaz PC del administrador. */
.incident-overview-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0}
.incident-overview-stat{padding:16px;border:1px solid #dce8df;background:#f7faf7;border-radius:12px;display:flex;flex-direction:column;gap:7px}
.incident-overview-stat span{font-size:13px;color:#516659}
.incident-overview-stat strong{font-size:28px;color:#164f35;font-variant-numeric:tabular-nums}
.incident-detail{border:1px solid #e6dfcf;border-left:4px solid #c68c41;background:#fffdf8;border-radius:10px;margin:14px 0;padding:18px}
.incident-detail-answered{border-left-color:#28764b}
.incident-detail h3{font-size:16px;margin:12px 0 8px}
.incident-detail p{line-height:1.5;margin:8px 0}
.incident-answer{border-radius:9px;background:#eef6ef;padding:12px;margin-top:12px}
.incident-answer p{white-space:pre-wrap;overflow-wrap:anywhere}
.incident-pending{font-weight:700;color:#895b19;margin-top:14px}
@media(max-width:450px){.incident-overview-totals{gap:8px}.incident-overview-stat{padding:12px}.incident-overview-stat strong{font-size:24px}}

/* Los avisos informativos no deben confundirse visualmente con errores de fichaje. */
.incident-detail-info{background:#f4f8fb;border-color:#d9e7ef;border-left-color:#6693ad}
.incident-detail-info h3{color:#315d70}

/* Bloque 1 — Opción 2, panel muy gráfico del TRABAJADOR.
   Todo limitado a .employee-mode: sin modificar la administración ni el acceso. */
body.employee-mode{--emp-green:#08b763;--emp-dark:#12233b;--emp-muted:#60768e;--emp-border:#e4ebf0;--emp-pale:#e9fbef;background:#f9fcfb;color:var(--emp-dark)}
body.employee-mode .main{max-width:660px}
body.employee-mode .header{border-bottom-color:#e9eef0}
body.employee-mode .symbol{background:var(--emp-green)}
body.employee-mode .main-heading{margin-bottom:12px}
body.employee-mode .main-heading h1{color:var(--emp-dark);font-weight:850;letter-spacing:-1px}
body.employee-mode .eyebrow{color:#678577}
body.employee-mode .nav-item.active{background:var(--emp-green);border-color:var(--emp-green);color:white}
body.employee-mode .nav-item{border-radius:12px}
body.employee-mode .card{border-color:var(--emp-border);box-shadow:0 5px 21px #16263d07}
body.employee-mode .card h2{color:var(--emp-dark);font-weight:820}
body.employee-mode .primary-btn{background:var(--emp-green);color:white}
body.employee-mode .primary-btn:hover{background:#059c53}
body.employee-mode .secondary-btn{background:#eaf9ef;color:#087847}
body.employee-mode .emp-clock-hero{background:linear-gradient(135deg,#e9fff2,#e5f8f0);border:1px solid #d5f4e2;box-shadow:none;padding:21px 16px 16px;border-radius:20px}
body.employee-mode .emp-clock-status{display:table;margin:0 auto;background:#bdf5d4;border-radius:99px;padding:10px 21px;font-size:17px;font-weight:850;color:#064b32}
body.employee-mode .emp-status-dot{display:inline-block;background:#009b52;box-shadow:0 0 0 5px #8be5b6;width:10px;height:10px;border-radius:50%;margin:0 13px 1px 0}
body.employee-mode .emp-clock-hero .timer{color:#101d33;font-size:clamp(44px,9vw,68px);margin:15px 0 0;letter-spacing:-2.5px}
body.employee-mode .emp-clock-hero p{font-size:12px;margin:8px 0 0;color:#44735a}
body.employee-mode .emp-timer-labels{display:grid;grid-template-columns:repeat(3,1fr);width:min(310px,86%);margin:0 auto;font-size:9px;letter-spacing:.6px;color:#567386;font-weight:750}
body.employee-mode .emp-punch-actions{display:grid;grid-template-columns:1fr;gap:8px;margin:9px 0 14px}
body.employee-mode .emp-punch-actions button{min-height:54px;width:100%;border-radius:13px;font-size:18px;font-weight:850}
body.employee-mode .emp-punch-actions .secondary-btn{background:#edf1f5;color:#354a62;border:0}
body.employee-mode .emp-quick-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0 16px}
body.employee-mode .emp-quick-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:#f3f6f9;border:1px solid #eaf0f3;padding:10px 5px;border-radius:14px;min-width:0}
body.employee-mode .emp-stat-symbol{font-size:19px;line-height:1.2;color:#27815c;font-weight:850}
body.employee-mode .emp-quick-stat small{font-size:11px;color:#65809a}
body.employee-mode .emp-quick-stat strong{font-size:19px;letter-spacing:-.7px;font-variant-numeric:tabular-nums;color:#112138}
body.employee-mode .emp-alert-section{background:#fff9ec;border:1px solid #ffebc8}
body.employee-mode .emp-alert-section h2{color:#a24511;font-size:16px;margin:0 0 8px}
body.employee-mode .emp-alert-section .compliance-alert{background:#fff6e6;box-shadow:none;border:0;margin:0;padding:10px 2px}
body.employee-mode .emp-alert-section .compliance-alert-info{background:#eef6ff}
body.employee-mode .emp-alert-section .compliance-alert strong{font-size:13px;color:#914c1a}
body.employee-mode .emp-alert-section .compliance-alert p{font-size:12px;margin:5px 0}
body.employee-mode .emp-alert-section .secondary-btn{width:100%;background:#ffe3ba;color:#954719;padding:11px}
body.employee-mode .emp-alert-section .muted{color:#8c775d}
body.employee-mode .emp-movement-section{padding-bottom:10px}
body.employee-mode .emp-movement-section h2{font-size:16px;margin-bottom:5px}
body.employee-mode .emp-movement{min-height:49px;gap:12px;padding:9px 3px}
body.employee-mode .emp-movement time{font-size:13px;color:#3c526a;min-width:48px}
body.employee-mode .emp-movement strong{font-size:13px}
body.employee-mode .emp-movement-icon{display:grid;place-items:center;flex:0 0 29px;height:29px;border-radius:50%;background:#03ae60;color:white;font-weight:900;font-size:14px}
body.employee-mode .emp-movement-pause{background:#ffb320;color:#653f00}
body.employee-mode .emp-movement-finish{background:#f65c60}
body.employee-mode .emp-week-card h2{margin-bottom:14px}
body.employee-mode .emp-week-progress{display:flex;justify-content:space-between;gap:12px}
body.employee-mode .emp-week-progress div{display:flex;flex-direction:column;gap:5px}
body.employee-mode .emp-week-progress div:last-child{text-align:right}
body.employee-mode .emp-week-progress small{color:var(--emp-muted);font-size:11px}
body.employee-mode .emp-week-progress strong{color:#14243a;font-size:24px;font-variant-numeric:tabular-nums}
body.employee-mode .emp-week-track{margin:15px 0;height:11px;border-radius:99px;background:#e4ebed;overflow:hidden}
body.employee-mode .emp-week-track span{display:block;background:var(--emp-green);height:100%;border-radius:99px}
body.employee-mode .emp-time-hint{font-size:11px;color:#7890a5;line-height:1.5;padding:0 8px}
body.employee-mode #filter-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
body.employee-mode #filter-form label{min-width:0}
body.employee-mode #filter-form input{border:1px solid #dbe5ea;color:var(--emp-dark)}
body.employee-mode #filter-form>button,body.employee-mode .emp-export-buttons{grid-column:1/-1}
body.employee-mode #filter-form .primary-btn{width:100%;min-height:47px}
body.employee-mode .emp-export-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}
body.employee-mode .emp-export-buttons button{min-height:43px;font-size:14px}
body.employee-mode .emp-period-total{display:flex;align-items:center;gap:16px;padding:20px;background:linear-gradient(125deg,#defbea,#effff5);border-color:#d6f4e1}
body.employee-mode .emp-period-total>div{display:flex;flex-direction:column;gap:2px}
body.employee-mode .emp-period-total span{font-size:13px;font-weight:800;color:#147746}
body.employee-mode .emp-period-total strong{font-size:40px;color:#12233b;font-variant-numeric:tabular-nums;letter-spacing:-2px;line-height:1.1}
body.employee-mode .emp-period-total small{font-size:10px;color:#597a67}
body.employee-mode .emp-chart-symbol{font-size:31px;background:#c0f3d8;padding:12px;border-radius:13px}
body.employee-mode .emp-history-days{margin:18px 0}
body.employee-mode .emp-history-days h2{font-size:17px;margin:12px 0}
body.employee-mode .emp-day-card{margin:9px 0;background:#fff;border:1px solid #e4ebf0;border-radius:13px;box-shadow:0 4px 16px #172b4006}
body.employee-mode .emp-day-card summary{display:block;list-style:none;cursor:pointer;padding:13px 14px;position:relative}
body.employee-mode .emp-day-card summary::-webkit-details-marker{display:none}
body.employee-mode .emp-day-card summary:focus-visible{outline:3px solid #22bc74}
body.employee-mode .emp-day-card summary:after{content:'›';font-size:23px;color:#7790a6;position:absolute;right:12px;top:32px}
body.employee-mode .emp-day-top{display:flex;align-items:center;justify-content:space-between;padding-right:20px;gap:8px}
body.employee-mode .emp-day-top strong{font-size:13px;color:#11243d}
body.employee-mode .emp-day-top b{font-size:19px;font-variant-numeric:tabular-nums}
body.employee-mode .emp-day-track{height:10px;background:#f6bc45;border-radius:99px;margin:12px 23px 7px 0;overflow:hidden}
body.employee-mode .emp-day-track span{display:block;height:100%;background:var(--emp-green);border-radius:99px}
body.employee-mode .emp-day-card summary small{color:#677e94;font-size:11px}
body.employee-mode .emp-day-detail{padding:2px 14px 12px;border-top:1px solid #eef1f3}
body.employee-mode .emp-day-event{display:flex;justify-content:space-between;gap:15px;padding:9px 0;font-size:12px;color:#53677c;border-bottom:1px solid #edf2f1}
body.employee-mode .emp-day-event strong{color:#182d40}
body.employee-mode .emp-history-notes h2{font-size:17px}
body.employee-mode .emp-note-card{display:flex;gap:12px;border:1px solid #edf0f3;background:#fff;padding:12px;border-radius:12px;margin:9px 0;overflow-wrap:anywhere}
body.employee-mode .emp-note-symbol{display:grid;place-items:center;background:#e9f6fc;color:#187ca3;border-radius:10px;width:36px;height:36px;flex:0 0 36px;font-size:20px}
body.employee-mode .emp-note-card strong{font-size:12px}
body.employee-mode .emp-note-card p{margin:4px 0;color:#526982;font-size:12px}
body.employee-mode .emp-note-card small{color:#8b9ba8;font-size:10px}
body.employee-mode .emp-history-details summary{font-size:13px;color:#227b4e;font-weight:800;cursor:pointer}
body.employee-mode .emp-history-details h3{font-size:15px;margin:18px 0 10px}
body.employee-mode .emp-history-alerts{margin-top:16px}
body.employee-mode .emp-guide-intro{font-size:13px;color:#607992;line-height:1.5;margin:4px 0 14px}
body.employee-mode .emp-guide-step{display:grid;grid-template-columns:36px 1fr 52px;align-items:center;gap:12px;margin:10px 0;padding:15px 13px;background:white;border:1px solid #e5ebf0;border-radius:16px}
body.employee-mode .emp-guide-number{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:18px;font-weight:900;color:white}
body.employee-mode .emp-guide-text strong{font-size:14px;display:block;line-height:1.25}
body.employee-mode .emp-guide-text p{font-size:12px;color:#617990;line-height:1.45;margin:5px 0 0}
body.employee-mode .emp-guide-icon{display:grid;place-items:center;width:50px;height:50px;border-radius:17px;font-size:27px;font-weight:800}
body.employee-mode .emp-guide-number.emp-accent-green{background:#06b75f}
body.employee-mode .emp-guide-number.emp-accent-orange{background:#f5aa17}
body.employee-mode .emp-guide-number.emp-accent-red{background:#f3575e}
body.employee-mode .emp-guide-number.emp-accent-blue{background:#228bf1}
body.employee-mode .emp-guide-icon.emp-accent-green{background:#ddfaeb;color:#07a95a}
body.employee-mode .emp-guide-icon.emp-accent-orange{background:#fff0d4;color:#eaa000}
body.employee-mode .emp-guide-icon.emp-accent-red{background:#ffe4e6;color:#e44953}
body.employee-mode .emp-guide-icon.emp-accent-blue{background:#e2f0ff;color:#188ce9}
body.employee-mode .emp-connection-note{display:flex;gap:12px;align-items:flex-start;margin:18px 0;background:#e5f4ff;color:#2460a0;padding:15px;border-radius:13px}
body.employee-mode .emp-connection-note>span{font-size:23px}
body.employee-mode .emp-connection-note strong{font-size:14px}
body.employee-mode .emp-connection-note p{margin:5px 0 0;font-size:12px;line-height:1.5;color:#426d95}
body.employee-mode .emp-settings-menu{display:grid;gap:12px}
body.employee-mode .emp-settings-item{display:flex;align-items:center;text-align:left;gap:14px;background:white;width:100%;min-height:82px;padding:13px;border:1px solid #e5ebf0;border-radius:15px}
body.employee-mode .emp-settings-item>span:nth-child(2){display:flex;flex-direction:column;flex:1;gap:6px}
body.employee-mode .emp-settings-item strong{font-size:14px;color:#172a44}
body.employee-mode .emp-settings-item small{font-size:11px;color:#71849c;line-height:1.3}
body.employee-mode .emp-settings-item b{font-size:24px;font-weight:500;color:#71849c}
body.employee-mode .emp-settings-icon{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:13px;font-size:28px;font-weight:800}
body.employee-mode .emp-settings-green{background:#e0fae9;color:#03ae5f}
body.employee-mode .emp-settings-blue{background:#e1efff;color:#1989df}
body.employee-mode .emp-settings-orange{background:#fff0d4;color:#f0a514}
body.employee-mode .emp-settings-red{background:#ffe6e9;color:#f14752}
body.employee-mode .emp-settings-logout{background:#fff4f5;border-color:#ffe1e4}
body.employee-mode .emp-settings-logout strong,body.employee-mode .emp-settings-logout b{color:#d6323f}
body.employee-mode .emp-settings-detail{scroll-margin-top:22px;margin-top:24px}
body.employee-mode .emp-settings-detail label{color:#3a536a}
body.employee-mode .emp-settings-detail input[type="time"],body.employee-mode .emp-settings-detail input[type="password"]{width:100%;padding:12px;border:1px solid #cedee3;border-radius:11px;min-height:45px;margin-top:8px}
body.employee-mode .emp-notification-buttons{display:grid;gap:9px}
body.employee-mode .emp-notification-buttons button{min-height:44px}
body.employee-mode #emp-password{scroll-margin-top:22px}
@media(max-width:850px){
  body.employee-mode .main{width:calc(100% - 26px);margin:17px auto 96px}
  body.employee-mode .header{padding:12px 16px;min-height:67px}
  body.employee-mode .identity strong{font-size:15px}
  body.employee-mode .identity small{font-size:10px}
  body.employee-mode #account-label,body.employee-mode #logout-btn{display:none}
  body.employee-mode #account-box{gap:0}
  body.employee-mode #settings-btn{font-size:0;width:42px;height:42px;border-radius:50%;background:#e8f4f9;padding:0;color:#506c82}
  body.employee-mode #settings-btn:before{content:'⚙';font-size:23px}
  body.employee-mode .main-heading h1{font-size:27px}
  body.employee-mode .main-heading .tag{font-size:10px;padding:8px}
  body.employee-mode .navigation{position:fixed;bottom:0;left:0;right:0;z-index:20;margin:0;padding:8px max(10px,env(safe-area-inset-right)) calc(9px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));display:flex;justify-content:space-around;gap:4px;background:white;border-top:1px solid #e5ebf1;border-bottom:0;box-shadow:0 -5px 22px #142f3b11;overflow:visible}
  body.employee-mode .nav-item{flex:1;min-width:0;border:none!important;background:white!important;color:#718399!important;padding:10px 2px 8px;font-size:11px;min-height:45px;white-space:normal}
  body.employee-mode .nav-item[data-tab="fichar"]:before{content:'◷'}
  body.employee-mode .nav-item[data-tab="historial"]:before{content:'▦'}
  body.employee-mode .nav-item[data-tab="guia"]:before{content:'▤'}
  body.employee-mode .nav-item:before{display:block;margin:0 auto 5px;font-size:23px;line-height:1.1;font-weight:800}
  body.employee-mode .nav-item.active{color:#079e56!important;border-bottom:3px solid #08b763!important;border-radius:0}
  body.employee-mode #messages:not([hidden]){position:fixed;left:13px;right:13px;bottom:calc(77px + env(safe-area-inset-bottom));z-index:30;box-shadow:0 9px 36px #1238;max-height:34dvh;overflow:auto}
  body.employee-mode .card{padding:17px;margin:13px 0}
  body.employee-mode .emp-quick-stats{gap:7px}
  body.employee-mode .emp-quick-stat strong{font-size:18px}
  body.employee-mode footer{display:none}
}
@media(max-width:370px){
  body.employee-mode .emp-guide-step{grid-template-columns:30px 1fr 40px;gap:8px;padding:12px 9px}
  body.employee-mode .emp-guide-icon{width:40px;height:40px;font-size:22px}
  body.employee-mode .emp-guide-number{width:30px;height:30px}
  body.employee-mode .emp-settings-item{padding:10px;gap:9px}
  body.employee-mode .emp-settings-icon{width:44px;height:44px;flex-basis:44px}
}

/* Acceso compartido móvil/PC — línea visual Opción 2 (solo pantallas públicas). */
body.auth-mode{background:linear-gradient(160deg,#f1fff6 0%,#f8fcfa 44%,#f4f8fc 100%);color:#14263e}
body.auth-mode .header{border-bottom:1px solid #e4f1e9;background:#ffffffdd}
body.auth-mode .symbol{background:#09b461;box-shadow:0 5px 15px #05b66022}
body.auth-mode .main{width:min(100% - 30px,1080px);display:flex;flex-direction:column;align-items:center;justify-content:center;margin:20px auto 28px}
body.auth-mode footer{color:#81969e}
body.auth-mode .login-panel{width:min(100%,470px);max-width:470px;margin:16px auto;background:#fff;border:1px solid #e0eee7;border-radius:24px;box-shadow:0 22px 64px #143b2d13;padding:clamp(24px,5vw,44px);text-align:left}
body.auth-mode .login-symbol{width:68px;height:68px;border-radius:20px;display:grid;place-items:center;background:#e1faeb;color:#06ae61;margin-bottom:19px}
body.auth-mode .login-eyebrow{color:#058d50;font-weight:850;letter-spacing:1.5px;font-size:11px}
body.auth-mode .login-panel h1{font-size:clamp(30px,5vw,36px);line-height:1.1;letter-spacing:-1.3px;color:#12233c;margin:9px 0 9px;font-weight:900}
body.auth-mode .login-panel .login-description{font-size:14px;color:#678096;line-height:1.5;margin:0 0 23px}
body.auth-mode .login-label{display:block;margin:17px 0 8px;font-size:13px;font-weight:800;color:#223a4d}
body.auth-mode .login-input-row{display:flex;align-items:center;gap:11px;border:1px solid #d8e4e6;background:#f9fbfd;border-radius:13px;min-height:54px;padding:0 14px;transition:border-color .18s,box-shadow .18s}
body.auth-mode .login-input-row:focus-within{border-color:#0ab968;box-shadow:0 0 0 3px #0ab96822;background:#fff}
body.auth-mode .login-input-row>svg{flex:0 0 21px;color:#658299}
body.auth-mode .login-input-row input{display:block;flex:1;min-width:0;width:100%;min-height:51px;margin:0;padding:11px 0;background:transparent;border:0;border-radius:0;color:#152a3d;font-size:16px;outline:none}
body.auth-mode .login-input-row input:focus-visible{outline:none}
body.auth-mode .login-input-row input::placeholder{color:#93a4b2;opacity:1}
body.auth-mode .login-password-toggle{background:transparent;border:0;border-radius:8px;color:#167d56;font-size:13px;font-weight:750;min-height:38px;padding:5px 8px}
body.auth-mode .login-password-toggle:hover{background:#e5f8ee}
body.auth-mode .login-submit{width:100%;min-height:54px;margin-top:25px;border-radius:13px;background:#08b765;color:white;font-size:16px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:11px;box-shadow:0 10px 22px #09ba6c25}
body.auth-mode .login-submit:hover{background:#039b54}
body.auth-mode .login-submit span{font-size:23px;line-height:1}
body.auth-mode .login-separator{height:1px;background:#e7efed;margin:24px 0 15px}
body.auth-mode .login-help{font-size:12px;line-height:1.5;color:#778d9d;text-align:center;margin:0}
body.auth-mode .login-setup-link{display:block;margin:7px auto 0;color:#778d9d;font-size:11px;text-decoration:none;text-align:center;padding:7px}
body.auth-mode .login-setup-link:hover{text-decoration:underline;color:#0c8c56}
body.auth-mode .login-company-choice{background:#f0fff6;border:1px solid #c9f0da;border-radius:12px;padding:14px;margin:18px 0 0}
body.auth-mode .login-company-choice strong{font-size:13px;color:#126943}
body.auth-mode .login-company-choice p{font-size:12px;color:#527a65;margin:5px 0 10px}
body.auth-mode .login-company-choice label{display:block;font-size:12px;color:#25473b;font-weight:800}
body.auth-mode .login-company-choice select{width:100%;font-size:15px;background:white;color:#183d31;border:1px solid #c2dfce;border-radius:9px;padding:12px;min-height:47px;margin-top:7px}
body.auth-mode .message{width:min(100%,470px);margin:8px auto 0}
@media(max-width:600px){
  body.auth-mode .header{padding:12px 17px;min-height:67px}
  body.auth-mode .main{width:calc(100% - 28px);justify-content:flex-start;margin:14px auto 20px}
  body.auth-mode .login-panel{padding:25px 22px;border-radius:20px;box-shadow:0 13px 37px #143b2d11;margin:10px auto}
  body.auth-mode .login-symbol{width:61px;height:61px;border-radius:17px}
  body.auth-mode .login-panel h1{font-size:31px}
  body.auth-mode footer{font-size:10px;padding:14px 20px 22px}
}
@media(max-width:355px){
  body.auth-mode .login-panel{padding:22px 16px}
}

/* Diseño «Panel muy gráfico», ADMIN PC. Aislado por .admin-mode:
   no altera el móvil de trabajadores ni el acceso compartido. */
body.admin-mode{--adm-deep:#0b4e3d;--adm-green:#10835e;--adm-ink:#182439;--adm-gray:#6c7d93;--adm-line:#e6edf0;--adm-soft:#f5f9fb;background:#f5f8fa;color:var(--adm-ink)}
body.admin-mode .layout{display:block;min-height:100dvh}
body.admin-mode .header{position:fixed;z-index:30;top:0;bottom:0;left:0;width:238px;min-height:100dvh;display:block;padding:26px 17px 20px;border:0;background:linear-gradient(160deg,#064738 0%,#0a5140 42%,#073b30 100%);color:#fff;box-shadow:4px 0 25px #18342b14}
body.admin-mode .header .identity{display:flex;align-items:center;gap:11px}
body.admin-mode .header .identity .symbol{border-radius:14px;width:51px;height:51px;flex:0 0 51px;background:#277d5b;color:#c0f4cc;font-size:30px;box-shadow:0 4px 15px #001a1029}
body.admin-mode .header .identity strong{font-size:20px;line-height:1.15;letter-spacing:-.65px;color:white}
body.admin-mode .header .identity small{color:#bee1d4;line-height:1.35;max-width:140px;margin-top:5px;font-size:12px;overflow-wrap:anywhere}
body.admin-mode .header .account{position:fixed;z-index:35;top:16px;right:32px;display:flex;gap:10px;align-items:center;max-width:40vw;color:#546b7b}
body.admin-mode .header #account-label{font-size:12px;color:#6c8295}
body.admin-mode .header .account button{background:#eef5f3;color:#195943;border:1px solid #dfece7;padding:10px 13px;border-radius:11px;font-weight:750}
body.admin-mode .header .account button:hover{background:#dbefe7}
body.admin-mode .main{width:auto;max-width:none;margin:22px 31px 65px 266px;padding:0;min-width:0}
body.admin-mode #main-screen{max-width:1740px;margin:0 auto}
body.admin-mode .main-heading{min-height:84px;margin:0 0 18px;align-items:center;gap:14px;padding-right:235px}
body.admin-mode .main-heading>div:first-child{display:flex;flex-direction:column;min-width:0}
body.admin-mode .main-heading h1{order:0;font-size:clamp(29px,3.4vw,39px);line-height:1.13;letter-spacing:-1.5px;color:#111a29;font-weight:900;margin:0 0 2px}
body.admin-mode .main-heading .eyebrow{order:1;color:#6e8094;font-size:17px;font-weight:500;letter-spacing:0;line-height:1.4;overflow-wrap:anywhere}
body.admin-mode .main-heading .tag{background:transparent;color:#788a9c;border:0;font-size:12px;padding:8px 0}
body.admin-mode .navigation{position:fixed;top:127px;left:10px;width:218px;z-index:32;display:flex;flex-direction:column;gap:8px;padding:0;border:0;margin:0;background:transparent;overflow:visible}
body.admin-mode .nav-item{width:100%;min-height:54px;background:transparent;border:0;color:#d8ede6;border-radius:12px;padding:12px 17px;display:flex;align-items:center;gap:16px;font-size:15px;text-align:left;white-space:normal;font-weight:650;transition:background .15s ease}
body.admin-mode .nav-item:hover{background:#ffffff1d}
body.admin-mode .nav-item.active{background:linear-gradient(90deg,#277f61,#246d57);border:0;color:#fff;font-weight:850;box-shadow:0 4px 12px #002b181a}
body.admin-mode .admin-nav-icon{display:grid;place-items:center;width:26px;height:27px;flex:0 0 26px;font-size:25px;font-weight:600}
body.admin-mode .card{border:1px solid #ebeff3;border-radius:17px;box-shadow:0 7px 28px #163d5208;background:#fff;padding:22px;margin:0}
body.admin-mode .admin-dashboard{display:grid;gap:16px}
body.admin-mode .admin-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
body.admin-mode .admin-kpi{display:flex;position:relative;align-items:flex-start;gap:15px;min-height:143px;overflow:hidden;border-radius:16px;background:white;border:1px solid #eaf0f3;box-shadow:0 7px 26px #163d5208;padding:21px 18px}
body.admin-mode .admin-kpi-circle{display:grid;place-items:center;border-radius:50%;flex:0 0 58px;width:58px;height:58px;font-size:29px;font-weight:900}
body.admin-mode .admin-kpi-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:6px;min-width:0}
body.admin-mode .admin-kpi-copy>span{font-size:14px;color:#1c2a39;font-weight:780}
body.admin-mode .admin-kpi-copy strong{font-size:clamp(27px,3vw,35px);color:#0e1520;line-height:1.05;font-weight:900;letter-spacing:-.9px;font-variant-numeric:tabular-nums}
body.admin-mode .admin-kpi-copy small{color:#8391a4;line-height:1.3;font-size:12px}
body.admin-mode .admin-kpi-bars{position:absolute;right:14px;bottom:21px;display:flex;gap:5px;align-items:flex-end;height:48px;opacity:.58}
body.admin-mode .admin-kpi-bars i{display:block;width:12px;border-radius:7px 7px 4px 4px;background:currentColor}
body.admin-mode .admin-kpi-bars i:nth-child(1){height:18px;opacity:.35}
body.admin-mode .admin-kpi-bars i:nth-child(2){height:31px;opacity:.57}
body.admin-mode .admin-kpi-bars i:nth-child(3){height:46px;opacity:.9}
body.admin-mode .admin-tone-green{color:#49c579}
body.admin-mode .admin-tone-green .admin-kpi-circle{color:#08793e;background:#dff8e9}
body.admin-mode .admin-tone-orange{color:#f5bd6d}
body.admin-mode .admin-tone-orange .admin-kpi-circle{color:#ed9a12;background:#ffeed4}
body.admin-mode .admin-tone-blue{color:#8bc4fa}
body.admin-mode .admin-tone-blue .admin-kpi-circle{color:#2683e5;background:#e0efff}
body.admin-mode .admin-tone-slate{color:#ccd5df}
body.admin-mode .admin-tone-slate .admin-kpi-circle{color:#475a70;background:#e8edf1}
body.admin-mode .admin-tone-red{color:#efa0ad}
body.admin-mode .admin-tone-red .admin-kpi-circle{color:#dd394a;background:#fde6e9}
body.admin-mode .admin-tone-purple{color:#c2aaee}
body.admin-mode .admin-tone-purple .admin-kpi-circle{color:#704be3;background:#eee7ff}
body.admin-mode .admin-overview-feature-grid{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,1fr);gap:16px}
body.admin-mode .admin-card-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px;min-width:0}
body.admin-mode .admin-card-heading h2{font-size:20px;font-weight:850;color:#172335;letter-spacing:-.6px;margin:0;display:flex;align-items:center;gap:11px}
body.admin-mode .admin-heading-icon{font-size:23px;font-weight:850;line-height:1;color:#0f8b56;display:inline-flex;align-items:center;justify-content:center;width:26px;height:28px}
body.admin-mode .admin-heading-red{color:#e24353}
body.admin-mode .admin-text-link{border:0;background:none;color:#17825a;text-decoration:none;white-space:nowrap;font-size:13px;font-weight:750;padding:7px 3px}
body.admin-mode .admin-text-link:hover{text-decoration:underline;color:#0a6748}
body.admin-mode .admin-hours-list{display:flex;flex-direction:column}
body.admin-mode .admin-hours-person{min-height:61px;display:grid;grid-template-columns:40px minmax(0,1fr) auto 80px;gap:12px;align-items:center;padding:9px 4px;border-bottom:1px solid #edf0f4}
body.admin-mode .admin-hours-person:last-child{border-bottom:0}
body.admin-mode .admin-avatar{border-radius:50%;width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;background:#def3e7;color:#14664d;border:1px solid #cce9d9;font-size:13px;font-weight:850;letter-spacing:.3px}
body.admin-mode .admin-hours-name{min-width:0}
body.admin-mode .admin-hours-name strong{font-size:13px;color:#1a2638;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.admin-mode .admin-hours-name small{display:block;margin-top:4px;color:#8190a1;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.admin-mode .admin-hours{font-size:17px;color:#172338;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-.35px}
body.admin-mode .admin-stage-badge{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:800;white-space:nowrap}
body.admin-mode .admin-stage-badge:before{content:'';width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:currentColor}
body.admin-mode .admin-stage-working{background:#e3f8e9;color:#168345}
body.admin-mode .admin-stage-paused{background:#fff0de;color:#d98514}
body.admin-mode .admin-stage-finished{background:#e5f0ff;color:#2477cb}
body.admin-mode .admin-stage-notStarted{background:#edf0f3;color:#647282}
body.admin-mode .admin-stage-pending{background:#fff0de;color:#d98514}
body.admin-mode .admin-stage-disabled{background:#ffe9ec;color:#ce4255}
body.admin-mode .admin-incidents-mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}
body.admin-mode .admin-mini-stat{min-height:166px;display:flex;flex-direction:column;gap:10px;justify-content:center;align-items:flex-start;border-radius:13px;padding:15px 12px}
body.admin-mode .admin-mini-icon{display:grid;place-items:center;font-size:19px;font-weight:900;width:43px;height:43px;border-radius:50%}
body.admin-mode .admin-mini-stat strong{font-size:32px;color:#151e2b;letter-spacing:-.7px;line-height:1.1;font-weight:900}
body.admin-mode .admin-mini-stat small{font-size:12px;color:#5a6c80;line-height:1.4}
body.admin-mode .admin-mini-red{background:#fff5f6}
body.admin-mode .admin-mini-red .admin-mini-icon{background:#fbdde2;color:#dd394b}
body.admin-mode .admin-mini-orange{background:#fffaf1}
body.admin-mode .admin-mini-orange .admin-mini-icon{background:#ffeed4;color:#ee9d19}
body.admin-mode .admin-mini-blue{background:#f1f7ff}
body.admin-mode .admin-mini-blue .admin-mini-icon{background:#dcecff;color:#2d7edb}
body.admin-mode .admin-wide-link{display:flex;align-items:center;justify-content:center;gap:14px;position:relative;width:100%;min-height:50px;background:#0b6047;border:none;color:#fff;border-radius:10px;font-size:14px;font-weight:820;cursor:pointer}
body.admin-mode .admin-wide-link span{position:absolute;right:19px;font-size:22px}
body.admin-mode .admin-wide-link:hover{background:#084d3d}
body.admin-mode .admin-people-card{scroll-margin-top:23px}
body.admin-mode .admin-card-heading-responsive{align-items:center}
body.admin-mode .admin-list-controls{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
body.admin-mode .admin-search-box,body.admin-mode .admin-select-box{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #dfe7ec;border-radius:10px;height:43px;padding:0 12px}
body.admin-mode .admin-search-box>span{font-size:25px;line-height:1;color:#78909d}
body.admin-mode .admin-search-box input{background:transparent;border:0;padding:0;outline:none;width:185px;font-size:12px;color:#2b4359;min-width:0}
body.admin-mode .admin-search-box input:focus-visible{outline:2px solid #23aa77;outline-offset:5px}
body.admin-mode .admin-search-box input::placeholder{color:#91a1ad}
body.admin-mode .admin-select-box select{background:transparent;border:0;outline:none;font-weight:650;color:#53677a;font-size:12px;min-width:127px;cursor:pointer}
body.admin-mode .admin-select-box select:focus-visible{outline:2px solid #23aa77;outline-offset:5px}
body.admin-mode .table-wrap{overflow-x:auto}
body.admin-mode .admin-data-table{width:100%;border-collapse:collapse;font-size:12px}
body.admin-mode .admin-data-table thead{background:#f0f4f7}
body.admin-mode .admin-data-table th{color:#637587;letter-spacing:0;font-size:11px;font-weight:850;padding:12px 11px;white-space:nowrap}
body.admin-mode .admin-data-table td{color:#516579;padding:12px 11px;vertical-align:middle;border-color:#e8edf1}
body.admin-mode .admin-data-table tbody tr:hover{background:#f8fcfa}
body.admin-mode .admin-employee-name{display:inline-flex;align-items:center;gap:10px;min-width:0}
body.admin-mode .admin-employee-name strong{color:#1e2a3b;font-size:12px;white-space:nowrap}
body.admin-mode .admin-data-table .admin-avatar{width:32px;height:32px;flex-basis:32px;font-size:11px}
body.admin-mode .admin-icon-action{border:1px solid #e0ebe6;background:#f3faf5;color:#156849;font-size:21px;line-height:1;width:37px;height:34px;border-radius:8px;font-weight:700}
body.admin-mode .admin-icon-action:hover{background:#dff1e7}
body.admin-mode .admin-empty{font-size:13px;color:#7b8c9d;padding:16px 0;margin:0}
body.admin-mode .admin-data-warning{background:#fff2df;color:#956126;border-radius:9px;padding:12px;margin:10px 0;font-size:12px;line-height:1.5}
body.admin-mode .admin-disclaimer{font-size:11px;color:#83909d;line-height:1.5;margin:16px 0 0}
body.admin-mode .admin-filter-card{padding:20px}
body.admin-mode .admin-filter-card .filter-bar{display:grid;grid-template-columns:minmax(200px,1.25fr) repeat(2,minmax(125px,1fr)) minmax(130px,.8fr);gap:15px;align-items:end}
body.admin-mode .admin-filter-card label{margin:0;font-size:13px;color:#31465b;font-weight:700}
body.admin-mode .admin-filter-card select,body.admin-mode .admin-filter-card input{background:#fff;border:1px solid #dfe7ee;border-radius:10px;padding:12px;min-height:49px;font-size:13px;color:#445870}
body.admin-mode .admin-filter-card button{min-height:49px;width:100%;background:#0b6047;border-radius:10px}
body.admin-mode .admin-records #history-results{margin-top:0}
body.admin-mode .admin-records-card .admin-card-heading{margin-bottom:15px}
body.admin-mode .admin-record-export{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
body.admin-mode .admin-record-export .secondary-btn{border:1px solid #bbe3cb;color:#15754c;background:#fff;font-size:12px;padding:11px 16px;min-height:42px;border-radius:9px}
body.admin-mode .admin-record-export .secondary-btn:hover{background:#eaf9ef}
body.admin-mode .admin-records-card .admin-data-table{min-width:860px}
body.admin-mode .admin-report-view{display:grid;gap:16px}
body.admin-mode .admin-records-card .admin-data-table td{white-space:nowrap}
body.admin-mode .admin-notes-preview .admin-preview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
body.admin-mode .admin-note-preview{display:flex;flex-direction:column;align-items:flex-start;gap:6px;border-radius:13px;padding:15px;background:#f4f9fc;border:1px solid #eaf0f5;overflow-wrap:anywhere}
body.admin-mode .admin-note-preview:nth-child(4n+1){background:#fff5f7}
body.admin-mode .admin-note-preview:nth-child(4n+2){background:#fff8ec}
body.admin-mode .admin-note-preview:nth-child(4n+3){background:#eff6ff}
body.admin-mode .admin-note-icon{display:grid;place-items:center;width:36px;height:36px;font-size:21px;background:#e4ecfb;color:#3277bc;border-radius:50%}
body.admin-mode .admin-note-preview small{font-size:10px;color:#718aa1}
body.admin-mode .admin-note-preview strong{font-size:13px;color:#1d3247}
body.admin-mode .admin-note-preview p{font-size:12px;line-height:1.45;color:#5b6f82;margin:0}
body.admin-mode .admin-report-details summary{cursor:pointer;font-size:14px;font-weight:850;color:#16764e;padding:5px 0}
body.admin-mode .admin-report-details summary:focus-visible{outline:3px solid #4bb18b}
body.admin-mode .admin-report-details h3{font-size:16px;color:#1f3449;margin:25px 0 12px}
body.admin-mode .admin-report-details .card{margin:12px 0;box-shadow:none}
body.admin-mode .admin-individual-export{display:flex;gap:15px;justify-content:space-between;align-items:center}
body.admin-mode .admin-individual-export strong{color:#29445b;font-size:13px}
body.admin-mode .admin-staff-feature-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:16px}
body.admin-mode .admin-staff-form .form-grid{gap:7px 14px}
body.admin-mode .admin-staff-form .form-grid label{font-size:12px;color:#35465b;font-weight:700;margin:8px 0 0}
body.admin-mode .admin-staff-form .form-grid input{background:#fff;border:1px solid #dee7ef;border-radius:9px;min-height:47px;color:#2c4559;margin-top:6px;font-size:13px;padding:12px}
body.admin-mode .admin-staff-form .primary-btn{background:#0b6047;border-radius:10px;min-height:49px;font-size:14px}
body.admin-mode .admin-description{font-size:12px;color:#8191a1;line-height:1.4;margin:5px 0 12px}
body.admin-mode .admin-invite-explainer{position:relative;overflow:hidden;background:linear-gradient(115deg,#fff,#eafbf1);padding:25px}
body.admin-mode .admin-invite-step{position:relative;z-index:1;display:flex;align-items:center;gap:14px;margin:23px 0;max-width:82%}
body.admin-mode .admin-invite-step>span{display:grid;place-items:center;flex:0 0 43px;width:43px;height:43px;background:#daf4e5;color:#0f8455;border-radius:50%;font-size:22px}
body.admin-mode .admin-invite-step strong{font-size:14px;color:#1d3447;display:block;margin-bottom:5px}
body.admin-mode .admin-invite-step small{color:#678398;font-size:12px;line-height:1.45;display:block}
body.admin-mode .admin-invite-art{position:absolute;bottom:15px;right:6px;font-size:125px;color:#bce8cf;opacity:.55;pointer-events:none}
body.admin-mode .admin-staff .admin-people-card .admin-data-table{min-width:740px}
body.admin-mode #admin-incidents-panel{background:#fff}
body.admin-mode .incident-overview-totals{grid-template-columns:repeat(3,minmax(0,1fr))}
body.admin-mode .incident-overview-stat{border-color:#e7edf2;background:#f5f9fc}
body.admin-mode .incident-overview-stat strong{color:#185b43}
body.admin-mode footer{margin-left:238px;font-size:10px;color:#9aa9b5}
@media(max-width:1350px){
  body.admin-mode .admin-kpi{padding:17px 13px;gap:11px}
  body.admin-mode .admin-kpi-circle{width:48px;height:48px;flex-basis:48px;font-size:26px}
  body.admin-mode .admin-kpi-copy strong{font-size:29px}
  body.admin-mode .admin-kpi-bars i{width:9px}
  body.admin-mode .admin-hours-person{grid-template-columns:35px minmax(0,1fr) auto 61px;gap:8px}
  body.admin-mode .admin-hours-person .admin-hours{font-size:15px}
  body.admin-mode .admin-stage-badge{padding:6px 8px;font-size:10px}
  body.admin-mode .admin-invite-step{max-width:95%}
}
@media(max-width:1080px){
  body.admin-mode .admin-overview-feature-grid,body.admin-mode .admin-staff-feature-grid{grid-template-columns:1fr}
  body.admin-mode .admin-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.admin-mode .admin-kpi-copy strong{font-size:33px}
  body.admin-mode .admin-notes-preview .admin-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.admin-mode .admin-invite-step{max-width:80%}
  body.admin-mode .admin-card-heading-responsive{align-items:flex-start;flex-direction:column}
  body.admin-mode .admin-filter-card .filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.admin-mode .admin-filter-card button{grid-column:1/-1}
}
@media(max-width:850px){
  body.admin-mode .header{position:relative;width:100%;min-height:72px;padding:12px 15px;display:flex;align-items:center;justify-content:space-between;background:#0b4e3d}
  body.admin-mode .header .identity .symbol{width:40px;height:40px;flex-basis:40px}
  body.admin-mode .header .identity strong{font-size:16px}
  body.admin-mode .header .identity small{font-size:10px}
  body.admin-mode .header .account{position:static;max-width:52%;gap:6px;color:white}
  body.admin-mode .header #account-label{display:none}
  body.admin-mode .header .account button{font-size:11px;padding:9px 8px}
  body.admin-mode .main{width:calc(100% - 28px);margin:20px auto 55px;max-width:none}
  body.admin-mode .main-heading{min-height:0;margin:0 0 16px;padding-right:0}
  body.admin-mode .navigation{position:static;width:100%;display:flex;flex-direction:row;gap:8px;overflow-x:auto;margin:0 0 16px}
  body.admin-mode .nav-item{width:auto;min-width:max-content;min-height:46px;gap:7px;background:white;color:#2c664f;border:1px solid #d6e7df;padding:10px 12px}
  body.admin-mode .nav-item:hover{background:#e5f5ed}
  body.admin-mode .nav-item.active{background:#21795b;color:white;border:1px solid #21795b}
  body.admin-mode .admin-nav-icon{font-size:20px;flex-basis:20px;width:20px;height:20px}
  body.admin-mode footer{margin-left:0}
}
@media(max-width:590px){
  body.admin-mode .main-heading h1{font-size:29px}
  body.admin-mode .main-heading .eyebrow{font-size:13px}
  body.admin-mode .main-heading .tag{display:none}
  body.admin-mode .card{padding:15px}
  body.admin-mode .admin-kpi-grid{gap:9px}
  body.admin-mode .admin-kpi{gap:9px;padding:12px;min-height:120px}
  body.admin-mode .admin-kpi-circle{width:40px;height:40px;flex-basis:40px;font-size:21px}
  body.admin-mode .admin-kpi-copy{gap:5px}
  body.admin-mode .admin-kpi-copy>span{font-size:12px}
  body.admin-mode .admin-kpi-copy strong{font-size:27px}
  body.admin-mode .admin-kpi-copy small{font-size:10px}
  body.admin-mode .admin-kpi-bars{display:none}
  body.admin-mode .admin-incidents-mini{gap:6px}
  body.admin-mode .admin-mini-stat{min-height:130px;padding:11px 8px}
  body.admin-mode .admin-mini-stat strong{font-size:24px}
  body.admin-mode .admin-mini-stat small{font-size:10px}
  body.admin-mode .admin-mini-icon{width:32px;height:32px;font-size:15px}
  body.admin-mode .admin-hours-person{grid-template-columns:32px minmax(0,1fr) auto;gap:8px}
  body.admin-mode .admin-hours-person .admin-stage-badge{display:none}
  body.admin-mode .admin-list-controls{width:100%}
  body.admin-mode .admin-search-box{flex:1;min-width:0}
  body.admin-mode .admin-search-box input{width:100%;font-size:13px}
  body.admin-mode .admin-filter-card .filter-bar{grid-template-columns:1fr}
  body.admin-mode .admin-filter-card button{grid-column:auto}
  body.admin-mode .admin-notes-preview .admin-preview-grid{grid-template-columns:1fr}
  body.admin-mode .admin-invite-step{max-width:100%}
  body.admin-mode .admin-invite-art{display:none}
  body.admin-mode .admin-staff-form .form-grid{grid-template-columns:1fr}
  body.admin-mode .admin-individual-export{align-items:flex-start;flex-direction:column}
}
/* Login: mensajes de validación dentro de la tarjeta, también en pantalla pequeña. */
body.auth-mode .login-field-hint{font-size:11px;color:#7892a3;line-height:1.4;margin:-3px 0 9px}
body.auth-mode .login-feedback{margin:16px 0 0;padding:13px 15px;border-radius:12px;
  font-size:13px;font-weight:700;line-height:1.45;overflow-wrap:anywhere;
  color:#15704d;background:#e8f7ee;border:1px solid #c8e9d4}
body.auth-mode .login-feedback.error{color:#9e322d;background:#fff0ed;border:1px solid #f0bfba}
body.auth-mode .login-feedback[hidden]{display:none!important}


/* Sistema de iconos vectoriales unificado: mismos trazos en PC, tablet y móvil. */
.ui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.16em;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.admin-nav-icon .ui-icon{width:23px;height:23px}
body.admin-mode .admin-kpi-circle .ui-icon{width:29px;height:29px}
body.admin-mode .admin-heading-icon .ui-icon{width:22px;height:22px}
body.admin-mode .admin-mini-icon .ui-icon{width:21px;height:21px}
body.admin-mode .admin-icon-action .ui-icon{width:18px;height:18px;vertical-align:middle}
body.admin-mode .admin-note-icon .ui-icon{width:20px;height:20px}
body.admin-mode .admin-wide-link>.ui-icon{width:17px;height:17px;margin-right:5px}
body.admin-mode .admin-invite-art .ui-icon{width:1em;height:1em}
body.admin-mode .admin-invite-step .ui-icon{width:20px;height:20px}
body.employee-mode .emp-stat-symbol .ui-icon{width:20px;height:20px}
body.employee-mode .emp-guide-icon .ui-icon{width:27px;height:27px}
body.employee-mode .emp-settings-icon .ui-icon{width:25px;height:25px}
body.employee-mode .emp-movement-icon .ui-icon{width:15px;height:15px}
body.employee-mode .emp-chart-symbol .ui-icon{width:30px;height:30px}
body.employee-mode .emp-note-symbol .ui-icon{width:19px;height:19px}
body.employee-mode .employee-nav-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;vertical-align:middle;margin-right:6px}
body.employee-mode .employee-nav-icon .ui-icon{width:20px;height:20px}
body.employee-mode #settings-btn>.ui-icon{display:none}
body.employee-mode .emp-punch-actions button .ui-icon,button[data-action="export"] .ui-icon,button[data-action="export-csv"] .ui-icon,button[data-action="admin-employee-records"] .ui-icon{vertical-align:-.17em}
body.employee-mode .emp-punch-actions button .ui-icon,button[data-action="export"] .ui-icon,button[data-action="export-csv"] .ui-icon{margin-right:.35em}
button .ui-icon{pointer-events:none}
body.admin-mode .admin-icon-action .ui-icon{margin:0}
@media(max-width:850px){
 body.employee-mode #settings-btn:before{content:none}
 body.employee-mode #settings-btn>.ui-icon{display:block;width:23px;height:23px;margin:auto}
 body.employee-mode .nav-item[data-tab="fichar"]:before,
 body.employee-mode .nav-item[data-tab="historial"]:before,
 body.employee-mode .nav-item[data-tab="guia"]:before,
 body.employee-mode .nav-item:before{content:none;display:none}
 body.employee-mode .nav-item{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px}
 body.employee-mode .employee-nav-icon{margin:0;width:23px;height:23px}
 body.employee-mode .employee-nav-icon .ui-icon{width:23px;height:23px}
}
@media(max-width:590px){
 body.admin-mode .admin-kpi-circle .ui-icon{width:21px;height:21px}
 body.admin-mode .admin-mini-icon .ui-icon{width:17px;height:17px}
 body.admin-mode .admin-nav-icon .ui-icon{width:20px;height:20px}
}

/* Misma identidad visual de la PWA en el encabezado móvil y PC. */
.identity .symbol.app-brand-symbol,body.employee-mode .identity .symbol.app-brand-symbol,body.admin-mode .header .identity .symbol.app-brand-symbol,body.auth-mode .identity .symbol.app-brand-symbol{background:transparent;box-shadow:none;padding:0;overflow:hidden}
.identity .symbol.app-brand-symbol img{display:block;width:100%;height:100%;object-fit:contain}


/* Cabecera corporativa aprobada: distribución HORIZONTAL según la imagen de referencia.
   Solo identidad corporativa: NO modificar menús, navegación ni iconos. */
body.company-branding .header .identity{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  background:#fff;
  color:#124a3a;
  border:1px solid #e6eee9;
  border-radius:13px;
  box-shadow:0 4px 13px #00291b13;
  box-sizing:border-box;
  padding:7px 9px;
  text-align:left;
  min-width:0;
}
body.company-branding .header .identity .app-brand-symbol{display:none!important}
body.company-branding .header .identity .company-brand-logo{
  display:block;
  width:82px;
  height:49px;
  max-width:none;
  flex:0 0 82px;
  object-fit:contain;
}
body.company-branding .header .identity .company-brand-logo[hidden]{display:none}
body.company-branding .header .identity>div{
  display:block;
  flex:1 1 auto;
  min-width:0;
  padding-left:7px;
  border-left:1px solid #dce6e2;
  text-align:left;
}
body.company-branding .header .identity strong{
  display:block;
  font-size:14px;
  font-weight:850;
  line-height:1.2;
  letter-spacing:-.55px;
  white-space:nowrap;
  color:#114a39;
}
body.company-branding .header .identity small{
  display:block;
  margin-top:3px;
  max-width:100%;
  color:#5a7770;
  font-size:9px;
  font-weight:500;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media(min-width:851px){
  body.admin-mode.company-branding .header{padding-top:12px}
  body.admin-mode.company-branding .header .identity{
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    width:220px;
    height:68px;
    margin-left:-4px;
    padding:7px 9px;
    text-align:left;
  }
  body.admin-mode.company-branding .header .identity .company-brand-logo{
    width:82px;
    height:49px;
    flex:0 0 82px;
  }
  body.admin-mode.company-branding .header .identity>div{
    width:auto;
    min-width:0;
    text-align:left;
    padding-left:7px;
  }
  body.admin-mode.company-branding .header .identity strong{
    font-size:14px;
    line-height:1.2;
    letter-spacing:-.55px;
    white-space:nowrap;
  }
  body.admin-mode.company-branding .header .identity small{
    max-width:100%;
    margin-top:3px;
    font-size:9px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}
@media(max-width:850px){
  body.company-branding .header .identity,
  body.admin-mode.company-branding .header .identity{
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    width:auto;
    min-width:0;
    max-width:100%;
    gap:6px;
    padding:6px 7px;
    border-radius:11px;
  }
  body.company-branding .header .identity .company-brand-logo,
  body.admin-mode.company-branding .header .identity .company-brand-logo{
    width:65px;
    height:42px;
    flex:0 0 65px;
  }
  body.company-branding .header .identity>div,
  body.admin-mode.company-branding .header .identity>div{
    min-width:0;
    padding-left:6px;
    text-align:left;
  }
  body.company-branding .header .identity strong,
  body.admin-mode.company-branding .header .identity strong{
    font-size:13px;
    line-height:1.15;
    letter-spacing:-.4px;
    white-space:nowrap;
  }
  body.company-branding .header .identity small,
  body.admin-mode.company-branding .header .identity small{
    max-width:100%;
    font-size:9px;
    margin-top:2px;
    line-height:1.15;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}
@media(max-width:380px){
  body.company-branding .header .identity,
  body.admin-mode.company-branding .header .identity{gap:4px;padding:5px}
  body.company-branding .header .identity .company-brand-logo,
  body.admin-mode.company-branding .header .identity .company-brand-logo{
    width:50px;
    height:38px;
    flex:0 0 50px;
  }
  body.company-branding .header .identity>div,
  body.admin-mode.company-branding .header .identity>div{padding-left:5px}
  body.company-branding .header .identity strong,
  body.admin-mode.company-branding .header .identity strong{font-size:12px}
  body.company-branding .header .identity small,
  body.admin-mode.company-branding .header .identity small{font-size:8.5px}
}


/* El subtítulo legal completo de Juan Carlos debe ser visible, sin puntos suspensivos.
   Solo se modifica ese texto; el resto de la cabecera y los menús siguen intactos. */
body.company-branding.company-juan .header .identity small{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  overflow-wrap:normal;
}