:root{--ink:#172033;--muted:#6b7588;--brand:#16324f;--brand2:#24537d;--bg:#f4f6fa;--card:#fff;--line:#dfe4ec;--red:#b42318;--green:#16794b}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:var(--ink);background:var(--bg)}a{color:#165d96;text-decoration:none}.topbar{height:62px;background:var(--brand);color:#fff;display:flex;align-items:center;gap:22px;padding:0 24px;position:sticky;top:0;z-index:5}.topbar nav{display:flex;gap:14px;flex:1;flex-wrap:wrap}.topbar a{color:#fff;font-size:14px}.linkbtn{background:transparent;border:0;color:white}.container{max-width:1500px;margin:26px auto;padding:0 22px}h1{font-size:28px;margin:0 0 20px}h2{font-size:18px;margin:0 0 14px}.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:20px;box-shadow:0 2px 10px rgba(15,30,50,.04)}.narrow{max-width:420px;margin:80px auto}.stack{display:grid;gap:13px}.stack label,.inline label{display:grid;gap:6px;font-size:13px;color:var(--muted)}input,select{width:100%;border:1px solid #cfd6df;border-radius:8px;padding:10px 11px;font-size:15px;background:#fff}button,.button{border:0;background:var(--brand2);color:#fff;border-radius:8px;padding:10px 16px;font-weight:700;cursor:pointer;display:inline-block}.secondary{background:#eef2f6;color:#344154}.dangerbtn{background:#b42318}.cards{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:14px;margin-bottom:20px}.metric{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}.metric span{display:block;color:var(--muted);font-size:13px}.metric b{display:block;font-size:34px;margin-top:6px}.smalltext{font-size:18px!important}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px}.toolbar input{max-width:320px}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:10px 9px;border-bottom:1px solid #e7ebf0;text-align:left;vertical-align:top}th{font-size:12px;text-transform:uppercase;color:#657084;background:#f8fafc;position:sticky;top:62px}.badge{padding:3px 8px;border-radius:999px;font-size:12px}.badge.red{background:#fee4e2;color:#b42318}.badge.green{background:#dcfae6;color:#16794b}.code{font-family:monospace;background:#f0f2f5;border-radius:5px;padding:3px 6px;display:inline-block;margin:2px}.muted{color:var(--muted)}.inline{display:flex;align-items:end;gap:8px}.inline.big{align-items:end;max-width:850px}.inline.big label{min-width:220px}.alert{padding:12px 14px;border-radius:9px;background:#e7f2ff;margin-bottom:16px}.alert.danger{background:#fee4e2;color:#8a1c14}.check{display:flex!important;grid-template-columns:auto 1fr;align-items:center}.check input{width:auto}.qrgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}.qrlabel{text-align:center;border:1px solid var(--line);padding:12px;border-radius:12px;display:grid;gap:5px;justify-items:center}.qrlabel img{width:150px;height:150px}.qrbox{display:flex;gap:16px;align-items:center}.qrbox img{width:170px;height:170px}.confirm{margin-top:12px}
.mobilebody{background:#eef2f6}.mobilewrap{max-width:560px;margin:0 auto;min-height:100vh;padding:12px}.mobilehead{background:var(--brand);color:white;border-radius:14px;padding:16px 18px;display:flex;justify-content:space-between}.mobilecard,#scanner{background:white;border-radius:16px;padding:16px;margin-top:12px}.hidden{display:none!important}.stepper{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.step{background:#e9edf2;border-radius:10px;padding:9px;text-align:center;font-weight:bold;color:#7a8493}.step span{display:block;font-size:10px;font-weight:normal}.step.active{background:#dceeff;color:#164d76}.step.done{background:#dcfae6;color:#16794b}.scanstatus{font-size:20px;font-weight:bold;text-align:center;padding:18px 4px}#video{width:100%;aspect-ratio:4/3;object-fit:cover;background:#111;border-radius:14px}.scanresult{min-height:62px;padding:12px;margin:10px 0;background:#f6f8fb;border-radius:10px;font-size:15px}.manual{display:flex;gap:8px;margin:10px 0}.manual input{flex:1}.toast{position:fixed;left:12px;right:12px;bottom:20px;max-width:536px;margin:auto;background:#153a2d;color:#fff;border-radius:14px;padding:18px;text-align:center;font-size:18px;box-shadow:0 8px 40px rgba(0,0,0,.25)}@media(max-width:800px){.topbar nav{display:none}.grid2,.cards{grid-template-columns:1fr}.container{padding:0 12px;margin-top:14px}table{font-size:12px}.card{overflow:auto}.qrbox{display:block}.inline.big{display:grid}.toolbar{align-items:stretch;flex-direction:column}.toolbar input{max-width:none}}

/* v0.1.2: catalog controls */
.product-tools,.action-buttons{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.product-tools input{width:min(280px,60vw)}
.action-buttons form,.barcode-entry form{margin:0}
.compact{padding:7px 10px;font-size:12px;white-space:nowrap}
.barcode-entry{display:flex;gap:10px;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f4;padding:5px 0}
.barcode-entry:last-child{border-bottom:none}
.barcode-list{margin-bottom:16px}
.table-scroll{overflow-x:auto}
@media(max-width:800px){.product-tools{width:100%}.product-tools input{width:100%}.action-buttons{min-width:190px}.barcode-entry{align-items:flex-start;flex-direction:column}}

/* v0.1.3: two mobile scan flows */
.mobilemode{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px}
.mobilemode .modetab{background:#eef2f6;color:#304156;border:2px solid transparent;font-size:13px;padding:11px 8px;line-height:1.3}
.mobilemode .modetab.selected{background:#dceeff;color:#164d76;border-color:#3975a3}
#retryBtn{display:block;width:100%;margin-top:10px}
@media(max-width:420px){.mobilemode .modetab{font-size:12px}}
