/* Scoped mockup adaptation; no shell, other modules, or action semantics. */
@media(max-width:760px){body.dbx-pick-pack-active #appShell .app-body{grid-template-columns:minmax(0,1fr)!important}body.dbx-pick-pack-active #appShell .main-content{grid-column:1!important;min-width:0}}
body #sec-pick-pack {--pp-pastel-pending:#fff0d6;--pp-pastel-picking:#e5f0ff;--pp-pastel-packing:#eee7ff;--pp-pastel-dispatch:#e1f7ef;min-width:0;font-family:var(--sans);color:var(--home-text)}
body #sec-pick-pack>.page-title {font-size:26px;font-weight:550;line-height:1.25;margin-bottom:6px}
body #sec-pick-pack>.page-sub {color:var(--home-muted);margin-bottom:18px}
#sec-pick-pack #ppHeaderMetrics {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:20px}
#sec-pick-pack .pp-header-metric {display:flex;gap:18px;align-items:flex-start;min-width:0;padding:20px 18px;background:#fff;border:1px solid var(--home-border);border-radius:10px;box-shadow:0 2px 6px #15233305}
#sec-pick-pack .pp-header-metric-content {min-width:0}
#sec-pick-pack .pp-header-value {font-size:30px;font-weight:500;line-height:1.15;margin:0 0 5px}
#sec-pick-pack .pp-header-metric h2 {font-size:13px;font-weight:400;line-height:1.4;margin:0 0 8px}
#sec-pick-pack .pp-header-icon {display:flex;align-items:center;justify-content:center;width:52px;height:54px;flex:0 0 52px;border-radius:10px}
#sec-pick-pack .pp-header-icon svg {width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#sec-pick-pack .pp-header-icon.red {background:var(--pp-pastel-pending);color:#9a6500}
#sec-pick-pack .pp-header-icon.blue {background:var(--pp-pastel-picking);color:#1675ee}
#sec-pick-pack .pp-header-icon.violet {background:var(--pp-pastel-packing);color:#7344d9}
#sec-pick-pack .pp-header-icon.mint {background:var(--pp-pastel-dispatch);color:#159b80}
body #sec-pick-pack button.pp-header-link {background:transparent!important;border:0!important;box-shadow:none!important;color:#007e83!important;font:400 12px/1.4 var(--sans)!important;padding:4px 0!important;min-height:0;cursor:pointer;text-align:left}
#sec-pick-pack button.pp-header-link:hover {text-decoration:underline}
#sec-pick-pack button.pp-header-link:focus-visible {outline:2px solid #007e83;outline-offset:3px}
body #sec-pick-pack>.pp-tabs {gap:12px!important;margin-bottom:8px!important;border-bottom:1px solid var(--home-border);padding:0!important;background:transparent!important}
body #sec-pick-pack>.pp-tabs>.btn {background:transparent!important;border-radius:0!important;font:400 12px/1.4 var(--sans)!important;color:#536171!important;box-shadow:none!important;padding:10px!important}
body #sec-pick-pack>.pp-tabs>.btn-dark {color:#14212b!important;box-shadow:inset 0 -2px #009f9e!important}
#sec-pick-pack #pp-panel .pp-v2-control-head {margin:0 0 4px;padding:0;background:transparent;border:0;min-height:0}
#sec-pick-pack #ppV2Flow {grid-template-columns:repeat(6,minmax(220px,1fr));gap:12px;overflow-x:auto;align-items:stretch;padding-bottom:8px}
#sec-pick-pack #ppV2Flow .pp-v2-stage {--stage-accent:#8497a3;min-width:220px;height:clamp(380px,calc(100dvh - 350px),760px);padding:0 10px 12px;background:#fcfdfe;border:1px solid #e5e9ed;border-radius:8px;box-shadow:none}
#sec-pick-pack #ppV2Flow .blocked {--stage-accent:#e75d6a}
#sec-pick-pack #ppV2Flow .picking {--stage-accent:#6ca9ee}
#sec-pick-pack #ppV2Flow :is(.control,.packing) {--stage-accent:#b197ef}
#sec-pick-pack #ppV2Flow .dispatch {--stage-accent:#69c58c}
#sec-pick-pack #ppV2Flow :is(.blocked,.ready) {--stage-header-bg:var(--pp-pastel-pending)}
#sec-pick-pack #ppV2Flow .picking {--stage-header-bg:var(--pp-pastel-picking)}
#sec-pick-pack #ppV2Flow :is(.control,.packing) {--stage-header-bg:var(--pp-pastel-packing)}
#sec-pick-pack #ppV2Flow .dispatch {--stage-header-bg:var(--pp-pastel-dispatch)}
#sec-pick-pack #ppV2Flow .pp-v2-stage>header {position:relative;top:auto;flex-shrink:0;background:var(--stage-header-bg);color:#14212b;min-height:32px;margin:0 -10px 8px;padding:10px 12px;border:0;border-radius:7px 7px 0 0;align-items:center}
#sec-pick-pack #ppV2Flow .pp-v2-stage>header strong {font:500 12px/1.4 var(--sans)}
#sec-pick-pack #ppV2Flow .pp-v2-stage>header b {font:500 12px/22px var(--sans);background:#fff;color:#344652;border-radius:5px}
#sec-pick-pack #ppV2Flow .pp-v2-stage>p {font:400 11px/1.4 var(--sans);color:#536171;margin:0 2px 10px}
#sec-pick-pack #ppV2Flow .pp-v2-stage-list {gap:8px;overflow-y:auto;min-height:0}
#sec-pick-pack #ppV2Flow .pp-v2-card {background:#fff!important;color:#14212b!important;border:1px solid #e5e9ed!important;border-left:2px solid var(--stage-accent)!important;border-radius:7px;padding:10px!important;box-shadow:none!important;transform:none}
#sec-pick-pack #ppV2Flow .blocked .pp-v2-card {background:#fffafb!important}
#sec-pick-pack #ppV2Flow .pp-v2-card:hover {background:#f7fafb!important;border-color:#acbdc7!important;transform:none;box-shadow:none}
#sec-pick-pack #ppV2Flow .pp-v2-card strong {font:500 12px/1.4 var(--sans)!important;color:#14212b}
#sec-pick-pack #ppV2Flow :is(.pp-v2-card small,.pp-v2-card-context,.pp-v2-card-meta) {font:400 11px/1.45 var(--sans)!important;color:#536171!important;overflow-wrap:anywhere}
#sec-pick-pack #ppV2Flow .pp-v2-card-top {gap:6px;flex-wrap:wrap}
#sec-pick-pack #ppV2Flow .pp-v2-channel {font:400 10px/1.5 var(--sans);padding:2px 6px;border-radius:5px}
#sec-pick-pack #ppV2Flow .pp-v2-next {color:#007e83;font:400 11px/1.4 var(--sans);border-top:1px solid #e5e9ed;padding-top:8px;margin-top:8px}
#sec-pick-pack #ppV2Flow .pp-v2-card-reason {background:transparent;border:0;border-left:2px solid #e75d6a;padding:2px 6px;font:400 11px/1.4 var(--sans)}
#sec-pick-pack #ppV2Flow .blocked .pp-v2-card-action {background:#e8f7f6;color:#006f73;border:1px solid #a9dbd8;box-shadow:none;transition:background .15s ease,border-color .15s ease}
#sec-pick-pack #ppV2Flow .blocked .pp-v2-card-action:hover:not(:disabled) {background:#d6efed;border-color:#62b9b5;color:#005c60}
#sec-pick-pack #ppV2Flow .blocked .pp-v2-card-action:focus-visible {outline:2px solid #007e83;outline-offset:2px}
#sec-pick-pack #ppV2Flow .pp-v2-empty {display:flex;flex:1;min-height:180px;align-items:center;justify-content:center;text-align:center;border:1px dashed #e5e9ed;background:#fff;border-radius:7px;padding:18px;color:#536171;font:400 12px/1.5 var(--sans)}
@media(max-width:1200px){#sec-pick-pack #ppHeaderMetrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){#sec-pick-pack #ppHeaderMetrics{grid-template-columns:minmax(0,1fr);gap:10px}#sec-pick-pack .pp-header-metric{padding:14px}body #sec-pick-pack>.pp-tabs{flex-wrap:nowrap;overflow-x:auto}body #sec-pick-pack>.pp-tabs>.btn{white-space:nowrap}#sec-pick-pack #ppV2Flow .pp-v2-stage{height:480px}}
