*{box-sizing:border-box}html,body{margin:0;background:#0b1727;color:#e5e7eb;font:17px/1.4 -apple-system,system-ui,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
.hidden{display:none!important}.muted{color:#9ca3af}.err{color:#f87171}.sp{flex:1}
header{display:flex;gap:12px;align-items:center;padding:calc(env(safe-area-inset-top) + 10px) 16px 10px;background:#13223a}
header b{color:#2f7bff;font-size:20px}
nav{display:flex;background:#13223a;border-bottom:1px solid #1f2937;position:sticky;top:0;z-index:5}nav button{flex:1;border-radius:0;background:none;border:0;border-bottom:3px solid transparent;min-height:56px}nav button.on{border-color:#2f7bff;color:#2f7bff}
main{padding:16px;padding-bottom:calc(env(safe-area-inset-bottom) + 40px);max-width:1100px;margin:auto}
button{font:inherit;min-height:48px;padding:0 18px;border-radius:10px;border:1px solid #374151;background:#1f2937;color:#e5e7eb;cursor:pointer}
button.primary{background:#2f7bff;color:#ffffff;border-color:#2f7bff;font-weight:700}button.danger{background:#7f1d1d;border-color:#991b1b}
button.big{min-height:60px;font-size:19px}button.small{min-height:38px;padding:0 12px;font-size:15px}
input,select,textarea{font:inherit;width:100%;min-height:50px;padding:10px 12px;border-radius:10px;border:1px solid #374151;background:#0f172a;color:#e5e7eb}
label{display:block;margin:8px 0;font-size:15px;color:#cbd5e1}label.inline,label.toggle{display:flex;gap:8px;align-items:center}label.inline input,label.toggle input{width:26px;min-height:26px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:10px 0}.row input,.row select{flex:1;min-width:140px;width:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.card{background:#13223a;border-radius:16px;padding:24px}.narrow{width:100%;max-width:420px}.card h1{color:#2f7bff;margin:0}
.scanbox{display:flex;gap:10px}.scanbox input{font-size:22px;min-height:64px;border:2px solid #2f7bff}
.binbar{margin:12px 0;padding:12px;border-radius:10px;background:#13223a;display:flex;flex-wrap:wrap;gap:10px;align-items:center}#curBin{color:#2f7bff;font-size:22px}
#reader{max-width:520px;margin:10px auto}
.pcard{background:#13223a;border-radius:14px;padding:16px;margin:10px 0;border-left:6px solid #2f7bff}.pcard h3{margin:0 0 4px}
.qty{display:flex;align-items:center;gap:14px;margin:12px 0}.qty button{min-width:72px;min-height:72px;font-size:32px}.qty b{font-size:40px;min-width:80px;text-align:center}
.list .item{display:flex;gap:12px;align-items:center;padding:12px;border-bottom:1px solid #1f2937;min-height:64px;cursor:pointer}.item .sp{flex:1}
.tag{font-size:12px;padding:2px 8px;border-radius:99px;background:#374151}.tag.sale{background:#065f46}
.log div{padding:6px 0;border-bottom:1px solid #1f2937;font-size:15px;color:#9ca3af}
dialog{width:min(640px,96vw);max-height:92vh;overflow:auto;background:#13223a;color:#e5e7eb;border:1px solid #374151;border-radius:16px;padding:18px}dialog::backdrop{background:#000a}dialog h2{margin-top:0}
#toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);background:#2f7bff;color:#ffffff;padding:12px 20px;border-radius:12px;font-weight:700;opacity:0;transition:.3s;pointer-events:none;z-index:50}#toast.show{opacity:1}
.thumb{width:52px;height:52px;object-fit:cover;border-radius:8px;background:#1f2937}
#printArea{display:none}
@media print{
 body{background:#fff;color:#000}body>*:not(#printArea){display:none!important}#printArea{display:block}
 .lbl{overflow:hidden;color:#000;font-family:Arial,sans-serif;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;page-break-inside:avoid;break-inside:avoid}
 .lbl .t{font-weight:700;line-height:1.1;overflow:hidden;max-height:2.3em;width:100%}.lbl .c{font-family:monospace;font-weight:700}
 .lbl svg.bc{width:95%;height:0.42in}
 .thermal .lbl{width:2in;height:1in;padding:0.04in 0.06in;page-break-after:always;break-after:page}.thermal .lbl .t{font-size:9pt}.thermal .lbl .c{font-size:8pt}
 .thermal .lbl.bin{flex-direction:row;gap:.08in}.thermal .lbl.bin svg{width:.85in;height:.85in}.thermal .lbl.bin .c{font-size:16pt}
 .sheet{display:grid}
 .avery5160 .sheet{grid-template-columns:repeat(3,2.625in);grid-auto-rows:1in;column-gap:.125in;padding:.5in .1875in 0;height:11in;page-break-after:always}
 .avery5160 .lbl{padding:.05in .12in}.avery5160 .lbl .t{font-size:9pt}.avery5160 .lbl .c{font-size:8pt}.avery5160 .lbl.bin{flex-direction:row;gap:.1in}.avery5160 .lbl.bin svg{width:.85in;height:.85in}.avery5160 .lbl.bin .c{font-size:15pt}
 .avery5163 .sheet{grid-template-columns:repeat(2,4in);grid-auto-rows:2in;column-gap:.1875in;padding:.5in .15625in 0;height:11in;page-break-after:always}
 .avery5163 .lbl .t{font-size:14pt}.avery5163 .lbl .c{font-size:12pt}.avery5163 svg.bc{height:.8in}.avery5163 .lbl.bin{flex-direction:row;gap:.2in}.avery5163 .lbl.bin svg{width:1.7in;height:1.7in}.avery5163 .lbl.bin .c{font-size:30pt}
}
header b{color:#fff}.hdrlogo{width:36px;height:36px;border-radius:9px}
.loginlogo{display:block;width:100%;max-width:420px;margin:0 auto 8px;background:#fff;border-radius:12px;border-bottom:4px solid #2f7bff;box-shadow:0 0 24px #2f7bff55}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.chan{border:0;padding:0;margin:10px 0}.chan legend{font-size:15px;color:#cbd5e1;margin-bottom:6px}.chan .opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.chan label{margin:0;display:flex;gap:10px;align-items:flex-start;padding:12px;border:2px solid #374151;border-radius:12px;background:#0f172a;cursor:pointer;min-height:64px}
.chan label input{width:24px;min-height:24px;margin:2px 0 0}.chan label:has(input:checked){border-color:#2f7bff;box-shadow:0 0 14px #2f7bff66}.chan small{display:block;color:#9ca3af;font-size:13px}
.tag.online{background:#1d4ed8}