:root { --border:#d9dee7; --bg:#f4f6f9; --text:#172033; --primary:#1769e0; --danger:#b42318; --success:#087443; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,-apple-system,Segoe UI,sans-serif; background:var(--bg); color:var(--text); }
header { background:#111827; color:white; min-height:64px; padding:0 5vw; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { color:white; font-size:1.3rem; font-weight:750; text-decoration:none; }
nav { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
nav a,.link-button { color:white; text-decoration:none; background:none; border:0; font:inherit; cursor:pointer; padding:0; }
nav form { margin:0; }
main { width:min(1180px,92vw); margin:30px auto; }
h1 { margin:0 0 6px; }
h2 { margin-top:0; font-size:1.2rem; }
p { line-height:1.5; }
.page-title { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:20px; }
.page-title p { margin:0; color:#5d6676; }
.card { background:white; border:1px solid var(--border); border-radius:14px; padding:22px; box-shadow:0 2px 8px rgba(15,23,42,.04); margin-bottom:20px; }
.narrow { max-width:440px; margin:60px auto; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.stat span { display:block; color:#687386; }
.stat strong { display:block; font-size:2rem; margin-top:8px; }
.button,button { border:1px solid var(--border); border-radius:9px; padding:10px 14px; background:white; color:var(--text); text-decoration:none; cursor:pointer; font-weight:600; }
.primary { background:var(--primary); color:white; border-color:var(--primary); }
input,select,textarea { width:100%; border:1px solid #bdc5d1; border-radius:8px; padding:10px; font:inherit; background:white; }
label { font-weight:650; }
.helptext,.hint { display:block; color:#6b7280; font-size:.85rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 20px; }
.form-grid p:has(textarea),.form-grid p:has(#id_description),.form-grid p:has(#id_notes) { grid-column:1/-1; }
.search { display:flex; gap:10px; margin-bottom:18px; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; }
th,td { text-align:left; padding:12px; border-bottom:1px solid var(--border); white-space:nowrap; }
th { font-size:.85rem; color:#5f6877; }
a { color:#145ec1; }
.positive { color:var(--success); font-weight:700; }
.negative { color:var(--danger); font-weight:700; }
.low-stock { background:#fff4e5; }
.product-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.stock { font-size:3rem; font-weight:800; }
.stock.warning { color:#b54708; }
.stock small { font-size:1rem; color:#687386; }
.qr-preview { width:180px; height:180px; float:right; margin-left:20px; }
.product-images { display:flex; gap:16px; justify-content:flex-end; align-items:flex-start; margin-bottom:10px; }
.product-images .qr-preview { float:none; margin-left:0; }
.product-image { max-width:200px; max-height:200px; object-fit:contain; }
dl { display:grid; grid-template-columns:130px 1fr; gap:10px; }
dt { font-weight:700; } dd { margin:0; }
.message { padding:12px 16px; border-radius:8px; margin-bottom:15px; background:#e8f1ff; }
.message.error { background:#fee4e2; }
.scanner-card { max-width:680px; }
#reader { width:100%; }
#scan-result { margin-top:15px; font-weight:700; }
@media (max-width:760px) {
  header { align-items:flex-start; padding-top:16px; padding-bottom:16px; flex-direction:column; }
  .stats,.product-grid,.form-grid { grid-template-columns:1fr; }
  .page-title { align-items:flex-start; flex-direction:column; }
  .qr-preview { float:none; margin:0 auto 15px; display:block; }
  main { margin-top:20px; }
}