.fulfillment-list{display:grid;gap:16px}.fulfillment-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 7px 22px rgba(17,18,20,.04)}.fulfillment-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.fulfillment-card h3{margin:4px 0;font-size:17px}.fulfillment-card small{color:var(--muted)}.fulfillment-id{font-size:10px;font-weight:900;letter-spacing:.12em;color:var(--orange)}.pick-progress{height:5px;background:#edf0f2;border-radius:99px;overflow:hidden;margin:16px 0}.pick-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--orange),#ffa356);border-radius:inherit}.pick-lines{display:grid;gap:8px}.pick-line{display:grid;grid-template-columns:32px 46px minmax(0,1fr) auto;align-items:center;gap:12px;border:1px solid var(--line);background:#f8f9fa;border-radius:12px;padding:8px 12px}.pick-line.picked{border-color:#bde9d2;background:#f2fbf6}.pick-line img{width:42px;height:42px;object-fit:contain;background:#fff;border-radius:8px}.pick-line b{display:block;font-size:12px}.pick-line small{display:block;font-size:10px;margin-top:3px}.pick-line strong{font-size:12px}.pick-check{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#202327;color:#fff;font-size:11px;font-weight:900}.pick-line.picked .pick-check{background:#0f9d62}.fulfillment-actions{display:flex;justify-content:flex-end;margin-top:14px}.scan-box{display:flex;gap:8px;width:min(100%,520px)}.scan-box input{flex:1;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-weight:800;text-transform:uppercase}.scan-box input:focus{outline:2px solid rgba(240,105,0,.2);border-color:var(--orange)}
@media(max-width:700px){.fulfillment-card{padding:14px}.fulfillment-card>header{align-items:flex-start}.pick-line{grid-template-columns:28px 38px minmax(0,1fr)}.pick-line img{width:36px;height:36px}.pick-line>strong{grid-column:3}.scan-box{display:grid}.fulfillment-actions>.btn,.scan-box .btn{width:100%}}