:root{--pink:#DB196E;--bg:#15151a;--card:#21212b;--mut:#9a9aab;--ok:#1db954;--warn:#e8a317;--err:#e0354b}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;user-select:none}
html,body{height:100%}
body{background:var(--bg);color:#fff;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  display:flex;flex-direction:column;overflow:hidden;touch-action:manipulation}
.bar{display:flex;align-items:center;gap:14px;padding:10px 16px;background:#000;border-bottom:3px solid var(--pink)}
.bar .station{font-weight:700}.bar .session{color:var(--mut);font-size:14px;flex:1}
.weight{font-size:34px;font-weight:800}.weight small{font-size:16px;color:var(--mut);margin-left:4px}
.dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--warn);margin-left:8px;vertical-align:middle}
.dot.on{background:var(--ok)}
.settings{display:flex;align-items:center;gap:10px;padding:8px 16px;background:#1b1b22;border-bottom:1px solid #2a2a33;flex-wrap:wrap}
.settings .lbl{color:var(--mut);font-size:14px}
.settings .choices{display:flex;gap:6px}
.chip{padding:8px 14px;border-radius:20px;border:1px solid #3a3a46;background:#26262f;color:#fff;font-size:15px}
.chip.on{background:var(--pink);border-color:var(--pink)}
.sel{padding:8px;border-radius:8px;background:#26262f;color:#fff;border:1px solid #3a3a46;font-size:15px}
.settings .warn{color:var(--warn);font-size:14px;margin-left:auto}
main{flex:1;position:relative;overflow:hidden}
.panel{position:absolute;inset:0;display:flex;flex-direction:column;padding:16px;gap:14px}
.hidden{display:none!important}
.camera{flex:1;width:100%;object-fit:contain;background:#000;border-radius:12px}
.hint{text-align:center;font-size:22px;color:var(--mut);padding:8px}
.card{display:flex;gap:16px;background:var(--card);border-radius:16px;padding:16px}
.photo{width:180px;height:180px;object-fit:contain;background:#fff;border-radius:12px;flex:none}
.info{flex:1;display:flex;flex-direction:column;gap:6px}
.brand{color:var(--pink);font-weight:700;font-size:18px}.name{font-size:26px;font-weight:800}
.rowline{display:flex;justify-content:space-between;color:var(--mut);font-size:16px;margin-top:6px}
.rowline b{color:#fff}
.count{background:var(--card);border-radius:16px;padding:14px;text-align:center}
.qty-label{color:var(--mut)}
.qty-row{display:flex;align-items:center;justify-content:center;gap:24px;margin:6px 0}
.qty{font-size:72px;font-weight:900;min-width:140px}
.step{width:84px;height:84px;border-radius:50%;border:none;background:#33333f;color:#fff;font-size:46px}
.step:active{background:var(--pink)}
.conf{font-size:15px;color:var(--mut)}.diff{font-size:18px;font-weight:700;margin-top:4px}
.diff.match{color:var(--ok)}.diff.off{color:var(--warn)}
.actions{display:flex;gap:14px;margin-top:auto}
.btn{flex:1;border:none;border-radius:14px;padding:22px;font-size:24px;font-weight:800;color:#fff}
.btn.confirm{background:var(--ok)}.btn.skip{background:#444}.btn:active{filter:brightness(1.2)}
.btn.small{flex:none;padding:12px 20px;font-size:16px;border-radius:10px;background:#33333f}
.btn.danger{background:var(--err)}
.foot{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#000;border-top:1px solid #2a2a33}
.totals{flex:1;color:var(--mut);font-size:15px}
.err{color:var(--err);font-size:22px;text-align:center;padding:30px}
.dev{position:fixed;bottom:64px;right:10px;display:flex;gap:6px;background:#000a;padding:8px;border-radius:10px}
.dev input{width:140px;padding:8px;border-radius:6px;border:1px solid #444;background:#222;color:#fff}
.dev button{padding:8px 12px;border:none;border-radius:6px;background:var(--pink);color:#fff;font-weight:700}

/* Setup overlay (component weights) */
.overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:50}
.sheet{background:var(--bg);width:min(720px,96vw);max-height:92vh;border-radius:16px;display:flex;flex-direction:column;border:1px solid #2a2a33}
.sheet-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid #2a2a33}
.sheet-head h2{font-size:20px;flex:1}.sheet-head .live{color:var(--mut)}.sheet-head .live b{color:var(--ok)}
.sheet-body{padding:14px 18px;overflow:auto;flex:1}
.sheet-body section{margin-bottom:18px}.sheet-body h3{color:var(--pink);margin-bottom:8px;font-size:16px}
.hintsm{color:var(--mut);font-size:13px;margin-bottom:10px}
.box-edit,.bag-edit{background:var(--card);border-radius:12px;padding:10px;margin-bottom:10px}
.wrow{display:flex;align-items:center;gap:8px;margin:6px 0}
.wrow label{width:120px;color:var(--mut);font-size:14px}
.wrow input{flex:1;padding:10px;border-radius:8px;border:1px solid #3a3a46;background:#26262f;color:#fff;font-size:16px;min-width:60px}
.wrow input.w{max-width:110px;flex:none}
.weigh{padding:10px 12px;border:none;border-radius:8px;background:#33333f;color:#fff;font-weight:700}
.weigh:active{background:var(--pink)}.wrow .u{color:var(--mut);width:14px}
.sheet-foot{display:flex;align-items:center;gap:12px;padding:14px 18px;border-top:1px solid #2a2a33}
.sheet-foot #save-msg{flex:1;color:var(--ok)}

/* Debug capture gallery */
.dbgcam{max-height:240px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:8px}
.gcard{background:var(--card);border-radius:10px;overflow:hidden}
.gcard img{width:100%;height:104px;object-fit:cover;background:#000;display:block}
.gmeta{padding:6px 8px;font-size:12px;color:var(--mut)}
.gmeta b{color:#fff}

/* Commit-review diff table */
.difftab{width:100%;border-collapse:collapse;margin-top:8px}
.difftab th,.difftab td{padding:8px 10px;text-align:left;border-bottom:1px solid #2a2a33}
.difftab th{color:var(--mut);font-size:13px;font-weight:600}
.difftab td:nth-child(n+2),.difftab th:nth-child(n+2){text-align:right}
.difftab tr.off td:last-child{color:var(--warn);font-weight:800}
.difftab tr.match td:last-child{color:var(--ok)}