:root{font-family:Segoe UI,Arial,sans-serif;color:#172c36;background:#eef2f4;font-size:16px;color-scheme:light}
*{box-sizing:border-box}
body{margin:0}
.site-header{background:#132d39;color:#fff;padding:20px 32px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.site-header b{font-size:26px;letter-spacing:1px}
.site-header b span{font-weight:400;color:#a6c8d8}
small{display:block;font-size:13px;margin-top:7px}
.session-tools{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#sessionName{max-width:340px;overflow-wrap:anywhere}
.notice{background:#fff0c2;padding:12px 24px;font-size:13px;text-align:center;line-height:1.5}
main{max-width:1060px;margin:28px auto;padding:0 20px 60px}
.narrow{max-width:540px;margin-left:auto!important;margin-right:auto!important}
.card{background:#fff;border:1px solid #d8e2e7;border-radius:14px;padding:24px;margin-bottom:18px;box-shadow:0 3px 12px #15344605}
h1{font-size:28px;margin:0 0 10px;overflow-wrap:anywhere}
h2{font-size:19px;margin:0 0 14px}
p{line-height:1.55}
.muted{color:#526875;font-size:14px}
.eyebrow{text-transform:uppercase;font-size:12px;letter-spacing:1.2px;color:#526875;font-weight:700;margin-bottom:10px}
button{font:inherit;border:1px solid #b9cbd4;border-radius:8px;background:#fff;color:#203e4e;padding:11px 15px;min-height:48px;cursor:pointer}
button:hover{background:#edf6f8}
button.primary{background:#087e77;color:#fff;border-color:#087e77;font-weight:600}
button.primary:hover{background:#06655f}
button:disabled{opacity:.5;cursor:not-allowed}
button.full{width:100%;margin-top:12px}
button[hidden]{display:none}
input,textarea{font:inherit;width:100%;min-height:50px;border:1px solid #a9bec9;border-radius:8px;padding:12px;margin:6px 0 16px;background:#fff;color:#172c36}
textarea{resize:vertical;min-height:130px;overflow-wrap:anywhere}
label{display:block;font-size:14px;font-weight:600}
:focus-visible{outline:3px solid #db9a17;outline-offset:3px}
.login-card h1,.login-card>p,.identity{text-align:center}
.badge-graphic{width:min(240px,100%);height:170px;display:block;margin:auto}
.scan-target{position:relative;max-width:320px;margin:22px auto 0;border:2px dashed #8db9b5;border-radius:18px;padding:16px;background:#f5faf9}
.scan-target:focus-within{outline:3px solid #087e77;outline-offset:3px;border-color:transparent}
.scan-receiver{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;font-size:16px}
.scan-help{text-align:center;color:#087e77;font-weight:600;line-height:1.8}
.login-help{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;border-top:1px solid #e2e9ed;padding-top:18px;margin-top:22px}
#pin{text-align:center;font-size:30px;letter-spacing:12px;padding-left:24px}
.identity .badge{margin:16px 0}
.badge{display:inline-block;background:#e4f1ef;color:#086659;border-radius:6px;padding:6px 9px;font-size:13px;font-weight:600;overflow-wrap:anywhere}
.error{padding:14px;background:#fff0de;color:#713d13;border-radius:8px;line-height:1.5;overflow-wrap:anywhere}
.status{padding:12px 0;color:#526875;line-height:1.5}
.row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.delivery-list{display:grid;gap:12px;margin-top:20px}
.delivery-row{display:grid;grid-template-columns:1fr auto;gap:10px;width:100%;text-align:left;padding:18px}
.delivery-row strong{display:block;font-size:19px;margin-bottom:6px}
.delivery-row .customer{display:block;overflow-wrap:anywhere}
.delivery-row .summary{font-size:13px;color:#526875;line-height:1.7;display:block;margin-top:8px}
.delivery-row .arrow{align-self:center;font-size:24px}
.list-footer{display:flex;justify-content:center;margin-top:20px}
.details{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:24px 0 0}
.details div{min-width:0}
dt{font-size:13px;color:#526875;margin-bottom:6px}
dd{margin:0;overflow-wrap:anywhere;line-height:1.4}
.positions{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.position{display:grid;grid-template-columns:1fr auto;gap:14px;border:1px solid #d8e2e7;border-radius:10px;padding:16px}
.position strong{display:block;overflow-wrap:anywhere}
.position .quantity{text-align:right;min-width:75px}
.position .quantity b{font-size:24px;display:block}
.position small{color:#526875;overflow-wrap:anywhere;line-height:1.5}
.back{margin-bottom:18px}
.error:empty,.status:empty{display:none}
.pick-entry{margin-top:20px;padding-top:16px;border-top:1px solid #d8e2e7}
#pickingMount{min-width:0}
#pickingMount button{touch-action:manipulation;line-height:1.35;overflow-wrap:anywhere}
#pickingMount select{font:inherit;width:100%;min-height:52px;margin:7px 0 0;border:1px solid #a9bec9;border-radius:8px;padding:11px 12px;background:#fff;color:#172c36}
#pickingMount select:disabled{opacity:.6}
#pickingMount small,#pickingMount .positions li{overflow-wrap:anywhere}
.work-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0}
.pick-menu button{min-height:54px;padding:10px 12px;font-weight:600}
.pick-package-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:14px;align-items:end}
.pick-package-controls>label{min-width:0}
.pick-package-controls>button{min-height:52px}
.product-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:110px}
.product-row>span:first-child{min-width:0;overflow-wrap:anywhere}
.product-row .quantity{text-align:right;min-width:66px;padding-left:6px}
.product-row .quantity b{display:block;font-size:30px;line-height:1.1;font-variant-numeric:tabular-nums}
.product-row .quantity small{font-size:12px;color:#526875}
.pick-card{scroll-margin-top:16px}
.pick-card>.row{margin-bottom:18px}
.pick-card>.row .eyebrow{margin:0}
.pick-scan-target{max-width:360px;padding:14px;margin:18px auto;background:#f2faf8}
.pick-graphic{width:190px;max-width:100%;height:116px}
.scan-code{display:block;margin-top:10px;text-align:center;font-size:clamp(24px,6vw,32px);line-height:1.2;overflow-wrap:anywhere}
.pick-scan-target .scan-help{margin:9px 0 2px;line-height:1.5;font-size:17px}
.pick-quantity{margin-top:22px;padding-top:18px;border-top:1px solid #d8e2e7}
.pick-quantity>label{text-align:center;font-size:16px}
.pick-quantity .quantity-input{display:block;min-height:96px;margin:10px 0;text-align:center;font-size:clamp(54px,12vw,72px);line-height:1.1;font-weight:700;font-variant-numeric:tabular-nums;border:2px solid #087e77;border-radius:12px}
.pick-quantity .quantity-input[readonly]{background:#edf7f5;color:#086659}
.pick-quantity .quantity-input:disabled{color:#526875;background:#f0f3f4;border-color:#b9cbd4}
.pick-quantity>button{width:100%;min-height:52px}
.pick-quantity>button.primary{min-height:64px;font-size:18px;padding:14px}
.pick-card form[data-pick-form="manual"]{padding:18px;background:#f5f8fa;border:1px solid #d8e2e7;border-radius:10px;margin-top:18px}
.pick-card form[data-pick-form="manual"]>button{width:100%;min-height:52px}
.package-card{border-left:5px solid #a9bec9}
.package-card h2{margin:0}
.package-card>.row{margin-bottom:18px}
.package-active{border-color:#087e77;background:#f6fbfa}
.package-active h2{color:#086659}
.package-card .position{background:#fff}
#pickingMount .positions>li:not(.position){padding:14px;border:1px solid #d8e2e7;border-radius:10px;background:#f8fafb;line-height:1.5}
#pickingMount .positions>li:not(.position) small{color:#526875;font-size:12px}
@media(max-width:700px){.site-header{padding:16px;align-items:flex-start}.site-header b{font-size:22px}.session-tools{justify-content:flex-end;gap:8px;font-size:13px}.notice{padding:10px 14px}main{padding:0 12px 40px;margin:18px auto}.card{padding:18px}h1{font-size:25px}.details{gap:18px 14px}.delivery-row{padding:15px}.position{padding:14px}}
@media(max-width:700px){.pick-package-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.pick-package-controls>button{grid-column:1/-1}.pick-card>.row{gap:10px}.pick-card .login-help{margin-top:16px;padding-top:14px}.pick-card .login-help>button{width:100%}.package-card>.row>button{width:100%}#pickingMount>.card:first-of-type{padding:16px}#pickingMount>.card:first-of-type h1{font-size:23px}#pickingMount>.card:first-of-type .error{font-size:13px;padding:10px}#pickingMount>.card:first-of-type .status{padding:6px 0;font-size:14px}.pick-menu{margin:12px 0;gap:8px}.pick-menu button{font-size:14px}.pick-scan-target{margin:14px auto}.pick-quantity{margin-top:16px;padding-top:16px}}
@media(max-width:390px){.site-header{flex-wrap:wrap}.session-tools{width:100%;justify-content:space-between}.details{grid-template-columns:1fr}.row>button{width:100%}}
@media(max-width:390px){#pickingMount .card{padding:15px}.pick-card>.row>button{width:auto;flex:1}.pick-card>.row .eyebrow{font-size:11px;letter-spacing:.5px}.product-row{padding:13px;gap:6px}.product-row strong{font-size:17px}.product-row .quantity{min-width:52px}.product-row .quantity b{font-size:27px}.pick-package-controls{gap:10px}.pick-package-controls label{font-size:13px}.pick-scan-target{padding:12px}.pick-graphic{height:100px;width:164px}.package-card .position{padding:12px;gap:8px}.package-card .position .quantity{min-width:50px}}
/* Central process controls, scanner and touch friendly. */
.work-nav{position:sticky;top:0;z-index:3;display:flex;flex-wrap:wrap;gap:12px;padding:14px;background:#fff;border:1px solid #ccdcd9;border-radius:12px;margin:16px 0}
.work-nav a{color:#086d66;font-weight:700;padding:8px}
.work-package{border:1px solid #ccdcd9;border-radius:12px;padding:16px;margin:16px 0}
.work-package h3{margin-top:0}.work-history{padding-left:20px}.work-history li{margin:12px 0}
#workflowMount form{display:grid;gap:12px;margin:20px 0;max-width:650px}
#workflowMount label{display:grid;gap:6px}#workflowMount input,#workflowMount select,#workflowMount textarea{box-sizing:border-box;width:100%;font:inherit;min-height:48px;padding:10px;border:1px solid #9fb3b1;border-radius:8px}
#workflowMount .check{display:flex;align-items:center;gap:12px}#workflowMount input[type=checkbox]{width:24px;height:24px;min-height:24px;flex-shrink:0}
#workflowMount .row{flex-wrap:wrap;gap:10px}#workflowMount button{min-height:48px}#workflowMount section{scroll-margin-top:90px}

/* Keep administration/picking available while scrolling without leaving the cart. */
.work-top{position:sticky;top:0;z-index:20;background:#f3f7f8;padding:10px 0;border-bottom:1px solid #d9e3e7;display:flex;flex-wrap:wrap;gap:10px}
.cart-graphic{display:block;width:240px;max-width:100%;height:170px;margin:auto;color:#087e77}

/* Approved handheld workflow: three actual views, automatic packages, direct scans. */
.work-mobile{max-width:540px;margin:0 auto;min-width:0}
.work-admin{min-width:0}
.work-tools{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.work-tools button{font-size:14px;min-height:44px;padding:9px 12px}
#workflowMount .work-menu{position:sticky;top:0;z-index:15;display:grid;grid-template-columns:1fr 1.35fr 1.1fr;gap:6px;background:#eef2f4;padding:8px 0;margin:0 0 12px}
#workflowMount .work-menu button{min-width:0;font-size:14px;font-weight:600;padding:10px 6px;overflow-wrap:normal;line-height:1.35}
#workflowMount .work-menu button[aria-pressed=true]{background:#087e77;border-color:#087e77;color:#fff}
.work-context{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:13px;margin-bottom:12px}
.work-context span{color:#526875}
.order-card h1{font-size:22px;margin:0}.order-card p{margin:9px 0}
.order-card progress{width:100%;height:12px;accent-color:#087e77}.work-progress{font-size:14px}
.product-list{display:grid;gap:12px}
.position{grid-template-columns:minmax(0,1fr) minmax(60px,80px);align-items:center}
.position>div{min-width:0}.position .quantity{min-width:0;max-width:80px}
.product-row{display:grid;grid-template-columns:minmax(0,1fr) 68px;width:100%;text-align:left;align-items:center;gap:12px;min-height:92px}
.product-row>span:first-child{min-width:0}.product-row strong{font-size:17px;line-height:1.4;overflow-wrap:break-word;word-break:normal}
.product-row .quantity{min-width:0;width:68px;padding:0;white-space:normal}
.product-row .quantity b{font-size:28px}.product-row .quantity small{font-size:12px;line-height:1.4}
.product-row .customer,.product-row .summary{font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.package-kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}
.package-kinds button{min-height:68px;font-size:17px;font-weight:600;padding:12px 6px;border:2px solid #087e77;color:#086659}
.pack-list{display:grid;gap:20px;margin:20px 0}
#workflowMount .package-card{border:3px solid #91a9b5;border-radius:14px;padding:18px;background:#f8fafb;min-width:0}
#workflowMount .package-card.package-active{border-color:#087e77;background:#f0f9f6}
.package-card h2{font-size:21px;line-height:1.4;overflow-wrap:break-word}
.package-actions,.action-list{display:grid;gap:10px;margin:16px 0}
.package-card summary{cursor:pointer;font-weight:600;padding:14px 0}
.package-card details[open]{border-top:1px solid #cdded8;margin-top:16px}
.completion-card{text-align:center;background:#e0f3ed;border:3px solid #087e77;padding:26px 20px}
.completion-card h2{color:#075e57;font-size:23px}.completion-card p{color:#244e48}
#workflowMount .completion-card form{margin:18px auto;max-width:360px}
.completion-card button.primary{min-height:60px;font-size:19px;font-weight:700;background:#076b61}
#workflowMount .completion-card small{color:#526875;font-weight:400;line-height:1.5}
#workflowMount .scan-target .scan-receiver{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0}
#workflowMount .scan-code{font-size:28px}
#workflowMount .pick-card{scroll-margin-top:90px}
#workflowMount #pickingMount .card{min-width:0}
#workflowMount #pickingMount .work-menu{display:none}
.work-mobile.is-scanning>.order-card,.work-mobile.is-scanning>p.status{display:none}
#workflowMount .quantity-input{font-size:40px;font-weight:700;text-align:center;min-height:76px}
@media(max-width:420px){#workflowMount .work-menu button{font-size:12px;padding:10px 5px}.package-kinds{gap:7px}.package-kinds button{font-size:16px}.product-row{padding:13px 11px;gap:10px;grid-template-columns:minmax(0,1fr) 58px}.product-row .quantity{width:58px}#workflowMount .package-card{padding:15px}}