:root { color-scheme:light; --bg:#f4f7f2; --surface:#fff; --text:#18211a; --muted:#59645c; --accent:#176b45; --border:#cbd5ce; }
html[data-theme="dark"] { color-scheme:dark; --bg:#111713; --surface:#1c251f; --text:#eef5f0; --muted:#aab7ae; --accent:#65d39e; --border:#3d4c42; }
html[data-theme="light"] { color-scheme:light; }
@media(prefers-color-scheme:dark) { html:not([data-theme]) { color-scheme:dark; --bg:#111713; --surface:#1c251f; --text:#eef5f0; --muted:#aab7ae; --accent:#65d39e; --border:#3d4c42; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:16px system-ui,sans-serif; }
header { position:sticky; top:0; z-index:2; background:var(--surface); border-bottom:1px solid var(--border); padding:.65rem max(1rem,calc((100% - 70rem)/2)); display:flex; gap:.7rem; justify-content:space-between; align-items:center; }
nav { display:flex; gap:.35rem; align-items:center; flex-wrap:wrap; }
nav form { margin:0; }
.eyebrow { display:block; font-size:.72rem; color:var(--muted); text-transform:uppercase; }
main,.login { max-width:70rem; margin:auto; padding:1rem; }
.login { max-width:28rem; padding-top:12vh; }
.quick { background:var(--surface); padding:1rem; border-radius:1rem; margin-bottom:1.5rem; }
form { display:grid; gap:.8rem; }
label { display:grid; gap:.3rem; font-weight:650; }
input,select,button,label,details { min-width:0; }
input,select,button { font:inherit; min-height:44px; border:1px solid var(--border); border-radius:.6rem; padding:.55rem .7rem; background:var(--surface); color:var(--text); }
button { background:var(--accent); color:var(--surface); border-color:transparent; font-weight:700; cursor:pointer; }
.secondary { background:transparent; color:var(--text); border-color:var(--border); }
:focus-visible { outline:3px solid #e59d23; outline-offset:2px; }
.part { display:grid; grid-template-columns:1fr 1fr auto auto; gap:.4rem; margin:.5rem 0; }
.package-fields { display:none; align-items:center; gap:.25rem; }
.part.package { grid-template-columns:1fr 1fr 1.2fr auto auto; }
.part.package .package-fields { display:flex; }
.size { min-width:0; width:100%; }
.grid,.actions { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
.list-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.table-wrap { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:.8rem; }
.inventory-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.inventory-table th,.inventory-table td { padding:.75rem; border-bottom:1px solid var(--border); text-align:left; vertical-align:middle; overflow-wrap:anywhere; }
.inventory-table thead th { color:var(--muted); font-size:.78rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; }
.inventory-table thead th:nth-child(1) { width:28%; }
.inventory-table thead th:nth-child(2) { width:22%; }
.inventory-table thead th:nth-child(3) { width:auto; }
.inventory-table thead th:nth-child(4) { width:27rem; }
.inventory-table tbody tr:last-child > * { border-bottom:0; }
.item-edit { min-height:0; padding:0; border:0; background:transparent; color:var(--text); text-align:left; font-weight:750; }
.item-edit:hover { color:var(--accent); text-decoration:underline; }
.quantity { font-variant-numeric:tabular-nums; font-weight:650; }
.item-note { color:var(--muted); }
.row-actions > div { display:flex; justify-content:flex-end; gap:.4rem; }
.row-actions button { white-space:nowrap; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.wide { width:100%; margin:1rem 0; }
.error { color:#b42318; min-height:1.2em; }
.hint { color:var(--muted); margin:0; }
.dialog-actions { display:flex; justify-content:flex-end; gap:.6rem; flex-wrap:wrap; }
dialog { width:min(40rem,calc(100% - 2rem)); max-height:85vh; border:1px solid var(--border); border-radius:1rem; background:var(--surface); color:var(--text); }
#history-dialog { width:min(72rem,calc(100% - 2rem)); }
.history-toolbar { display:flex; align-items:center; justify-content:flex-end; gap:.5rem; flex-wrap:wrap; }
.history-toolbar span { margin-right:auto; color:var(--muted); }
#history-list { display:grid; gap:.55rem; }
.audit-event { border:1px solid var(--border); border-radius:.7rem; overflow:hidden; }
.audit-event > summary { display:flex; justify-content:space-between; gap:1rem; padding:.8rem; cursor:pointer; background:var(--bg); }
.audit-summary-main { min-width:0; }
.audit-meta { color:var(--muted); font-size:.88rem; text-align:right; }
.audit-body { display:grid; gap:.7rem; padding:.8rem; }
.audit-body h3,.audit-body h4 { margin:.15rem 0; }
.audit-diff-wrap { max-width:100%; overflow-x:auto; }
.audit-diff { width:100%; border-collapse:collapse; }
.audit-diff th,.audit-diff td { min-width:9rem; padding:.55rem; border:1px solid var(--border); text-align:left; vertical-align:top; }
.audit-diff th:first-child { min-width:8rem; }
.audit-diff pre,.snapshot-grid pre { max-width:100%; margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font: .82rem ui-monospace,monospace; }
.audit-snapshots > summary { cursor:pointer; font-weight:700; }
.snapshot-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; margin-top:.7rem; }
.snapshot-grid section { min-width:0; padding:.65rem; border:1px solid var(--border); border-radius:.5rem; }
dialog::backdrop { background:#0008; }
.close { float:right; font-size:1.4rem; }
@media(max-width:650px) {
  header { position:static; align-items:flex-start; }
  nav { justify-content:flex-end; }
  nav button { font-size:.78rem; padding:.35rem; }
  .part,.part.package { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .part .package-fields { grid-column:1/3; }
  .table-wrap { overflow:visible; border:0; background:transparent; }
  .inventory-table,.inventory-table tbody { display:block; }
  .inventory-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .inventory-table tr { display:grid; grid-template-columns:minmax(0,1fr); background:var(--surface); border:1px solid var(--border); border-radius:.8rem; margin-bottom:.6rem; overflow:hidden; }
  .inventory-table th,.inventory-table td { display:block; padding:.65rem .75rem; border:0; overflow-wrap:anywhere; word-break:normal; }
  .inventory-table tbody th { grid-column:1; font-size:1.05rem; padding-bottom:.25rem; }
  .inventory-table .quantity { grid-column:1; grid-row:auto; padding-top:0; text-align:left; white-space:normal; }
  .inventory-table .quantity::before { content:attr(data-label) ": "; color:var(--muted); font-size:.75rem; font-weight:700; text-transform:uppercase; }
  .inventory-table .item-note { grid-column:1; padding-top:0; }
  .inventory-table .item-note::before { content:attr(data-label) ": "; font-size:.75rem; font-weight:700; text-transform:uppercase; }
  .inventory-table .row-actions { grid-column:1; padding:.55rem; border-top:1px solid var(--border); }
  .row-actions > div { display:grid; grid-template-columns:repeat(auto-fit,minmax(6.5rem,1fr)); }
  .row-actions button { width:100%; white-space:normal; }
  .list-head { align-items:stretch; flex-direction:column; }
  .grid { grid-template-columns:1fr; }
  .quick h1 { font-size:1.45rem; }
  .audit-event > summary { display:grid; gap:.25rem; }
  .audit-meta { text-align:left; }
  .snapshot-grid { grid-template-columns:1fr; }
  .audit-diff-wrap { overflow:visible; }
  .audit-diff,.audit-diff tbody,.audit-diff tr,.audit-diff th,.audit-diff td { display:block; width:100%; min-width:0; }
  .audit-diff thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .audit-diff tr { margin-bottom:.7rem; border:1px solid var(--border); border-radius:.5rem; overflow:hidden; }
  .audit-diff th,.audit-diff td { border:0; border-bottom:1px solid var(--border); }
  .audit-diff td:last-child { border-bottom:0; }
  .audit-diff th::before,.audit-diff td::before { content:attr(data-label); display:block; margin-bottom:.25rem; color:var(--muted); font:700 .72rem system-ui,sans-serif; text-transform:uppercase; }
}