:root{
  --bg:#f8fafc;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#64748b;
  --border:#e2e8f0;
  --dark:#0f172a;
  --dark-2:#111827;
  --soft:#f1f5f9;
  --success:#047857;
}
*{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(--text);background:var(--bg)} a{text-decoration:none;color:inherit} h1,h2,h3,p{margin:0}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;gap:24px}
.brand{display:flex;align-items:center;gap:12px}.brand strong{display:block}.brand small{display:block;color:var(--muted);font-size:12px}.brand-mark{width:40px;height:40px;border-radius:14px;background:var(--dark);color:#fff;display:grid;place-items:center;font-weight:700}
.nav{display:flex;gap:24px;color:var(--muted);font-size:14px}.nav a:hover{color:var(--text)} .header-actions{display:flex;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:14px;padding:12px 18px;font-weight:600;font-size:14px;border:1px solid transparent;cursor:pointer}.btn-dark{background:var(--dark);color:#fff}.btn-dark:hover{background:var(--dark-2)}.btn-light{background:#fff;border-color:#cbd5e1;color:#334155}.btn-light:hover{border-color:#94a3b8}.full{width:100%}
.hero{padding:72px 0 56px;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%)}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}.hero h1{font-size:56px;line-height:1.05;letter-spacing:-.03em;margin:12px 0 18px}.lead{font-size:20px;line-height:1.7;color:#475569}.muted{margin-top:14px;color:var(--muted);line-height:1.7}.eyebrow{display:inline-flex;padding:9px 14px;border-radius:999px;background:#fff;border:1px solid var(--border);font-size:14px;color:#475569;box-shadow:0 4px 16px rgba(15,23,42,.06)} .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.hero-points{display:flex;gap:24px;flex-wrap:wrap;margin-top:30px;color:var(--muted);font-size:14px}
.panel-preview,.content-card,.card,.compact-card,.auth-card,.table-card{background:var(--card);border:1px solid var(--border);border-radius:28px;box-shadow:0 12px 40px rgba(15,23,42,.06)}.panel-preview{padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid #f1f5f9}.panel-head.simple{padding-bottom:0;border:0}.panel-head strong{display:block;font-size:14px}.panel-head small{display:block;color:var(--muted);font-size:12px}.badge-success{padding:6px 12px;background:#ecfdf5;color:var(--success);border-radius:999px;font-weight:700;font-size:12px}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}.stat-box{background:var(--soft);border-radius:18px;padding:16px}.stat-box small{display:block;color:var(--muted)}.stat-box strong{display:block;font-size:28px;margin-top:8px}.preview-card{margin-top:16px;border:1px solid #f1f5f9;border-radius:20px;padding:16px}.mini-pill{padding:6px 10px;border:1px solid var(--border);border-radius:12px;color:#475569;font-size:12px}.pill-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}.pill-grid span,.pill-row span{display:block;background:var(--soft);border-radius:14px;padding:12px 14px;color:#475569}.section{padding:64px 0}.section h2{font-size:40px;line-height:1.1;letter-spacing:-.02em}.section-intro{margin-top:14px;color:var(--muted);line-height:1.7;max-width:740px}.compact-card{padding:32px}.feature-split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.mini-card{background:var(--soft);border-radius:18px;padding:20px}.mini-card p{margin-top:8px;color:var(--muted);line-height:1.6;font-size:14px}.card-grid{display:grid;gap:20px;margin-top:28px}.card-grid.three{grid-template-columns:repeat(3,1fr)}.card-grid.two{grid-template-columns:repeat(2,1fr)}.card-grid.one-gap{display:grid;gap:20px;margin-top:20px}.card{padding:24px}.card h3{font-size:20px}.card p{margin-top:10px;color:var(--muted);line-height:1.7}.card.dark{background:var(--dark);color:#fff}.card.dark p{color:#cbd5e1}.card.xl{padding:32px}
.dark-band{background:var(--dark);color:#fff}.dual-band{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.eyebrow.dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08);color:#cbd5e1}.muted-dark{margin-top:10px;color:#94a3b8}.dark-pills span{background:rgba(255,255,255,.07);color:#fff}.two-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.pill-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.white-band{background:#fff}.cta-block{background:var(--dark);color:#fff;border-radius:32px;padding:40px;display:grid;grid-template-columns:1fr .95fr;gap:40px;box-shadow:0 16px 48px rgba(15,23,42,.14)}.cta-block p{margin-top:12px;color:#cbd5e1;line-height:1.8}.contact-card{background:#fff;color:var(--text);border-radius:26px;padding:24px;display:grid;gap:14px}.contact-card input,.contact-card textarea,.auth-form input,.search-form input{width:100%;padding:14px 16px;border:1px solid #cbd5e1;border-radius:16px;font:inherit}.contact-card textarea{resize:vertical}.text-link{color:#475569;text-decoration:underline;text-underline-offset:4px}.centered{text-align:center;display:block}
.site-footer{border-top:1px solid var(--border);background:#fff;padding:28px 0}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center}.footer-inner p{margin-top:6px;color:var(--muted)}
.auth-wrap{min-height:calc(100vh - 85px);display:grid;place-items:center;padding:48px 24px}.auth-card{width:min(480px,100%);padding:32px}.auth-card h1{font-size:36px;margin:14px 0 8px}.auth-form{display:grid;gap:10px;margin-top:24px}.auth-form label{font-size:14px;color:#334155;font-weight:600}.demo-box{margin-top:18px;padding:16px;background:var(--soft);border-radius:18px}.demo-box p{margin-top:6px;color:var(--muted)}.alert{padding:12px 14px;border-radius:14px;margin-top:16px}.alert.error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.app-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.sidebar{background:#fff;border-right:1px solid var(--border);padding:24px;position:sticky;top:0;height:100vh}.app-brand{margin-bottom:28px}.side-nav{display:grid;gap:8px}.side-nav a,.disabled-link{padding:12px 14px;border-radius:14px;color:#475569;font-weight:600}.side-nav a:hover{background:var(--soft)}.side-nav a.active{background:var(--dark);color:#fff}.disabled-link{background:#f8fafc;color:#94a3b8}.app-main{padding:28px}.app-topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}.app-topbar h1{font-size:34px}.app-topbar p{margin-top:6px;color:var(--muted)}.content-card{padding:24px}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.metric{background:var(--soft);border-radius:22px;padding:18px}.metric span{display:block;color:var(--muted);font-size:14px}.metric strong{display:block;margin-top:8px;font-size:32px}.table-card{margin-top:20px;padding:20px}.table-card.no-padding{padding:0;overflow:hidden}.table-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}.stack-mobile{flex-wrap:wrap}.search-form{display:flex;gap:10px;flex-wrap:wrap}.search-form input{min-width:320px}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:14px 16px;border-bottom:1px solid #eef2f7;text-align:left;font-size:14px}.data-table th{color:#64748b;background:#f8fafc;font-weight:700}.status-pill{display:inline-flex;padding:6px 10px;background:#eef2ff;color:#3730a3;border-radius:999px;font-size:12px;font-weight:700}.empty{text-align:center;color:var(--muted);padding:24px!important}.detail-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px}.detail-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px}.detail-list li{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid #f1f5f9}.detail-list strong{color:#334155}
@media (max-width: 1024px){.hero-grid,.feature-split,.dual-band,.two-grid,.cta-block,.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.desktop-nav{display:none}.card-grid.three,.card-grid.two,.stat-grid,.pill-row,.mini-grid,.stats-row{grid-template-columns:1fr}.app-topbar,.detail-header,.footer-inner{flex-direction:column;align-items:flex-start}.search-form input{min-width:100%}.hero h1{font-size:42px}.section h2{font-size:32px}}

.alert.success{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}.mt-0{margin-top:0}.actions-row{display:flex;gap:10px;flex-wrap:wrap}.upload-form{display:grid;gap:14px;margin-top:18px}.upload-form input[type=file]{width:100%;padding:14px 16px;border:1px dashed #94a3b8;border-radius:16px;background:#f8fafc;font:inherit}.bullet-list{margin:14px 0 0;padding-left:18px;color:var(--muted);display:grid;gap:8px}.import-top-grid{align-items:start}.import-stats{grid-template-columns:repeat(5,1fr)}.compact-table th,.compact-table td{vertical-align:top}.msg{font-size:12px;line-height:1.5;margin:2px 0}.error-text{color:#b91c1c;font-weight:600}.warning-text{color:#92400e}.status-pill.success{background:#ecfdf5;color:#065f46}.status-pill.warning{background:#fff7ed;color:#9a3412}.status-pill.danger{background:#fef2f2;color:#991b1b}@media (max-width: 1024px){.import-stats{grid-template-columns:1fr 1fr}}

.filters-grid{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:16px;align-items:end}
.empleados-filter-grid{grid-template-columns:2fr 1fr 1fr 1fr auto}
.field-block{display:flex;flex-direction:column;gap:8px}
.field-block label{font-size:14px;font-weight:700;color:#5b6b86}
.field-block input,.field-block select{width:100%;padding:12px 14px;border:1px solid #d7deea;border-radius:14px;background:#fff;color:#091a3a}
.align-end{align-self:end}
.mb-16{margin-bottom:16px}
@media (max-width: 1100px){.filters-grid{grid-template-columns:1fr 1fr}.align-end{grid-column:1 / -1}}
@media (max-width: 720px){.filters-grid{grid-template-columns:1fr}}

.compact-table th,.compact-table td{font-size:13px}
.detail-stats{grid-template-columns:repeat(6,1fr);margin-bottom:20px}
.detail-grid{margin-top:0}
.big-inline{display:block;font-size:36px;margin-top:10px}
@media (max-width: 1200px){.detail-stats{grid-template-columns:repeat(3,1fr)}}
@media (max-width: 768px){.detail-stats{grid-template-columns:repeat(2,1fr)} .big-inline{font-size:28px}}

.topbar-actions{display:flex;align-items:center;gap:12px}
.version-chip{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border:1px solid #cbd5e1;border-radius:999px;background:#fff;color:#475569;font-size:12px;font-weight:700}
@media (max-width: 1024px){.topbar-actions{width:100%;justify-content:space-between}}

.form-help{padding:0 6px 8px;color:#64748b}

.checkbox-line{display:flex;align-items:center;gap:8px;color:#475569;font-size:14px}
.mt-20{margin-top:20px}
.mt-8{margin-top:8px}
.file-input-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}

.autocomplete-box {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 50;
  background: #fff;
  border: 1px solid #d9e1ec;
  border-radius: 12px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.12);
  max-height: 280px;
  overflow-y: auto;
}
.autocomplete-box.open { display: block; }
.autocomplete-item {
  display: flex;
  flex-direction: column;
  width: 100%;
  border: 0;
  background: #fff;
  text-align: left;
  padding: 10px 12px;
  cursor: pointer;
}
.autocomplete-item + .autocomplete-item { border-top: 1px solid #eef2f7; }
.autocomplete-item:hover { background: #f8fafc; }
.autocomplete-item strong { font-size: 13px; color: #0f172a; }
.autocomplete-item span { font-size: 14px; color: #0f172a; }
.autocomplete-item small { font-size: 12px; color: #64748b; margin-top: 2px; }

.corrections-table .row-problem td{background:#fff7ed}.corrections-table .row-corrected td{box-shadow:inset 3px 0 0 #059669}.correction-detail summary{list-style:none}.correction-detail summary::-webkit-details-marker{display:none}.correction-detail[open]{min-width:320px}.correction-form{min-width:280px}.correction-detail{display:grid;gap:8px}

.side-nav-group-label {
  margin: 1rem 0 .35rem;
  padding: 0 .85rem;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--muted, #7583a0);
  letter-spacing: .04em;
}

.btn-xs {
  padding: .35rem .55rem;
  font-size: .75rem;
}

.inline-actions.compact-actions {
  display: flex;
  gap: .35rem;
  flex-wrap: wrap;
}


.accordion-nav .side-group{margin:8px 0;border-top:1px solid rgba(15,23,42,.08);padding-top:8px}.accordion-nav .side-group summary{list-style:none;cursor:pointer;color:#94a3b8;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px}.accordion-nav .side-group summary::-webkit-details-marker{display:none}.accordion-nav .side-group a{display:block;margin-left:8px}.autocomplete-box{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid #dbe3f0;border-radius:12px;box-shadow:0 8px 30px rgba(15,23,42,.12);z-index:30;display:none;max-height:280px;overflow:auto}.autocomplete-box.open{display:block}.autocomplete-item{width:100%;text-align:left;border:0;background:#fff;padding:10px 12px;display:flex;flex-direction:column;gap:2px;cursor:pointer}.autocomplete-item:hover{background:#f8fafc}.autocomplete-item strong{font-size:13px}.autocomplete-item span{font-size:13px}.autocomplete-item small{font-size:11px;color:#64748b}.btn-xs{padding:6px 10px;font-size:12px}.inline-actions.compact-actions{display:flex;flex-direction:column;gap:6px}
.hidden{display:none !important}
.badge{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:#eef2ff;color:#1f2937;font-size:12px;font-weight:700}
.compact-table input[type="checkbox"]{transform:scale(1.05)}
#bulk-operation-form .filters-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
#bulk-operation-form .wide{grid-column:1 / -1}

html,body{max-width:100%;overflow-x:hidden}
.app-shell,.app-main,.content-card,.table-card,.panel-preview,.auth-card{min-width:0;max-width:100%}
.app-main{min-width:0}
.content-card{overflow:visible}
.table-card{overflow-x:auto}
.data-table{min-width:720px}
@media (max-width:1024px){
  .sidebar{display:none;position:fixed;left:0;top:0;bottom:0;width:min(86vw,320px);z-index:80;overflow:auto;box-shadow:0 20px 40px rgba(15,23,42,.18)}
  .sidebar.is-open{display:block}
  .mobile-nav-toggle{display:inline-flex;position:sticky;top:12px;z-index:60;margin-bottom:12px}
  .app-main{padding:16px}
  .content-card{padding:16px}
  .table-head{align-items:flex-start}
}
@media (min-width:1025px){
  .mobile-nav-toggle{display:none}
}
.side-group summary{user-select:none}
.install-app-btn{position:fixed;right:16px;bottom:16px;z-index:90;box-shadow:0 12px 30px rgba(15,23,42,.22)}
.form-row-responsive{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.compact-table{display:block;overflow-x:auto}
.compact-table table,.compact-table .data-table{min-width:760px}


/* Deploy 5: base diaria compacta + maestros bulk */
.selection-toolbar{align-items:center}
.btn-primary-soft{background:#2563eb;color:#fff;border-color:#2563eb}
.inline-date-label{display:inline-flex;align-items:center;gap:8px;color:#334155;font-size:14px}
.inline-date-label input{padding:10px 12px;border:1px solid #d7deea;border-radius:12px;background:#fff}
.quick-filter-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.chip-btn{border:0;background:#e2e8f0;color:#fff;padding:6px 10px;border-radius:999px;font:inherit;font-size:13px;cursor:pointer;color:#fff;background:#cbd5e1}
.chip-btn:hover{background:#94a3b8}
.compact-bulk-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.base-diaria-card .data-table,.base-diaria-card .compact-table,.base-diaria-card table{min-width:0}
#base-diaria-table th,#base-diaria-table td{padding:10px 8px;font-size:12px;line-height:1.25;white-space:normal}
#base-diaria-table th{position:sticky;top:0;z-index:2}
#base-diaria-table .sticky-col{position:sticky;left:0;background:#fff;z-index:1}
#base-diaria-table .sticky-date{min-width:95px;box-shadow:2px 0 0 rgba(226,232,240,.8)}
#base-diaria-table thead .sticky-col{background:#f8fafc;z-index:3}
#base-diaria-table td strong{display:block}
#base-diaria-table td:nth-child(6),#base-diaria-table td:nth-child(7),#base-diaria-table td:nth-child(12),#base-diaria-table td:nth-child(13),#base-diaria-table td:nth-child(14),#base-diaria-table td:nth-child(15),#base-diaria-table td:nth-child(16){text-align:center}
.data-table td,.data-table th{word-break:break-word}
.nowrap{white-space:nowrap;word-break:normal}
.audit-table{min-width:1400px;table-layout:auto}
.audit-table .audit-col-date,.audit-table .audit-col-user,.audit-table .audit-col-entity,.audit-table .audit-col-ip{white-space:nowrap;word-break:normal;vertical-align:top}
.audit-table .audit-col-date{min-width:170px}
.audit-table .audit-col-user{min-width:180px}
.audit-table .audit-col-entity{min-width:140px}
.audit-table .audit-col-ip{min-width:140px}
.audit-table .audit-col-detail{min-width:520px;max-width:760px}
.audit-detail-pre{margin:0;white-space:pre-wrap;word-break:break-word;font-family:Consolas,Monaco,monospace;font-size:12px;line-height:1.45;max-height:220px;overflow:auto}
.maestro-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.maestro-tools form{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.maestro-tools input[type=file]{max-width:280px}
@media (max-width: 1400px){
  .hide-lg{display:none}
}
@media (max-width: 1200px){
  .hide-md{display:none}
  #base-diaria-table th,#base-diaria-table td{padding:8px 6px;font-size:11px}
}
@media (max-width: 768px){
  .hide-sm{display:none}
  .selection-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .inline-date-label{grid-column:1 / -1}
  .quick-filter-row{gap:6px}
  .chip-btn{font-size:12px;padding:6px 8px}
  .topbar-actions{flex-wrap:wrap}
  .version-chip{order:2}
}

/* Deploy 6: UOCRA + historiales importación */
.wrap-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.no-margin{margin:0}
.chip{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:#eef2ff;color:#334155;font-size:12px;font-weight:700}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.stats-grid-compact .stat-card{min-height:96px}
.stat-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:8px}
.stat-card small{color:#64748b;font-size:13px;font-weight:600}
.stat-card strong{font-size:22px;line-height:1.1;color:#0f172a}
.table-scroll-x{overflow-x:auto}
.table-scroll-x .data-table{min-width:1400px}

/* Deploy 7: fixes búsqueda/UOCRA/empleados */
.base-diaria-card{overflow-x:auto !important;}
.base-diaria-card .data-table{min-width:1100px;}
.table-scroll-x .data-table{min-width:1200px;}
@media (max-width: 1280px){#base-diaria-table th,#base-diaria-table td{padding:7px 5px;font-size:11px}}
@media (max-width: 980px){.base-diaria-card .data-table{min-width:960px;} .table-scroll-x .data-table{min-width:980px;}}

/* Deploy 14: UOCRA subtotales + tabla legible */
.uocra-table{table-layout:auto;}
.uocra-table th,.uocra-table td{word-break:normal;white-space:nowrap;vertical-align:top;}
.uocra-table td:last-child,.uocra-table th:last-child{white-space:normal;min-width:260px;}
.uocra-table td:nth-child(1),.uocra-table td:nth-child(2),.uocra-table td:nth-child(3),.uocra-table td:nth-child(5),.uocra-table td:nth-child(6),.uocra-table th:nth-child(1),.uocra-table th:nth-child(2),.uocra-table th:nth-child(3),.uocra-table th:nth-child(5),.uocra-table th:nth-child(6){min-width:78px;}
.uocra-table td:nth-child(4),.uocra-table th:nth-child(4){white-space:normal;min-width:180px;}


.pager-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 16px}.pager-actions .btn.is-disabled{pointer-events:none;opacity:.45}.pager-meta strong{font-weight:700}.table-head .actions-row{display:flex;gap:8px;flex-wrap:wrap}


/* Deploy 3 UX operativa */
.alert{position:relative;padding-right:44px;transition:opacity .25s ease,transform .25s ease}.alert.fade-out{opacity:0;transform:translateY(-4px)}
.alert-close{position:absolute;right:10px;top:8px;border:0;background:transparent;color:inherit;font-size:22px;line-height:1;cursor:pointer;opacity:.6}.alert-close:hover{opacity:1}
.btn.is-loading{opacity:.9;cursor:wait}.btn-spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;display:inline-block;vertical-align:-2px;margin-right:8px;animation:btnspin .8s linear infinite}
.btn.btn-light .btn-spinner{border-color:rgba(15,23,42,.15);border-top-color:#0f172a}
@keyframes btnspin{to{transform:rotate(360deg)}}
.filters-grid.card.app-get-form{position:sticky;top:12px;z-index:5;box-shadow:0 10px 24px rgba(15,23,42,.06)}
.table-card,.table-scroll-x,.base-diaria-card{scrollbar-color:#94a3b8 #e2e8f0;scrollbar-width:thin}
.table-card::-webkit-scrollbar,.table-scroll-x::-webkit-scrollbar,.base-diaria-card::-webkit-scrollbar{height:10px;width:10px}.table-card::-webkit-scrollbar-thumb,.table-scroll-x::-webkit-scrollbar-thumb,.base-diaria-card::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:999px}.table-card::-webkit-scrollbar-track,.table-scroll-x::-webkit-scrollbar-track,.base-diaria-card::-webkit-scrollbar-track{background:#e2e8f0}
.data-table thead th{position:sticky;top:0;background:#f8fafc;z-index:2}
.status-pill,.badge,.chip{white-space:nowrap}
@media (max-width: 1024px){.filters-grid.card.app-get-form{position:static;box-shadow:none}}

/* Deploy 30: diseno operativo */
.page-intro{
  display:grid;
  gap:18px;
  margin-bottom:20px;
}
.page-intro-card{
  padding:24px 26px;
  border-radius:26px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
  border:1px solid #dbe4f0;
  box-shadow:0 16px 36px rgba(15,23,42,.05);
}
.page-intro-card h2{
  font-size:17px;
  margin-bottom:8px;
}
.page-intro-card p{
  color:#52627d;
  line-height:1.65;
}
.page-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.page-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:#eff6ff;
  color:#1e3a8a;
  font-size:12px;
  font-weight:700;
}
.page-chip.muted{
  background:#f1f5f9;
  color:#475569;
  margin-top:0;
}
.surface-grid{
  display:grid;
  gap:20px;
}
.surface-grid.two{
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
}
.surface-grid.equal{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.surface-grid.three{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.surface-card{
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:26px;
  padding:24px;
  box-shadow:0 14px 34px rgba(15,23,42,.05);
  min-width:0;
}
.surface-card.tight{
  padding:18px;
}
.surface-card.soft{
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
}
.surface-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  margin-bottom:16px;
}
.surface-head h3,.surface-head h4{
  margin:0;
}
.surface-head p{
  margin-top:8px;
  color:#64748b;
  line-height:1.6;
}
.surface-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
.surface-stack{
  display:grid;
  gap:16px;
}
.field-note{
  margin-top:6px;
  color:#64748b;
  font-size:13px;
  line-height:1.55;
}
.upload-shell{
  display:grid;
  gap:16px;
}
.upload-shell .upload-form{
  margin-top:0;
}
.upload-shell .file-input-row{
  padding:14px 16px;
  border:1px dashed #c4d1e1;
  border-radius:18px;
  background:#f8fafc;
  display:block;
}
.upload-shell .file-input-row input[type=file]{
  padding:0;
  border:0;
  background:transparent;
  width:100%;
  max-width:100%;
  min-height:28px;
}
.checklist{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.checklist li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:#334155;
  line-height:1.55;
}
.checklist li::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:#2563eb;
  margin-top:8px;
  flex:0 0 auto;
}
.summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:14px;
}
.summary-tile{
  border:1px solid #e2e8f0;
  border-radius:22px;
  padding:18px;
  background:#f8fafc;
}
.summary-tile span{
  display:block;
  color:#64748b;
  font-size:13px;
  font-weight:600;
}
.summary-tile strong{
  display:block;
  margin-top:10px;
  font-size:30px;
  line-height:1;
  color:#0f172a;
}
.summary-tile em{
  display:block;
  margin-top:8px;
  color:#64748b;
  font-style:normal;
  font-size:12px;
}
.summary-tile.success{
  background:#ecfdf5;
  border-color:#a7f3d0;
}
.summary-tile.warning{
  background:#fff7ed;
  border-color:#fdba74;
}
.summary-tile.info{
  background:#eff6ff;
  border-color:#bfdbfe;
}
.section-divider{
  height:1px;
  background:#e2e8f0;
  margin:18px 0;
}
.filters-grid.card.import-filter-card,
.filters-grid.card.ops-filter-card{
  padding:20px;
  border-radius:24px;
  border-color:#dbe4f0;
}
.table-card.section-card,
.surface-card.table-section{
  margin-top:20px;
}
.table-section-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:14px;
}
.table-section-header h3{
  margin:0;
}
.table-section-header p{
  margin-top:8px;
  color:#64748b;
  line-height:1.6;
}
.table-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
.table-toolbar .badge,
.table-toolbar .page-chip{
  margin-top:0;
}
.table-card.soft-table{
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}
.data-table tbody tr.row-soft td{
  background:#fcfdff;
}
.data-table tbody tr.row-franco td{
  background:#f8fafc;
}
.data-table tbody tr.row-feriado td{
  background:#fff7ed;
}
.data-table tbody tr.row-incompleta td{
  background:#fff1f2;
}
.data-table tbody tr.row-manual td{
  box-shadow:inset 3px 0 0 #2563eb;
}
.data-table tbody tr.row-warning td{
  box-shadow:inset 3px 0 0 #f59e0b;
}
.data-table tbody tr.row-soft:hover td,
.data-table tbody tr.row-franco:hover td,
.data-table tbody tr.row-feriado:hover td,
.data-table tbody tr.row-incompleta:hover td{
  filter:brightness(.992);
}
.state-stack{
  display:grid;
  gap:4px;
}
.state-stack .muted{
  margin-top:0;
  font-size:12px;
  line-height:1.4;
}
.audit-table .audit-col-detail{
  min-width:620px;
}
.audit-detail-pre{
  padding:14px;
  border-radius:18px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
}
.audit-table td{
  vertical-align:top;
}
.audit-table .status-pill{
  margin-top:2px;
}
.history-toolbar{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.history-bulk-bar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-bottom:12px;
}
.history-table .actions-row{
  gap:8px;
}
.stats-strip{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
}
.stats-strip .chip{
  justify-content:flex-start;
  padding:10px 12px;
  background:#f8fafc;
  border:1px solid #dbe4f0;
  color:#334155;
}
.preview-filter-btn.is-active{
  background:#0f172a;
  color:#fff;
  border-color:#0f172a;
}
.btn-danger{
  background:#991b1b;
  color:#fff;
  border-color:#991b1b;
}
.btn-danger:hover{
  background:#7f1d1d;
  border-color:#7f1d1d;
}
.check-inline{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:46px;
  padding:0 2px;
  color:#334155;
  font-size:14px;
}
.inline-label{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  color:#334155;
  font-weight:600;
}
.inline-label input{
  padding:10px 12px;
  border:1px solid #d7deea;
  border-radius:12px;
  background:#fff;
}
.alert-danger,.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.alert-success{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.alert-info{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}
.preview-result-note{
  color:#64748b;
  font-size:13px;
}
.card-grid.import-entry-grid{
  margin-top:20px;
}
.import-stage-card{
  padding:24px;
  border-radius:24px;
  background:#fff;
  border:1px solid #dbe4f0;
  box-shadow:0 12px 30px rgba(15,23,42,.04);
}
.import-stage-card h3{
  margin-bottom:10px;
}
.import-stage-card p{
  margin-top:0;
}
.import-preview-shell{
  display:grid;
  gap:18px;
}
.table-hint{
  color:#64748b;
  font-size:13px;
  line-height:1.55;
}
@media (max-width: 1200px){
  .surface-grid.two,
  .surface-grid.equal,
  .surface-grid.three{
    grid-template-columns:1fr;
  }
}
@media (max-width: 768px){
  .page-intro-card,
  .surface-card,
  .import-stage-card{
    padding:18px;
    border-radius:22px;
  }
  .summary-tile strong{
    font-size:24px;
  }
  .table-section-header,
  .surface-head,
  .history-toolbar{
    flex-direction:column;
    align-items:flex-start;
  }
}
.config-bulk-shell{padding:20px;border-radius:18px}
.config-bulk-toolbar{display:grid;grid-template-columns:minmax(260px,1.4fr) minmax(220px,1fr) minmax(170px,.7fr) auto;gap:16px;align-items:end;margin-bottom:12px}
.config-bulk-actions{justify-content:flex-end;gap:10px;flex-wrap:wrap}
.config-bulk-actions .btn{white-space:nowrap}
.config-pending-table-wrap{margin-top:12px}
.config-pending-table-wrap .data-table{min-width:1180px}
.config-pending-table-wrap th{white-space:nowrap}
.config-pending-table-wrap td{vertical-align:top}
.config-pending-links{gap:8px}
.data-table tbody tr.row-ausencia-marca td{
  background:#fff7d6;
  box-shadow:inset 4px 0 0 #f59e0b;
}
.data-table tbody tr.row-conflicto-novedad td{
  background:#ffe4e6;
  box-shadow:inset 4px 0 0 #e11d48;
}
@media (max-width: 1200px){.config-bulk-toolbar{grid-template-columns:1fr 1fr}.config-bulk-actions{grid-column:1/-1;justify-content:flex-start}}
@media (max-width: 768px){.config-bulk-toolbar{grid-template-columns:1fr}.config-pending-table-wrap .data-table{min-width:980px}}

/* Deploy 36: modernizacion final */
:root{
  --bg:#eef3f8;
  --bg-accent:#f8fbff;
  --card:#ffffff;
  --card-soft:#f6f9fc;
  --text:#0f172a;
  --muted:#5f6f86;
  --border:#d7e2ee;
  --line:#e7edf5;
  --accent:#2563eb;
  --accent-soft:#e8f0ff;
  --success:#047857;
  --warning:#b45309;
  --danger:#b91c1c;
  --shadow-sm:0 10px 24px rgba(15,23,42,.06);
  --shadow-md:0 18px 44px rgba(15,23,42,.08);
  --shadow-lg:0 28px 64px rgba(15,23,42,.10);
}
body.app-shell-bg{
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.09), transparent 26%),
    radial-gradient(circle at top right, rgba(14,165,233,.08), transparent 22%),
    linear-gradient(180deg,#f7fbff 0%,#eef3f8 55%,#edf2f7 100%);
  color:var(--text);
}
.app-shell{
  grid-template-columns:280px minmax(0,1fr);
  background:transparent;
}
.sidebar{
  background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(248,251,255,.94) 100%);
  backdrop-filter:blur(18px);
  border-right:1px solid rgba(215,226,238,.92);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.7);
  padding:22px 18px 28px;
}
.app-brand{
  padding:10px 12px;
  border-radius:22px;
  background:linear-gradient(180deg,#ffffff 0%,#f4f8fd 100%);
  border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
}
.brand-mark{
  width:42px;
  height:42px;
  border-radius:16px;
  background:linear-gradient(135deg,#111827 0%,#1e3a8a 100%);
  box-shadow:0 12px 24px rgba(37,99,235,.22);
}
.brand strong{font-size:17px}
.brand small{font-size:12px;color:var(--muted)}
.side-nav{
  gap:10px;
}
.accordion-nav .side-group{
  margin:8px 0 0;
  border-top:1px solid rgba(148,163,184,.18);
  padding-top:10px;
}
.accordion-nav .side-group summary{
  padding:6px 12px;
  color:#64748b;
  font-size:11px;
  letter-spacing:.08em;
}
.side-nav a,.disabled-link{
  border-radius:16px;
  padding:12px 14px;
  color:#475569;
  transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.side-nav a:hover{
  background:rgba(255,255,255,.86);
  color:#0f172a;
  box-shadow:var(--shadow-sm);
  transform:translateX(2px);
}
.side-nav a.active{
  background:linear-gradient(135deg,#0f172a 0%,#1e3a8a 100%);
  color:#fff;
  box-shadow:0 16px 28px rgba(15,23,42,.18);
}
.app-main{
  padding:26px;
}
.app-topbar{
  position:sticky;
  top:14px;
  z-index:12;
  margin-bottom:24px;
  padding:20px 24px;
  border:1px solid rgba(215,226,238,.92);
  border-radius:28px;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(16px);
  box-shadow:var(--shadow-md);
}
.app-topbar h1{
  font-size:40px;
  line-height:1.02;
  letter-spacing:-.03em;
}
.app-topbar p{
  margin-top:8px;
  color:var(--muted);
  font-weight:600;
}
.version-chip{
  padding:10px 14px;
  background:linear-gradient(180deg,#ffffff 0%,#f2f7ff 100%);
  border-color:#d7e2ee;
  color:#334155;
  box-shadow:var(--shadow-sm);
}
.content-card{
  padding:26px;
  border:1px solid rgba(215,226,238,.9);
  border-radius:30px;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(10px);
  box-shadow:var(--shadow-lg);
}
.page-intro-card,
.surface-card,
.table-card,
.card,
.import-stage-card{
  border-radius:28px;
  border-color:rgba(215,226,238,.9);
  background:linear-gradient(180deg,#ffffff 0%,#f9fbfe 100%);
  box-shadow:var(--shadow-md);
}
.page-intro-card{
  padding:28px 30px;
}
.surface-card.soft,
.table-card.soft-table,
.import-stage-card{
  background:linear-gradient(180deg,#ffffff 0%,#f5f9fd 100%);
}
.dashboard-hero-card{
  background:
    radial-gradient(circle at top right, rgba(37,99,235,.12), transparent 22%),
    radial-gradient(circle at top left, rgba(14,165,233,.10), transparent 18%),
    linear-gradient(180deg,#ffffff 0%,#f6faff 100%);
}
.dashboard-summary-grid{
  margin-top:18px;
}
.dashboard-main-grid{
  align-items:start;
}
.dashboard-note-card,
.quick-action-card{
  min-height:220px;
}
.surface-head,
.table-head,
.table-section-header{
  gap:16px;
}
.surface-head h3,
.table-head h2,
.table-section-header h3{
  letter-spacing:-.02em;
}
.surface-head p,
.table-head p,
.table-section-header p,
.page-intro-card p{
  color:var(--muted);
}
.surface-actions,
.actions-row{
  gap:12px;
}
.btn{
  min-height:44px;
  border-radius:16px;
  padding:11px 18px;
  font-weight:700;
  letter-spacing:.01em;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;
}
.btn:hover{
  transform:translateY(-1px);
}
.btn-dark{
  background:linear-gradient(135deg,#0f172a 0%,#1e293b 50%,#1e40af 100%);
  box-shadow:0 16px 30px rgba(30,64,175,.18);
}
.btn-light{
  background:rgba(255,255,255,.88);
  border-color:#d1dceb;
  color:#334155;
}
.btn-light:hover{
  border-color:#94a3b8;
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.filters-grid.card,
.filters-grid.surface-card{
  padding:20px;
  border-radius:24px;
  background:rgba(255,255,255,.86);
  box-shadow:var(--shadow-sm);
}
.field-block label{
  color:#51627b;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.field-block input,
.field-block select,
.inline-label input,
.inline-date-label input{
  min-height:46px;
  border-radius:16px;
  border:1px solid #d4dfeb;
  background:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.field-block input:focus,
.field-block select:focus,
.inline-label input:focus,
.inline-date-label input:focus{
  outline:none;
  border-color:#7aa2f7;
  box-shadow:0 0 0 4px rgba(37,99,235,.10);
}
.summary-tile,
.stat-card,
.metric{
  border:1px solid rgba(215,226,238,.9);
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  box-shadow:var(--shadow-sm);
}
.summary-tile strong,
.stat-card strong,
.metric strong{
  letter-spacing:-.03em;
}
.page-chip,
.chip,
.badge,
.status-pill{
  border-radius:999px;
  border:1px solid rgba(191,219,254,.7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
}
.page-chip{
  background:linear-gradient(180deg,#eff6ff 0%,#dbeafe 100%);
}
.page-chip.muted{
  background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%);
}
.status-pill{
  background:linear-gradient(180deg,#eff6ff 0%,#dbeafe 100%);
  color:#1e3a8a;
}
.status-pill.success{
  background:linear-gradient(180deg,#ecfdf5 0%,#d1fae5 100%);
  color:#065f46;
  border-color:#a7f3d0;
}
.status-pill.warning{
  background:linear-gradient(180deg,#fff7ed 0%,#ffedd5 100%);
  color:#9a3412;
  border-color:#fdba74;
}
.status-pill.danger{
  background:linear-gradient(180deg,#fef2f2 0%,#fee2e2 100%);
  color:#991b1b;
  border-color:#fecaca;
}
.table-card.no-padding{
  overflow:hidden;
}
.table-scroll-x{
  padding-bottom:4px;
}
.data-table{
  min-width:760px;
}
.data-table th,
.data-table td{
  padding:14px 16px;
  border-bottom:1px solid var(--line);
}
.data-table th{
  background:#f6f9fd;
  color:#5b6b83;
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.data-table tbody tr td{
  background:rgba(255,255,255,.88);
}
.data-table tbody tr:last-child td{
  border-bottom:0;
}
.data-table tbody tr.row-soft td{
  background:rgba(255,255,255,.78);
}
.data-table tbody tr.row-franco td{
  background:#f8fbff;
}
.data-table tbody tr.row-feriado td{
  background:#fff8ef;
}
.data-table tbody tr.row-incompleta td{
  background:#fff2f2;
}
.data-table tbody tr:hover td{
  background:#f8fbff;
}
.soft-table .data-table thead th{
  position:sticky;
  top:0;
  z-index:2;
}
.text-link{
  color:#1d4ed8;
  font-weight:600;
}
.text-link:hover{
  color:#1e40af;
}
.audit-detail-pre{
  background:#f8fbff;
  border:1px solid var(--line);
  border-radius:20px;
}
.upload-shell .file-input-row{
  border-radius:20px;
  background:linear-gradient(180deg,#f8fbff 0%,#f3f8fc 100%);
}
.import-stage-card{
  min-height:190px;
}
.preview-filter-btn.is-active{
  background:linear-gradient(135deg,#0f172a 0%,#1e40af 100%);
  border-color:#1e40af;
}
.stats-strip .chip{
  background:linear-gradient(180deg,#ffffff 0%,#f6f9fd 100%);
}
.table-hint,
.preview-result-note,
.form-help{
  color:var(--muted);
}
.content-card .alert{
  border-radius:18px;
  box-shadow:var(--shadow-sm);
}
@media (max-width: 1280px){
  .app-shell{
    grid-template-columns:256px minmax(0,1fr);
  }
  .app-topbar h1{
    font-size:34px;
  }
}
@media (max-width: 1024px){
  .sidebar{
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(20px);
  }
  .content-card{
    padding:18px;
    border-radius:24px;
  }
  .app-topbar{
    top:10px;
    padding:18px;
    border-radius:24px;
  }
}
@media (max-width: 768px){
  .app-main{
    padding:14px;
  }
  .app-topbar h1{
    font-size:30px;
  }
  .page-intro-card,
  .surface-card,
  .table-card,
  .content-card{
    border-radius:22px;
  }
  .summary-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media (max-width: 560px){
  .summary-grid{
    grid-template-columns:1fr;
  }
  .surface-actions,
  .actions-row{
    width:100%;
  }
  .surface-actions .btn,
  .actions-row .btn{
    width:100%;
  }
}

/* Deploy 37: mobile containment and device-fit fixes */
html,
body{
  max-width:100%;
}
.app-shell,
.app-main,
.content-card,
.content-card > *,
.page-intro,
.page-intro-card,
.surface-grid,
.surface-card,
.table-card,
.table-scroll-x,
.base-diaria-card,
.config-pending-table-wrap,
.card-grid,
.stats-grid,
.summary-grid,
.dashboard-main-grid,
.dashboard-summary-grid{
  min-width:0;
}
.table-scroll-x,
.base-diaria-card,
.config-pending-table-wrap{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  overscroll-behavior-x:contain;
}
.table-scroll-x .data-table,
.base-diaria-card .data-table,
.config-pending-table-wrap .data-table{
  width:max-content;
  min-width:100%;
}

@media (max-width: 900px){
  body{
    overflow-x:hidden;
  }
  .app-shell{
    display:block;
    width:100%;
  }
  .sidebar{
    width:min(88vw,320px);
    max-width:100%;
  }
  .app-main{
    width:100%;
    max-width:100%;
    padding:12px;
  }
  .app-topbar{
    position:static;
    width:100%;
    max-width:100%;
    padding:16px;
    margin-bottom:14px;
  }
  .content-card{
    width:100%;
    max-width:100%;
    padding:14px;
    border-radius:20px;
  }
  .surface-card,
  .table-card,
  .page-intro-card{
    border-radius:20px;
  }
  .page-chip-row,
  .topbar-actions{
    width:100%;
    align-items:stretch;
    justify-content:flex-start;
  }
  .topbar-actions form,
  .topbar-actions .btn,
  .topbar-actions .version-chip{
    width:100%;
  }
  .topbar-actions .version-chip{
    justify-content:flex-start;
  }
  .surface-grid.two,
  .surface-grid.equal,
  .surface-grid.three,
  .card-grid.two,
  .card-grid.three,
  .stats-grid,
  .dashboard-main-grid{
    grid-template-columns:1fr;
  }
  .filters-grid,
  .empleados-filter-grid,
  .config-bulk-toolbar{
    grid-template-columns:1fr;
  }
  .config-bulk-actions{
    grid-column:auto;
    justify-content:stretch;
  }
  .config-bulk-actions .btn,
  .surface-actions .btn,
  .actions-row .btn{
    width:100%;
  }
  .soft-table .data-table thead th,
  .data-table thead th{
    position:static;
  }
}

@media (max-width: 640px){
  .app-main{
    padding:10px;
  }
  .mobile-nav-toggle{
    width:100%;
    justify-content:center;
  }
  .app-topbar h1{
    font-size:28px;
    line-height:1.05;
  }
  .app-topbar p{
    font-size:14px;
  }
  .content-card,
  .page-intro-card,
  .surface-card,
  .table-card{
    padding:12px;
    border-radius:18px;
  }
  .table-card.no-padding{
    padding:0;
  }
  .data-table th,
  .data-table td{
    padding:12px 12px;
    font-size:13px;
  }
  .file-input-row{
    align-items:flex-start;
  }
  .file-input-row input[type=file]{
    width:100%;
    max-width:100%;
  }
}