/* Additions for the live app (base.css holds the design carried over from the prototype) */
[hidden]{display:none!important}
body{min-height:100vh}
.boot{padding:64px 0;text-align:center;color:var(--muted)}

/* sign in / invitation */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px 0}
.auth-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:28px 24px;display:flex;flex-direction:column;gap:16px}
.auth-card .brand{margin-bottom:4px}
.auth-card form{display:flex;flex-direction:column;gap:14px}
.auth-card .btn{width:100%}
.auth-foot{font-size:12.5px;color:var(--muted)}

/* header user button */
.userbtn{display:flex;flex-direction:column;align-items:flex-start;gap:4px;background:none;border:0;padding:0;cursor:pointer;text-align:left}
.userbtn>span{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.userbtn b{font-weight:500;border:1px solid var(--accent);background:var(--accent-soft);border-radius:4px;padding:8px 10px;min-height:38px;display:flex;align-items:center;max-width:16rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* people / setup */
.setup{display:flex;flex-direction:column;gap:28px;margin-top:16px}
.setup-sec>.sec-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin-bottom:10px}
.setup-sec>.sec-head p{width:100%;color:var(--muted);font-size:13px}
.prow{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.4fr) 7rem 12rem;gap:6px 14px;align-items:center;padding:10px 14px;border-top:1px solid var(--line)}
.prow.head{border-top:0;background:var(--surface-2);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding-block:8px;border-radius:6px 6px 0 0}
.prow .sub{display:block}
.drow{grid-template-columns:minmax(0,1.6fr) 6rem 7rem 8rem}
.erow{grid-template-columns:minmax(0,1.6fr) minmax(0,1.4fr) 7rem 8rem}
.cbgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.cbgrid .chk{align-items:center}
.linkbox{display:flex;gap:8px;align-items:stretch}
.linkbox input{flex:1 1 auto;min-width:0;border:1px solid var(--line-strong);background:var(--surface);border-radius:4px;padding:8px 10px;font-family:var(--mono);font-size:12px}
.swatch{width:38px;height:38px;padding:2px;border:1px solid var(--line-strong);border-radius:4px;background:var(--surface)}
.pre{white-space:pre-wrap;font-family:var(--mono);font-size:12px;background:var(--surface-2);border-radius:4px;padding:10px;max-height:14rem;overflow:auto}
.inl{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inl input{border:1px solid var(--line-strong);background:var(--surface);border-radius:4px;padding:6px 8px;min-height:32px;width:8rem}
.danger{color:var(--bad)}
.btn.danger-btn{border-color:var(--bad);color:var(--bad)}
.log li .by{color:var(--muted)}
.photo-wrap img{cursor:zoom-in}
.docs li a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line-strong)}
.docs li a:hover{color:var(--accent)}
.docs li.edit{display:block}
.qrsvg{width:84px;height:84px;flex:none;display:block}
.qrsvg svg{width:100%;height:100%;display:block}

/* labels (screen preview + print) */
.labels-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-top:16px}
.lab{display:flex;gap:10px;align-items:center;background:#fff;color:#111;border:1px dashed #9aa;border-radius:4px;padding:8px;break-inside:avoid;page-break-inside:avoid}
.lab .qrsvg{width:72px;height:72px}
.lab .lt{font-family:var(--mono);font-size:12px;font-weight:600;color:#111}
.lab .ln{font-size:11.5px;line-height:1.25;max-height:3.8em;overflow:hidden;color:#111}
.lab .ld{font-size:10.5px;color:#444;margin-top:2px}

@media (max-width:860px){
  .prow{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"who status" "role role" "act act"}
  .prow.head{display:none}
  .prow>:nth-child(1){grid-area:who}
  .prow>:nth-child(2){grid-area:role}
  .prow>:nth-child(3){grid-area:status;justify-self:end}
  .prow>:nth-child(4){grid-area:act}
  .drow,.erow{grid-template-columns:minmax(0,1fr) auto}
}
@media (max-width:760px){
  .filters .field{flex:1 1 140px}
  .filters .field.grow{flex:1 1 100%}
  .userbtn{flex:1 1 100%}
  .userbtn b{max-width:none;width:100%}
  .cbgrid{grid-template-columns:minmax(0,1fr)}
}

@media print{
  html,body{background:#fff!important}
  body{padding:0}
  .top,.no-print,.toast,.sheet,.tabs,.page-head .btn{display:none!important}
  main{padding:0}
  .labels-grid{grid-template-columns:repeat(3,1fr);gap:4mm;margin:0}
  .lab{border:1px solid #888}
  .page-head{display:none}
}

/* start a new item from a photo */
.aibox{display:flex;flex-direction:column;gap:10px;border:1px solid var(--accent);background:var(--accent-soft);border-radius:6px;padding:12px 14px;margin-bottom:16px}
.aibox.off{border-color:var(--line-strong);background:var(--surface-2)}
.aibox .hint{margin:2px 0 0}
.aithumb{width:100%;max-height:220px;object-fit:contain;border-radius:4px;background:var(--surface-2)}
.btn.disabled{opacity:.55;pointer-events:none}
.ai-filled input,.ai-filled textarea{border-color:var(--accent);background:var(--accent-soft)}

/* footer with version */
.foot{margin:40px 0 24px;padding-top:14px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--accent);text-decoration:underline;cursor:pointer}

/* scan */
.modeseg{display:flex;gap:6px;margin:12px 0}
.modeseg button{flex:1;min-height:44px;border:1px solid var(--line,#cfd8d6);background:#fff;border-radius:10px;font:inherit;font-weight:600;cursor:pointer}
.modeseg button.on{background:#0D5C57;border-color:#0D5C57;color:#fff}
.scanbox{position:relative;background:#10201f;border-radius:14px;overflow:hidden;aspect-ratio:4/3;max-width:560px}
.scanbox video{width:100%;height:100%;object-fit:cover;display:block}
.scanaim{position:absolute;inset:18%;border:3px solid rgba(255,255,255,.75);border-radius:14px;pointer-events:none}
.scanoff{position:absolute;inset:0;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;padding:16px;text-align:center;background:#10201f;color:#fff}
.scanoff[hidden]{display:none}
.scanoff .muted{color:#c9d8d6}
.scanman{display:flex;gap:10px;align-items:flex-end;margin:14px 0;max-width:560px}
.scanman .field{flex:1}
.scanstatus{min-height:52px;padding:12px 14px;border-radius:10px;font-weight:600;max-width:560px;background:#eef3f2}
.scanstatus.ok{background:#d9f2e3;color:#0b5a2b}.scanstatus.warn{background:#fff1cf;color:#6b4a00}.scanstatus.bad{background:#fadcdc;color:#8a1c1c}
.scanprog{margin:14px 0 8px;font-size:1.05rem}
.scanlog{list-style:none;padding:0;margin:0 0 10px;max-width:560px}
.scanlog li{padding:8px 10px;border-bottom:1px solid #e3e9e8}
.scanlog li.ok{border-left:4px solid #1e9a54}.scanlog li.warn{border-left:4px solid #d9a21b}.scanlog li.bad{border-left:4px solid #c0392b}
.scanwait{margin-top:12px;max-width:560px}.scanwait ul{padding-left:18px}