:root{
  --navy:#002F6C;--navy2:#001d46;--cyan:#00A7D8;--orange:#F4A51C;--ink:#171B21;--muted:#667085;
  --bg:#f3f6fa;--card:#fff;--line:#dce5ef;--soft:#eef4fa;--ok:#16794b;--warn:#a85b00;--danger:#b42318;
  --shadow:0 16px 42px rgba(20,44,73,.10);--shadow-sm:0 8px 22px rgba(20,44,73,.08);--radius:20px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}.hidden{display:none!important}.modal-open{overflow:hidden}.mt-14{margin-top:14px}.mt-8{margin-top:8px}.optional{font-weight:500;color:var(--muted)}
.kicker,.modal-kicker{display:inline-block;font-size:11px;line-height:1;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}.kicker.light{color:#7ee3ff}
.portal-brand,.sidebar-brand{display:flex;align-items:center;gap:12px;text-decoration:none}.portal-brand img,.sidebar-brand img{width:48px;height:48px;object-fit:contain}.portal-brand strong,.sidebar-brand strong{display:block;color:var(--navy);font-size:20px;letter-spacing:.02em}.portal-brand span,.sidebar-brand span{display:block;color:var(--muted);font-size:11px;margin-top:2px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.auth-page{min-height:100vh;display:grid;grid-template-columns:minmax(440px,.88fr) 1.12fr;background:#fff}.auth-form-side{display:grid;place-items:center;padding:42px clamp(24px,5vw,80px)}.auth-card{width:min(450px,100%)}.auth-copy{margin:38px 0 26px}.auth-copy h1{font-size:clamp(32px,4vw,46px);line-height:1.06;color:var(--navy);margin:10px 0 12px;letter-spacing:-.035em}.auth-copy p{margin:0;color:var(--muted);line-height:1.6}.auth-links{display:flex;justify-content:space-between;gap:14px;margin-top:20px;font-size:12px;font-weight:800;color:var(--navy)}.auth-links a{text-decoration:none}.auth-links a:hover{text-decoration:underline}.auth-visual{position:relative;overflow:hidden;background:linear-gradient(145deg,#001735,#002f6c 45%,#006b9e 76%,#00a7d8);color:#fff;display:flex;align-items:flex-end;padding:clamp(38px,6vw,82px)}.auth-visual:before{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.13);border-radius:50%;right:-120px;top:-130px}.auth-visual:after{content:"";position:absolute;width:340px;height:340px;background:radial-gradient(circle,rgba(244,165,28,.22),transparent 68%);left:12%;top:14%}.visual-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,black,transparent 90%)}.auth-visual-content{position:relative;z-index:2;max-width:720px}.auth-visual h2{font-size:clamp(38px,5.5vw,72px);line-height:.98;letter-spacing:-.045em;margin:14px 0 20px;max-width:720px}.auth-visual p{font-size:16px;line-height:1.7;color:#d9ebf7;max-width:600px}.visual-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.visual-pills span{padding:8px 11px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);backdrop-filter:blur(8px);border-radius:999px;font-size:11px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.form-stack{display:flex;flex-direction:column;gap:14px}.form-grid{display:grid;gap:12px}.form-grid.two{grid-template-columns:1fr 1fr}.field{display:flex;flex-direction:column;gap:7px}.field label{font-size:12px;font-weight:900;color:#344054}.control{width:100%;min-height:48px;border:1px solid #cfdbe8;border-radius:13px;background:#fff;color:var(--ink);padding:11px 13px;outline:none;transition:border-color .15s,box-shadow .15s,background .15s}.control:focus{border-color:#69b9dc;box-shadow:0 0 0 4px rgba(0,167,216,.10)}.control[readonly]{background:#f6f8fb;color:#526071}.control.error{border-color:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.08)}textarea.control{resize:vertical}.hint{font-size:11px;color:var(--muted);line-height:1.45}.password-control{position:relative}.password-control .control{padding-right:60px}.text-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--navy);font-size:11px;font-weight:900;padding:8px;border-radius:8px}
.btn{border:0;border-radius:13px;min-height:44px;padding:10px 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:900;transition:transform .15s,box-shadow .15s,opacity .15s}.btn:hover{transform:translateY(-1px)}.btn:disabled{opacity:.52;cursor:not-allowed;transform:none}.btn-wide{width:100%;min-height:52px}.btn-primary{background:linear-gradient(135deg,var(--navy),#075d9b);color:#fff;box-shadow:0 11px 24px rgba(0,47,108,.20)}.btn-orange{background:linear-gradient(135deg,#e99107,var(--orange));color:#15191d;box-shadow:0 10px 20px rgba(244,165,28,.18)}.btn-cyan{background:linear-gradient(135deg,#008fbd,var(--cyan));color:#fff}.btn-ghost{background:#f6f9fc;border:1px solid #d7e2ee;color:var(--navy)}.btn-danger{background:#fff1f0;border:1px solid #fecaca;color:var(--danger)}.btn-small{min-height:36px;padding:7px 11px;border-radius:10px;font-size:11px}.big-mark{width:100%;min-height:62px;font-size:16px;border-radius:16px}.icon-btn{width:38px;height:38px;border:1px solid #dce5ef;background:#f8fafc;border-radius:11px;color:#475467;font-weight:900}.mobile-menu{display:none;width:40px;height:40px;border:1px solid #dce5ef;background:#fff;border-radius:11px;color:var(--navy);font-size:18px}
.notice{border-radius:13px;padding:12px 13px;font-size:12px;line-height:1.5;font-weight:750}.notice.info{background:#eef8ff;border:1px solid #b9e6ff;color:#075985}.notice.ok{background:#ecfdf3;border:1px solid #abefc6;color:#166534}.notice.warn{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}.notice.danger{background:#fff1f0;border:1px solid #fecdca;color:#b42318}.notice code{font-size:11px}
.portal-shell{min-height:100vh;display:grid;grid-template-columns:252px minmax(0,1fr)}.sidebar{height:100vh;position:sticky;top:0;display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--line);padding:22px 16px;z-index:50}.sidebar-brand{padding:3px 8px 22px;border-bottom:1px solid #edf2f7}.sidebar-brand img{width:42px;height:42px}.side-nav{display:flex;flex-direction:column;gap:5px;padding-top:18px}.nav-item{width:100%;border:0;background:transparent;color:#526071;display:flex;align-items:center;gap:12px;min-height:45px;padding:9px 11px;border-radius:12px;font-weight:850;text-align:left;transition:background .15s,color .15s,transform .15s}.nav-item:hover{background:#f4f8fc;color:var(--navy)}.nav-item.active{background:linear-gradient(135deg,#eaf5ff,#f5fbff);color:var(--navy);box-shadow:inset 3px 0 0 var(--cyan)}.nav-icon{width:26px;height:26px;border-radius:8px;background:#edf3f8;display:grid;place-items:center;font-size:14px;font-weight:900}.nav-item.active .nav-icon{background:#d7f2fb;color:#007ea8}.sidebar-foot{margin-top:auto;border-top:1px solid #edf2f7;padding-top:15px}.side-status{display:flex;align-items:center;gap:8px;padding:8px 11px 12px;color:var(--muted);font-size:11px;font-weight:800}.online-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.10)}.online-dot.off{background:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.10)}.logout{color:#7a3540}
.portal-main{min-width:0}.portal-topbar{height:76px;position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,3vw,38px)}.topbar-label{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em;font-weight:900}.portal-topbar>div>strong{color:var(--navy);font-size:16px}.top-user{display:flex;align-items:center;gap:10px}.top-user-copy strong{display:block;color:var(--navy);font-size:12px}.top-user-copy span{display:block;color:var(--muted);font-size:10px;margin-top:2px}.avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--navy),#0075a5);color:#fff;display:grid;place-items:center;font-weight:950}.avatar.large{width:62px;height:62px;border-radius:18px;font-size:22px}.portal-content{width:min(1180px,calc(100% - 42px));margin:0 auto;padding:34px 0 54px}.portal-view{display:none;animation:viewIn .22s ease}.portal-view.active-view{display:block}@keyframes viewIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.welcome-panel{background:linear-gradient(135deg,#fff 0%,#f9fcff 62%,#eaf8fd 100%);border:1px solid var(--line);box-shadow:var(--shadow-sm);border-radius:24px;padding:28px 30px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;position:relative;overflow:hidden}.welcome-panel:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(0,167,216,.18),transparent 68%);right:-70px;top:-100px}.welcome-panel h1{font-size:34px;line-height:1.06;color:var(--navy);margin:9px 0 7px;letter-spacing:-.035em}.welcome-panel p{margin:0;color:var(--muted)}.welcome-date{position:relative;z-index:2;text-align:right}.welcome-date span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:900}.welcome-date strong{display:block;color:var(--navy);font-size:15px;margin-top:4px}.section-head,.page-title,.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.section-head{margin:28px 0 12px}.section-head h2,.card-head h2{margin:0;color:var(--navy);font-size:18px}.section-head p,.card-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.page-title{margin-bottom:18px}.page-title h1{font-size:32px;color:var(--navy);margin:8px 0 7px;letter-spacing:-.03em}.page-title p{margin:0;color:var(--muted)}
.module-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.module-card{border:1px solid var(--line);background:#fff;border-radius:20px;padding:18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;text-align:left;box-shadow:var(--shadow-sm);transition:transform .16s,border-color .16s,box-shadow .16s}.module-card:hover{transform:translateY(-2px);border-color:#bdd5e8;box-shadow:var(--shadow)}.module-card.featured{background:linear-gradient(145deg,#fff,#f4fbff)}.module-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:20px;font-weight:950}.module-icon.cyan{background:#ddf6fc;color:#007b9f}.module-icon.navy{background:#e7eef7;color:var(--navy)}.module-tag{font-size:9px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:var(--cyan)}.module-copy h3{margin:3px 0 4px;color:var(--navy);font-size:16px}.module-copy p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}.module-arrow{font-size:22px;color:#8fa1b5}
.card,.journey-card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-sm)}.card{padding:20px}.journey-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:17px 20px}.journey-times{display:flex;align-items:center;gap:22px}.time-divider{width:1px;height:42px;background:#e2e8f0}.time-box span{display:block;color:var(--muted);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.time-box strong{display:block;color:var(--navy);font-size:24px;margin-top:3px}.journey-state{font-size:11px;font-weight:900;padding:7px 10px;border-radius:999px;background:#eef2f7;color:#526071}.attendance-card{max-width:820px}.today-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.today-row .time-box{background:#f7fafe;border:1px solid #e0e8f1;border-radius:15px;padding:15px}.attendance-action{margin-top:14px;padding:17px;background:#f8fbfe;border:1px solid #dfe8f1;border-radius:16px}.attendance-action .notice{margin-bottom:11px}.records-list{display:flex;flex-direction:column;gap:9px}.record-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px 16px;display:flex;justify-content:space-between;gap:16px;align-items:center}.record-card strong{color:var(--navy)}.record-meta{font-size:11px;color:var(--muted);margin-top:4px}.status-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:950;letter-spacing:.02em}.status-chip.ok{background:#dcfce7;color:#166534}.status-chip.warn{background:#ffedd5;color:#9a3412}.status-chip.muted{background:#eef2f7;color:#475467}.status-chip.danger{background:#fee2e2;color:#991b1b}.profile-card{max-width:760px}.profile-identity{display:flex;align-items:center;gap:15px;padding-bottom:18px;border-bottom:1px solid #edf2f7}.profile-identity h2{margin:0;color:var(--navy)}.profile-identity p{margin:4px 0 0;color:var(--muted);font-size:12px}.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:17px}.profile-grid>div{background:#f8fafc;border:1px solid #e5ebf2;border-radius:13px;padding:12px}.profile-grid span{display:block;font-size:10px;color:var(--muted);font-weight:900;text-transform:uppercase;letter-spacing:.06em}.profile-grid strong{display:block;color:var(--navy);font-size:13px;margin-top:4px}
.permission-box{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:flex-start;padding:14px;border:1px solid #dce7f2;border-radius:15px;background:#f8fbfe}.permission-icon{width:42px;height:42px;border-radius:13px;background:#ddf6fc;color:#007ea8;display:grid;place-items:center;font-size:20px}.permission-box h4{margin:0 0 4px;color:var(--navy)}.permission-box p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.location-live{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border-radius:14px;background:#f8fafc;border:1px solid #e2e8f0}.location-copy{display:flex;align-items:center;gap:11px}.location-live strong{font-size:12px;color:var(--navy)}.location-live small{display:block;color:var(--muted);margin-top:3px;font-size:11px}.dot{width:10px;height:10px;border-radius:50%;background:#94a3b8;box-shadow:0 0 0 5px rgba(148,163,184,.13)}.dot.ok{background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.13)}.dot.warn{background:#f59e0b;box-shadow:0 0 0 5px rgba(245,158,11,.13)}.dot.danger{background:#ef4444;box-shadow:0 0 0 5px rgba(239,68,68,.13)}.photo-drop{border:1.5px dashed #b9c9db;border-radius:15px;padding:16px;text-align:center;background:#fbfdff}.photo-drop input{display:none}.photo-preview{width:100%;max-height:300px;object-fit:cover;border-radius:13px;margin-top:12px;border:1px solid #dce7f2}.signature-wrap{border:1px solid #dce7f2;border-radius:15px;background:#fff;overflow:hidden}.signature-head{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-bottom:1px solid #edf2f7}.signature-head span{font-size:11px;font-weight:800;color:var(--muted)}#signatureCanvas{width:100%;height:180px;display:block;touch-action:none;background:linear-gradient(#fff,#fcfdff)}
.modal-backdrop{position:fixed;inset:0;background:rgba(8,20,39,.58);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:16px;z-index:100;animation:fadeIn .17s ease}.modal{width:min(690px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:22px;box-shadow:0 30px 90px rgba(0,0,0,.22);animation:rise .2s ease}.modal.large{width:min(820px,100%)}.modal-head{position:sticky;top:0;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);z-index:2;padding:17px 19px;border-bottom:1px solid #edf2f7;display:flex;align-items:center;justify-content:space-between;gap:12px}.modal-head h3{margin:4px 0 0;color:var(--navy)}.modal-subtitle{font-size:11px;color:var(--muted);margin-top:4px}.modal-body{padding:19px}.modal-foot{padding:14px 19px;border-top:1px solid #edf2f7;display:flex;justify-content:flex-end;gap:9px;position:sticky;bottom:0;background:#fff}.empty{padding:28px;text-align:center;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:16px}.empty strong{display:block;color:var(--navy);font-size:15px;margin-bottom:4px}.toast-wrap{position:fixed;top:88px;right:16px;display:flex;flex-direction:column;gap:8px;z-index:150}.toast{min-width:280px;max-width:420px;background:#fff;border-radius:13px;padding:12px 14px;box-shadow:0 18px 50px rgba(0,0,0,.16);border-left:4px solid var(--navy);font-size:12px;font-weight:750;animation:slideIn .2s ease}.toast.ok{border-left-color:var(--ok)}.toast.warn{border-left-color:#f59e0b}.toast.danger{border-left-color:var(--danger)}.mobile-overlay{position:fixed;inset:0;background:rgba(0,20,45,.45);z-index:44}
/* ADMIN */
.admin-shell{grid-template-columns:270px minmax(0,1fr)}.admin-sidebar{background:linear-gradient(180deg,#001e47,#002f6c);border-right:0;color:#fff}.admin-sidebar .sidebar-brand{border-bottom-color:rgba(255,255,255,.12)}.admin-sidebar .sidebar-brand strong{color:#fff}.admin-sidebar .sidebar-brand span{color:#b8d5eb}.admin-sidebar .nav-item{color:#c7d9e9}.admin-sidebar .nav-item:hover{background:rgba(255,255,255,.07);color:#fff}.admin-sidebar .nav-item.active{background:rgba(255,255,255,.11);color:#fff;box-shadow:inset 3px 0 0 var(--orange)}.admin-sidebar .nav-icon{background:rgba(255,255,255,.09)}.admin-sidebar .nav-item.active .nav-icon{background:rgba(244,165,28,.18);color:#ffd27a}.admin-sidebar .sidebar-foot{border-top-color:rgba(255,255,255,.12)}.admin-sidebar .side-status{color:#c7d9e9}.admin-sidebar .logout{color:#f6cdd2}.hero-admin{border-radius:23px;padding:25px 28px;color:#fff;background:linear-gradient(135deg,#002f6c,#005a8e 68%,#00a7d8);box-shadow:var(--shadow);position:relative;overflow:hidden}.hero-admin:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;border:1px solid rgba(255,255,255,.15);right:-75px;top:-110px}.hero-admin h1{font-size:30px;margin:8px 0 7px;letter-spacing:-.03em}.hero-admin p{margin:0;color:#d8e9f6}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:15px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:17px;box-shadow:var(--shadow-sm)}.stat-card .label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900}.stat-card .value{font-size:30px;color:var(--navy);font-weight:950;margin-top:5px}.stat-card .meta{font-size:10px;color:var(--muted);margin-top:3px}.admin-toolbar{display:flex;align-items:end;gap:9px;flex-wrap:wrap}.admin-toolbar .field{min-width:140px;flex:1}.admin-toolbar .search{min-width:220px;flex:2}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow-sm)}.table{width:100%;border-collapse:collapse;min-width:850px}.table th,.table td{padding:11px 12px;border-bottom:1px solid #edf2f7;text-align:left;font-size:12px;vertical-align:middle}.table th{background:#f7f9fc;color:#475467;font-size:10px;letter-spacing:.055em;text-transform:uppercase;position:sticky;top:0;z-index:1}.table tr:hover td{background:#fbfdff}.table td strong{color:var(--navy)}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.detail-box{border:1px solid #e1e8f0;background:#f9fbfd;border-radius:14px;padding:13px}.detail-box span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:900}.detail-box strong{display:block;margin-top:4px;color:var(--navy);font-size:12px}.map-frame{width:100%;height:260px;border:0;border-radius:14px;background:#eef3f8}.evidence-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:12px}.evidence-card{border:1px solid #e1e8f0;border-radius:15px;padding:11px}.evidence-card h4{margin:0 0 9px;color:var(--navy);font-size:13px}.evidence-card img{width:100%;max-height:340px;object-fit:contain;border-radius:11px;background:#f7f9fc}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.setting-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}.setting-card h3{margin:0;color:var(--navy);font-size:14px}.setting-card p{margin:5px 0 13px;color:var(--muted);font-size:11px;line-height:1.5}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.switch{position:relative;width:48px;height:27px}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;inset:0;background:#cbd5e1;border-radius:999px;transition:.2s}.switch-slider:before{content:"";position:absolute;width:21px;height:21px;left:3px;top:3px;background:#fff;border-radius:50%;box-shadow:0 2px 7px rgba(0,0,0,.18);transition:.2s}.switch input:checked+.switch-slider{background:var(--cyan)}.switch input:checked+.switch-slider:before{transform:translateX(21px)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes rise{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}@keyframes slideIn{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
@media(max-width:1020px){.portal-shell,.admin-shell{grid-template-columns:220px minmax(0,1fr)}.sidebar{padding-left:12px;padding-right:12px}.summary-grid{grid-template-columns:repeat(2,1fr)}.module-grid{grid-template-columns:1fr}.auth-page{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.auth-page{display:block}.auth-form-side{min-height:100vh;padding:28px 20px}.auth-visual{display:none}.portal-shell,.admin-shell{display:block}.sidebar{position:fixed;left:0;top:0;width:min(290px,84vw);height:100vh;transform:translateX(-105%);transition:transform .2s ease;box-shadow:0 20px 60px rgba(0,0,0,.24);z-index:50}.sidebar.open{transform:none}.mobile-menu{display:grid;place-items:center}.portal-topbar{height:68px;padding:0 13px;gap:10px}.portal-topbar>div:nth-child(2){flex:1}.top-user-copy{display:none}.portal-content{width:min(100% - 20px,100%);padding:20px 0 36px}.welcome-panel{padding:21px 18px;border-radius:19px;align-items:flex-start}.welcome-panel h1{font-size:28px}.welcome-date{display:none}.section-head{margin-top:22px}.module-card{border-radius:16px;padding:15px}.journey-card{align-items:flex-start;flex-direction:column;border-radius:16px}.journey-state{align-self:stretch;text-align:center}.page-title{align-items:flex-start}.page-title h1{font-size:28px}.card{border-radius:16px;padding:16px}.form-grid.two,.profile-grid,.detail-grid,.settings-grid{grid-template-columns:1fr}.modal-backdrop{padding:0;align-items:flex-end}.modal,.modal.large{border-radius:21px 21px 0 0;max-height:94vh}.modal-body{padding:15px}.modal-head{padding:14px 15px}.modal-foot{padding:11px 15px;flex-direction:column-reverse}.modal-foot .btn{width:100%}.toast-wrap{top:78px;left:10px;right:10px}.toast{min-width:0;max-width:none}.summary-grid{grid-template-columns:1fr 1fr}.evidence-grid{grid-template-columns:1fr}.admin-toolbar{display:grid;grid-template-columns:1fr 1fr}.admin-toolbar .field,.admin-toolbar .search{min-width:0}.admin-toolbar .search{grid-column:1/-1}.admin-toolbar>.btn{width:100%}.record-card{align-items:flex-start}.topbar-label{display:none}}
@media(max-width:440px){.summary-grid{grid-template-columns:1fr 1fr}.stat-card{padding:14px}.stat-card .value{font-size:26px}.today-row{grid-template-columns:1fr 1fr}.journey-times{width:100%;justify-content:space-between}.visual-pills{display:none}.auth-copy{margin-top:30px}.auth-copy h1{font-size:32px}.sidebar-brand{padding-top:max(4px,env(safe-area-inset-top))}.modal-foot{padding-bottom:max(11px,env(safe-area-inset-bottom))}}


/* PORTAL ESCEM · ACCESO UNIFICADO V1.1 */
.portal-entry-page{min-height:100dvh;background:#fff;display:flex;flex-direction:column}.entry-topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,3vw,46px);border-bottom:1px solid #e9eef5;background:#fff;position:relative;z-index:10}.entry-brand{display:flex;align-items:center;gap:12px;text-decoration:none}.entry-brand img{width:45px;height:45px;object-fit:contain}.entry-brand strong{display:block;color:var(--navy);font-size:15px;letter-spacing:.065em}.entry-brand span{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;margin-top:2px}.entry-site-link{font-size:10px;letter-spacing:.08em;font-weight:900;text-decoration:none;color:#526071;display:flex;align-items:center;gap:6px}.entry-site-link:hover{color:var(--navy)}
.entry-stage{flex:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);min-height:calc(100dvh - 72px)}.entry-visual{position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:clamp(44px,5.5vw,82px);background:linear-gradient(140deg,#001633 0%,#002f6c 45%,#006b9e 76%,#00a7d8 100%);color:#fff}.entry-visual:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 73% 18%,rgba(0,167,216,.42),transparent 28%),radial-gradient(circle at 15% 75%,rgba(244,165,28,.17),transparent 27%)}.entry-visual:after{content:"";position:absolute;width:55vw;height:55vw;max-width:760px;max-height:760px;border:1px solid rgba(255,255,255,.12);border-radius:50%;right:-27vw;top:-25vw;box-shadow:0 0 0 90px rgba(255,255,255,.018),0 0 0 180px rgba(255,255,255,.012)}.entry-grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(145deg,black 0%,rgba(0,0,0,.8) 55%,transparent 100%)}.entry-orb{position:absolute;border-radius:50%;filter:blur(1px)}.entry-orb.one{width:230px;height:230px;border:1px solid rgba(255,255,255,.14);left:10%;top:13%}.entry-orb.two{width:86px;height:86px;background:rgba(244,165,28,.13);right:14%;bottom:16%}.entry-visual-copy{position:relative;z-index:3;max-width:720px}.entry-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:900;letter-spacing:.15em;color:#8be8ff}.entry-eyebrow:before{content:"";width:28px;height:2px;background:var(--orange);border-radius:9px}.entry-visual-copy h1{font-size:clamp(44px,5vw,74px);line-height:.98;letter-spacing:-.047em;margin:17px 0 20px}.entry-visual-copy h1 span{color:#a8eaff}.entry-visual-copy p{max-width:610px;margin:0;color:#d9e9f5;font-size:15px;line-height:1.7}.entry-capabilities{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}.entry-capabilities span{padding:8px 11px;border:1px solid rgba(255,255,255,.17);border-radius:999px;background:rgba(255,255,255,.07);backdrop-filter:blur(8px);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.entry-visual-mark{position:absolute;right:32px;bottom:24px;font-size:clamp(62px,8vw,124px);font-weight:950;letter-spacing:-.08em;color:rgba(255,255,255,.045);line-height:.8;user-select:none}
.entry-access-side{display:grid;place-items:center;padding:42px clamp(24px,5vw,74px);background:linear-gradient(180deg,#fbfdff,#f5f8fc)}.entry-access-card{width:min(500px,100%)}.access-step{animation:accessFade .22s ease}.access-heading{margin-bottom:25px}.access-heading h2,.login-role-head h2{font-size:clamp(30px,3vw,42px);line-height:1.06;color:var(--navy);letter-spacing:-.035em;margin:10px 0 9px}.access-heading p,.login-role-head p{margin:0;color:var(--muted);line-height:1.55;font-size:13px}.access-options{display:flex;flex-direction:column;gap:12px}.access-option{width:100%;display:grid;grid-template-columns:54px 1fr 30px;align-items:center;gap:14px;text-align:left;padding:17px 16px;border:1px solid #d9e3ee;background:#fff;border-radius:18px;color:inherit;box-shadow:0 8px 22px rgba(20,44,73,.055);transition:border-color .18s,box-shadow .18s,transform .18s,background .18s}.access-option:hover{transform:translateY(-2px);border-color:#82cae2;box-shadow:0 16px 32px rgba(20,44,73,.11);background:#fbfeff}.access-option.admin-option:hover{border-color:#edbd5f;background:#fffdf8}.access-option-icon{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;font-size:24px;font-weight:900}.worker-icon{color:#007fa9;background:#e2f7fc}.admin-icon{color:#8a5600;background:#fff3d8}.access-option-copy strong{display:block;color:var(--navy);font-size:15px;margin-bottom:4px}.access-option-copy small{display:block;color:var(--muted);font-size:11px;line-height:1.45}.access-option-arrow{font-size:19px;color:#8da0b4;transition:transform .18s}.access-option:hover .access-option-arrow{transform:translateX(3px);color:var(--navy)}.access-footnote{font-size:10px;line-height:1.5;color:#8793a2;margin-top:18px;padding-left:2px}.entry-privacy{margin-top:28px;padding-top:18px;border-top:1px solid #e1e8f0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:10px;color:#8793a2}.entry-privacy a{text-decoration:none;font-weight:800;color:#536174}.entry-privacy a:hover{color:var(--navy)}.back-access{border:0;background:transparent;color:#607086;padding:0;margin-bottom:25px;font-size:11px;font-weight:850}.back-access:hover{color:var(--navy)}.login-role-head{display:grid;grid-template-columns:58px 1fr;align-items:start;gap:15px;margin-bottom:25px}.login-role-head h2{font-size:30px;margin-top:6px}.login-role-icon{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;font-size:25px;font-weight:900}.login-role-icon.is-worker{background:#e1f7fc;color:#0084ad}.login-role-icon.is-admin{background:#fff1d2;color:#986100}.entry-login-form .control{min-height:52px;border-radius:14px}.entry-login-form .btn-wide{margin-top:2px;min-height:54px}.entry-login-form #loginSubmitBtn{transition:background .18s,box-shadow .18s}.entry-login-form #loginSubmitBtn.admin-mode{background:linear-gradient(135deg,#8f5b00,#e99a0a)}
@keyframes accessFade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:980px){.entry-stage{grid-template-columns:1fr 1fr}.entry-visual{padding:44px 34px}.entry-visual-copy h1{font-size:48px}.entry-access-side{padding:36px 26px}}
@media(max-width:760px){.entry-topbar{height:64px;padding:0 16px}.entry-brand img{width:38px;height:38px}.entry-brand strong{font-size:13px}.entry-brand span{font-size:8px}.entry-site-link{display:none}.entry-stage{display:flex;flex-direction:column;min-height:calc(100dvh - 64px)}.entry-visual{min-height:210px;align-items:flex-end;padding:27px 20px}.entry-visual-copy h1{font-size:36px;margin:10px 0 10px}.entry-visual-copy p{font-size:12px;line-height:1.5}.entry-eyebrow{font-size:8px}.entry-capabilities{display:none}.entry-visual-mark{right:18px;bottom:12px;font-size:68px}.entry-orb.one{width:150px;height:150px;left:auto;right:-30px;top:-35px}.entry-access-side{display:block;flex:1;padding:27px 20px 34px}.entry-access-card{width:100%;max-width:520px;margin:0 auto}.access-heading{margin-bottom:19px}.access-heading h2{font-size:29px}.access-option{grid-template-columns:48px 1fr 24px;padding:14px 13px;border-radius:16px}.access-option-icon{width:48px;height:48px;border-radius:14px}.login-role-head{grid-template-columns:52px 1fr;gap:12px}.login-role-icon{width:52px;height:52px;border-radius:15px}.login-role-head h2{font-size:27px}.entry-privacy{margin-top:22px}}
@media(max-width:420px){.entry-visual{min-height:186px}.entry-visual-copy h1{font-size:31px}.entry-visual-copy p{max-width:330px}.access-option-copy small{font-size:10px}.access-option{gap:11px}.entry-access-side{padding-left:15px;padding-right:15px}}

/* =========================================================
   PORTAL ESCEM · IDENTIDAD WEB
   ========================================================= */

.entry-visual{background-image:linear-gradient(90deg,rgba(0,26,62,.94) 0%,rgba(0,47,108,.82) 45%,rgba(0,77,126,.50) 100%),url('images/portal-hero.webp');background-position:center center;background-size:cover}.entry-visual:before{background:linear-gradient(180deg,rgba(0,20,48,.08),rgba(0,25,58,.28)),radial-gradient(circle at 72% 20%,rgba(0,167,216,.25),transparent 32%)}.entry-visual:after{opacity:.5}.entry-grid-lines{opacity:.48}.entry-photo-logo{width:min(280px,48%);max-height:100px;object-fit:contain;object-position:left center;margin:0 0 26px;filter:drop-shadow(0 8px 18px rgba(0,0,0,.14))}.entry-visual-copy{max-width:760px}.entry-visual-copy h1{text-shadow:0 4px 18px rgba(0,20,48,.22)}.entry-visual-copy p{text-shadow:0 2px 12px rgba(0,20,48,.20)}
.access-option-icon svg,.login-role-icon svg{width:25px;height:25px}.nav-icon svg{width:16px;height:16px}.module-icon svg{width:24px;height:24px}.btn svg{width:16px;height:16px;flex:0 0 auto}.permission-icon svg{width:29px;height:29px}.entry-site-link{transition:color .18s,transform .18s}.entry-site-link:hover{transform:translateY(-1px)}
.location-live{gap:12px}.location-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.record-leading{display:flex;align-items:center;gap:11px}.record-type-icon{width:36px;height:36px;border-radius:11px;background:#eaf7fb;color:#007fa8;display:grid;place-items:center;flex:0 0 auto}.record-type-icon svg{width:17px;height:17px}
.auth-visual{background-image:linear-gradient(90deg,rgba(0,26,62,.90),rgba(0,73,116,.56)),url('images/portal-hero.webp');background-size:cover;background-position:center}.auth-visual:before{border-color:rgba(255,255,255,.16)}
.topbar-actions{display:flex;align-items:center;gap:12px}.master-control-badge{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;border:1px solid #efd08d;background:#fff8e7;color:#835300;font-size:9px;font-weight:950;letter-spacing:.06em;text-transform:uppercase}.master-control-badge svg{width:14px;height:14px}.admin-permission-note{margin:-4px 0 14px;padding:11px 13px;border-radius:13px;border:1px solid #cfe5f2;background:#f3fbff;color:#36566e;font-size:11px;line-height:1.45}.role-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:900}.role-badge svg{width:13px;height:13px}.role-badge.superadmin{color:#8a5700}.role-badge.admin{color:#004b7d}.role-badge.trabajador{color:#3f5266}.table-actions{display:flex;gap:6px;flex-wrap:wrap}.type-pill{display:inline-flex;align-items:center;gap:5px;font-size:9px;font-weight:900;letter-spacing:.04em;padding:5px 7px;border-radius:999px}.type-pill svg{width:12px;height:12px}.type-pill.in{background:#eaf8f0;color:#18784c}.type-pill.out{background:#edf4fb;color:#315f8b}.area-card{grid-template-columns:52px 1fr auto}

.photo-drop .btn svg{width:17px;height:17px}.entry-topbar{box-shadow:0 3px 18px rgba(20,44,73,.035)}
@media(max-width:760px){.entry-photo-logo{width:175px;max-height:58px;margin-bottom:12px}.entry-visual{background-position:58% 58%;min-height:245px}.entry-visual:before{background:linear-gradient(90deg,rgba(0,29,67,.92),rgba(0,52,96,.55))}.entry-visual-copy h1{font-size:31px}.entry-visual-copy p{max-width:350px}.location-live{align-items:flex-start;flex-direction:column}.location-actions{width:100%;justify-content:flex-start}.topbar-actions .master-control-badge{display:none!important}.area-card{grid-template-columns:48px 1fr}.area-card>.btn{grid-column:1/-1;width:100%}.table-actions{min-width:150px}}
@media(max-width:420px){.entry-photo-logo{width:145px}.entry-visual{min-height:220px}.record-leading{align-items:flex-start}}

/* ===== PORTAL ESCEM V2 · Producción ===== */
:root{--ease-out:cubic-bezier(.22,1,.36,1);--ease-spring:cubic-bezier(.16,1,.3,1)}
.portal-view{display:none}.portal-view.active-view{display:block}.view-enter{animation:viewEnter .42s var(--ease-out) both}@keyframes viewEnter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.nav-item,.btn,.module-card,.stat-card,.setting-card,.record-card,.access-option,.icon-btn{transition:transform .2s var(--ease-out),box-shadow .2s var(--ease-out),border-color .2s ease,background .2s ease,color .2s ease}
.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(0) scale(.985)}
.module-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(15,39,67,.10)}.stat-card:hover,.setting-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(15,39,67,.08)}
.modal-backdrop{opacity:0;transition:opacity .18s ease;background:rgba(6,21,38,.58);backdrop-filter:blur(5px)}.modal-backdrop.modal-visible{opacity:1}.modal-backdrop .modal{transform:translateY(18px) scale(.985);opacity:.88;transition:transform .26s var(--ease-spring),opacity .18s ease}.modal-backdrop.modal-visible .modal{transform:none;opacity:1}
.toast{opacity:0;transform:translateY(-8px) scale(.98);transition:opacity .22s ease,transform .22s var(--ease-out);display:flex;gap:10px;align-items:center}.toast.show{opacity:1;transform:none}.toast-icon{width:8px;height:8px;border-radius:50%;background:currentColor;flex:0 0 auto}
.btn-spinner{width:15px;height:15px;border:2px solid rgba(255,255,255,.38);border-top-color:#fff;border-radius:50%;display:inline-block;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.avatar,.person-avatar{background-size:cover;background-position:center}.avatar.has-photo,.person-avatar.has-photo{color:transparent}
.person-cell{display:flex;align-items:center;gap:10px;min-width:190px}.person-avatar{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,#e8f7fb,#dfeafa);color:var(--navy);font-weight:950;display:grid;place-items:center;flex:0 0 auto;border:1px solid #d6e4ef;box-shadow:0 3px 10px rgba(0,47,108,.07)}.person-avatar.large-avatar{width:54px;height:54px;border-radius:16px;font-size:18px}.detail-avatar{width:62px;height:62px;border-radius:18px;font-size:22px}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.icon-text-btn{display:inline-flex;align-items:center;gap:6px}.icon-text-btn svg{width:15px;height:15px}
.profile-identity-edit{align-items:center}.profile-photo-shell{width:92px;height:92px;position:relative;flex:0 0 auto}.profile-photo-shell .avatar.large,.profile-photo{position:absolute;inset:0;width:92px;height:92px;border-radius:25px;object-fit:cover}.profile-photo{border:3px solid #fff;box-shadow:0 10px 28px rgba(0,47,108,.14)}.profile-photo-edit{position:absolute;right:-4px;bottom:-4px;width:34px;height:34px;border:3px solid #fff;border-radius:12px;background:var(--navy);color:#fff;display:grid;place-items:center;box-shadow:0 5px 15px rgba(0,47,108,.24);z-index:3}.profile-photo-edit:hover{background:#004b87;transform:translateY(-1px)}.profile-photo-edit svg{width:16px;height:16px}
.signature-wrap{overflow:hidden}.signature-wrap canvas,#signatureCanvas{display:block;width:100%;height:190px;min-height:190px;background:#fff;touch-action:none!important;user-select:none;-webkit-user-select:none;cursor:crosshair;overscroll-behavior:contain}
.attendance-person-head{display:flex;align-items:center;gap:14px;padding:4px 0 16px;border-bottom:1px solid #e6edf4;margin-bottom:15px}.attendance-person-head h2{margin:4px 0 3px;color:var(--navy);font-size:19px}.attendance-person-head p{margin:0;color:var(--muted);font-size:12px}
.evidence-list{display:flex;flex-direction:column;gap:16px}.evidence-record{border:1px solid #dfe8f1;border-radius:18px;padding:13px;background:linear-gradient(180deg,#fff,#fbfdff)}.evidence-record-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px;color:#718096;font-size:11px}.evidence-card h4{display:flex;align-items:center;gap:7px}.evidence-card h4 svg{width:16px;height:16px;color:var(--cyan)}.signature-image{background:#fff!important;object-fit:contain!important;padding:12px}
.edit-user-photo-row{display:flex;align-items:center;gap:12px;background:#f7fafc;border:1px solid #e3eaf2;border-radius:16px;padding:12px}.edit-user-photo-row div{display:flex;flex-direction:column;gap:3px}.edit-user-photo-row strong{color:var(--navy)}.edit-user-photo-row span{font-size:11px;color:var(--muted)}
.compact-modal{max-width:520px!important}.danger-kicker{color:#c53030!important}.danger-panel{display:flex;gap:13px;align-items:flex-start;padding:14px;border:1px solid #f3c6c6;background:#fff7f7;border-radius:15px}.danger-panel-icon{width:38px;height:38px;border-radius:12px;background:#fee2e2;color:#b91c1c;display:grid;place-items:center;flex:0 0 auto}.danger-panel-icon svg{width:20px;height:20px}.danger-panel strong{display:block;color:#8e1b1b;margin-bottom:4px}.danger-panel p{margin:0;color:#7c4b4b;font-size:11px;line-height:1.5}
.setting-title-row{display:flex;gap:11px;align-items:flex-start}.setting-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto}.setting-icon.gold{background:#fff1cf;color:#9b6200}.setting-icon svg{width:19px;height:19px}.master-setting{border-color:#ead19d;background:linear-gradient(180deg,#fff,#fffcf5)}
.master-control-badge{display:inline-flex;align-items:center;gap:6px}.master-control-badge svg{width:14px;height:14px}
.area-card{cursor:default!important}.area-card .btn{margin-left:auto}
.mobile-menu{font-size:0}.mobile-menu:after{content:'☰';font-size:22px}
.portal-topbar{backdrop-filter:saturate(130%) blur(10px)}
.auth-visual{position:relative;overflow:hidden}.auth-visual:after{content:"";position:absolute;inset:auto -120px -160px auto;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(0,167,216,.24),transparent 68%);pointer-events:none}
.login-role-icon,.access-option-icon,.module-icon{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
@media(max-width:760px){.signature-wrap canvas,#signatureCanvas{height:220px;min-height:220px}.profile-photo-shell,.profile-photo-shell .avatar.large,.profile-photo{width:82px;height:82px}.profile-photo-shell{height:82px}.row-actions{justify-content:flex-start}.evidence-record{padding:10px}}
.top-user-button{border:0;background:transparent;padding:5px 7px;border-radius:14px;color:inherit;cursor:pointer}.top-user-button:hover{background:#f3f7fb}.top-user-chevron{width:14px;height:14px;color:#7c8b9b}.admin-profile-editor{display:flex;align-items:center;gap:16px;padding:8px 0}.admin-profile-editor h3{margin:0 0 4px;color:var(--navy);font-size:19px}.admin-profile-editor p{margin:0 0 5px;color:var(--muted);font-size:12px}.admin-photo-shell{width:92px;height:92px}.admin-photo-shell .avatar.large,.admin-photo-shell .profile-photo{width:92px;height:92px}

/* ===== Refinamiento visual e interacción ===== */
.nav-item{position:relative;overflow:hidden}.nav-item:before{content:"";position:absolute;left:0;top:16%;bottom:16%;width:3px;border-radius:0 5px 5px 0;background:linear-gradient(180deg,var(--cyan),var(--orange));transform:scaleY(0);opacity:0;transition:transform .24s var(--ease-spring),opacity .18s ease}.nav-item.active:before{transform:scaleY(1);opacity:1}.nav-item .nav-icon{transition:transform .24s var(--ease-spring),color .18s ease}.nav-item:hover .nav-icon,.nav-item.active .nav-icon{transform:scale(1.08) translateX(1px)}
.icon-btn{position:relative;overflow:hidden}.icon-btn svg,.btn svg,.access-option-icon svg,.module-icon svg{transition:transform .22s var(--ease-spring)}.icon-btn:hover svg{transform:rotate(4deg) scale(1.08)}.btn:hover svg{transform:translateX(1px) scale(1.04)}
.access-option{isolation:isolate}.access-option:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,rgba(0,167,216,.08),transparent 45%,rgba(244,165,28,.07));opacity:0;transition:opacity .22s ease;z-index:-1}.access-option:hover:before{opacity:1}.access-option:hover .access-option-icon{transform:translateY(-2px) scale(1.03)}.access-option-icon{transition:transform .25s var(--ease-spring),box-shadow .2s ease}
.top-user{transition:background .2s ease,border-color .2s ease,transform .2s var(--ease-out),box-shadow .2s ease}.top-user:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,47,108,.08)}
.table-card tbody tr{transition:background .16s ease,transform .16s ease}.table-card tbody tr:hover{background:#f7fbfe}.evidence-card img{transition:transform .3s var(--ease-out),box-shadow .25s ease}.evidence-card img:hover{transform:scale(1.012);box-shadow:0 12px 30px rgba(0,47,108,.12)}
.profile-photo-edit{transition:transform .22s var(--ease-spring),background .18s ease,box-shadow .18s ease}.profile-photo-edit:hover{transform:translateY(-2px) scale(1.04)}
.modal-head .icon-btn{border-color:#d6e3ee;background:#f8fbfd}.modal-head .icon-btn:hover{background:#edf7fb;border-color:#b8dae9;color:#006f9a}
.attendance-person-head{display:flex;align-items:center;gap:15px;padding:16px 18px;margin-bottom:16px;border:1px solid #dce8f1;border-radius:18px;background:linear-gradient(135deg,#fbfdff,#f3f9fc)}.attendance-person-head h2{margin:2px 0 3px;color:var(--navy);font-size:19px}.attendance-person-head p{margin:0;color:#60788e;font-size:11px}.attendance-person-head .kicker{font-size:8px;letter-spacing:.12em}
.evidence-record{animation:evidenceIn .32s var(--ease-out) both}@keyframes evidenceIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:640px){.attendance-person-head{align-items:flex-start}.detail-avatar{width:52px;height:52px;border-radius:15px;flex:0 0 auto}.row-actions .btn{min-height:38px}.modal-head{position:sticky;top:0;z-index:4;background:rgba(255,255,255,.96);backdrop-filter:blur(10px)}}

/* Password recovery · Portal ESCEM V2.2 */
.forgot-password-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;align-self:center;border:0;background:transparent;color:#486176;font-size:11px;font-weight:850;padding:7px 10px;margin:-2px auto 0;cursor:pointer;transition:color .18s,transform .18s}.forgot-password-btn:hover{color:var(--navy);transform:translateY(-1px)}.forgot-password-btn svg{width:15px;height:15px}.recovery-intro{display:flex;gap:13px;align-items:flex-start;padding:14px;border:1px solid #d8e6f0;background:#f7fbfe;border-radius:15px}.recovery-intro.success{border-color:#bfe6cf;background:#f4fcf7}.recovery-icon{width:40px;height:40px;border-radius:12px;background:#e1f7fc;color:#007fa9;display:grid;place-items:center;flex:0 0 auto}.recovery-intro.success .recovery-icon{background:#e7f8ed;color:#15803d}.recovery-icon svg{width:21px;height:21px}.recovery-intro strong{display:block;color:var(--navy);font-size:13px;margin-bottom:3px}.recovery-intro p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}.recovery-note,.password-hint{display:flex;align-items:flex-start;gap:8px;color:#607086;font-size:10px;line-height:1.5;padding:9px 10px;background:#f8fafc;border-radius:11px}.recovery-note svg,.password-hint svg{width:15px;height:15px;flex:0 0 auto;margin-top:1px;color:#007fa9}.notice.ok{border-color:#a7dfbc;background:#f0fbf4;color:#166534}.modal-open{overflow:hidden}

/* ========================================================================== 
   PORTAL ESCEM V2.4.1 · UI PROFESIONAL / ROLES / HH / ASISTENCIA UNIVERSAL
   ========================================================================== */
:root{
  --escem-blue:#002F6C;--escem-blue-700:#004b87;--escem-cyan:#00A7D8;--escem-orange:#F4A51C;
  --surface-glass:rgba(255,255,255,.92);--line-strong:#cbd9e6;
  --shadow-premium:0 18px 48px rgba(2,36,77,.10),0 2px 8px rgba(2,36,77,.05);
  --ease-premium:cubic-bezier(.2,.8,.2,1);
}

/* Iconografía: tamaño, trazo y contenedores consistentes */
svg.lucide{stroke-width:2;vector-effect:non-scaling-stroke}
.nav-icon svg{width:18px;height:18px}.btn svg{width:16px;height:16px}.icon-btn svg{width:18px;height:18px}
.admin-sidebar{background:linear-gradient(180deg,#001a3d 0%,#002c66 48%,#003979 100%);box-shadow:10px 0 40px rgba(0,32,73,.06)}
.admin-brand{padding:7px 8px 22px}.admin-brand img{width:116px;height:40px;object-fit:contain;object-position:left center}.admin-brand>div{display:none}
.admin-sidebar .side-nav{gap:7px}.admin-sidebar .nav-item{min-height:50px;border:1px solid transparent;border-radius:14px;padding:8px 10px;font-size:13px;font-weight:780;letter-spacing:.005em}
.admin-sidebar .nav-icon{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.admin-sidebar .nav-item:hover{background:rgba(255,255,255,.085);border-color:rgba(255,255,255,.06);transform:translateX(2px)}
.admin-sidebar .nav-item.active{background:linear-gradient(90deg,rgba(255,255,255,.15),rgba(255,255,255,.075));box-shadow:inset 3px 0 0 var(--orange),0 8px 22px rgba(0,0,0,.08);border-color:rgba(255,255,255,.06)}
.admin-sidebar .nav-item.active .nav-icon{background:linear-gradient(145deg,rgba(244,165,28,.28),rgba(244,165,28,.12));color:#ffd787;border-color:rgba(244,165,28,.22)}
.admin-sidebar .logout:hover{background:rgba(255,86,99,.10);color:#ffd8dc}

.mobile-menu{font-size:0!important;display:none}.mobile-menu:after{display:none!important}.mobile-menu svg{width:20px;height:20px}
.portal-topbar{height:74px;box-shadow:0 1px 0 rgba(16,54,89,.04);background:rgba(255,255,255,.92);backdrop-filter:saturate(160%) blur(16px)}
.topbar-actions{display:flex;align-items:center;gap:10px}.top-user-button{border:1px solid transparent}.top-user-button:hover{border-color:#e0e8ef;background:#f8fbfd}
.master-control-badge{padding:8px 11px;border:1px solid #f0cf88;border-radius:999px;background:linear-gradient(180deg,#fff9e8,#fff4d4);color:#825100;font-size:10px;font-weight:900;letter-spacing:.035em;text-transform:uppercase;box-shadow:0 5px 14px rgba(161,104,0,.08)}
.master-control-badge svg{width:14px;height:14px}

/* Hero y accesos rápidos */
.hero-admin-v24{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:30px 32px;background:
  radial-gradient(circle at 86% 0%,rgba(0,167,216,.35),transparent 28%),
  radial-gradient(circle at 68% 115%,rgba(244,165,28,.20),transparent 24%),
  linear-gradient(135deg,#00265a 0%,#003f79 55%,#006e9e 100%)}
.hero-admin-v24:after{right:-55px;top:-125px;border-color:rgba(255,255,255,.12)}
.hero-admin-v24 h1{font-size:34px}.hero-admin-v24>div:first-child{position:relative;z-index:2}
.hero-actions{display:flex;gap:10px;position:relative;z-index:3;flex-wrap:wrap;justify-content:flex-end}
.hero-action{border:1px solid rgba(255,255,255,.19);background:rgba(255,255,255,.105);color:#fff;border-radius:15px;padding:10px 12px;min-width:190px;display:grid;grid-template-columns:36px 1fr 18px;align-items:center;gap:9px;text-align:left;backdrop-filter:blur(8px);transition:transform .22s var(--ease-premium),background .2s,border-color .2s,box-shadow .2s}
.hero-action:hover{transform:translateY(-2px);background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.28);box-shadow:0 10px 24px rgba(0,0,0,.10)}
.hero-action>span{width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.13);display:grid;place-items:center}.hero-action>span svg{width:18px;height:18px}.hero-action>svg{width:16px;height:16px;color:#bdefff}.hero-action strong{display:block;font-size:11px}.hero-action small{display:block;margin-top:2px;color:#cfe4f2;font-size:9px}

/* Métricas */
.metric-grid{gap:14px}.metric-card{position:relative;overflow:hidden;padding:18px 18px 16px;border-color:#dde7ef;box-shadow:var(--shadow-premium)}
.metric-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-42px;top:-42px;background:radial-gradient(circle,rgba(0,167,216,.08),transparent 68%)}
.metric-card.premium{border-color:#b8cde0;background:linear-gradient(145deg,#fff,#f6faff)}
.metric-head{display:flex;align-items:center;gap:9px;color:#5b6d80;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.055em}
.metric-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:0 0 auto;border:1px solid transparent}.metric-icon svg{width:17px;height:17px}
.metric-icon.blue,.metric-icon.navy{background:#e8f0fb;color:#003e7a;border-color:#dbe7f3}.metric-icon.cyan{background:#e0f8fd;color:#007f9f;border-color:#c9eef7}.metric-icon.green{background:#e9f9ef;color:#17734b;border-color:#d4f0df}.metric-icon.amber{background:#fff3d8;color:#9a6200;border-color:#f9e7bd}.metric-icon.soft{background:#f0f4f8;color:#34556f;border-color:#e2e8ef}
.metric-card .value{font-size:32px!important;letter-spacing:-.03em;margin-top:11px!important}.metric-card .meta{font-size:10px!important;color:#758698!important}

/* Tablas y acciones */
.table-card{border-color:#dce6ef;box-shadow:0 12px 30px rgba(2,40,78,.06)}.table-card .table th{background:#f7fafd;color:#536779}.table-card .table tbody tr{transition:background .16s ease}.table-card .table tbody tr:hover td{background:#f8fbfd}
.row-actions{align-items:center}.action-icon-btn{white-space:nowrap}.square-action{width:38px;padding:0!important}.square-action svg{width:15px;height:15px}.table td{height:54px}
.role-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.045em;text-transform:uppercase;border:1px solid}.role-badge svg{width:13px;height:13px}.role-badge.master{background:#fff6df;border-color:#f0d08b;color:#8a5800}.role-badge.moderate{background:#eaf4ff;border-color:#cfe1f5;color:#15558a}.role-badge.worker{background:#f0f5f8;border-color:#dce5eb;color:#536575}
.admin-permission-note{margin:-4px 0 14px;padding:10px 12px;border:1px solid #d7e7f0;border-radius:13px;background:linear-gradient(90deg,#f2f9fd,#f8fbfd);color:#49667c;font-size:10px;font-weight:680;line-height:1.5}

/* Asistencia de cuentas administrativas */
.self-attendance-card{max-width:none;background:linear-gradient(180deg,#fff,#fbfdff)}
#selfSignatureCanvas{display:block;width:100%;height:190px;min-height:190px;background:#fff;touch-action:none!important;user-select:none;-webkit-user-select:none;cursor:crosshair;overscroll-behavior:contain}
#selfRecentList .record-card{box-shadow:0 6px 18px rgba(3,43,83,.045)}
#selfOpenMarkBtn{background:linear-gradient(135deg,#d98500,#f4a51c);color:#15202b;box-shadow:0 14px 28px rgba(244,165,28,.20)}

/* Horas hombre */
.hh-toolbar{display:flex;align-items:end;justify-content:space-between;gap:14px;padding:16px 18px}.hh-toolbar .field{width:min(280px,100%)}.hh-toolbar-actions{display:flex;gap:9px}
.hh-summary-grid{margin-top:14px}.hh-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,.6fr);gap:14px}.hh-chart-card,.hh-insight-card{min-height:330px}.chart-legend{font-size:9px;color:#6f8193;font-weight:800;display:flex;align-items:center;gap:6px}.chart-legend i{width:9px;height:9px;border-radius:3px;background:linear-gradient(180deg,#00a7d8,#006e9e)}
.hh-chart{height:235px;margin-top:18px;display:flex;align-items:stretch;gap:4px;overflow-x:auto;padding:8px 2px 2px;scrollbar-width:thin}.hh-bar-col{min-width:22px;flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}.hh-bar-track{height:198px;width:100%;display:flex;align-items:flex-end;border-radius:8px;background:linear-gradient(180deg,#f8fafc,#f2f6f9);overflow:hidden;border:1px solid #edf2f6}.hh-bar-fill{width:100%;min-height:2px;background:linear-gradient(180deg,#03b3df,#006b9c);border-radius:6px 6px 3px 3px;position:relative;transition:height .5s var(--ease-premium),filter .18s}.hh-bar-col:hover .hh-bar-fill{filter:saturate(1.18) brightness(1.04)}.hh-bar-fill span{position:absolute;top:4px;left:50%;transform:translateX(-50%);font-size:7px;font-weight:900;color:#fff;writing-mode:vertical-rl;opacity:.92}.hh-bar-col small{font-size:8px;color:#8494a4;font-weight:800}.hh-loading{width:100%;height:100%;display:grid;place-items:center;color:#61768a;font-size:11px}.btn-spinner.dark{border-color:#cbd8e3;border-top-color:#1b5c8e}
.hh-insight-list{display:grid;gap:10px;margin-top:18px}.hh-insight-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid #e2e9ef;border-radius:13px;background:#f9fbfd}.hh-insight-list span{font-size:10px;color:#6f8091;font-weight:800}.hh-insight-list strong{font-size:12px;color:var(--navy);text-align:right}.hh-number{font-size:14px!important;color:#003f7f!important}

/* Modales y formularios más limpios */
.modal-backdrop{background:rgba(3,20,38,.62);backdrop-filter:blur(7px) saturate(120%)}.modal{border:1px solid rgba(255,255,255,.62);box-shadow:0 32px 100px rgba(0,18,40,.28)}.modal-head{padding:18px 20px}.modal-body{padding:20px}.modal-foot{padding:14px 20px}.control{border-color:#cbd8e3;background:#fff;box-shadow:inset 0 1px 2px rgba(17,52,83,.025)}.control:hover{border-color:#b8cada}.control:focus{border-color:#39a7d0;box-shadow:0 0 0 4px rgba(0,167,216,.10),0 5px 16px rgba(0,86,129,.05)}
.btn{position:relative;overflow:hidden;letter-spacing:.003em}.btn:active{transform:translateY(0) scale(.985)}.btn-primary{background:linear-gradient(135deg,#00356f,#00659a)}.btn-ghost{background:#f8fafc}.icon-btn{display:grid;place-items:center;padding:0;transition:all .18s var(--ease-premium)}

/* Microinteracciones */
.portal-view.view-enter{animation:v24View .38s var(--ease-premium) both}@keyframes v24View{from{opacity:0;transform:translateY(10px) scale(.995)}to{opacity:1;transform:none}}
.metric-card,.card,.table-wrap,.module-card{transition:transform .22s var(--ease-premium),box-shadow .22s var(--ease-premium),border-color .2s ease}.metric-card:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(2,40,78,.10)}
.nav-item svg,.btn svg,.hero-action svg{transition:transform .2s var(--ease-premium)}.nav-item:hover .nav-icon svg{transform:scale(1.08)}.btn:hover svg{transform:translateX(1px)}
.modal-backdrop .modal{transition:transform .3s cubic-bezier(.16,1,.3,1),opacity .2s ease}.modal-backdrop.modal-visible .modal{animation:v24Modal .32s cubic-bezier(.16,1,.3,1)}@keyframes v24Modal{from{transform:translateY(24px) scale(.975);opacity:.65}to{transform:none;opacity:1}}

@media(max-width:1100px){.hero-admin-v24{align-items:flex-start;flex-direction:column}.hero-actions{justify-content:flex-start}.hh-layout{grid-template-columns:1fr}.hh-chart-card,.hh-insight-card{min-height:auto}}
@media(max-width:760px){
  .mobile-menu{display:grid!important;place-items:center}.admin-brand img{width:112px}.portal-content{padding-top:16px}.hero-admin-v24{padding:22px 18px;border-radius:20px}.hero-admin-v24 h1{font-size:29px}.hero-actions{width:100%;display:grid;grid-template-columns:1fr}.hero-action{min-width:0;width:100%}
  .metric-grid,.hh-summary-grid{grid-template-columns:1fr 1fr}.metric-card{padding:15px}.metric-head{align-items:flex-start;flex-direction:column;gap:7px}.metric-icon{width:32px;height:32px}.metric-card .value{font-size:28px!important;margin-top:8px!important}
  .hh-toolbar{align-items:stretch;flex-direction:column}.hh-toolbar .field{width:100%}.hh-toolbar-actions{display:grid;grid-template-columns:1fr 1fr}.hh-chart{gap:3px}.hh-bar-col{min-width:20px}.hh-insight-list>div{padding:12px}
  #selfSignatureCanvas{height:220px;min-height:220px}.page-title{gap:10px}.page-title>span.status-chip{margin-top:4px;flex:0 0 auto}
  .row-actions{min-width:210px}.action-icon-btn span{display:none}.action-icon-btn{width:38px;padding:0!important}
}
@media(max-width:460px){.metric-grid,.hh-summary-grid{grid-template-columns:1fr 1fr;gap:9px}.metric-card{border-radius:15px}.metric-head{font-size:8px}.metric-card .meta{font-size:9px!important}.hh-toolbar-actions{grid-template-columns:1fr}.topbar-actions{gap:4px}.master-control-badge{display:none!important}.hh-bar-col{min-width:18px}.hh-chart{height:220px}.hh-bar-track{height:180px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* V2.4.1 — cierre de sesión robusto y compatibilidad móvil */
.mobile-logout-btn{display:none;width:42px;height:42px;min-width:42px;border:1px solid #dce5ef;background:#fff;color:#8f2f3a;border-radius:12px;align-items:center;justify-content:center;padding:0;box-shadow:0 4px 14px rgba(10,42,73,.06);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mobile-logout-btn svg{width:18px;height:18px;pointer-events:none}.mobile-logout-btn:active{transform:scale(.96);background:#fff2f2;border-color:#f4c4c8}
.logout,.mobile-menu,.mobile-logout-btn,.top-user-button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.logout-screen{position:fixed;inset:0;z-index:10000;background:rgba(248,251,254,.96);backdrop-filter:blur(12px);display:grid;place-items:center;padding:24px}.logout-screen-card{min-width:220px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:28px 24px;border:1px solid #dce7f0;border-radius:22px;background:#fff;box-shadow:0 24px 70px rgba(0,47,108,.16);color:var(--navy)}.logout-screen-card strong{font-size:16px}.logout-screen-card small{color:var(--muted);font-size:11px}.logout-spinner{width:30px;height:30px;border:3px solid #d9e8f2;border-top-color:var(--cyan);border-radius:50%;animation:logoutSpin .7s linear infinite}@keyframes logoutSpin{to{transform:rotate(360deg)}}.session-logout-active{overflow:hidden!important}
@media(max-width:760px){
  .sidebar{height:100dvh!important;min-height:100dvh!important;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(16px,env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
  .sidebar-foot{padding-bottom:max(2px,env(safe-area-inset-bottom))}
  .mobile-logout-btn{display:inline-flex}
  .portal-topbar{padding-top:env(safe-area-inset-top);height:calc(68px + env(safe-area-inset-top));min-height:calc(68px + env(safe-area-inset-top))}
  .nav-item,.mobile-menu,.mobile-logout-btn,.top-user-button{min-height:44px}
}
@media(max-width:390px){.mobile-logout-btn{width:40px;height:40px;min-width:40px}.top-user .avatar{width:36px;height:36px}}

/* =====================================================================
   V2.5.0 — Rediseño visual corporativo premium ESCEM
   Enfoque: estética alineada con la web principal, mejor jerarquía,
   microinteracciones más suaves y navegación más profesional.
   ===================================================================== */
:root{
  --premium-bg:#f4f7fb;
  --premium-bg-2:#eef3f8;
  --premium-surface:#ffffff;
  --premium-surface-2:#f9fbfd;
  --premium-line:#dbe5ef;
  --premium-line-soft:#e8eef5;
  --premium-navy:#072a58;
  --premium-navy-2:#0a3a74;
  --premium-cyan:#00a7d8;
  --premium-cyan-2:#0cc2ef;
  --premium-gold:#f4a51c;
  --premium-gold-2:#ffbf47;
  --premium-text:#162535;
  --premium-muted:#607286;
  --shadow-premium:0 20px 60px rgba(7,35,76,.10);
  --shadow-premium-lg:0 30px 80px rgba(7,35,76,.16);
  --shadow-premium-sm:0 8px 28px rgba(7,35,76,.08);
  --ease-premium:cubic-bezier(.16,1,.3,1);
}
html,body{background:
  radial-gradient(circle at top right, rgba(12,194,239,.08), transparent 24%),
  radial-gradient(circle at left 30%, rgba(244,165,28,.07), transparent 18%),
  linear-gradient(180deg,#f9fbfd 0%, #f3f7fb 100%);
  color:var(--premium-text);
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:
 linear-gradient(120deg,rgba(255,255,255,.68),rgba(255,255,255,0) 24%,rgba(255,255,255,.28) 46%,rgba(255,255,255,0) 70%);
 opacity:.42;z-index:-1}
*{scrollbar-width:thin;scrollbar-color:#c1d1df #f5f8fb}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#c7d5e2;border-radius:999px;border:2px solid #f6f9fc}
*::-webkit-scrollbar-track{background:#f6f9fc}

/* Tipografía y transiciones globales */
button,input,select,textarea,.card,.module-card,.stat-card,.table-wrap,.access-option,.nav-item,.hero-action,.top-user-button,.icon-btn,.btn,.record-card,.setting-card,.area-card{
  transition:transform .22s var(--ease-premium), box-shadow .24s var(--ease-premium), border-color .22s ease, background .22s ease, color .2s ease, opacity .2s ease;
}
.control,
select.control,
textarea.control{
  border-radius:16px;
  min-height:50px;
  border-color:#cad7e4;
  background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
}
.control:hover{border-color:#b8cbe0}
.control:focus{border-color:#1ca7d3;box-shadow:0 0 0 4px rgba(0,167,216,.12), 0 12px 28px rgba(10,55,97,.08)}
.btn{
  min-height:46px;
  border-radius:15px;
  font-weight:900;
  letter-spacing:.01em;
}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.18),rgba(255,255,255,0) 38%,rgba(255,255,255,.10) 58%,rgba(255,255,255,0) 100%);opacity:0;transition:opacity .25s ease}
.btn:hover::after{opacity:1}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,#082f67 0%,#0a4b87 48%,#0f6ea5 100%);box-shadow:0 14px 34px rgba(0,47,108,.22)}
.btn-orange{background:linear-gradient(135deg,#d88900 0%,#f0a117 60%,#ffc247 100%);box-shadow:0 14px 34px rgba(244,165,28,.25)}
.btn-cyan{background:linear-gradient(135deg,#008ab4 0%,#00a7d8 55%,#1bc4ee 100%);box-shadow:0 14px 30px rgba(0,167,216,.20)}
.btn-ghost{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid #d9e4ef;color:var(--premium-navy)}
.btn-ghost:hover{background:#fff;box-shadow:var(--shadow-premium-sm)}
.btn-danger{background:linear-gradient(180deg,#fff7f6,#fff1f0)}
.icon-btn,.mobile-menu,.mobile-logout-btn{box-shadow:0 8px 20px rgba(7,35,76,.06)}
.notice{border-radius:15px}

/* Acceso principal / selector de acceso */
.portal-entry-page{background:linear-gradient(180deg,#f8fbfe 0%,#f2f7fb 100%)}
.entry-topbar{
  height:78px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(16px) saturate(130%);
  border-bottom:1px solid rgba(217,229,238,.92);
  box-shadow:0 6px 30px rgba(7,35,76,.04);
}
.entry-brand strong{font-size:15px;color:#093767}
.entry-site-link{padding:9px 12px;border-radius:999px;border:1px solid #dde7f0;background:rgba(255,255,255,.8)}
.entry-stage{min-height:calc(100dvh - 78px);grid-template-columns:minmax(0,1.12fr) minmax(480px,.88fr)}
.entry-visual{
  padding:clamp(48px,5.8vw,88px);
  background-image:
   linear-gradient(90deg,rgba(3,24,55,.94) 0%,rgba(4,39,84,.88) 34%,rgba(0,72,122,.58) 72%,rgba(0,140,180,.34) 100%),
   url('images/portal-hero.webp');
}
.entry-visual::after{box-shadow:0 0 0 110px rgba(255,255,255,.020),0 0 0 220px rgba(255,255,255,.010)}
.entry-photo-logo{width:min(320px,50%);max-height:112px;margin-bottom:28px}
.entry-visual-copy h1{font-size:clamp(52px,5.7vw,86px);line-height:.94;margin:15px 0 16px}
.entry-visual-copy h1 span{color:#9fe7ff}
.entry-visual-copy p{font-size:16px;line-height:1.72;max-width:560px}
.entry-capabilities span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);font-size:10px}
.entry-access-side{
  position:relative;
  padding:54px clamp(26px,5vw,82px);
  background:
    radial-gradient(circle at top left, rgba(0,167,216,.07), transparent 20%),
    radial-gradient(circle at bottom right, rgba(244,165,28,.08), transparent 18%),
    linear-gradient(180deg,#f7fbfe 0%,#eef4fa 100%);
}
.entry-access-side::before{content:"";position:absolute;inset:26px;pointer-events:none;border-radius:38px;border:1px solid rgba(219,229,239,.8);background:linear-gradient(180deg,rgba(255,255,255,.36),rgba(255,255,255,.06));box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.entry-access-card{position:relative;z-index:1;width:min(560px,100%);padding:34px 30px;border-radius:30px;background:rgba(255,255,255,.72);backdrop-filter:blur(12px) saturate(145%);border:1px solid rgba(217,228,237,.92);box-shadow:0 24px 60px rgba(7,35,76,.10)}
.access-heading h2,.login-role-head h2{font-size:clamp(34px,3vw,46px);margin:8px 0 10px;line-height:1.02;letter-spacing:-.042em}
.access-heading p,.login-role-head p{font-size:13px;color:#66798b}
.access-options{gap:14px}
.access-option{
  grid-template-columns:62px 1fr 30px;
  padding:18px 18px;
  border-radius:22px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  border:1px solid #d8e4ef;
  box-shadow:0 14px 28px rgba(7,35,76,.06);
}
.access-option:hover{transform:translateY(-4px);border-color:#9fd8ea;box-shadow:0 24px 50px rgba(7,35,76,.12)}
.access-option.admin-option:hover{border-color:#f1cb7b;box-shadow:0 24px 50px rgba(141,97,0,.12)}
.access-option-icon{width:62px;height:62px;border-radius:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.worker-icon{background:linear-gradient(135deg,#e6f9fd,#d4f2fb);color:#0284a8}
.admin-icon{background:linear-gradient(135deg,#fff6e1,#fff0c4);color:#a76a03}
.access-option-copy strong{font-size:16px}
.access-option-copy small{font-size:11px;line-height:1.55}
.login-role-head{padding:0 0 6px;margin-bottom:24px}
.login-role-icon{box-shadow:0 12px 24px rgba(7,35,76,.08)}
.entry-login-form .control{min-height:54px;border-radius:16px}
.entry-privacy{margin-top:26px;padding-top:18px}
.back-access{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:#f8fafc;border:1px solid #dee8f1}

/* Login administrativo */
.auth-page{background:linear-gradient(180deg,#f7fbfe 0%,#eef4fa 100%)}
.auth-form-side{position:relative}
.auth-form-side::before{content:"";position:absolute;inset:24px 18px 24px 24px;border-radius:38px;background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,.15));border:1px solid rgba(219,229,239,.9);box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.auth-card{position:relative;z-index:1;width:min(500px,100%);padding:34px;border-radius:30px;background:rgba(255,255,255,.76);backdrop-filter:blur(12px) saturate(150%);border:1px solid rgba(219,229,239,.92);box-shadow:0 22px 55px rgba(7,35,76,.10)}
.auth-copy{margin:34px 0 24px}
.auth-copy h1{font-size:clamp(36px,4vw,52px);line-height:1;letter-spacing:-.045em}
.auth-copy p{font-size:14px;line-height:1.7;color:#63778b}
.auth-links{margin-top:22px;padding-top:18px;border-top:1px solid #e6edf4}
.auth-visual{background:
 linear-gradient(90deg,rgba(5,25,56,.92) 0%,rgba(6,43,87,.90) 38%,rgba(0,92,141,.66) 100%),
 url('images/portal-hero.webp');
 background-size:cover;background-position:center center}
.auth-visual-content{max-width:680px}
.auth-visual h2{font-size:clamp(46px,5.6vw,78px);line-height:.96;margin:14px 0 18px;max-width:640px;text-shadow:0 6px 26px rgba(0,16,41,.24)}
.auth-visual p{font-size:16px;line-height:1.75;max-width:560px}
.visual-pills span{padding:10px 13px;background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);font-size:10px}

/* Shell principal */
.portal-shell,
.admin-shell{
  min-height:100vh;
  background:
    radial-gradient(circle at top right, rgba(0,167,216,.08), transparent 18%),
    linear-gradient(180deg,#f8fbfe 0%, #f2f7fb 100%);
}
.portal-shell{grid-template-columns:286px minmax(0,1fr)}
.admin-shell{grid-template-columns:300px minmax(0,1fr)}
.sidebar{
  padding:20px 16px 18px;
  border-right:1px solid rgba(255,255,255,.05);
  background:
    linear-gradient(180deg,#031f46 0%,#052a59 42%,#0b3e76 100%);
  color:#fff;
  box-shadow:18px 0 42px rgba(4,23,52,.16);
}
.sidebar::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:42px 42px;opacity:.42;mask-image:linear-gradient(180deg,black 0%,rgba(0,0,0,.2) 100%)}
.sidebar-brand{position:relative;padding:8px 12px 22px;border-bottom:1px solid rgba(255,255,255,.12)}
.sidebar-brand strong{color:#fff!important;font-size:20px}
.sidebar-brand span{color:#b7d0e4!important;font-size:10px;letter-spacing:.12em}
.sidebar-brand img{filter:drop-shadow(0 10px 20px rgba(0,0,0,.18))}
.side-nav{position:relative;gap:7px;padding-top:18px}
.nav-item{
  position:relative;
  min-height:50px;
  padding:11px 12px;
  border-radius:16px;
  color:#d3e1ee;
  background:transparent;
  font-weight:850;
}
.nav-item:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px)}
.nav-item.active{
  color:#fff;
  background:linear-gradient(90deg,rgba(255,255,255,.15),rgba(255,255,255,.08));
  box-shadow:inset 3px 0 0 var(--premium-gold), 0 14px 30px rgba(2,18,40,.14);
}
.nav-item::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:1px;background:transparent}
.nav-icon{width:30px;height:30px;border-radius:10px;background:rgba(255,255,255,.10);color:#cfe0ec}
.nav-item.active .nav-icon{background:rgba(244,165,28,.18);color:#ffd27d}
.sidebar-foot{position:relative;border-top:1px solid rgba(255,255,255,.12);padding-top:16px}
.side-status{color:#c7d8e6}
.logout{color:#ffd9dd}
.portal-main{position:relative}
.portal-topbar{
  height:82px;
  padding:0 clamp(18px,3vw,40px);
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(18px) saturate(145%);
  border-bottom:1px solid rgba(217,229,239,.86);
  box-shadow:0 8px 28px rgba(7,35,76,.04);
}
.portal-topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(0,167,216,.32),transparent)}
.portal-topbar>div>strong{font-size:18px}
.topbar-label{font-size:10px;color:#8091a3}
.top-user-button,.top-user{padding:8px 10px;border-radius:16px;background:rgba(255,255,255,.86);border:1px solid #e1e9f1;box-shadow:0 10px 24px rgba(7,35,76,.05)}
.top-user-button:hover{transform:translateY(-1px);box-shadow:0 16px 28px rgba(7,35,76,.08)}
.avatar{border-radius:14px;background:linear-gradient(135deg,#09386f,#0d71a6 74%,#11aed8);box-shadow:0 10px 22px rgba(7,35,76,.16)}
.portal-content{width:min(1260px,calc(100% - 54px));padding:32px 0 60px}
.portal-view.active-view{animation:viewPremium .36s var(--ease-premium) both}
@keyframes viewPremium{from{opacity:0;transform:translateY(12px) scale(.992)}to{opacity:1;transform:none}}

/* Paneles de bienvenida y héroes */
.welcome-panel,
.hero-admin,
.hero-admin-v24{
  border-radius:30px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:var(--shadow-premium-lg);
}
.welcome-panel{
  padding:34px 34px;
  background:
   linear-gradient(135deg,rgba(5,27,58,.96) 0%,rgba(7,47,108,.96) 44%,rgba(10,107,160,.92) 100%),
   url('images/portal-hero.webp');
  background-size:cover;
  background-position:center center;
  color:#fff;
}
.welcome-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,22,50,.22),rgba(0,0,0,0) 52%);pointer-events:none}
.welcome-panel::after{width:320px;height:320px;right:-100px;top:-120px;background:radial-gradient(circle,rgba(255,255,255,.10),transparent 70%)}
.welcome-panel h1,.welcome-panel p,.welcome-date strong,.welcome-date span{position:relative;z-index:1}
.welcome-panel h1{font-size:clamp(38px,4vw,52px);color:#fff;margin:8px 0 8px;text-shadow:0 4px 18px rgba(0,0,0,.18)}
.welcome-panel p{color:#d8e7f4;font-size:14px;max-width:620px}
.welcome-date{padding:18px 20px;border-radius:20px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px)}
.welcome-date span{color:#d2e3f3}.welcome-date strong{color:#fff;font-size:16px}
.hero-admin-v24{padding:34px 34px;background:
 linear-gradient(135deg,#052650 0%,#06356b 42%,#0b5892 70%,#0b8cb9 100%),
 url('images/portal-hero.webp');background-size:cover;background-position:center center;color:#fff;position:relative;overflow:hidden}
.hero-admin-v24::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,24,55,.42),rgba(3,24,55,0) 48%)}
.hero-admin-v24>*{position:relative;z-index:1}
.hero-admin-v24 h1{font-size:clamp(34px,4vw,50px);line-height:.98;text-shadow:0 4px 18px rgba(0,0,0,.18)}
.hero-admin-v24 p{color:#d8ebf8;font-size:14px;max-width:560px}
.hero-actions{gap:12px}
.hero-action{
  min-width:245px;
  padding:16px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.11);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(10px);
  box-shadow:0 16px 34px rgba(0,0,0,.12);
}
.hero-action:hover{transform:translateY(-3px);background:rgba(255,255,255,.15)}
.hero-action>span{width:48px;height:48px;border-radius:16px;background:rgba(255,255,255,.16)}
.hero-action strong,.hero-action small,.hero-action svg{color:#fff}

/* Secciones, tarjetas y tablas */
.section-head{margin:30px 0 14px}
.section-head h2,.card-head h2{font-size:22px;letter-spacing:-.025em}
.section-head p,.card-head p,.page-title p{font-size:13px;line-height:1.6;color:#66798b}
.page-title{margin-bottom:20px}
.page-title h1{font-size:clamp(34px,4vw,44px);letter-spacing:-.04em}
.card,
.stat-card,
.setting-card,
.table-wrap,
.records-list,
.module-card,
.journey-card,
.profile-card,
.area-card,
.profile-menu,
.compact-widget,
.filter-panel,
.detail-box,
.evidence-card,
.permission-box{
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
  border:1px solid #dce6ef;
  box-shadow:var(--shadow-premium-sm);
}
.card,.setting-card,.journey-card,.profile-card,.area-card,.table-wrap,.evidence-card,.detail-box,.permission-box{border-radius:24px}
.card{padding:22px}
.stat-card,.metric-card{border-radius:24px;padding:20px}
.metric-grid,.summary-grid{gap:14px}
.metric-head{gap:10px;font-size:11px;color:#62778b}
.metric-icon,.module-icon{box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 10px 18px rgba(7,35,76,.06)}
.metric-card .value,.stat-card .value{font-size:36px!important;line-height:1;margin-top:10px!important}
.metric-card .meta,.stat-card .meta{font-size:11px!important;line-height:1.55;color:#6f8295!important}
.module-grid{gap:16px}
.module-card{
  border-radius:24px;
  padding:22px 20px;
  grid-template-columns:56px 1fr auto;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
}
.module-card.featured{background:linear-gradient(145deg,#fff 0%,#f4fbff 55%,#ebf8fd 100%)}
.module-card:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(7,35,76,.10);border-color:#c3d8ea}
.module-icon{width:56px;height:56px;border-radius:18px}
.module-copy h3{font-size:18px;margin-bottom:5px}
.module-copy p{font-size:12px;line-height:1.6}
.module-tag{font-size:10px}
.journey-card{padding:22px 24px;gap:18px}
.time-box{padding:16px 18px;border-radius:20px;background:linear-gradient(180deg,#f8fbfd,#f3f8fc);border:1px solid #e2ebf2;min-width:150px}
.time-box span{font-size:11px;letter-spacing:.08em;color:#73869a;font-weight:900;text-transform:uppercase}
.time-box strong{font-size:24px;color:var(--premium-navy);margin-top:7px;display:block}
.journey-state,.status-chip{border-radius:999px;padding:9px 13px;font-size:11px;font-weight:900;letter-spacing:.04em}
.table-wrap{border-radius:24px;overflow:auto}
.table{min-width:900px}
.table th{background:linear-gradient(180deg,#f9fbfd,#f4f8fb);color:#5f7488;font-size:10px;letter-spacing:.08em;border-bottom:1px solid #e3ebf2}
.table td{font-size:12px;padding:13px 12px}
.table tbody tr{transition:transform .18s ease, box-shadow .18s ease, background .18s ease}
.table tbody tr:hover td{background:#fbfdff}
.table td strong{font-weight:900}
.role-badge,.status-badge,.master-control-badge{box-shadow:0 8px 18px rgba(7,35,76,.06)}
.records-list{display:grid;gap:12px;background:transparent;border:none;box-shadow:none}
.record-card{padding:18px 18px;border-radius:22px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);border:1px solid #dce6ef;box-shadow:var(--shadow-premium-sm)}
.record-card:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(7,35,76,.10)}
.profile-grid{gap:12px}
.profile-grid>div{padding:16px 16px;border-radius:18px;background:linear-gradient(180deg,#f9fbfd,#f4f8fb);border:1px solid #e2ebf2}
.profile-grid>div span{font-size:10px;letter-spacing:.09em;color:#73869a;font-weight:900;text-transform:uppercase}
.profile-grid>div strong{display:block;margin-top:8px;color:var(--premium-navy);font-size:15px}
.profile-photo-shell{box-shadow:0 18px 34px rgba(7,35,76,.10)}

/* Filtros / toolbars */
.admin-toolbar,
.hh-toolbar{
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,#fff 0%,#f8fbfd 100%);
  border:1px solid #dde6ef;
  box-shadow:var(--shadow-premium-sm);
}
.admin-toolbar .field label,.hh-toolbar .field label{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#73869a}

/* Menús, modales y overlays */
.mobile-overlay{background:rgba(4,18,38,.44);backdrop-filter:blur(6px)}
.modal-backdrop{background:rgba(3,18,39,.56);backdrop-filter:blur(10px) saturate(115%)}
.modal{
  border-radius:28px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(14px) saturate(130%);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:0 34px 90px rgba(0,18,40,.28);
}
.modal.large{max-width:min(940px,92vw)}
.modal-head{padding:20px 22px;border-bottom:1px solid rgba(220,230,239,.74)}
.modal-body{padding:22px}
.modal-foot{padding:16px 22px;border-top:1px solid rgba(220,230,239,.74)}
.modal-subtitle{font-size:12px;color:#6a7c8f;line-height:1.5}
.permission-box,.recovery-intro,.danger-panel{border-radius:20px;padding:18px}
.permission-icon,.recovery-icon,.danger-panel-icon{box-shadow:0 10px 22px rgba(7,35,76,.08)}
.toast-wrap{top:94px;right:22px}
.toast{border-radius:18px;box-shadow:0 20px 50px rgba(7,35,76,.16)}

/* Microinteracciones específicas */
.access-step{animation:premiumFade .28s var(--ease-premium) both}
@keyframes premiumFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.access-option-arrow,
.module-arrow,
.hero-action i:last-child,
.top-user-chevron{transition:transform .22s var(--ease-premium), opacity .2s ease}
.access-option:hover .access-option-arrow,
.module-card:hover .module-arrow,
.hero-action:hover i:last-child{transform:translateX(4px)}
.nav-item:hover .nav-icon svg,
.hero-action:hover span svg,
.btn:hover svg{transform:translateX(1px) scale(1.04)}
.metric-card:hover,.stat-card:hover,.card:hover,.table-wrap:hover,.setting-card:hover,.journey-card:hover{transform:translateY(-2px)}

/* Responsive premium */
@media(max-width:1180px){
  .portal-shell{grid-template-columns:262px minmax(0,1fr)}
  .admin-shell{grid-template-columns:274px minmax(0,1fr)}
  .entry-stage{grid-template-columns:1fr 1fr}
}
@media(max-width:980px){
  .entry-stage{grid-template-columns:1fr}
  .entry-visual{min-height:380px}
  .entry-access-side{padding-top:24px}
  .entry-access-side::before{display:none}
  .entry-access-card{width:min(720px,100%)}
}
@media(max-width:760px){
  .entry-topbar{height:68px;padding:0 16px}
  .entry-stage{min-height:calc(100dvh - 68px)}
  .entry-visual{padding:28px 20px;min-height:255px;background-position:58% 50%}
  .entry-photo-logo{width:170px;max-height:60px;margin-bottom:12px}
  .entry-visual-copy h1{font-size:34px;margin:10px 0}
  .entry-visual-copy p{font-size:12px;line-height:1.55;max-width:340px}
  .entry-access-side{padding:18px 16px 28px}
  .entry-access-card{padding:24px 18px;border-radius:24px}
  .access-heading h2,.login-role-head h2{font-size:30px}
  .access-option{grid-template-columns:52px 1fr 20px;padding:15px 14px;border-radius:18px}
  .access-option-icon{width:52px;height:52px;border-radius:16px}
  .auth-form-side{padding:26px 18px}
  .auth-form-side::before{display:none}
  .auth-card{padding:24px 18px;border-radius:24px}
  .portal-content{width:min(100% - 18px,100%);padding:18px 0 38px}
  .portal-topbar{height:74px;padding:0 12px}
  .sidebar{width:min(300px,86vw);padding:16px 14px}
  .welcome-panel,.hero-admin-v24{padding:24px 20px;border-radius:24px}
  .welcome-panel h1{font-size:30px}
  .page-title h1{font-size:30px}
  .section-head h2,.card-head h2{font-size:20px}
  .metric-grid,.summary-grid{grid-template-columns:1fr 1fr}
  .metric-card,.stat-card,.module-card,.journey-card,.card{border-radius:20px}
  .module-card{padding:18px 16px}
  .hero-actions{grid-template-columns:1fr;width:100%}
  .hero-action{min-width:0;width:100%}
  .admin-toolbar,.hh-toolbar{padding:14px;border-radius:20px}
  .modal,.modal.large{border-radius:24px 24px 0 0}
  .modal-body{padding:18px}
  .modal-head{padding:16px 18px}
  .modal-foot{padding:14px 18px}
}
@media(max-width:460px){
  .metric-grid,.summary-grid{gap:10px}
  .metric-card .value,.stat-card .value{font-size:28px!important}
  .metric-card,.stat-card{padding:16px}
  .time-box{min-width:0;padding:14px}
  .time-box strong{font-size:21px}
  .page-title h1{font-size:28px}
  .top-user-button,.top-user{padding:6px 8px}
}


/* V2.5.1 — robustez GPS + fotografía móvil */
.photo-capture-state{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding:10px 12px;border-radius:14px;font-size:11px;font-weight:850;line-height:1.4;text-align:left}
.photo-capture-state svg{width:16px;height:16px;flex:0 0 auto}
.photo-capture-state.pending{background:#eff8ff;border:1px solid #c7e9f7;color:#0b6080}
.photo-capture-state.ok{background:#ecfdf3;border:1px solid #b7ebc9;color:#166534}
.photo-capture-state.danger{background:#fff1f0;border:1px solid #f6c5c1;color:#b42318}
.photo-capture-state.pending .lucide-loader-circle{animation:photoSpin .8s linear infinite}@keyframes photoSpin{to{transform:rotate(360deg)}}
.photo-preview{display:block;max-height:340px;object-fit:contain;background:#eef3f8;box-shadow:0 12px 28px rgba(7,35,76,.08)}
.location-live{min-height:78px}
.location-copy{min-width:0}.location-copy>div{min-width:0}.location-live small{overflow-wrap:anywhere}
@media(max-width:760px){.photo-drop{padding:14px;border-radius:20px}.photo-preview{max-height:360px}.location-live{padding:15px;border-radius:20px}.photo-capture-state{justify-content:flex-start;font-size:11px}}

/* =====================================================================
   V2.5.3 — MOBILE EXCELLENCE OVERHAUL
   Objetivo: interfaz móvil compacta, ordenada y app-like en iOS/Android.
   Mantiene escritorio intacto y optimiza <= 760 px.
   ===================================================================== */
@media(max-width:760px){
  :root{
    --mobile-pad:14px;
    --mobile-radius:18px;
    --mobile-gap:12px;
  }
  html{background:#f4f7fb}
  body{background:linear-gradient(180deg,#f7fafd 0%,#f2f6fa 100%);overflow-x:hidden}
  body::before{display:none}

  /* Barra superior: más compacta, limpia y estable en iOS */
  .portal-topbar{
    height:64px!important;
    min-height:64px!important;
    padding:env(safe-area-inset-top) var(--mobile-pad) 0!important;
    box-sizing:content-box;
    gap:9px;
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(18px) saturate(140%);
    box-shadow:0 4px 18px rgba(7,35,76,.055);
  }
  .portal-topbar>div:nth-child(2){min-width:0;flex:1}
  .portal-topbar>div:nth-child(2)>strong{font-size:18px!important;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar-label{display:none!important}
  .mobile-menu,.mobile-logout-btn{
    width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
    border-radius:13px!important;background:#fff!important;border:1px solid #dce6ef!important;
    box-shadow:0 5px 14px rgba(7,35,76,.06)!important;
  }
  .mobile-menu svg,.mobile-logout-btn svg{width:19px;height:19px}
  .top-user,.top-user-button{
    padding:4px!important;border-radius:13px!important;background:transparent!important;border:0!important;box-shadow:none!important;gap:3px!important;
  }
  .top-user .avatar,.top-user-button .avatar{width:42px!important;height:42px!important;border-radius:13px!important;font-size:15px!important}
  .top-user-chevron{display:none}
  .topbar-actions{gap:4px!important}

  /* Contenedor móvil: sin márgenes gigantes */
  .portal-content{
    width:100%!important;
    padding:16px var(--mobile-pad) calc(32px + env(safe-area-inset-bottom))!important;
    margin:0!important;
  }
  .portal-view{max-width:100%;overflow:visible}
  .portal-view.active-view{animation:mobileViewIn .28s var(--ease-premium) both}
  @keyframes mobileViewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  /* Navegación lateral */
  .sidebar{
    width:min(292px,84vw)!important;
    padding:14px 12px max(14px,env(safe-area-inset-bottom))!important;
    border-radius:0 22px 22px 0;
    box-shadow:24px 0 70px rgba(2,20,48,.28)!important;
  }
  .sidebar-brand{padding:8px 10px 16px!important}
  .sidebar-brand img{width:112px!important;height:auto!important;max-height:46px!important;object-fit:contain!important}
  .sidebar-brand>div{display:none}
  .side-nav{padding-top:14px!important;gap:6px!important}
  .nav-item{min-height:46px!important;border-radius:14px!important;padding:9px 10px!important;font-size:14px!important}
  .nav-icon{width:30px!important;height:30px!important;border-radius:10px!important}
  .sidebar-foot{padding-top:12px!important}

  /* Títulos y espaciado */
  .page-title{margin:0 0 14px!important;display:flex;align-items:flex-start;gap:10px}
  .page-title>div{min-width:0;flex:1}
  .page-title .kicker{font-size:9px!important;letter-spacing:.14em!important}
  .page-title h1{font-size:28px!important;line-height:1.03!important;margin:7px 0 6px!important;letter-spacing:-.035em!important}
  .page-title p{font-size:13px!important;line-height:1.45!important;margin:0!important;color:#647689!important}
  .page-title>.btn{min-height:42px;padding:9px 11px;border-radius:13px;flex:0 0 auto;font-size:12px}
  .section-head{margin:22px 0 10px!important;align-items:center!important;gap:10px!important}
  .section-head>div{min-width:0}
  .section-head h2{font-size:19px!important;line-height:1.1!important;margin:0!important}
  .section-head p{font-size:12px!important;line-height:1.4!important;margin-top:4px!important}
  .section-head>.btn{min-height:40px!important;padding:8px 11px!important;font-size:11px!important;flex:0 0 auto}

  /* Dashboard admin: héroe compacto, no una pantalla entera */
  .hero-admin-v24{
    padding:20px 18px!important;
    min-height:0!important;
    border-radius:22px!important;
    gap:16px!important;
    background-position:center 48%!important;
    box-shadow:0 16px 36px rgba(4,35,76,.16)!important;
  }
  .hero-admin-v24>div:first-child{width:100%}
  .hero-admin-v24 .kicker{font-size:9px!important}
  .hero-admin-v24 h1{font-size:31px!important;line-height:.98!important;margin:8px 0 7px!important}
  .hero-admin-v24 p{font-size:12px!important;line-height:1.45!important;max-width:310px!important}
  .hero-actions{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
  }
  .hero-action{
    width:100%!important;min-width:0!important;min-height:92px!important;
    padding:11px!important;border-radius:16px!important;gap:9px!important;
    display:grid!important;grid-template-columns:38px 1fr!important;align-items:center!important;
    box-shadow:none!important;
  }
  .hero-action>span{width:38px!important;height:38px!important;border-radius:12px!important;grid-row:1/3}
  .hero-action>span svg{width:19px!important;height:19px!important}
  .hero-action>div{min-width:0}
  .hero-action strong{font-size:12px!important;line-height:1.15!important;display:block}
  .hero-action small{font-size:9px!important;line-height:1.25!important;display:block;margin-top:3px;opacity:.86}
  .hero-action>svg,.hero-action>i:last-child{display:none!important}

  /* Dashboard personal: saludo compacto */
  .welcome-panel{
    padding:20px 18px!important;
    min-height:150px!important;
    border-radius:22px!important;
    align-items:flex-end!important;
    background-position:56% center!important;
  }
  .welcome-panel h1{font-size:29px!important;line-height:1!important;margin:7px 0 6px!important}
  .welcome-panel p{font-size:12px!important;line-height:1.4!important;max-width:290px!important}
  .welcome-date{display:none!important}

  /* Métricas compactas 2x2 */
  .summary-grid,.metric-grid,.hh-summary-grid{
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-top:10px!important;
  }
  .stat-card,.metric-card{
    min-width:0!important;padding:14px!important;border-radius:17px!important;box-shadow:0 8px 22px rgba(7,35,76,.055)!important;
  }
  .metric-head{display:flex!important;flex-direction:row!important;align-items:center!important;gap:7px!important;font-size:9px!important;line-height:1.2!important;letter-spacing:.035em!important}
  .metric-icon{width:30px!important;height:30px!important;min-width:30px!important;border-radius:10px!important}
  .metric-icon svg{width:15px!important;height:15px!important}
  .metric-card .value,.stat-card .value{font-size:27px!important;margin-top:10px!important;line-height:1!important}
  .metric-card .meta,.stat-card .meta{font-size:9px!important;line-height:1.35!important;margin-top:4px!important}

  /* Tarjetas y módulos */
  .card{padding:14px!important;border-radius:18px!important;box-shadow:0 8px 22px rgba(7,35,76,.055)!important}
  .module-grid{grid-template-columns:1fr!important;gap:10px!important}
  .module-card{padding:14px!important;border-radius:17px!important;grid-template-columns:44px 1fr 22px!important;gap:11px!important}
  .module-icon{width:44px!important;height:44px!important;border-radius:14px!important}
  .module-icon svg{width:20px!important;height:20px!important}
  .module-copy h3{font-size:15px!important;margin:2px 0 2px!important}
  .module-copy p{font-size:10px!important;line-height:1.35!important}
  .module-tag{font-size:8px!important}
  .module-arrow svg{width:17px!important;height:17px!important}

  /* Jornada */
  .journey-card{padding:14px!important;border-radius:18px!important;align-items:stretch!important;gap:10px!important}
  .journey-times{width:100%!important;gap:8px!important;display:grid!important;grid-template-columns:1fr 1fr!important}
  .time-divider{display:none!important}
  .time-box{min-width:0!important;padding:12px!important;border-radius:14px!important}
  .time-box span{font-size:8px!important}
  .time-box strong{font-size:20px!important;margin-top:4px!important}
  .journey-state{align-self:stretch!important;text-align:center!important;padding:8px 10px!important;font-size:9px!important}
  .today-row{grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:12px!important}
  .today-row .time-box{padding:12px!important;border-radius:14px!important}
  .attendance-action{margin-top:10px!important;padding:12px!important;border-radius:15px!important}
  .attendance-action .notice{margin-bottom:9px!important}
  .big-mark{min-height:52px!important;border-radius:14px!important;font-size:14px!important}

  /* Filtros: no más fechas superpuestas ni controles desbordados */
  #attendanceView>.card{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
  .admin-toolbar{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    padding:12px!important;
    border-radius:17px!important;
    align-items:end!important;
  }
  .admin-toolbar .field,.admin-toolbar .search{min-width:0!important;width:100%!important;flex:none!important}
  .admin-toolbar .field label{font-size:9px!important;letter-spacing:.1em!important;margin-bottom:1px}
  .admin-toolbar .control{
    width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;
    min-height:46px!important;height:46px!important;border-radius:13px!important;padding:8px 10px!important;font-size:14px!important;
  }
  .admin-toolbar input[type=date],.admin-toolbar input[type=month]{
    -webkit-appearance:none!important;appearance:none!important;min-width:0!important;text-align:left!important;
  }
  .admin-toolbar .search{grid-column:1/-1!important}
  .admin-toolbar>.btn{width:100%!important;min-height:44px!important;border-radius:13px!important;font-size:12px!important;margin:0!important}
  #attendanceView .admin-toolbar>.btn:nth-last-child(2){grid-column:1/2!important}
  #attendanceView .admin-toolbar>.btn:last-child{grid-column:2/3!important}
  #peopleView .admin-toolbar{grid-template-columns:1fr!important}
  #peopleView .admin-toolbar .search{grid-column:auto!important}

  /* HORAS HOMBRE: toolbar y gráfico adaptados */
  .hh-toolbar{padding:12px!important;border-radius:17px!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .hh-toolbar .field{width:100%!important;min-width:0!important}
  .hh-toolbar .control{width:100%!important;min-width:0!important;height:46px!important;min-height:46px!important;border-radius:13px!important}
  .hh-toolbar-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;width:100%!important}
  .hh-toolbar-actions .btn{width:100%!important;min-height:44px!important;font-size:11px!important;padding:8px 9px!important}
  .hh-layout{grid-template-columns:1fr!important;gap:10px!important}
  .hh-chart-card,.hh-insight-card{min-height:0!important;padding:14px!important}
  .hh-chart{height:190px!important;margin-top:10px!important;gap:3px!important;padding-bottom:2px!important}
  .hh-bar-track{height:150px!important}
  .hh-bar-col{min-width:18px!important}
  .hh-bar-col small{font-size:7px!important}
  .chart-legend{font-size:8px!important}
  .hh-insight-list{gap:8px!important;margin-top:10px!important}
  .hh-insight-list>div{padding:10px 11px!important;border-radius:12px!important}
  .hh-insight-list span{font-size:9px!important}.hh-insight-list strong{font-size:10px!important}

  /* ====================== TABLAS -> TARJETAS MÓVILES ====================== */
  .table-wrap.table-card{
    overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;
  }
  .table-wrap.table-card .table{display:block!important;min-width:0!important;width:100%!important;border:0!important;background:transparent!important}
  .table-wrap.table-card .table thead{display:none!important}
  .table-wrap.table-card .table tbody{display:grid!important;gap:10px!important;width:100%!important}
  .table-wrap.table-card .table tbody tr{
    display:grid!important;width:100%!important;min-width:0!important;
    padding:12px!important;border:1px solid #dce6ef!important;border-radius:17px!important;
    background:linear-gradient(180deg,#fff,#fbfdff)!important;box-shadow:0 7px 20px rgba(7,35,76,.055)!important;
    overflow:hidden!important;
  }
  .table-wrap.table-card .table tbody td{
    display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;
    width:100%!important;min-width:0!important;height:auto!important;min-height:34px!important;
    padding:7px 0!important;border:0!important;border-bottom:1px solid #eef3f7!important;
    background:transparent!important;font-size:11px!important;text-align:right!important;overflow-wrap:anywhere;
  }
  .table-wrap.table-card .table tbody td:last-child{border-bottom:0!important;padding-bottom:0!important}
  .table-wrap.table-card .table tbody td::before{
    flex:0 0 auto;content:"";font-size:8px;line-height:1.2;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:#7d8ea0;text-align:left;
  }
  .table-wrap.table-card .table tbody td>*{max-width:68%}
  .table-wrap.table-card .person-cell{min-width:0!important;max-width:72%!important;text-align:left!important}
  .table-wrap.table-card .person-avatar{width:32px!important;height:32px!important;border-radius:10px!important}
  .table-wrap.table-card .record-meta{font-size:9px!important;line-height:1.25!important}
  .table-wrap.table-card .status-chip{font-size:8px!important;padding:5px 7px!important}
  .table-wrap.table-card .btn{min-height:38px!important;width:auto!important;font-size:10px!important;padding:7px 10px!important;margin-left:auto!important}

  /* Dashboard: últimos movimientos */
  #dashboardView .table-card .table tbody td:nth-child(1)::before{content:"Hora"}
  #dashboardView .table-card .table tbody td:nth-child(2)::before{content:"Usuario"}
  #dashboardView .table-card .table tbody td:nth-child(3)::before{content:"Tipo"}
  #dashboardView .table-card .table tbody td:nth-child(4)::before{content:"Área"}
  #dashboardView .table-card .table tbody td:nth-child(5)::before{content:"GPS"}
  #dashboardView .table-card .table tbody td:nth-child(6)::before{content:"Estado"}

  /* Asistencias */
  #attendanceView .table-card .table tbody td:nth-child(1)::before{content:"Fecha"}
  #attendanceView .table-card .table tbody td:nth-child(2)::before{content:"Usuario"}
  #attendanceView .table-card .table tbody td:nth-child(3)::before{content:"Área"}
  #attendanceView .table-card .table tbody td:nth-child(4)::before{content:"Entrada"}
  #attendanceView .table-card .table tbody td:nth-child(5)::before{content:"Salida"}
  #attendanceView .table-card .table tbody td:nth-child(6)::before{content:"GPS"}
  #attendanceView .table-card .table tbody td:nth-child(7)::before{content:"Estado"}
  #attendanceView .table-card .table tbody td:nth-child(8)::before{content:"Acción"}

  /* Usuarios */
  #peopleView .table-card .table tbody td:nth-child(1)::before{content:"Nombre"}
  #peopleView .table-card .table tbody td:nth-child(2)::before{content:"DNI"}
  #peopleView .table-card .table tbody td:nth-child(3)::before{content:"Área"}
  #peopleView .table-card .table tbody td:nth-child(4)::before{content:"Usuario"}
  #peopleView .table-card .table tbody td:nth-child(5)::before{content:"Acceso"}
  #peopleView .table-card .table tbody td:nth-child(6)::before{content:"Estado"}
  #peopleView .table-card .table tbody td:nth-child(7)::before{content:"Acciones"}
  #peopleView .row-actions{display:flex!important;justify-content:flex-end!important;flex-wrap:wrap!important;gap:6px!important;max-width:72%!important;min-width:0!important}
  #peopleView .row-actions .btn{width:38px!important;min-width:38px!important;padding:0!important}

  /* HH por usuario */
  #hoursView .table-card .table tbody td:nth-child(1)::before{content:"Usuario"}
  #hoursView .table-card .table tbody td:nth-child(2)::before{content:"Perfil"}
  #hoursView .table-card .table tbody td:nth-child(3)::before{content:"Días"}
  #hoursView .table-card .table tbody td:nth-child(4)::before{content:"Horas"}
  #hoursView .table-card .table tbody td:nth-child(5)::before{content:"Promedio"}
  #hoursView .table-card .table tbody td:nth-child(6)::before{content:"Incompletas"}

  /* Empty states dentro de tablas */
  .table-wrap.table-card .table tbody tr:has(.empty){display:block!important;padding:0!important}
  .table-wrap.table-card .table tbody tr:has(.empty) td{display:block!important;padding:0!important;border:0!important;max-width:none!important;text-align:center!important}
  .table-wrap.table-card .table tbody tr:has(.empty) td::before{display:none!important}
  .table-wrap.table-card .empty{padding:28px 18px!important}

  /* Registros recientes */
  .record-card{padding:12px!important;border-radius:16px!important;gap:9px!important;align-items:flex-start!important}
  .record-leading{gap:9px!important;min-width:0!important}
  .record-leading>div{min-width:0!important}
  .record-type-icon{width:34px!important;height:34px!important;border-radius:11px!important}
  .record-card strong{font-size:12px!important}
  .record-card .record-meta{font-size:9px!important;line-height:1.35!important;overflow-wrap:anywhere}
  .record-card>.status-chip{font-size:7px!important;padding:5px 6px!important;flex:0 0 auto!important}

  /* Perfil */
  .profile-card{padding:14px!important}
  .profile-identity{gap:12px!important;padding-bottom:14px!important;align-items:center!important}
  .profile-photo-shell,.profile-photo-shell .avatar.large,.profile-photo{width:72px!important;height:72px!important;border-radius:20px!important}
  .profile-photo-edit{width:30px!important;height:30px!important;border-radius:10px!important}
  .profile-identity h2{font-size:18px!important;line-height:1.15!important}
  .profile-identity p{font-size:10px!important}
  .profile-identity .hint{font-size:9px!important;line-height:1.3!important;display:block;margin-top:4px}
  .profile-grid{grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:12px!important}
  .profile-grid>div{padding:11px!important;border-radius:13px!important}
  .profile-grid>div span{font-size:8px!important}.profile-grid>div strong{font-size:11px!important;margin-top:4px!important}

  /* Configuración / áreas */
  .settings-grid{grid-template-columns:1fr!important;gap:10px!important}
  .setting-card{padding:14px!important;border-radius:17px!important}
  .setting-title-row{gap:10px!important}
  .setting-title-row h3{font-size:14px!important}.setting-title-row p{font-size:10px!important;line-height:1.35!important;margin-top:3px!important}
  .setting-icon{width:38px!important;height:38px!important;border-radius:12px!important}
  .area-card{padding:13px!important;border-radius:16px!important}
  .area-card>.btn{min-height:40px!important}
  #areasView .page-title,#peopleView .page-title{align-items:flex-start!important}
  #areasView .page-title>.btn,#peopleView .page-title>.btn{font-size:0!important;width:42px!important;height:42px!important;padding:0!important}
  #areasView .page-title>.btn svg,#peopleView .page-title>.btn svg{width:18px!important;height:18px!important}

  /* Modales: hoja móvil a pantalla completa, sin superposición de footer */
  .modal-backdrop{
    padding:0!important;align-items:flex-end!important;overflow:hidden!important;
    background:rgba(3,18,39,.50)!important;
  }
  .modal,.modal.large,.compact-modal{
    width:100%!important;max-width:100%!important;max-height:calc(100dvh - env(safe-area-inset-top))!important;
    height:auto!important;border-radius:22px 22px 0 0!important;
    display:flex!important;flex-direction:column!important;overflow:hidden!important;
  }
  .modal-head{
    flex:0 0 auto!important;padding:14px 15px!important;position:relative!important;top:auto!important;
    background:rgba(255,255,255,.98)!important;
  }
  .modal-head h3{font-size:18px!important;line-height:1.15!important}
  .modal-kicker{font-size:8px!important}
  .modal-body{
    flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;
    padding:14px 15px 24px!important;overscroll-behavior:contain!important;
  }
  .modal-foot{
    position:relative!important;flex:0 0 auto!important;bottom:auto!important;padding:10px 15px max(10px,env(safe-area-inset-bottom))!important;
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;background:rgba(255,255,255,.98)!important;
    box-shadow:0 -8px 24px rgba(7,35,76,.06)!important;
  }
  .modal-foot .btn{width:100%!important;min-height:46px!important;margin:0!important;border-radius:13px!important}
  .modal-foot .btn:only-child{grid-column:1/-1!important}
  .form-grid.two,.detail-grid,.evidence-grid{grid-template-columns:1fr!important;gap:9px!important}
  .modal .field{gap:5px!important}
  .modal .field label{font-size:10px!important}
  .modal .control{min-height:46px!important;border-radius:13px!important;font-size:14px!important;padding:8px 10px!important}
  .modal textarea.control{min-height:86px!important;height:auto!important}
  .location-live{min-height:0!important;padding:12px!important;border-radius:15px!important;gap:8px!important}
  .location-copy{gap:8px!important}.location-copy strong{font-size:12px!important}.location-copy small{font-size:9px!important;line-height:1.35!important}
  .location-actions{width:auto!important}
  .location-actions .btn{min-height:38px!important}
  .photo-drop{padding:12px!important;border-radius:16px!important}
  .photo-drop .btn{min-height:46px!important;width:100%!important}
  .photo-preview{max-height:250px!important;border-radius:13px!important;margin-top:10px!important}
  .photo-capture-state{font-size:9px!important;padding:8px 9px!important;border-radius:11px!important}
  .signature-wrap{border-radius:16px!important;overflow:hidden!important}
  .signature-head{padding:9px 10px!important;gap:8px!important}
  .signature-head span{font-size:9px!important}
  #signatureCanvas,#selfSignatureCanvas{height:170px!important;min-height:170px!important;width:100%!important;touch-action:none!important}
  .permission-box,.recovery-intro,.danger-panel{padding:13px!important;border-radius:15px!important}
  .attendance-person-head{padding:12px!important;border-radius:15px!important;gap:10px!important}
  .attendance-person-head h2{font-size:15px!important;line-height:1.2!important}.attendance-person-head p{font-size:9px!important;line-height:1.3!important}
  .detail-avatar{width:46px!important;height:46px!important;border-radius:14px!important}
  .map-frame{height:210px!important;border-radius:13px!important}
  .evidence-card{padding:10px!important;border-radius:14px!important}
  .evidence-card img{max-height:260px!important;border-radius:10px!important}
  .evidence-record-head{font-size:9px!important}

  /* Botones y avisos */
  .btn{min-height:44px!important;border-radius:13px!important;font-size:12px!important;padding:8px 11px!important}
  .btn-small{min-height:38px!important;font-size:10px!important}
  .notice{padding:10px 11px!important;border-radius:13px!important;font-size:10px!important;line-height:1.4!important}
  .status-chip{font-size:8px!important;padding:6px 8px!important}
  .toast-wrap{left:10px!important;right:10px!important;top:calc(72px + env(safe-area-inset-top))!important}
  .toast{max-width:none!important;min-width:0!important;border-radius:14px!important;font-size:10px!important}
}

@media(max-width:430px){
  .portal-content{padding-left:12px!important;padding-right:12px!important}
  .hero-admin-v24{padding:18px 15px!important}
  .hero-admin-v24 h1{font-size:28px!important}
  .hero-actions{gap:7px!important}
  .hero-action{min-height:84px!important;padding:9px!important;grid-template-columns:34px 1fr!important}
  .hero-action>span{width:34px!important;height:34px!important}
  .hero-action strong{font-size:11px!important}.hero-action small{font-size:8px!important}
  .summary-grid,.metric-grid,.hh-summary-grid{gap:8px!important}
  .stat-card,.metric-card{padding:12px!important}
  .metric-head{font-size:8px!important}.metric-icon{width:28px!important;height:28px!important;min-width:28px!important}
  .metric-card .value,.stat-card .value{font-size:24px!important}
  .metric-card .meta,.stat-card .meta{font-size:8px!important}
  .admin-toolbar{grid-template-columns:1fr!important;gap:8px!important}
  .admin-toolbar .search{grid-column:auto!important}
  #attendanceView .admin-toolbar>.btn:nth-last-child(2),#attendanceView .admin-toolbar>.btn:last-child{grid-column:auto!important}
  #attendanceView .admin-toolbar>.btn{width:100%!important}
  .hh-toolbar-actions{grid-template-columns:1fr!important}
  .table-wrap.table-card .table tbody td>*{max-width:65%}
  .table-wrap.table-card .person-cell{max-width:68%!important}
  .profile-grid{grid-template-columns:1fr!important}
  .modal-foot{grid-template-columns:1fr!important}
  .modal-foot .btn{grid-column:auto!important}
}

/* =====================================================================
   V2.5.3 — Transición de ingreso profesional / anti-flash
   El login no salta directamente al panel ni muestra vistas intermedias.
   ===================================================================== */
.portal-entry-transition{
  position:fixed;
  inset:0;
  z-index:13000;
  display:grid;
  place-items:center;
  padding:max(24px,env(safe-area-inset-top)) 24px max(24px,env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 78% 20%,rgba(0,167,216,.18),transparent 27%),
    radial-gradient(circle at 18% 82%,rgba(244,165,28,.10),transparent 23%),
    linear-gradient(145deg,#031a3a 0%,#062a59 48%,#064778 100%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease,visibility 0s linear .24s;
  overflow:hidden;
}
.portal-entry-transition::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(145deg,rgba(0,0,0,.85),transparent 86%);
}
.portal-entry-transition::after{
  content:"";
  position:absolute;
  width:min(70vw,720px);
  aspect-ratio:1;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  right:min(-28vw,-150px);
  top:min(-26vw,-130px);
  box-shadow:0 0 0 90px rgba(255,255,255,.012),0 0 0 180px rgba(255,255,255,.008);
}
html.portal-auth-pending .portal-entry-transition,
html.portal-transitioning .portal-entry-transition{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
html.portal-auth-pending body,
html.portal-transitioning body{overflow:hidden!important}
.portal-entry-transition-inner{
  position:relative;
  z-index:2;
  width:min(390px,88vw);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  color:#fff;
}
.portal-entry-transition-logo{
  width:min(210px,52vw);
  max-height:82px;
  object-fit:contain;
  margin-bottom:26px;
  filter:drop-shadow(0 12px 30px rgba(0,0,0,.18));
}
.portal-entry-transition-copy{display:flex;flex-direction:column;align-items:center}
.portal-entry-transition-copy span{
  color:#7ee4ff;
  font-size:10px;
  font-weight:950;
  letter-spacing:.17em;
  text-transform:uppercase;
  margin-bottom:9px;
}
.portal-entry-transition-copy strong{
  color:#fff;
  font-size:clamp(20px,4.8vw,27px);
  line-height:1.1;
  letter-spacing:-.025em;
}
.portal-entry-transition-copy small{
  margin-top:8px;
  color:#c9ddeb;
  font-size:12px;
  line-height:1.55;
  min-height:19px;
}
.portal-entry-progress{
  width:148px;
  height:3px;
  margin-top:25px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.13);
}
.portal-entry-progress i{
  display:block;
  height:100%;
  width:52%;
  border-radius:inherit;
  background:linear-gradient(90deg,#f4a51c,#ffd17a 38%,#7ee4ff 100%);
  box-shadow:0 0 14px rgba(126,228,255,.26);
  animation:portalEntryProgress 1.05s cubic-bezier(.65,0,.35,1) infinite;
}
@keyframes portalEntryProgress{
  0%{transform:translateX(-115%)}
  55%{transform:translateX(88%)}
  100%{transform:translateX(210%)}
}
/* Durante el handoff el panel se prepara detrás del velo, sin animaciones dobles. */
html.portal-auth-pending .portal-view.active-view,
html.portal-transitioning .portal-view.active-view,
html.portal-auth-pending .view-enter,
html.portal-transitioning .view-enter{animation:none!important}
/* Evita que el formulario de login parpadee mientras se valida una sesión existente. */
html.portal-auth-pending #loginView{visibility:hidden}
html.portal-auth-pending .portal-entry-transition{visibility:visible}
@media(max-width:760px){
  .portal-entry-transition{place-items:center;padding-left:20px;padding-right:20px}
  .portal-entry-transition-logo{width:min(180px,48vw);margin-bottom:22px}
  .portal-entry-transition-copy strong{font-size:22px}
  .portal-entry-transition-copy small{font-size:11px;max-width:280px}
  .portal-entry-progress{width:132px;margin-top:21px}
}
@media(prefers-reduced-motion:reduce){
  .portal-entry-transition{transition:opacity .12s ease!important}
  .portal-entry-progress i{animation:none!important;width:100%;transform:none!important}
}

/* =====================================================================
   V2.5.5 — QUALITY AUDIT · RESPONSIVE + GPS + REVISIÓN ADMINISTRATIVA
   Ajustes finales de armonía PC/móvil y corrección visual de ubicación.
   ===================================================================== */

/* Flujo GPS: bloque estable, sin superposiciones */
.location-live{
  width:100%;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
  padding:14px 16px!important;
  border:1px solid #d9e5ef!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fbfdff 0%,#f5f9fc 100%)!important;
  box-shadow:0 8px 22px rgba(7,35,76,.05)!important;
}
.location-copy{
  width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr)!important;
  align-items:start!important;
  gap:10px!important;
}
.location-copy .dot{grid-column:1;grid-row:1 / span 2;margin-top:5px;flex:0 0 auto}
.location-copy>div{grid-column:2;min-width:0!important;width:100%!important}
.location-live strong{display:block!important;font-size:13px!important;line-height:1.3!important;color:#07386f!important;overflow-wrap:anywhere}
.location-live small{display:block!important;margin-top:4px!important;font-size:11px!important;line-height:1.45!important;color:#687b8f!important;white-space:normal!important;overflow-wrap:anywhere!important}
.location-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;width:auto!important;min-width:0!important}
.location-actions .btn{white-space:nowrap!important}
#gpsMsg,#selfGpsMsg{margin:0!important;position:relative!important;z-index:1!important}
.photo-drop,.signature-wrap{position:relative!important;z-index:0!important}
.modal-body.form-stack{gap:15px!important}
.modal-body.form-stack>.field{margin:0!important}

/* Revisión por marcación: no vuelve a modificar todas las filas del día */
.compact-head{margin-bottom:10px!important}
.review-records{display:grid;gap:9px}
.review-record-row{
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  border:1px solid #dce6ef;
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#f9fcfe);
  padding:12px 13px;
  text-align:left;
  color:inherit;
  box-shadow:0 6px 18px rgba(7,35,76,.045);
}
.review-record-row:hover{transform:translateY(-1px);border-color:#bcd5e8;box-shadow:0 12px 24px rgba(7,35,76,.08)}
.review-record-row.selected{border-color:#52b6db;background:linear-gradient(180deg,#f7fdff,#ecf9fd);box-shadow:0 0 0 3px rgba(0,167,216,.09),0 12px 28px rgba(7,35,76,.08)}
.review-record-copy{min-width:0;display:block}
.review-record-copy strong{display:block;color:#0b386d;font-size:12px;line-height:1.35}
.review-record-copy small{display:block;margin-top:3px;color:#6e8194;font-size:10px;line-height:1.4;overflow-wrap:anywhere}
.review-target-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;padding:13px 14px;border:1px solid #cfe5ef;border-radius:16px;background:linear-gradient(90deg,#f3fbfe,#f8fcfe);color:#0b3c71}
.review-target-summary>div{min-width:0}
.review-target-summary span{display:block;font-size:8px;font-weight:950;letter-spacing:.1em;text-transform:uppercase;color:#59809a}
.review-target-summary strong{display:block;margin-top:3px;font-size:13px}
.review-target-summary small{display:block;margin-top:3px;font-size:10px;line-height:1.4;color:#6b8092;overflow-wrap:anywhere}
.review-target-summary>svg{width:22px;height:22px;flex:0 0 auto;color:#00a7d8}
.evidence-record-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.evidence-record-head>.status-chip{margin-left:auto}

/* Desktop: usar mejor el espacio disponible y elevar legibilidad */
@media(min-width:1180px){
  .admin-shell{grid-template-columns:260px minmax(0,1fr)!important}
  .portal-shell:not(.admin-shell){grid-template-columns:260px minmax(0,1fr)!important}
  .sidebar{padding-left:14px!important;padding-right:14px!important}
  .nav-item{font-size:13px!important;min-height:48px!important}
  .sidebar-brand strong{font-size:18px!important}
  .portal-content{width:min(1440px,calc(100% - 48px))!important;padding-top:30px!important}
  .portal-topbar{height:78px!important}
  .hero-admin-v24{padding:30px 34px!important;min-height:150px}
  .hero-admin-v24 h1{font-size:42px!important}
  .hero-action{min-width:230px!important}
  .section-head h2,.card-head h2{font-size:21px!important}
  .summary-grid,.metric-grid{gap:14px!important}
  .stat-card,.metric-card{min-height:108px!important;padding:18px!important}
  .metric-head,.stat-card .label{font-size:10px!important;line-height:1.35!important}
  .metric-card .value,.stat-card .value{font-size:32px!important}
  .metric-card .meta,.stat-card .meta{font-size:10.5px!important;line-height:1.4!important}
  .table th{font-size:10.5px!important;padding:12px 14px!important}
  .table td{font-size:12.5px!important;padding:13px 14px!important;line-height:1.4!important}
  .person-cell strong{font-size:12.5px!important;line-height:1.35!important}
  .record-meta{font-size:10px!important;line-height:1.4!important}
  .status-chip{font-size:9px!important;padding:6px 9px!important}
  .admin-toolbar,.hh-toolbar{padding:16px 18px!important}
}
@media(min-width:1600px){
  .portal-content{width:min(1500px,calc(100% - 60px))!important}
  .admin-shell{grid-template-columns:250px minmax(0,1fr)!important}
  .hero-admin-v24{min-height:162px}
  .table td{font-size:13px!important}
}

/* Móvil: cada bloque ocupa su propio espacio, sin solaparse */
@media(max-width:760px){
  .modal-body.form-stack{gap:13px!important;padding-top:13px!important}
  .location-live{
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:13px 13px!important;
    border-radius:16px!important;
    box-shadow:none!important;
  }
  .location-copy{grid-template-columns:16px minmax(0,1fr)!important;gap:9px!important}
  .location-copy .dot{margin-top:4px!important}
  .location-live strong{font-size:12px!important;line-height:1.32!important}
  .location-live small{font-size:9.5px!important;line-height:1.42!important;margin-top:3px!important}
  .location-actions{width:100%!important;justify-content:flex-start!important;grid-column:1!important}
  .location-actions .btn{width:auto!important;max-width:100%!important;min-height:38px!important}
  #gpsMsg,#selfGpsMsg{font-size:9.5px!important;line-height:1.45!important;margin-top:-2px!important}
  .photo-drop{margin-top:0!important;padding:12px!important}
  .photo-drop .hint{font-size:9.5px!important;line-height:1.4!important}
  .photo-preview{display:block!important;width:100%!important;height:auto!important;max-height:280px!important;object-fit:contain!important;background:#f4f7fa!important}
  .signature-wrap{margin-top:0!important}

  .review-records{gap:8px!important}
  .review-record-row{grid-template-columns:1fr auto!important;gap:7px 10px!important;padding:11px!important;border-radius:14px!important}
  .review-record-type{grid-column:1!important;grid-row:1!important;justify-self:start}
  .review-record-copy{grid-column:1/-1!important;grid-row:2!important}
  .review-record-row>.status-chip{grid-column:2!important;grid-row:1!important;justify-self:end}
  .review-record-copy strong{font-size:11px!important}
  .review-record-copy small{font-size:9px!important}
  .review-target-summary{padding:11px 12px!important;border-radius:14px!important;gap:8px!important}
  .review-target-summary strong{font-size:11px!important}
  .review-target-summary small{font-size:9px!important}
  .review-form-grid{grid-template-columns:1fr!important}
  .evidence-record-head>.status-chip{margin-left:0!important}

  /* Toasts: menos invasivos y sin tapar el encabezado del modal */
  .toast-wrap{top:auto!important;bottom:calc(82px + env(safe-area-inset-bottom))!important;left:12px!important;right:12px!important;z-index:15000!important}
  .toast{font-size:10px!important;line-height:1.4!important;padding:11px 12px!important;max-height:28vh!important;overflow:auto!important}
}

@media(max-width:430px){
  .location-live{padding:12px!important}
  .location-copy strong{font-size:11.5px!important}
  .location-copy small{font-size:9px!important}
  .review-record-row{padding:10px!important}
}

/* =====================================================================
   V2.5.5 — GPS CARD + PROFILE PHOTO RELIABILITY
   ===================================================================== */
.avatar-photo-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:inherit;
}
.avatar.has-photo,.person-avatar.has-photo{overflow:hidden;background:#edf4f9!important;color:transparent!important}

.gps-status-card{
  display:grid;
  grid-template-columns:46px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  width:100%;
  padding:14px 15px;
  border:1px solid #d7e3ed;
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%,#f7fafc 100%);
  box-shadow:0 8px 22px rgba(7,35,76,.055);
  overflow:hidden;
}
.gps-status-card[data-state="ok"]{border-color:#bfe8d5;background:linear-gradient(180deg,#fbfffd 0%,#f2fbf7 100%)}
.gps-status-card[data-state="warn"]{border-color:#f1d797;background:linear-gradient(180deg,#fffdf8 0%,#fff9ec 100%)}
.gps-status-card[data-state="danger"]{border-color:#f2c3c3;background:linear-gradient(180deg,#fffdfd 0%,#fff4f4 100%)}
.gps-status-icon{
  width:46px;
  height:46px;
  border-radius:15px;
  display:grid;
  place-items:center;
  position:relative;
  color:#0a6291;
  background:linear-gradient(145deg,#eaf8fd,#dff2f9);
  border:1px solid #cfe8f2;
}
.gps-status-icon svg{width:21px;height:21px}
.gps-status-dot{
  position:absolute;
  right:-2px;
  bottom:-2px;
  width:13px;
  height:13px;
  border-radius:50%;
  background:#9aabba;
  border:3px solid #fff;
  box-shadow:0 2px 8px rgba(7,35,76,.14);
}
.gps-status-dot.ok{background:#20c978}.gps-status-dot.warn{background:#e8a113}.gps-status-dot.danger{background:#eb4d58}
.gps-status-content{min-width:0;display:grid;gap:4px}
.gps-status-head{display:flex;align-items:center;gap:8px;min-width:0}
.gps-status-head strong{
  min-width:0;
  color:#0a376b;
  font-size:13px;
  line-height:1.3;
  font-weight:900;
  white-space:normal;
  overflow-wrap:anywhere;
}
.gps-status-content>small{
  color:#6a7d90;
  font-size:10.5px;
  line-height:1.4;
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.gps-accuracy-badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:4px 8px;
  border-radius:999px;
  background:#edf3f7;
  color:#5b7184;
  font-size:9px;
  line-height:1;
  font-weight:950;
  letter-spacing:.02em;
  white-space:nowrap;
}
.gps-accuracy-badge.ok{background:#dcf7e9;color:#157b4b}
.gps-accuracy-badge.warn{background:#fff0c9;color:#946000}
.gps-accuracy-badge.danger{background:#ffe0e1;color:#a52530}
.gps-retry-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:38px;
  padding:8px 11px;
  border:1px solid #d1dfeb;
  border-radius:12px;
  background:#fff;
  color:#0a3a70;
  font-size:10.5px;
  font-weight:900;
  cursor:pointer;
}
.gps-retry-btn:hover{transform:translateY(-1px);border-color:#9fc8de;box-shadow:0 8px 18px rgba(7,35,76,.08)}
.gps-retry-btn svg{width:15px;height:15px}

@media(max-width:760px){
  .gps-status-card{
    grid-template-columns:40px minmax(0,1fr);
    gap:10px;
    padding:12px;
    border-radius:16px;
    box-shadow:none;
    margin:0!important;
  }
  .gps-status-icon{width:40px;height:40px;border-radius:13px}
  .gps-status-icon svg{width:19px;height:19px}
  .gps-status-head{align-items:flex-start;justify-content:space-between;gap:6px}
  .gps-status-head strong{font-size:11.5px;line-height:1.28}
  .gps-status-content>small{font-size:9px;line-height:1.38}
  .gps-accuracy-badge{min-height:22px;padding:4px 7px;font-size:8.5px}
  .gps-retry-btn{grid-column:1/-1;width:100%;min-height:38px;margin-top:1px}
  #gpsMsg,#selfGpsMsg{margin-top:0!important;border-radius:13px!important;padding:10px 11px!important}
  .modal-body.form-stack>.gps-status-card + .notice.hidden + .field,
  .modal-body.form-stack>.gps-status-card + .notice + .field{margin-top:1px!important}
}
@media(max-width:420px){
  .gps-status-card{grid-template-columns:38px minmax(0,1fr);padding:11px;gap:9px}
  .gps-status-icon{width:38px;height:38px}
  .gps-status-head{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .gps-status-content>small{font-size:8.8px}
}


/* =====================================================================
   V2.5.6 — GPS CARD VISUAL HOTFIX
   ===================================================================== */
.gps-status-card{
  align-items:start;
  overflow:visible;
}
.gps-status-content{
  align-self:center;
  min-width:0;
}
.gps-status-head{
  flex-wrap:wrap;
  row-gap:6px;
}
.gps-status-head strong{
  flex:1 1 180px;
}
.gps-status-content>small{
  display:block;
  margin-top:2px;
  white-space:normal;
  word-break:break-word;
}
.gps-accuracy-badge{
  margin-left:auto;
}
@media(max-width:760px){
  .gps-status-card{
    grid-template-columns:40px minmax(0,1fr);
    align-items:start;
    gap:11px;
    min-height:84px;
    padding:13px 13px 12px;
    border-radius:17px;
  }
  .gps-status-icon{
    margin-top:1px;
  }
  .gps-status-content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:40px;
  }
  .gps-status-head{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:6px;
  }
  .gps-status-head strong{
    flex:none;
    width:100%;
    font-size:12.5px;
    line-height:1.3;
  }
  .gps-status-content>small{
    font-size:10px;
    line-height:1.45;
    margin-top:3px;
  }
  .gps-accuracy-badge{
    margin-left:0;
    align-self:flex-start;
    min-height:24px;
    padding:5px 9px;
    font-size:9px;
  }
  .gps-retry-btn{
    margin-top:4px;
  }
}
@media(max-width:420px){
  .gps-status-card{
    grid-template-columns:38px minmax(0,1fr);
    gap:10px;
    min-height:86px;
    padding:13px 12px;
  }
  .gps-status-icon{
    width:38px;
    height:38px;
    border-radius:13px;
  }
  .gps-status-icon svg{
    width:18px;
    height:18px;
  }
  .gps-status-head strong{
    font-size:12px;
  }
  .gps-status-content>small{
    font-size:9.7px;
  }
}

/* =====================================================================
   V2.6.1 — PERMISOS PERSONALIZADOS POR USUARIO
   ===================================================================== */
.permission-matrix{
  display:grid;
  gap:14px;
  padding:17px;
  border:1px solid #d9e5ef;
  border-radius:20px;
  background:linear-gradient(180deg,#fbfdff 0%,#f5f9fc 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.permission-matrix-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}
.permission-matrix-head h4{margin:3px 0 4px;color:#082f63;font-size:16px;letter-spacing:-.02em}
.permission-matrix-head p{margin:0;max-width:520px;color:#66798b;font-size:11px;line-height:1.55}
.permission-security{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid #cfe5ef;
  background:#eef9fc;
  color:#08779d;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.permission-security svg{width:14px;height:14px}
.permission-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.permission-toggle-card{
  min-width:0;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:1px solid #dce7f0;
  border-radius:15px;
  background:#fff;
  cursor:pointer;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease;
}
.permission-toggle-card:hover{border-color:#b8d7e6;box-shadow:0 8px 22px rgba(7,35,76,.07);transform:translateY(-1px)}
.permission-toggle-icon{
  width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  color:#086a92;background:linear-gradient(145deg,#e9f8fc,#e0f2f8);border:1px solid #d4eaf2;
}
.permission-toggle-icon svg{width:17px;height:17px}
.permission-toggle-copy{min-width:0;display:grid;gap:2px}
.permission-toggle-copy strong{color:#0a376b;font-size:11px;line-height:1.3}
.permission-toggle-copy small{color:#718397;font-size:9px;line-height:1.35}
.permission-toggle-card .switch{width:42px;height:24px}
.permission-toggle-card .switch-slider:before{width:18px;height:18px}
.permission-toggle-card .switch input:checked+.switch-slider:before{transform:translateX(18px)}
.permission-master-note{
  display:flex;align-items:center;gap:12px;padding:14px 15px;border-radius:15px;
  border:1px solid #efd28c;background:linear-gradient(135deg,#fff9e9,#fff3cf);color:#805200;
}
.permission-master-note>svg{width:25px;height:25px;color:#b77800}
.permission-master-note div{display:grid;gap:2px}.permission-master-note strong{font-size:12px}.permission-master-note span{font-size:10px;color:#906b27}
.permission-footnote{display:flex;align-items:flex-start;gap:8px;color:#677b8f;font-size:9.5px;line-height:1.45}
.permission-footnote svg{width:14px;height:14px;flex:0 0 auto;color:#557086;margin-top:1px}
.permission-chips{display:flex;align-items:center;flex-wrap:wrap;gap:4px;max-width:210px}
.permission-chip{
  display:inline-flex;align-items:center;gap:4px;padding:5px 7px;border-radius:999px;
  background:#eef6fb;border:1px solid #d9e9f2;color:#245b7b;font-size:8.5px;font-weight:900;white-space:nowrap;
}
.permission-chip.master{background:#fff6dc;border-color:#f1d48f;color:#8b5b00}
.permission-chip svg{width:11px;height:11px}
.permission-module{border-color:#cce4ef!important;background:linear-gradient(145deg,#fff 0%,#f4fbfe 100%)!important}
.permission-module .module-tag{color:#0784ad}

@media(max-width:760px){
  .permission-matrix{padding:14px;border-radius:17px;gap:12px}
  .permission-matrix-head{display:grid;gap:10px}
  .permission-security{justify-self:start}
  .permission-grid{grid-template-columns:1fr;gap:8px}
  .permission-toggle-card{grid-template-columns:34px minmax(0,1fr) auto;padding:10px;border-radius:14px}
  .permission-toggle-icon{width:34px;height:34px}
  .permission-toggle-copy strong{font-size:10.5px}
  .permission-toggle-copy small{font-size:8.8px}
  .permission-chips{max-width:none;justify-content:flex-start}
}

@media(max-width:760px){
  #peopleView .table-card .table tbody td:nth-child(6)::before{content:"Permisos"}
  #peopleView .table-card .table tbody td:nth-child(7)::before{content:"Estado"}
  #peopleView .table-card .table tbody td:nth-child(8)::before{content:"Acciones"}
  #peopleView .permission-chips{max-width:72%;justify-content:flex-end}
  #hoursView .table-card .table tbody td:nth-child(2)::before{content:"DNI"}
}

/* =====================================================================
   V2.6.1 — SELECTOR DE ACCESO PROFESIONAL + UX CONSISTENTE
   ===================================================================== */
.access-options{gap:16px}
.access-option{
  position:relative;
  grid-template-columns:64px minmax(0,1fr) 42px;
  min-height:94px;
  padding:15px 16px;
  gap:16px;
  border-radius:22px;
  border:1px solid #d9e5ef;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,252,255,.98));
  box-shadow:0 12px 30px rgba(7,35,76,.065);
  overflow:hidden;
}
.access-option::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,.72),rgba(255,255,255,0) 34%);
  opacity:.55;
}
.access-option>*{position:relative;z-index:1}
.access-option:hover{
  transform:translateY(-3px);
  border-color:#aed8e8;
  box-shadow:0 22px 45px rgba(7,35,76,.12);
}
.access-option.admin-option:hover{border-color:#e9ca8a;box-shadow:0 22px 45px rgba(110,73,0,.10)}
.access-option-icon{
  width:64px;
  height:64px;
  border-radius:20px;
  display:grid;
  place-items:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 10px 22px rgba(7,35,76,.07);
}
.access-option-icon svg{width:29px;height:29px;stroke-width:1.9}
.worker-icon{
  color:#007fa9;
  background:linear-gradient(145deg,#e5f9fd,#d8f3fa);
  border:1px solid #c9ebf4;
}
.admin-icon{
  color:#9a6200;
  background:linear-gradient(145deg,#fff7df,#ffedbd);
  border:1px solid #f3d99d;
}
.access-option-copy{display:flex;align-items:center;min-width:0}
.access-option-copy strong{
  margin:0;
  font-size:17px;
  line-height:1.2;
  letter-spacing:-.018em;
  color:#072f67;
}
.access-option-copy small{display:none!important}

/* Acceso 5.5.6: selección clara y entrada directa al Centro de Gestión. */
.portal-entry-page .access-option{min-height:108px;border-left:4px solid #08a3d0;padding:19px 18px}
.portal-entry-page .access-option.admin-option{border-left-color:#f1a313}
.portal-entry-page .access-option-copy{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.portal-entry-page .access-option-copy strong{margin:0;font-size:16px}
.portal-entry-page .access-option-copy small{display:block!important;color:#687d91;font-size:10.5px;line-height:1.48}
.entry-security-note{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:12px;margin-top:18px;padding:15px 16px;border:1px solid #d9e8f2;border-radius:16px;background:#f5fbff;color:#173d64}
.entry-security-note>span{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#def4ff;color:#067ca8}
.entry-security-note svg{width:21px;height:21px}
.entry-security-note strong,.entry-security-note small{display:block}
.entry-security-note strong{font-size:11.5px;margin-bottom:3px}
.entry-security-note small{color:#708397;font-size:10px;line-height:1.4}
html.portal-direct-entry #loginView{visibility:hidden}
html.portal-direct-entry .portal-entry-transition{display:none!important}
@media(max-width:420px){.portal-entry-page .access-option{min-height:102px;padding:15px 13px}.entry-security-note{padding:13px}}

/* Portada 5.5.7: mensaje corporativo y beneficios operativos. */
.portal-entry-page .entry-visual{align-items:center;padding-top:48px;padding-bottom:48px;background-image:linear-gradient(90deg,rgba(0,22,53,.97) 0%,rgba(0,39,82,.91) 48%,rgba(0,52,92,.66) 100%),url('images/portal-hero.webp');background-position:center;background-size:cover}
.portal-entry-page .entry-visual:before{background:linear-gradient(180deg,rgba(0,20,48,.04),rgba(0,17,42,.42))}
.portal-entry-page .entry-visual-copy{width:100%;max-width:790px}
.portal-entry-page .entry-photo-logo{width:220px;max-height:76px;margin-bottom:32px}
.portal-entry-page .entry-visual-copy h1{max-width:700px;font-size:clamp(52px,5.5vw,82px);line-height:.97;margin:17px 0 22px;letter-spacing:-.052em}
.portal-entry-page .entry-visual-copy h1 span{color:#34bdf2}
.portal-entry-page .entry-visual-copy h1 i{color:#f5a800;font-style:normal}
.portal-entry-page .entry-visual-copy p{max-width:600px;color:#edf6fc;font-size:15px;line-height:1.7}
.portal-entry-page .entry-capabilities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:38px;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.12);background:rgba(0,24,58,.22);backdrop-filter:blur(5px)}
.portal-entry-page .entry-capabilities>div{min-width:0;display:grid;justify-items:center;align-content:start;gap:5px;padding:19px 12px;text-align:center;border-right:1px solid rgba(255,255,255,.18)}
.portal-entry-page .entry-capabilities>div:last-child{border-right:0}
.portal-entry-page .entry-capabilities svg{width:31px;height:31px;margin-bottom:4px;color:#3bc4f7;stroke-width:1.8}
.portal-entry-page .entry-capabilities strong{color:#fff;font-size:11px}
.portal-entry-page .entry-capabilities small{max-width:120px;color:#d8e7f2;font-size:9px;line-height:1.45}
@media(max-width:980px){.portal-entry-page .entry-capabilities{grid-template-columns:repeat(2,1fr)}.portal-entry-page .entry-capabilities>div:nth-child(2){border-right:0}.portal-entry-page .entry-capabilities>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18)}}
@media(max-width:760px){.portal-entry-page .entry-visual{align-items:flex-end;padding-top:26px;padding-bottom:24px}.portal-entry-page .entry-photo-logo{width:150px;margin-bottom:12px}.portal-entry-page .entry-visual-copy h1{font-size:34px;margin:9px 0 10px}.portal-entry-page .entry-visual-copy p{font-size:11px}.portal-entry-page .entry-capabilities{display:none}}
.access-option-arrow{
  width:38px;
  height:38px;
  border-radius:13px;
  display:grid;
  place-items:center;
  color:#6f8498;
  background:#f5f8fb;
  border:1px solid #e1e9f0;
}
.access-option-arrow svg{width:18px;height:18px;stroke-width:2}
.access-option:hover .access-option-arrow{transform:translateX(2px);color:#073a73;background:#fff;border-color:#cbdce9}
.access-option:focus-visible{outline:none;border-color:#31abd1;box-shadow:0 0 0 4px rgba(0,167,216,.12),0 22px 45px rgba(7,35,76,.12)}
.access-choice-msg{margin-top:14px}

@media(max-width:760px){
  .access-options{gap:12px}
  .access-option{
    grid-template-columns:56px minmax(0,1fr) 36px;
    min-height:82px;
    padding:13px 13px;
    gap:13px;
    border-radius:19px;
  }
  .access-option-icon{width:56px;height:56px;border-radius:17px}
  .access-option-icon svg{width:26px;height:26px}
  .access-option-copy strong{font-size:16px}
  .access-option-arrow{width:34px;height:34px;border-radius:11px}
  .access-option-arrow svg{width:16px;height:16px}
}
@media(max-width:420px){
  .access-option{
    grid-template-columns:52px minmax(0,1fr) 32px;
    min-height:76px;
    padding:12px;
    gap:11px;
  }
  .access-option-icon{width:52px;height:52px;border-radius:16px}
  .access-option-copy strong{font-size:15px}
  .access-option-arrow{width:32px;height:32px}
}
.master-command-hero{display:flex;align-items:center;justify-content:space-between;padding:30px;border-radius:18px;background:linear-gradient(120deg,#061e3d,#003f7d);color:#fff;margin-bottom:18px;overflow:hidden;position:relative}.master-command-hero span{font-size:10px;letter-spacing:.18em;color:#75c8ff}.master-command-hero h2{margin:8px 0;font-size:27px}.master-command-hero p{margin:0;color:#bed1e3}.master-command-hero>svg{width:92px;height:92px;opacity:.16}.master-command-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.master-command-card{border:1px solid #dce5ee;background:#fff;border-radius:15px;padding:20px;text-align:left;display:flex;flex-direction:column;gap:9px;cursor:pointer;transition:.2s}.master-command-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(0,47,108,.11);border-color:#8bb7dd}.master-command-card>svg{width:24px;color:#0071bc}.master-command-card strong{font-size:14px;color:#082f55}.master-command-card span{font-size:11px;color:#6b7d8e;min-height:32px}.master-command-card em{font-style:normal;color:#f58220;font-weight:800;font-size:11px}.assignment-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.assignment-summary article{background:#fff;border:1px solid #dce5ee;border-radius:13px;padding:17px}.assignment-summary span{display:block;color:#6b7d8e;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.assignment-summary strong{display:block;font-size:26px;margin-top:6px;color:#082f55}.priority-pill{display:inline-flex;padding:5px 9px;border-radius:20px;font-size:9px;font-weight:800;background:#edf3f8;color:#36546e}.priority-pill.high{background:#fff0ed;color:#c9432e}.priority-pill.low{background:#eaf8f2;color:#23835e}.assignment-title strong{display:block}.assignment-title small{display:block;color:#7b8b99;margin-top:4px}.assignment-actions{display:flex;gap:5px}.assignment-actions button{border:1px solid #dce5ee;background:#fff;border-radius:7px;padding:6px 8px;cursor:pointer}.assignment-actions button:hover{border-color:#f58220;color:#f58220}@media(max-width:900px){.master-command-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.master-command-grid,.assignment-summary{grid-template-columns:1fr}.master-command-hero>svg{display:none}}
.nav-section-label{display:block;margin:22px 14px 8px;color:#7890a7;font-size:9px;font-weight:800;letter-spacing:.13em}.enterprise-head-actions{display:flex;align-items:center;gap:10px}.enterprise-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:16px}.enterprise-kpis article{position:relative;background:#fff;border:1px solid #dce5ee;border-radius:14px;padding:18px;overflow:hidden}.enterprise-kpis article:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--area)}.enterprise-kpis span{display:block;color:#6d7f90;font-size:10px;text-transform:uppercase;letter-spacing:.05em}.enterprise-kpis strong{display:block;color:#082f55;font-size:25px;margin:8px 0 3px}.enterprise-kpis small{font-size:9px;color:#91a0ad}.enterprise-layout{display:grid;grid-template-columns:230px 1fr;gap:15px;align-items:start}.enterprise-flows{background:#fff;border:1px solid #dce5ee;border-radius:14px;padding:10px}.enterprise-flows>span{display:block;padding:10px;color:#8090a0;font-size:9px;font-weight:800;letter-spacing:.12em}.enterprise-flows button{width:100%;display:flex;align-items:center;gap:7px;border:0;background:transparent;border-radius:8px;padding:11px 9px;color:#40566a;text-align:left;font-size:11px;cursor:pointer}.enterprise-flows button:hover,.enterprise-flows button.active{background:#edf5fb;color:#005da8;font-weight:700}.enterprise-flows button svg{width:14px}.enterprise-flows em{margin-left:auto;background:#e7eef5;padding:2px 6px;border-radius:10px;font-style:normal;font-size:9px}.enterprise-toolbar{display:flex;align-items:center;background:#fff;border:1px solid #dce5ee;border-radius:13px;padding:15px;margin-bottom:10px}.enterprise-toolbar>div{flex:1}.enterprise-toolbar h2{font-size:14px;margin:0 0 3px}.enterprise-toolbar p{font-size:10px;color:#718293;margin:0}.enterprise-toolbar input{max-width:240px}.record-type{display:block;color:#7c8c9b;font-size:9px;margin-top:4px}.enterprise-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:300px;color:#687b8d}.table td>strong{color:#082f55}@media(max-width:1050px){.enterprise-kpis{grid-template-columns:repeat(2,1fr)}.enterprise-layout{grid-template-columns:1fr}.enterprise-flows{display:grid;grid-template-columns:repeat(2,1fr)}.enterprise-flows>span{grid-column:1/-1}}@media(max-width:620px){.enterprise-kpis,.enterprise-flows{grid-template-columns:1fr}.enterprise-toolbar{align-items:stretch;gap:12px;flex-direction:column}.enterprise-toolbar input{max-width:none}.enterprise-head-actions{align-items:flex-end;flex-direction:column}}
.erp-page-title{align-items:center}.erp-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:15px}.erp-kpis article{position:relative;background:#fff;border:1px solid #dce5ee;border-radius:14px;padding:18px;overflow:hidden}.erp-kpis article:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--area)}.erp-kpis span{display:block;color:#6d7f90;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.erp-kpis strong{display:block;color:#082f55;font-size:25px;margin:8px 0 2px}.erp-kpis small{color:#8a99a6;font-size:9px}.erp-process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:15px}.erp-process-grid button{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dce5ee;border-radius:12px;padding:13px;text-align:left;cursor:pointer;transition:.18s;color:#213c55}.erp-process-grid button:hover,.erp-process-grid button.active{border-color:#1174bd;background:#f2f8fd;box-shadow:0 7px 18px rgba(0,64,123,.08)}.erp-process-grid button>svg{width:19px;color:#1174bd}.erp-process-grid span{flex:1}.erp-process-grid strong{display:block;font-size:11px}.erp-process-grid small{display:block;color:#7c8c9b;font-size:9px;margin-top:3px}.erp-process-grid em{font-style:normal;color:#f58220}.erp-workspace{padding:0;overflow:hidden}.erp-toolbar{display:flex;align-items:center;gap:9px;padding:16px;border-bottom:1px solid #e2e8ee}.erp-toolbar>div{flex:1}.erp-toolbar h2{margin:0 0 3px;font-size:15px}.erp-toolbar p{margin:0;color:#798b9b;font-size:10px}.erp-toolbar input{max-width:230px}.erp-toolbar select{max-width:160px}.approval-pill{display:inline-flex;padding:5px 8px;border-radius:20px;background:#fff1e5;color:#b85d19;font-size:9px;font-weight:800}.approval-pill.approved{background:#e7f7ef;color:#247b58}.erp-row-actions{display:flex;gap:4px}.erp-row-actions button{display:grid;place-items:center;width:29px;height:29px;border:1px solid #dde5ec;background:#fff;border-radius:7px;color:#31536e;cursor:pointer}.erp-row-actions button:hover{color:#f58220;border-color:#f0a36a}.erp-row-actions svg{width:14px}.erp-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.erp-detail-grid section{padding:13px;background:#f6f9fb;border:1px solid #e4eaf0;border-radius:10px}.erp-detail-grid span{display:block;color:#718393;font-size:9px;text-transform:uppercase;letter-spacing:.07em}.erp-detail-grid strong{display:block;margin-top:5px;color:#0a355c;font-size:12px}.erp-detail-heading{margin:22px 0 10px;color:#0a355c}.erp-document-list>div{display:flex;align-items:center;gap:10px;padding:11px;border:1px solid #e1e8ee;border-radius:9px;margin:7px 0}.erp-document-list svg{width:18px;color:#1174bd}.erp-document-list strong,.erp-document-list small{display:block}.erp-document-list small{font-size:9px;color:#7c8b98;margin-top:3px}.erp-timeline>div{display:flex;align-items:center;gap:11px;padding:8px 2px}.erp-timeline i{width:9px;height:9px;background:#1b8b63;border-radius:50%;box-shadow:0 0 0 5px #1b8b6317}.erp-timeline strong,.erp-timeline small{display:block}.erp-timeline small{font-size:9px;color:#7f8e9b;margin-top:3px}.permission-check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.permission-check-grid label{display:flex;align-items:center;gap:9px;border:1px solid #dfe6ec;border-radius:10px;padding:13px;color:#173c5e;font-size:11px;font-weight:700}.permission-check-grid input{accent-color:#006fba;width:17px;height:17px}@media(max-width:1100px){.erp-process-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.erp-kpis,.erp-process-grid{grid-template-columns:repeat(2,1fr)}.erp-toolbar{align-items:stretch;flex-wrap:wrap}.erp-toolbar>div{flex-basis:100%}.erp-toolbar input,.erp-toolbar select{max-width:none;flex:1}}@media(max-width:560px){.erp-kpis,.erp-process-grid,.erp-detail-grid,.permission-check-grid{grid-template-columns:1fr}.erp-toolbar{flex-direction:column}.erp-toolbar>*{width:100%}.enterprise-head-actions{align-items:stretch;width:100%}.erp-page-title{align-items:stretch}}
.admin-sidebar .side-nav{min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin}.erp-module-switcher{display:flex;align-items:stretch;gap:8px;padding:10px;margin:0 0 18px;background:linear-gradient(135deg,#062f59,#075b92);border-radius:16px;box-shadow:0 12px 30px rgba(4,47,88,.16);overflow-x:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}.erp-module-switcher>div{min-width:145px;padding:8px 10px;color:#fff;display:flex;flex-direction:column;justify-content:center}.erp-module-switcher>div span{font-size:9px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#8ed9f1}.erp-module-switcher>div strong{font-size:12px;margin-top:4px}.erp-module-switcher button{min-width:100px;flex:1;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#dcebf6;border-radius:11px;padding:10px 7px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:9px;font-weight:750;cursor:pointer;transition:.18s}.erp-module-switcher button svg{width:16px}.erp-module-switcher button:hover,.erp-module-switcher button.active{background:#fff;color:#07375f;border-color:#fff;box-shadow:inset 0 -3px 0 var(--module)}.erp-document-list>div>span{flex:1}.erp-document-list .btn{margin-left:auto}@media(max-width:700px){.erp-module-switcher{padding:8px}.erp-module-switcher>div{min-width:150px}.erp-module-switcher button{min-width:105px}}
.erp-file-selection{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}.erp-file-selection>span{display:flex;align-items:center;gap:7px;min-height:34px;padding:7px 10px;border-radius:9px;background:#f3f8fc;border:1px solid #dce7ef;color:#5f7182;font-size:10px}.erp-file-selection>span svg{width:15px;color:#1681bb}.erp-file-selection>span strong{color:#153b5d;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.erp-file-selection>span small{color:#758797}.erp-detail-upload{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;margin-top:12px;padding:13px;border:1px dashed #9bc9df;background:#f4fbfe;border-radius:12px}.erp-detail-upload label{display:flex;align-items:center;gap:10px;color:#0b4e7b}.erp-detail-upload label>svg{width:22px}.erp-detail-upload label span,.erp-detail-upload label strong,.erp-detail-upload label small{display:block}.erp-detail-upload label small{color:#718493;font-size:9px;margin-top:3px}.erp-detail-upload input{grid-column:1/-1}.erp-detail-upload .notice{grid-column:1/-1;margin:0}@media(max-width:620px){.erp-detail-upload{grid-template-columns:1fr}.erp-detail-upload>*{grid-column:1!important}.erp-detail-upload .btn{width:100%}.erp-file-selection>span{width:100%}}

.worker-permission-nav{display:flex;flex-direction:column;gap:5px}.worker-permission-nav .nav-section-label{margin-top:15px}.worker-module-nav>span:nth-child(2){min-width:0;flex:1}.worker-nav-count{min-width:24px;height:24px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:#e6eff7;color:#315a7d;font-size:9px;font-weight:900}.worker-module-nav:hover .worker-nav-count{background:#dcebf6;color:#06437e}.portal-shell:not(.admin-shell) .side-nav{min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}

/* ERP ESCEM 5.0 · Centro de Accesos Empresarial */
body.access-center-open{overflow:hidden}.access-center{position:fixed;inset:0;z-index:3500;background:rgba(3,18,38,.7);backdrop-filter:blur(10px);padding:18px;display:grid;place-items:center}.access-center.hidden{display:none}.access-center-shell{width:min(1540px,100%);height:min(940px,calc(100vh - 36px));display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden;background:#f4f7fb;border:1px solid rgba(255,255,255,.3);border-radius:28px;box-shadow:0 32px 100px rgba(0,20,52,.4)}
.access-center-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;background:linear-gradient(135deg,#002f6c,#064c91);color:#fff}.access-center-header .kicker{color:#8dd7ff}.access-center-header h2{margin:5px 0 4px;font-size:clamp(1.45rem,2vw,2rem)}.access-center-header p{margin:0;color:#d8e9fa}.access-center-header .icon-btn{color:#fff;border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.1)}
.access-center-tabs{display:flex;gap:4px;padding:8px 18px;background:#fff;border-bottom:1px solid #dce5ef;overflow-x:auto}.access-center-tabs button{display:flex;align-items:center;gap:8px;padding:11px 16px;border:0;border-radius:10px;background:transparent;color:#52657a;font:inherit;font-weight:750;white-space:nowrap;cursor:pointer}.access-center-tabs button svg{width:18px}.access-center-tabs button.active{color:#003f7d;background:#eaf3fc}.access-center-body{min-height:0;overflow:auto}.access-layout{height:100%;display:grid;grid-template-columns:300px minmax(0,1fr)}
.access-list-panel{min-height:0;display:flex;flex-direction:column;background:#fff;border-right:1px solid #dce5ef}.access-panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px}.access-panel-head>div{display:flex;flex-direction:column;gap:3px}.access-panel-head span{font-size:.68rem;font-weight:850;letter-spacing:.12em;color:#70839a}.access-panel-head strong{font-size:.88rem;color:#263c55}.access-profile-list{padding:0 10px 16px;overflow:auto}.access-profile-list>button{width:100%;display:grid;grid-template-columns:38px minmax(0,1fr) 18px;align-items:center;gap:10px;padding:11px;margin-bottom:4px;border:1px solid transparent;border-radius:13px;background:transparent;text-align:left;color:#30465c;cursor:pointer}.access-profile-list>button:hover{background:#f4f8fc}.access-profile-list>button.active{background:#eaf3fc;border-color:#c8dff3;color:#003f7d}.access-profile-list>button.inactive{opacity:.58}.access-profile-list>button>span:nth-child(2){min-width:0;display:flex;flex-direction:column}.access-profile-list strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.access-profile-list small{margin-top:3px;color:#71849a}.access-profile-list>button>svg{width:16px}.access-profile-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:#edf3f8}.access-profile-icon svg{width:19px}
.access-detail-panel{min-width:0;padding:24px;overflow:auto}.access-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}.access-detail-head h3{margin:5px 0;font-size:1.5rem;color:#102b48}.access-detail-head p{margin:0;color:#687c91}.access-head-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.access-master-banner{display:flex;gap:16px;align-items:center;padding:22px;border:1px solid #f0cf83;border-radius:16px;background:linear-gradient(135deg,#fff9e9,#fff);color:#72510b}.access-master-banner>svg{width:34px;height:34px}.access-master-banner>div{display:flex;flex-direction:column;gap:5px}.access-master-banner span{color:#806b3d}.access-matrix-toolbar{position:sticky;top:-24px;z-index:4;display:grid;grid-template-columns:minmax(240px,1fr) 180px 190px;align-items:center;gap:10px;padding:14px 16px;margin:0 -4px 12px;border:1px solid #dae5ef;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 8px 24px rgba(20,51,83,.06);backdrop-filter:blur(8px)}.access-matrix-toolbar>div{display:flex;flex-direction:column}.access-matrix-toolbar span{font-size:.78rem;color:#6e8195}.access-matrix-wrap{overflow:auto;border:1px solid #dbe5ef;border-radius:15px;background:#fff}.access-matrix{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0}.access-matrix th,.access-matrix td{padding:9px;border-right:1px solid #edf1f5;border-bottom:1px solid #e5ebf1;text-align:center}.access-matrix thead th{position:sticky;top:0;z-index:2;background:#f0f5fa;color:#435a72;font-size:.72rem}.access-matrix thead th:first-child{left:0;z-index:3;min-width:245px;text-align:left}.access-matrix tbody th{position:sticky;left:0;z-index:1;min-width:245px;background:#fff;text-align:left}.access-matrix tbody th>span{display:block;padding:4px 3px;font-size:.82rem;color:#354c63}.access-module-name{margin:5px 3px 4px;padding-top:7px;border-top:1px solid #e2e9f0;color:#003f7d;font-size:.68rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.access-matrix tbody tr:first-child .access-module-name{border-top:0}.access-permission-cell{width:30px;height:30px;display:grid;place-items:center;margin:auto;border:1px solid #d8e2eb;border-radius:8px;background:#f5f7f9;color:#9aa8b5;cursor:pointer}.access-permission-cell svg{width:15px}.access-permission-cell.granted{border-color:#8cd3ad;background:#e5f8ee;color:#137647}.access-permission-cell:disabled{opacity:.45;cursor:wait}.access-not-applicable{color:#b8c2cb}
.access-assignment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.access-assignment-card{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px;border:1px solid #dce5ed;border-radius:14px;background:#fff}.access-assignment-card.assigned{border-color:#8fc8ed;background:#f1f8fe}.access-assignment-card>span:first-child{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#edf3f8;color:#315b83}.access-assignment-card>span:first-child svg{width:20px}.access-assignment-card>div{display:flex;min-width:0;flex-direction:column}.access-assignment-card small{margin-top:3px;color:#708297;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.access-user-overrides{margin-top:24px;border-top:1px solid #dce5ed;padding-top:6px}.access-override-form{display:grid;grid-template-columns:1.1fr 1.2fr 1fr .9fr auto;gap:8px}.access-chip-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.access-override-chip{padding:7px 10px;border-radius:999px;background:#e6f7ee;color:#176b46;font-size:.72rem;font-weight:800}.access-override-chip.deny{background:#fff0ee;color:#b13c32}
.access-scopes-view,.access-audit-view,.access-approvals-view{padding:24px}.access-scope-form{display:grid;grid-template-columns:180px 1fr 1.4fr auto;gap:10px;padding:16px;border:1px solid #dbe5ee;border-radius:15px;background:#fff}.access-scope-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.access-scope-cards article{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px;border:1px solid #dce5ed;border-radius:14px;background:#fff}.access-scope-cards article>span{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#eaf3fc;color:#17639c}.access-scope-cards article>div{display:flex;min-width:0;flex-direction:column}.access-scope-cards small{margin-top:3px;color:#72859a}.access-approval-section{margin-top:16px;border:1px solid #dce5ed;border-radius:16px;background:#fff;overflow:hidden}.access-workflow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 16px 16px}.access-workflow-grid>article{padding:14px;border:1px solid #dce5ed;border-radius:14px;background:#f8fafc}.access-workflow-title{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center}.access-workflow-title>span{width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:#e7f2fc;color:#1766a1}.access-workflow-title>div{display:flex;min-width:0;flex-direction:column}.access-workflow-title small{margin-top:3px;color:#718399}.access-workflow-title button{border:0;cursor:pointer}.access-step-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.access-step-row span{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:8px;background:#fff;border:1px solid #e1e8ef;color:#53697e;font-size:.72rem}.access-step-row b{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#003f7d;color:#fff}.access-responsibility-form,.access-delegation-form{display:grid;gap:8px;padding:0 16px 16px}.access-responsibility-form{grid-template-columns:1fr 1.2fr 1fr 1.2fr 1fr 1fr auto}.access-delegation-form{grid-template-columns:1.2fr 1.2fr 1fr 1fr 1fr 1.3fr auto}.access-responsibility-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:0 16px 16px}.access-responsibility-list article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;border:1px solid #dce5ed;border-radius:12px;background:#f8fafc}.access-responsibility-list article>div{display:flex;min-width:0;flex-direction:column}.access-responsibility-list span,.access-responsibility-list small{margin-top:3px;color:#6e8296}.access-responsibility-list small{font-size:.72rem}.access-audit-list{display:flex;flex-direction:column;gap:9px}.access-audit-list article{display:grid;grid-template-columns:44px minmax(0,1fr);gap:13px;padding:15px;border:1px solid #dce5ed;border-radius:14px;background:#fff}.access-audit-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#eef4f9;color:#245d8e}.access-audit-list article>div{display:flex;flex-direction:column;gap:3px}.access-audit-list p{margin:0;color:#60758a}.access-audit-list small{color:#8797a8}.access-empty-state{min-height:300px;display:grid;place-items:center;align-content:center;text-align:center;padding:30px;color:#687d91}.access-empty-state svg{width:48px;height:48px;margin-bottom:10px;color:#7da6c8}.access-empty-state h3{margin:4px}.access-empty-state p{max-width:600px}.access-empty-state.compact{min-height:160px;border:1px dashed #cddae5;border-radius:15px;background:#fff}.erp-scope-panel{padding:15px;border:1px solid #dce6ef;border-radius:15px;background:#f7fafc}.erp-scope-panel h4{margin:3px 0}.erp-scope-panel p{margin:0 0 12px;color:#6b7f93;font-size:.84rem}
.erp-global-search-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}.erp-global-results{display:flex;flex-direction:column;gap:8px;margin-top:15px}.erp-global-result{display:grid;grid-template-columns:42px minmax(0,1fr) auto 20px;align-items:center;gap:11px;width:100%;padding:12px;border:1px solid #dce5ed;border-radius:13px;background:#fff;text-align:left;color:#23405b;cursor:pointer}.erp-global-result:hover{border-color:#78b5df;background:#f3f9fe}.erp-global-result>span:first-child{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#eaf3fc;color:#1769aa}.erp-global-result>div{display:flex;min-width:0;flex-direction:column}.erp-global-result small{margin-top:4px;color:#72869a}.erp-global-result>svg{width:17px}.enterprise-loading.compact{min-height:120px}
.erp-attention{margin-bottom:15px;padding:18px}.erp-attention .section-head{margin-bottom:12px}.erp-attention-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.erp-attention-grid>button{display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;gap:10px;padding:11px;border:1px solid #dfe7ee;border-radius:11px;background:#fafcfe;text-align:left;color:#27435e;cursor:pointer}.erp-attention-grid>button:hover{border-color:#f0a36a;background:#fffaf5}.erp-attention-grid>button>svg:first-child{width:20px;color:#dc721e}.erp-attention-grid>button>svg:last-child{width:16px}.erp-attention-grid span{display:flex;min-width:0;flex-direction:column}.erp-attention-grid small{margin-top:3px;color:#74879a}@media(max-width:700px){.erp-attention-grid,.erp-global-search-bar{grid-template-columns:1fr}.erp-global-result{grid-template-columns:38px minmax(0,1fr) 18px}.erp-global-result>.status-chip{display:none}}
@media(max-width:1180px){.access-responsibility-form,.access-delegation-form{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:980px){.access-center{padding:0}.access-center-shell{height:100dvh;border-radius:0}.access-layout{grid-template-columns:240px minmax(0,1fr)}.access-assignment-grid,.access-scope-cards,.access-workflow-grid,.access-responsibility-list{grid-template-columns:1fr}.access-override-form{grid-template-columns:1fr 1fr}.access-matrix-toolbar{grid-template-columns:1fr 1fr}.access-matrix-toolbar>div{grid-column:1/-1}.access-scope-form{grid-template-columns:1fr 1fr}}@media(max-width:700px){.access-center-header{padding:18px}.access-center-header p{display:none}.access-center-tabs{padding:7px}.access-center-tabs button{padding:10px;font-size:.78rem}.access-layout{display:block}.access-list-panel{max-height:230px;border-right:0;border-bottom:1px solid #dce5ef}.access-profile-list{display:flex;gap:7px;overflow-x:auto}.access-profile-list>button{min-width:220px}.access-detail-panel,.access-scopes-view,.access-audit-view,.access-approvals-view{padding:16px}.access-detail-head{flex-direction:column}.access-head-actions{justify-content:flex-start}.access-matrix-toolbar{top:-16px;grid-template-columns:1fr}.access-matrix-toolbar>div{grid-column:auto}.access-assignment-grid,.access-override-form,.access-scope-form,.access-responsibility-form,.access-delegation-form{grid-template-columns:1fr}.access-scope-cards{grid-template-columns:1fr}.access-workflow-title{grid-template-columns:40px minmax(0,1fr)}.access-workflow-title button{grid-column:1/-1}}