:root{
  --bg:#f6f8fb; --panel:#ffffff; --border:#e4e7ee; --accent:#0d6efd;
  --thead:#f1f4f9; --price:#d6f5dd; --importe:#e9fbe9; --total:#003cff;
}
html,body{height:100%;margin:0;background:var(--bg);font-family:Segoe UI,Arial}
.app-root{min-height:100vh;display:flex;flex-direction:column}
.section-stretch{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
.band{background:linear-gradient(180deg,#2876e3,#8fb5ff);color:#fff;padding:6px 10px;font-weight:900}
.ctrl{display:grid;grid-template-columns:160px 1fr 250px auto;gap:10px;padding:10px;background:#fff;border-bottom:1px solid var(--border)}
.tab{background:#e9edf3;border-top:1px solid #cfd7e3;border-bottom:1px solid #cfd7e3;padding:6px 10px;font-weight:800}
.sheet{flex:1 1 auto;min-height:0;background:#fff;border-top:1px solid var(--border);border-bottom:1px solid var(--border);display:flex;flex-direction:column}
.wrap{flex:1 1 auto;min-height:0;overflow:auto}
table.pos{width:100%;border-collapse:collapse}
table.pos thead th{position:sticky;top:0;background:var(--thead);border-bottom:1px solid var(--border);padding:9px 10px;font-weight:800}
table.pos tbody td{border-bottom:1px solid #f2f4f8;padding:10px}
.num{text-align:right}.ctr{text-align:center}
.col-precio{background:var(--price)} .col-importe{background:var(--importe)}
.foot{background:#fff;border-top:1px solid var(--border);padding:10px;display:flex;gap:10px;align-items:center}
.total{min-width:230px;text-align:right;font-weight:900;font-size:3rem;color:var(--total)}
.hidden{display:none!important}