:root{
  --bg:#f4f5f7; --card:#fff; --text:#1d2330; --muted:#6b7385; --line:#e2e5ec;
  --brand:#1d3f94; --brand-d:#142d6e; --accent:#e8710a; --ok:#2f9e44; --warn:#e67700; --bad:#d6336c;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:inherit}
.muted{color:var(--muted);margin:0;font-size:13px}
.bad{color:var(--bad)} .okc{color:var(--ok)}
button,select,input,textarea,.btn{font:inherit}
button,.btn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 12px;cursor:pointer;text-decoration:none;color:var(--text);display:inline-block}
button:hover,.btn:hover{background:#f0f1f5}
button.primary{background:var(--brand);border-color:var(--brand);color:#fff}
button.primary:hover{background:var(--brand-d)}
button.danger{color:var(--bad)}
button.mini{padding:2px 8px;font-size:12px;margin-left:8px}
input,select,textarea{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fff;width:100%;color:var(--text)}

.top{background:#1d3f94!important;border-bottom:4px solid var(--accent)!important;color:#fff;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:12px 20px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand{display:flex;gap:12px;align-items:center;text-decoration:none}
.logo{width:46px;height:46px;border-radius:50%}.logo-s{width:34px;height:34px;border-radius:50%;vertical-align:middle}.top h1{color:#fff}.top .muted{color:#c9d4f2}.top .who{color:#fff}
h1{font-size:19px;margin:0}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.who{font-weight:600;color:var(--muted)}
.menu{position:relative}
.menu summary{color:var(--text);list-style:none;border:1px solid var(--line);border-radius:8px;padding:8px 12px;cursor:pointer;background:#fff}
.menu summary::-webkit-details-marker{display:none}
.menu-body{position:absolute;right:0;top:110%;background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px;display:flex;flex-direction:column;gap:2px;min-width:210px;box-shadow:0 8px 24px #0002;z-index:10}
.menu-body button{border:0;text-align:left}
.menu-body hr{border:0;border-top:1px solid var(--line);width:100%;margin:4px 0}
.not-admin .admin-only{display:none}

.page{max-width:1150px;margin:0 auto;padding:16px 20px 60px}
.gh{font-size:18px;margin:18px 0 10px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:6px;text-decoration:none}
.card:hover{border-color:var(--brand);box-shadow:0 4px 14px #0001}
.cn{font-size:22px}
.bar{height:8px;background:var(--line);border-radius:99px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--ok)}

.uhead{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:10px}
.uhead h2{margin:0;font-size:20px;flex:1}
.uname{color:var(--accent)}
.back{text-decoration:none;color:var(--muted)}
.uactions{display:flex;gap:8px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:10px 0}
.stat{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.stat b{display:block;font-size:24px}
.stat span{color:var(--muted);font-size:13px}
.stat .bar{margin-top:8px}
.stat.ok b{color:var(--ok)} .stat.warn b{color:var(--warn)} .stat.bad b{color:var(--bad)}
.filters{display:grid;grid-template-columns:2fr 1fr;gap:10px;margin:12px 0}

.group{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:12px}
.group>summary{cursor:pointer;padding:12px 16px;font-weight:600;display:flex;justify-content:space-between;gap:10px;background:#fafbfc}
.group>summary small{font-weight:400;color:var(--muted)}
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);text-align:left;padding:8px 12px;border-top:1px solid var(--line)}
.tbl td{padding:7px 12px;border-top:1px solid var(--line);vertical-align:middle}
.tbl td.r,.tbl th.r{text-align:right;white-space:nowrap}
.lines td select{width:auto;padding:5px 8px}
.lines td input{padding:5px 8px;min-width:140px}
.lines .meta{font-size:12px;color:var(--muted);white-space:nowrap}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:8px;vertical-align:-1px;border:1px solid #0003}
.qty{color:var(--muted);font-size:13px}
.badge{display:inline-block;padding:1px 8px;border-radius:99px;font-size:12px;background:#e7ecf7;color:#34457a}
.lines tr.st-ok{background:#f2fbf4}
.lines tr.st-no,.lines tr.st-falta{background:#fff0f5}
.lines tr.st-rev{background:#fff}
.lines tr.exp td.nm{box-shadow:inset 4px 0 var(--warn)}
.lines tr.st-no td.nm,.lines tr.st-falta td.nm{box-shadow:inset 4px 0 var(--bad)}
.lines tr.st-ok td.nm{box-shadow:inset 4px 0 var(--ok)}
.pill{display:inline-block;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:600}
.pill.st-ok{background:#d3f9d8;color:#1e7a33}.pill.st-no,.pill.st-falta{background:#ffdeeb;color:#a61e4d}.pill.st-rev{background:#eef0f4;color:var(--muted)}
.empty{text-align:center;color:var(--muted);padding:40px}
.err{color:var(--bad);min-height:1.2em;margin:8px 0 0;font-size:13px}

dialog{border:0;border-radius:14px;padding:20px;width:min(520px,94vw);box-shadow:0 20px 60px #0004}
dialog.wide{width:min(760px,94vw)}
dialog::backdrop{background:#0006}
dialog h2{margin:0 0 10px}
dialog h3{margin:16px 0 0;font-size:15px}
dialog label{display:block;font-size:13px;color:var(--muted);margin-top:10px}
dialog label input,dialog label select{margin-top:4px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dlg-actions{display:flex;gap:8px;margin-top:16px}
.spacer{flex:1}
.tpl-scroll{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:8px}

/* Preventius */
.svform{display:grid;grid-template-columns:150px 2fr 1fr 1fr auto;gap:8px 10px;align-items:end;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
.svbar,.svcbar{background:#fff4e6;border:1px solid #ffd8a8;border-radius:8px;padding:6px 10px}
@media (max-width:720px){.svform{grid-template-columns:1fr 1fr}}
/* Magatzem */
.stform{display:grid;grid-template-columns:2fr 1fr 90px 100px 90px auto;gap:8px 10px;align-items:end;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
.stbtns{display:flex;gap:6px}
.warnc{color:var(--warn)}
tr.low{background:#fff8e6}
button:disabled{opacity:.4;cursor:not-allowed}
.not-admin .stform{display:none}
@media (max-width:720px){.stform{grid-template-columns:1fr 1fr}}
/* Informes */
.rep fieldset{background:var(--card);border:1px solid var(--line);border-radius:12px;margin:0 0 12px;padding:10px 14px 14px}
.rep legend{font-weight:600;padding:0 6px}
.rg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px 14px;align-items:end}
.rg .wide{grid-column:1/-1}
.rf{display:block;font-size:12px;color:var(--muted)}
.rf input,.rf select,.rf textarea{margin-top:3px;color:var(--text);font-size:15px}
.chk{display:flex;gap:8px;align-items:flex-start;font-size:14px;padding:4px 0}
.chk input{width:auto;margin-top:3px}
.vwrap{overflow-x:auto}
.vt td{padding:4px 4px}.vt input,.vt select{padding:5px 6px;min-width:70px}
button.primary.btn,a.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
@media (max-width:720px){
  .page{padding:12px}
  .filters,.row2{grid-template-columns:1fr}
  .lines thead{display:none}
  .lines tr{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 12px;border-top:1px solid var(--line)}
  .lines td{border:0;padding:0}
  .lines td.nm{grid-column:1/3;font-weight:600}
  .lines td:nth-child(4){grid-column:1/3}
  .lines td.meta{grid-column:1/3}
  .lines td select,.lines td input{width:100%}
  .hist thead{display:none}
  .hist tr{display:block;padding:10px 12px;border-top:1px solid var(--line)}
  .hist td{display:block;border:0;padding:1px 0}
}
@media print{
  .top,.filters,.uactions,.back,.mini{display:none!important}
  body{background:#fff}
  .group{break-inside:avoid;border-color:#999}
  .lines select,.lines input{border:0;background:none;appearance:none;padding:0}
  .noprint,.rep .err{display:none!important}
  .rep fieldset{break-inside:avoid;border-color:#999;margin-bottom:6px;padding:4px 8px}
  .rep input:not([type=checkbox]),.rep select,.rep textarea{border:0;border-bottom:1px solid #ccc;border-radius:0;background:none;appearance:none;padding:2px 0;font-size:12px}
  .rep .chk{font-size:12px;padding:1px 0}
}
.crewl{display:flex;flex-wrap:wrap;gap:4px 16px}.svform .crew{margin:0}
.crewadd{display:flex;gap:8px;margin-bottom:8px}.crewadd input{flex:1}
.crewchips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;background:#e7edfb;border:1px solid #c5d2f2;border-radius:999px;padding:3px 4px 3px 10px;font-size:14px}
.chip small{color:var(--muted)}.chip button{border:0;background:transparent;padding:0 6px;border-radius:50%;color:var(--bad);line-height:1.4}
.lesbox{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin-bottom:12px}
.lesl{flex:1 1 200px}
.lt{cursor:pointer;border-radius:8px;padding:4px 6px;align-items:center}
.lt.act{background:#fff3e0;outline:2px solid var(--accent)}
.num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:12px}
.bodywrap{position:relative;width:340px;max-width:100%;flex:0 0 auto;cursor:crosshair;border:1px solid var(--line);border-radius:8px;overflow:hidden;user-select:none}
.bodywrap img{display:block;width:100%;height:auto}
.mk{position:absolute;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 0 0 2px #fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}