:root{--bg: #0b1220;--surface: #131c2e;--surface-raised: #1c2740;--border: #2a3654;--text: #f2f5fb;--text-dim: #9aa7c2;--accent: #0b5fff;--accent-text: #ffffff;--good: #1fbf75;--warn: #e6a700;--bad: #ef4444;--radius: 14px;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:18px;-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}#app{min-height:100vh;display:flex;flex-direction:column}button,input,select{font:inherit;color:inherit}button{appearance:none;border:none;border-radius:var(--radius);background:var(--surface-raised);color:var(--text);padding:1rem 1.25rem;font-size:1.1rem;font-weight:600;min-height:56px;cursor:pointer}button.primary{background:var(--accent);color:var(--accent-text)}button.danger{background:var(--bad);color:#fff}button.ghost{background:transparent;border:2px solid var(--border)}button:disabled{opacity:.5;cursor:not-allowed}button:active:not(:disabled){transform:scale(.98)}input[type=text],input[type=number],input[type=password]{width:100%;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:.9rem 1rem;min-height:56px;font-size:1.2rem}input:focus{outline:3px solid var(--accent);outline-offset:1px}label{display:block;font-size:.95rem;color:var(--text-dim);margin:.75rem 0 .35rem}.screen{flex:1;display:flex;flex-direction:column;padding:1rem 1rem 2rem;gap:.75rem;max-width:720px;width:100%;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem 0}.topbar h1{font-size:1.15rem;margin:0}.status-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .7rem;border-radius:999px;font-size:.85rem;font-weight:600;background:var(--surface-raised)}.status-pill.offline{background:var(--bad);color:#fff}.status-pill.pending{background:var(--warn);color:#1a1300}.dot{width:8px;height:8px;border-radius:50%;background:var(--good);display:inline-block}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.list{display:flex;flex-direction:column;gap:.6rem}.asn-row{display:flex;flex-direction:column;gap:.4rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;text-align:left;width:100%}.asn-row .po{font-size:1.15rem;font-weight:700}.asn-row .meta{color:var(--text-dim);font-size:.9rem}.badge{display:inline-block;padding:.2rem .6rem;border-radius:999px;font-size:.8rem;font-weight:700;background:var(--surface-raised);width:fit-content}.badge.exact{background:var(--good);color:#04140b}.badge.short{background:var(--warn);color:#1a1300}.badge.over{background:var(--bad);color:#fff}.badge.pending{background:var(--surface-raised);color:var(--text-dim)}.scan-input-wrap{position:relative}.scan-input-wrap input{font-size:1.4rem;text-align:center;letter-spacing:.05em}.last-scan{text-align:center;padding:1.25rem;border-radius:var(--radius);background:var(--surface-raised)}.last-scan .sku{font-size:1.4rem;font-weight:800}.last-scan .count{font-size:2.4rem;font-weight:800;margin-top:.25rem}.last-scan.flash-good{animation:flash-good .5s ease}.last-scan.flash-bad{animation:flash-bad .5s ease}@keyframes flash-good{0%{background:var(--good)}to{background:var(--surface-raised)}}@keyframes flash-bad{0%{background:var(--bad)}to{background:var(--surface-raised)}}.item-row{display:grid;grid-template-columns:1fr auto auto;gap:.5rem 1rem;align-items:center;padding:.75rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.item-row .sku{font-weight:700}.item-row .ean{color:var(--text-dim);font-size:.85rem}.item-row .qty{font-size:1.3rem;font-weight:800;text-align:right;white-space:nowrap}.item-row .qty .expected{color:var(--text-dim);font-size:.95rem;font-weight:500}.actions-row{display:flex;gap:.6rem}.actions-row button{flex:1}.footer-actions{position:sticky;bottom:0;display:flex;gap:.6rem;padding-top:.75rem;background:linear-gradient(to top,var(--bg) 60%,transparent)}.footer-actions button{flex:1}.modal-backdrop{position:fixed;inset:0;background:#0009;display:flex;align-items:flex-end;justify-content:center;z-index:50}.modal{background:var(--surface);border:1px solid var(--border);border-radius:20px 20px 0 0;padding:1.25rem;width:100%;max-width:720px;max-height:85vh;overflow-y:auto}.modal h2{margin-top:0}.error-text{color:var(--bad);font-weight:600}.hint{color:var(--text-dim);font-size:.9rem}.search-input{margin-bottom:.25rem}.review-row{display:grid;grid-template-columns:1fr auto;gap:.25rem 1rem;padding:.75rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.review-row .variance-good{color:var(--good)}.review-row .variance-bad{color:var(--bad)}.center{text-align:center}.spacer{flex:1}.link-button{background:none;border:none;color:var(--accent);text-decoration:underline;padding:0;min-height:auto;font-weight:600}
