:root{--bg:#f4f6f8;--card:#fff;--ink:#172033;--muted:#64748b;--line:#dbe3ee;--primary:#0f766e;--primary-dark:#115e59;--danger:#b91c1c;--ok:#166534;--warn:#92400e;--info:#1d4ed8;--soft:#eef6f5}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#0f766e,#172033)}[v-cloak]{display:none}.topbar{background:#fff;border-bottom:1px solid var(--line);padding:26px clamp(18px,4vw,44px);display:flex;justify-content:space-between;gap:20px;align-items:center}.topbar h1,.login-card h1{margin:.25rem 0;font-size:clamp(1.7rem,3vw,2.4rem)}.topbar p,.login-card p{margin:0;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}.brand-pill,.session-pill{display:inline-flex;background:#e0f2f1;color:#115e59;font-weight:800;border-radius:999px;padding:6px 12px;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase}.session-pill{background:#f1f5f9;color:#334155;text-transform:none;letter-spacing:0}.logout{color:#115e59;font-weight:800;text-decoration:none}.container{max-width:1280px;margin:0 auto;padding:26px clamp(14px,3vw,32px) 48px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 24px rgba(15,23,42,.05);padding:20px}.grid{display:grid;gap:18px}.metrics{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}.two-cols{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:18px}.dashboard-grid{grid-template-columns:1fr 1.35fr;margin-bottom:18px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric span{display:block;color:var(--muted);font-size:.88rem}.metric strong{display:block;margin-top:6px;font-size:clamp(1.25rem,2.1vw,1.55rem);overflow-wrap:anywhere}.metric small{display:block;color:var(--muted);margin-top:6px}h2{margin:0 0 16px;font-size:1.15rem}.stack{display:grid;gap:14px}.small-gap{gap:9px}.toolbar-card{margin-bottom:14px}.toolbar{display:flex;align-items:end;justify-content:space-between;gap:18px}.inline-form{display:flex;gap:10px;align-items:end}label{display:grid;gap:6px;font-weight:700;font-size:.9rem}.check-row{display:flex;align-items:center;gap:10px}.check-row input{width:auto}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:11px 12px;font:inherit;background:#fff;color:var(--ink)}input:disabled{background:#f8fafc;color:#64748b}textarea{resize:vertical}button{border:0;border-radius:12px;background:var(--primary);color:#fff;font-weight:800;padding:12px 16px;cursor:pointer}button:hover{background:var(--primary-dark)}button.secondary{background:#e2e8f0;color:#0f172a}button.secondary:hover{background:#cbd5e1}.button-row{display:flex;gap:10px;flex-wrap:wrap}.table-button{padding:8px 10px;border-radius:10px;font-size:.82rem}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;padding:10px}.tabs button{background:#f8fafc;color:#334155;border:1px solid var(--line)}.tabs button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.tab-panel{animation:fadeIn .18s ease}@keyframes fadeIn{from{opacity:.45;transform:translateY(3px)}to{opacity:1;transform:none}}.alert{max-width:1280px;margin:0 auto 18px;border-radius:14px;padding:12px 16px;font-weight:800}.alert.error{background:#fee2e2;color:var(--danger);border:1px solid #fecaca}.alert.success{background:#dcfce7;color:var(--ok);border:1px solid #bbf7d0}.alert.info{background:#ffedd5;color:var(--warn);border:1px solid #fed7aa}.mini-alert{border-radius:12px;padding:10px 12px;font-weight:700}.mini-alert.info{background:#dbeafe;color:var(--info);border:1px solid #bfdbfe}.mini-alert.warning{background:#ffedd5;color:var(--warn);border:1px solid #fed7aa}.mini-alert.danger{background:#fee2e2;color:var(--danger);border:1px solid #fecaca}.kpi-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.kpi-list div{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:14px}.kpi-list span{display:block;color:var(--muted);font-size:.85rem}.kpi-list strong{display:block;margin-top:4px;font-size:1.45rem}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:.92rem}th,td{border-bottom:1px solid var(--line);padding:10px;text-align:left;white-space:nowrap}th{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}.muted{color:var(--muted);text-align:center}.muted.left{text-align:left}.badge{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:900}.badge.ok{background:#dcfce7;color:#166534}.badge.off{background:#f1f5f9;color:#475569}.login-card{width:min(440px,92vw);background:#fff;border-radius:22px;padding:32px;box-shadow:0 22px 60px rgba(0,0,0,.25)}@media(max-width:1000px){.metrics,.two-cols,.dashboard-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.toolbar{display:grid}.inline-form{display:grid}.topbar{align-items:flex-start}}@media(max-width:680px){.topbar{display:grid}.metrics{grid-template-columns:1fr}.card{padding:16px}.kpi-list{grid-template-columns:1fr}.tabs button{width:100%}.top-actions{justify-content:flex-start}}

/* Parche admin ajustes finos */
.helper-box{background:#f8fafc;border:1px dashed var(--line);border-radius:14px;padding:12px 14px;color:var(--muted);line-height:1.45}.admin-metrics{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}.tabs button{white-space:nowrap}.mini-alert.danger{background:#fee2e2;color:var(--danger);border-color:#fecaca}.mini-alert.warning{background:#fef3c7;color:var(--warn);border-color:#fde68a}.mini-alert.info{background:#dbeafe;color:var(--info);border-color:#bfdbfe}@media(max-width:1100px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.metrics,.admin-metrics,.two-cols,.dashboard-grid,.form-grid{grid-template-columns:1fr}.toolbar{align-items:stretch}.inline-form{width:100%}}

/* Parche edición/eliminación de compras */
button.danger{background:var(--danger);color:#fff}
button.danger:hover{background:#991b1b}.table-button.danger{background:#fee2e2;color:var(--danger);border:1px solid #fecaca}.table-button.danger:hover{background:#fecaca}.action-buttons{display:flex;gap:8px;align-items:center;flex-wrap:nowrap}.edit-purchase-card{margin-bottom:18px;border-color:#99f6e4;background:linear-gradient(180deg,#ffffff,#f0fdfa)}
@media(max-width:720px){.action-buttons{flex-wrap:wrap}.action-buttons .table-button{width:100%}}

/* Parche roles, centros de costo y experiencia móvil */
.role-note{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:10px 12px;color:var(--muted);font-weight:700;line-height:1.35}
.empty-state{margin-bottom:18px;border-style:dashed;background:#fbfdff}.empty-state h2{margin-bottom:8px}.access-box{border:1px solid var(--line);border-radius:16px;background:#f8fafc;padding:14px;display:grid;gap:10px}.access-box strong{font-size:.95rem}.checkbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.check-card{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-weight:800}.check-card input{width:auto}.check-card span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toolbar label{min-width:260px}.table-wrap{border-radius:14px}
@media(max-width:900px){.checkbox-grid{grid-template-columns:1fr}.toolbar label{min-width:0}}
@media(max-width:720px){
  body{background:#eef2f7}.topbar{padding:18px 14px}.topbar h1{font-size:1.45rem}.topbar p{font-size:.92rem}.brand-pill,.session-pill{font-size:.75rem}.container{padding:14px 10px 36px}.card{border-radius:16px;padding:14px}.toolbar{gap:12px}.toolbar-card{position:sticky;top:0;z-index:9;border-radius:0 0 16px 16px;margin-left:-10px;margin-right:-10px}.inline-form{grid-template-columns:1fr}.tabs{position:sticky;top:96px;z-index:8;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;margin-left:-10px;margin-right:-10px;border-radius:0;padding:10px;scroll-snap-type:x proximity}.tabs button{width:auto!important;min-width:max-content;scroll-snap-align:start;padding:10px 13px}.metrics{gap:10px}.metric{padding:14px}.metric strong{font-size:1.25rem}input,select,textarea{font-size:16px;min-height:44px}button{width:100%;min-height:44px}.button-row{display:grid;grid-template-columns:1fr}.table-button{width:100%}.table-wrap{overflow:visible}.table-wrap table,.table-wrap thead,.table-wrap tbody,.table-wrap th,.table-wrap td,.table-wrap tr{display:block}.table-wrap thead{display:none}.table-wrap tr{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;padding:8px;box-shadow:0 6px 16px rgba(15,23,42,.04)}.table-wrap td{border:0;border-bottom:1px solid #eef2f7;white-space:normal;display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:9px 8px;text-align:right}.table-wrap td:last-child{border-bottom:0}.table-wrap td[data-label]::before{content:attr(data-label);font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:.72rem;text-align:left;min-width:38%}.table-wrap td.muted{display:block;text-align:center}.table-wrap td[colspan]{display:block;text-align:center}.action-buttons{display:grid;grid-template-columns:1fr;gap:8px;width:100%}.access-box{padding:12px}.check-card{min-height:44px}.role-note{font-size:.86rem}.kpi-list{gap:10px}.helper-box{font-size:.9rem}
}