:root{--navy:#163a5b;--blue:#1f4e79;--sky:#eaf2f8;--bg:#f3f6f9;--text:#22313f;--muted:#687785;--line:#dfe6ec;--danger:#b42318;--success:#197a42;--white:#fff}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--bg)}a{text-decoration:none;color:inherit}.topbar{background:var(--navy);color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.15)}.topbar-inner{max-width:1280px;margin:auto;min-height:82px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:14px}.brand-logo{width:64px;height:58px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;padding:7px;overflow:hidden}.brand-logo img{max-width:100%;max-height:100%;object-fit:contain}.brand-copy{display:flex;flex-direction:column}.brand-copy strong{font-size:19px}.brand-copy small,.user-box small{opacity:.78;margin-top:3px}.user-box{display:flex;align-items:center;gap:14px}.user-box>span{display:flex;flex-direction:column;text-align:right}.main-nav{max-width:1280px;margin:auto;padding:0 24px;display:flex;gap:4px;overflow:auto}.main-nav a{padding:13px 16px;border-radius:8px 8px 0 0;white-space:nowrap}.main-nav a:hover,.main-nav a.active{background:#fff;color:var(--navy)}.page-shell{max-width:1280px;margin:0 auto;padding:26px 24px 48px}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:20px}.page-heading h1{font-size:27px;margin:3px 0 0}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:.12em;color:var(--muted);font-weight:700}.heading-actions,.toolbar,.form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:22px;box-shadow:0 4px 14px rgba(35,53,68,.05)}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:18px}.dashboard-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:22px;min-height:155px;transition:.2s;box-shadow:0 4px 14px rgba(35,53,68,.05)}.dashboard-card:hover{transform:translateY(-3px);border-color:#adc4d8}.dashboard-card .icon{width:42px;height:42px;border-radius:10px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px}.dashboard-card h3{margin:16px 0 7px}.dashboard-card p{margin:0;color:var(--muted);line-height:1.45}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 14px;border:1px solid transparent;border-radius:8px;background:var(--blue);color:#fff;font:inherit;font-weight:600;cursor:pointer}.btn:hover{filter:brightness(.94)}.btn-secondary{background:var(--navy)}.btn-light{background:#fff;color:var(--text);border-color:var(--line)}.btn-danger{background:var(--danger)}.btn-small{min-height:32px;padding:6px 10px;font-size:13px}.toolbar{justify-content:space-between;margin-bottom:15px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th,.data-table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.data-table th{background:#f7f9fb;font-size:13px;color:#52616d}.data-table tr:last-child td{border-bottom:0}.actions{display:flex;gap:7px;flex-wrap:wrap}.action{font-size:13px;font-weight:600;color:var(--blue)}.action.danger{color:var(--danger)}.badge{display:inline-flex;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700}.badge.success{background:#e7f6ec;color:var(--success)}.badge.muted{background:#edf0f2;color:#5e6b74}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-weight:600;font-size:14px}.field input,.field select{width:100%;height:42px;border:1px solid #cbd5dd;border-radius:8px;padding:8px 11px;font:inherit;background:#fff}.field input:focus,.field select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(31,78,121,.12)}.form-actions{margin-top:22px}.alert{padding:13px 15px;border-radius:9px;margin-bottom:18px;border:1px solid}.alert.ok{background:#eaf7ef;border-color:#b7dec6;color:#176735}.alert.error{background:#fff0ef;border-color:#efc2be;color:#92251c}.alert.warning{background:#fff7e5;border-color:#ead099;color:#76550a}.footer{text-align:center;color:var(--muted);font-size:13px;padding:20px}.empty{padding:30px;text-align:center;color:var(--muted)}.calendar-controls{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin-bottom:16px}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.calendar-head{text-align:center;font-size:12px;font-weight:700;color:var(--muted);padding:8px}.calendar-day{background:#fff;border:1px solid var(--line);border-radius:9px;min-height:72px;padding:8px;position:relative}.calendar-day.empty{background:transparent;border:0}.calendar-day input{position:absolute;right:8px;top:8px}.calendar-day.checked{background:#e7f6ec;border-color:#8bc6a1}.calendar-day .day-number{font-weight:700}.note{color:var(--muted);font-size:13px}.login-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,var(--blue),#0b1f33)}.login-card{width:min(410px,100%);background:#fff;border-radius:16px;padding:34px;box-shadow:0 18px 50px rgba(0,0,0,.28)}.login-logo{height:90px;display:flex;justify-content:center;align-items:center}.login-logo img{max-height:78px;max-width:170px}.login-card h1{text-align:center;color:var(--blue);font-size:23px;margin:8px 0}.login-card .subtitle{text-align:center;color:var(--muted);font-size:14px;margin-bottom:25px}@media(max-width:720px){.topbar-inner,.page-heading{align-items:flex-start;flex-direction:column}.user-box{width:100%;justify-content:space-between}.user-box>span{text-align:left}.form-grid{grid-template-columns:1fr}.page-shell{padding:20px 14px 40px}.main-nav{padding:0 14px}.calendar-grid{gap:3px}.calendar-day{min-height:58px;padding:5px}.brand-copy small{display:none}}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:20px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:18px;box-shadow:0 4px 14px rgba(35,53,68,.05)}.stat-card .label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}.stat-card .value{font-size:31px;line-height:1.1;color:var(--navy);font-weight:800;margin:8px 0 3px}.stat-card .hint{font-size:12px;color:var(--muted)}.section-title{margin:24px 0 12px;font-size:18px;color:var(--navy)}.chart-bars{display:flex;flex-direction:column;gap:10px}.chart-row{display:grid;grid-template-columns:minmax(140px,240px) 1fr 55px;align-items:center;gap:10px;font-size:13px}.chart-track{height:14px;background:#eaf0f4;border-radius:999px;overflow:hidden}.chart-fill{height:100%;background:var(--blue);border-radius:999px}.audit-detail{max-width:420px;white-space:normal}.report-actions{gap:12px}


/* ==========================================================
   UI PRO 2026 - Capa visual. No modifica lógica de negocio.
   ========================================================== */
:root{
  --navy:#062b50;
  --navy-2:#0a416f;
  --blue:#1e6fe8;
  --blue-soft:#eaf3ff;
  --teal:#08a0a7;
  --orange:#ff7a16;
  --purple:#7351c8;
  --sky:#159bd8;
  --bg:#f5f8fc;
  --text:#0d2442;
  --muted:#64748b;
  --line:#e0e8f0;
}
body{background:linear-gradient(180deg,#f7faff 0,#f4f7fb 100%);color:var(--text)}
.topbar{background:linear-gradient(110deg,#052848 0%,#083a65 62%,#07528a 100%);box-shadow:0 4px 18px rgba(5,40,72,.16);position:relative;overflow:hidden}
.topbar:after{content:"";position:absolute;right:-90px;top:-90px;width:500px;height:230px;background:radial-gradient(circle,rgba(44,151,226,.17),transparent 68%);pointer-events:none}
.topbar-inner{max-width:1440px;min-height:86px;padding:14px 30px;position:relative;z-index:1}
.brand{gap:16px}.brand-logo{width:66px;height:58px;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.12)}
.brand-copy strong{font-size:22px;letter-spacing:-.01em}.brand-copy small{font-size:13px}
.user-box{position:relative;z-index:2}.user-copy strong{font-size:14px}.user-copy small{font-size:11px}
.user-avatar{width:38px;height:38px;border-radius:50%;background:#fff;color:#1764ae;display:flex;align-items:center;justify-content:center;font-weight:800;border:3px solid rgba(255,255,255,.35);box-shadow:0 5px 16px rgba(0,0,0,.15)}
.logout-btn{background:#d92d20!important;border-radius:9px!important;padding-inline:15px!important}
.main-nav{max-width:1440px;padding:0 30px;gap:8px;position:relative;z-index:1}
.main-nav a{display:flex;align-items:center;gap:8px;padding:14px 18px;border-radius:9px 9px 0 0;font-size:14px}
.main-nav a:hover{background:rgba(255,255,255,.11);color:#fff}.main-nav a.active{background:#1970e8;color:#fff;box-shadow:0 -1px 0 rgba(255,255,255,.1) inset}
.nav-glyph{font-size:15px;line-height:1;opacity:.95}
.page-shell{max-width:1440px;padding:28px 30px 48px}
.page-heading{align-items:center;margin-bottom:20px}.page-heading h1{font-size:30px;letter-spacing:-.02em}.page-heading h1:after{content:"";display:block;width:48px;height:4px;background:#2875e7;border-radius:99px;margin-top:9px}
.eyebrow{color:#506d8d;letter-spacing:.14em}.eyebrow.mini{font-size:9px;color:#75879a}
.date-chip,.period-chip{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:9px;padding:11px 15px;color:#173251;font-size:13px;font-weight:650;box-shadow:0 4px 14px rgba(24,62,100,.05)}
.date-icon{color:#1d64ae}
.card{border-color:#dde6ef;border-radius:14px;box-shadow:0 8px 24px rgba(36,65,93,.055)}
.welcome-card{background:#fff;border:1px solid #dfe7ef;border-radius:14px;min-height:98px;margin-bottom:18px;padding:20px 24px;display:flex;align-items:center;gap:18px;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(36,65,93,.055)}
.welcome-avatar{flex:0 0 48px;width:48px;height:48px;border-radius:50%;background:linear-gradient(145deg,#2b7ff0,#165bd0);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;box-shadow:0 8px 18px rgba(30,111,232,.25)}
.welcome-copy{position:relative;z-index:2}.welcome-copy h2{margin:0 0 8px;font-size:22px}.welcome-copy p{margin:0;color:var(--muted);font-size:13px}.dot-sep{padding:0 10px;color:#8aa0b5}
.welcome-art{position:absolute;right:0;bottom:0;width:340px;height:78px;opacity:.68;background:linear-gradient(180deg,transparent,#edf5fe)}
.mountain{position:absolute;bottom:-1px;width:0;height:0;border-left:70px solid transparent;border-right:70px solid transparent;border-bottom:50px solid #d9e9f8}
.m1{right:75px}.m2{right:-10px;border-left-width:95px;border-right-width:95px;border-bottom-width:65px;border-bottom-color:#d2e4f6}
.mine-dot{position:absolute;width:9px;height:9px;background:#7aa8d1;border-radius:50%;bottom:18px}.d1{right:112px}.d2{right:45px}
.stats-grid-pro{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.stat-card{min-height:178px;padding:18px 18px 15px;position:relative;overflow:hidden;transition:.2s ease}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(27,69,109,.09)}
.stat-card .stat-icon{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;margin-bottom:12px}
.stat-card .label{font-size:11px;line-height:1.35;color:#193557;min-height:31px}.stat-card .value{font-size:34px;margin:5px 0 7px}.stat-card .hint{line-height:1.4;min-height:34px}
.stat-line{position:absolute;left:14px;right:14px;bottom:7px;height:3px;border-radius:99px;background:currentColor}
.stat-blue{color:#1e6fe8}.stat-blue .stat-icon{background:#e8f1ff;color:#1e6fe8}
.stat-teal{color:#08a0a7}.stat-teal .stat-icon{background:#e5f8f8;color:#078e94}
.stat-orange{color:#ff7a16}.stat-orange .stat-icon{background:#fff0e5;color:#f26e0d}.stat-orange .value{color:#f36f0e}.accent-text{color:#ef6d10}
.stat-purple{color:#7351c8}.stat-purple .stat-icon{background:#f0ebfb;color:#7351c8}.stat-purple .value{color:#6746bf}
.stat-sky{color:#159bd8}.stat-sky .stat-icon{background:#e6f5fc;color:#159bd8}.stat-sky .value{color:#167dcc}
.dashboard-analysis-grid{display:grid;grid-template-columns:minmax(0,3.3fr) minmax(250px,1fr);gap:16px;margin-bottom:24px}
.analysis-card{padding:20px 22px}.card-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:16px}.card-heading-row h3{margin:5px 0 0;font-size:18px}
.chart-bars-pro{gap:13px}.chart-row{grid-template-columns:minmax(180px,280px) 1fr 48px}.chart-row>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chart-track{height:12px;background:#e9eff5}.chart-fill{background:linear-gradient(90deg,#2d75d9,#1d64ba)}
.month-summary{padding:20px;display:flex;flex-direction:column;justify-content:center;min-height:250px;background:linear-gradient(155deg,#fff,#f2f7ff)}
.summary-icon{width:58px;height:58px;border:2px solid #90baf0;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#1e6fe8;font-weight:900;margin:14px 0}
.summary-label{font-size:12px;color:#29445f}.summary-value{font-size:39px;line-height:1;color:#1e6fe8;font-weight:850;margin:5px 0}.summary-unit{font-size:12px;color:#1e6fe8}
.summary-divider{height:1px;background:#d8e5f3;margin:15px 0 10px}.month-summary p{font-size:11px;color:#63778b;margin:0;line-height:1.4}
.section-title{font-size:20px;margin-top:24px}.dashboard-grid-pro{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.dashboard-card{min-height:132px;padding:18px;display:flex;gap:15px;align-items:flex-start;position:relative}
.dashboard-card .icon{flex:0 0 48px;width:48px;height:48px;margin:0;border-radius:10px;color:#fff;font-size:20px;box-shadow:0 7px 15px rgba(26,72,119,.12)}
.dashboard-card h3{margin:1px 0 5px;font-size:16px}.dashboard-card p{font-size:12px;line-height:1.4}.module-copy{min-width:0}.module-link{display:inline-block;margin-top:10px;font-size:12px;font-weight:700}
.mod-blue .icon{background:linear-gradient(145deg,#287af0,#1762d2)}.mod-blue .module-link{color:#1e6fe8}
.mod-teal .icon{background:linear-gradient(145deg,#16b4b8,#058c96)}.mod-teal .module-link{color:#07979d}
.mod-orange .icon{background:linear-gradient(145deg,#ff952f,#f46a08)}.mod-orange .module-link{color:#f16e0c}
.mod-purple .icon{background:linear-gradient(145deg,#8a64dc,#6541ba)}.mod-purple .module-link{color:#7351c8}
.mod-slate .icon{background:linear-gradient(145deg,#4f6680,#31475f)}.mod-slate .module-link{color:#415d78}
.footer{background:#072a4b;color:#d8e5f0;padding:15px 30px;margin-top:10px;text-align:left}
@media(max-width:1100px){
  .stats-grid-pro{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-grid-pro{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-analysis-grid{grid-template-columns:1fr}
  .month-summary{min-height:auto}
}
@media(max-width:720px){
  .topbar-inner{padding:12px 14px}.main-nav{padding:0 14px}
  .brand-copy strong{font-size:18px}.user-avatar{display:none}
  .stats-grid-pro{grid-template-columns:1fr}
  .dashboard-grid-pro{grid-template-columns:1fr}
  .welcome-art{display:none}.welcome-card{padding:18px}.welcome-avatar{display:none}
  .chart-row{grid-template-columns:minmax(110px,160px) 1fr 42px}
}