/* Quiet operational surfaces: blue actions, restrained platform green accents. */
body.ops-app{--op-accent:#237a68;--op-green-soft:#f0f7f4;--op-green-line:#d9e9e2;--op-ink:#29465b;--op-muted:#657d8e;--op-line:#e1e8ed;background:#f6f8fa}
.ops-app .op-content{max-width:1240px}
.ops-app .page-heading{gap:10px 16px;margin-bottom:18px}
.ops-app .page-heading h1{font-size:20px;font-weight:650;letter-spacing:-.25px}
.ops-app .page-heading p{color:var(--op-muted);font-size:12px;max-width:72ch}
.ops-app .heading-actions,.ops-app .op-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ops-app .btn{min-height:36px;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:500;line-height:1.7;white-space:normal;overflow-wrap:anywhere;transition:background-color .16s,border-color .16s,color .16s}
.ops-app .btn-primary{background:#286cae;border-color:#286cae;box-shadow:0 1px 2px #173f6810}
.ops-app .btn-primary:hover:not(:disabled){background:#235f98;border-color:#235f98}
.ops-app .btn:not(.btn-primary){color:#476577;border-color:#dce5eb;background:#fff}
.ops-app .btn:not(.btn-primary):hover:not(:disabled){color:#236e5f;border-color:#b6d4c7;background:#f4f9f6}
.ops-app .btn:disabled{opacity:.48;cursor:not-allowed;box-shadow:none}
.ops-app .btn .icon{width:15px;height:15px;flex-shrink:0}
.ops-app :is(a,button,input,textarea,select):focus-visible{outline:2px solid #237a68;outline-offset:3px}
.ops-app .op-panel{padding:16px 18px;border:1px solid var(--op-line);border-radius:12px;box-shadow:0 2px 6px #243f5803;margin-bottom:14px}
.ops-app .op-section-head{gap:8px;min-height:28px;margin-bottom:9px}
.ops-app .op-section-head h2{font-size:13px;font-weight:600;color:#2c4a5f;line-height:1.9}
.ops-app :is(.op-row,.ow-item,.ow-job){padding:12px 0;gap:12px;border-color:#edf1f4}
.ops-app :is(.op-row-content,.ow-job-main,.ow-hub-copy){min-width:0}
.ops-app :is(.op-row-content strong,.ow-item strong,.ow-job strong){font-size:12px;font-weight:600;color:#304f62;line-height:1.9}
.ops-app .op-row-content p{font-size:11px;color:#637e90;line-height:1.9;margin-top:3px}
.ops-app .op-row-content small{font-size:10.5px;color:#708695;line-height:1.8}
.ops-app :is(.op-row-icon,.ow-hub-symbol){width:32px;height:32px;border-radius:9px;background:var(--op-green-soft);color:var(--op-accent);border:1px solid #e6f0eb}
.ops-app :is(.op-row-icon,.ow-hub-symbol) .icon{width:16px;height:16px}
.ops-app .op-badge{font-size:10.5px;padding:2px 7px;border-radius:6px;line-height:1.8;max-width:100%;white-space:normal}
.ops-app .op-badge.success{color:#23725c;background:#edf6f0}
.ops-app .op-mini-link{font-size:11px;min-height:32px;display:inline-flex;align-items:center;gap:4px}
.ops-app .op-back{display:inline-flex;align-items:center;gap:5px;min-height:32px;color:#647e90;font-size:11px;margin-bottom:8px}
.ops-app .op-back:hover{color:var(--op-accent)}
.ops-app .ow-hub-panel{padding:7px 16px 2px}
.ops-app .ow-hub-panel>.op-section-head{padding:7px 0 10px;border-color:#edf1f4}
.ops-app .ow-hub-row{min-height:76px;padding:14px 4px;gap:12px;border-color:#edf1f4;border-radius:6px}
.ops-app .ow-hub-row:hover{background:#f7faf8}
.ops-app .ow-hub-copy strong{font-size:12.5px;color:#2d4e60;line-height:1.9}
.ops-app .ow-hub-copy>span{font-size:11px;color:#6b8293;margin-top:3px}
.ops-app .ow-hub-queue{color:#276f5e;background:var(--op-green-soft);border:1px solid #e4eee8;padding:3px 8px;border-radius:7px;gap:5px}
.ops-app .ow-hub-queue b{font-size:13px;font-weight:600}
.ops-app .ow-hub-queue small{font-size:10px}
.ops-app .ow-hub-arrow{color:#829c95}
.ops-app .ow-hub-secondary-link{border-radius:10px;padding:12px;border-color:var(--op-line);gap:10px}
.ops-app .ow-hub-secondary-link:hover{border-color:#c9ded3;background:#fbfdfc}
.ops-app .ow-hub-secondary-link .ow-hub-copy strong{font-size:12px}
.ops-app .ow-hub-secondary-link .ow-hub-copy>span{font-size:10.5px}
.ops-app .ow-next{border:1px solid var(--op-green-line);background:#f4f9f6;border-inline-start:3px solid #76a995;border-radius:10px;padding:13px 15px;gap:12px}
.ops-app .ow-next strong{font-size:13px;color:#345f53;line-height:1.9}
.ops-app .ow-next p{font-size:11.5px;color:#617e73}
.ops-app .ow-next .btn{min-height:36px}
.ops-app .op-kv{gap:12px 20px;margin:12px 0}
.ops-app .op-kv dt{font-size:11px;color:#6e8493;line-height:1.9}
.ops-app .op-kv dd{font-size:12px;color:#35566b;line-height:1.9}
.ops-app .op-stats{border-radius:12px;border-color:var(--op-line);margin-bottom:16px}
.ops-app .op-stat{padding:15px 18px;gap:10px}
.ops-app .op-stat>strong{font-size:25px;font-weight:600}
.ops-app .op-stat .icon{color:var(--op-accent)}
.ops-app .op-stat:hover{background:#f6faf8}
.ops-app .ow-main-flow a{border-radius:9px;border-color:var(--op-line);min-height:42px;font-size:11.5px;background:#fff}
.ops-app .ow-main-flow a>span{color:var(--op-accent);background:var(--op-green-soft)}
.ops-app .ow-main-flow a:hover{border-color:#c5dcd0;background:#f8fbf9}
.ops-app .ow-tabs button.active{color:var(--op-accent);border-color:var(--op-accent)}
.ops-app .op-toolbar{gap:9px;padding-bottom:10px}
.ops-app :is(.op-search,.select-trigger){border-radius:8px;border-color:#dce5eb}
.ops-app .op-search:focus-within{border-color:#85b5a1;box-shadow:0 0 0 2px #edf5f0}
.ops-app .modal{border-radius:13px;border:1px solid #dfe7ec;box-shadow:0 18px 60px #203b4d24}
.ops-app .modal-header{padding:13px 16px;border-color:#e8eef1}
.ops-app .modal-header h2{font-size:14px;font-weight:600}
.ops-app .modal-body{padding:15px 16px}
.ops-app .op-form-actions{border-color:#e6edf0;padding-top:12px;gap:8px}
.ops-app :is(.op-line,.ow-line){padding:10px 0}
.ops-app :is(.ow-pack-group,.ps-product,.pi-confirm){border-color:#e0e9e6;border-radius:9px}
.ops-app .op-checkbox input{accent-color:var(--op-accent)}
@media(min-width:1000px){
 .ops-app .ow-hub-row{padding:16px 12px}
 .ops-app .ow-hub-panel:has(.ow-hub-row:nth-child(4)) .ow-hub-row{padding:14px 10px;min-height:80px}
 .ops-app .ow-hub-row .ow-hub-queue{margin-inline-start:44px}
}
@media(max-width:760px){
 .ops-app .op-content{padding-inline:14px;padding-top:14px}
 .ops-app .page-heading h1{font-size:19px}
 .ops-app .page-heading p{font-size:11.5px}
 .ops-app .op-panel{padding:13px 14px;border-radius:10px}
 .ops-app .ow-hub-panel{padding:5px 13px 1px}
 .ops-app .ow-hub-row{padding:13px 0;min-height:74px;gap:10px}
 .ops-app .ow-hub-queue{padding:3px 7px;min-width:38px}
 .ops-app .ow-hub-queue small{font-size:9px}
 .ops-app .ow-hub-secondary-link .ow-hub-copy>span{font-size:10.5px}
 .ops-app :is(.btn,.ow-job .btn,.ow-item .btn,.op-form-actions .btn){min-height:38px;font-size:11.5px;padding:7px 11px}
 .ops-app :is(.ow-job-action,.op-row-end){gap:7px}
 .ops-app .ow-item-end{max-width:44%}
 .ops-app .op-stat{padding:12px;gap:8px}
 .ops-app .op-stat>strong{font-size:23px}
 .ops-app .op-kv{gap:12px}
 .ops-app .ow-next{padding:12px;border-radius:9px}
 .ops-app .heading-actions{max-width:100%}
}
@media(max-width:380px){
 .ops-app .op-content{padding-inline:11px}
 .ops-app .ow-hub-secondary>nav{grid-template-columns:1fr}
 .ops-app .ow-hub-queue small{display:block}
 .ops-app .ow-item-end{max-width:100%}
 .ops-app .ow-job{flex-wrap:wrap}
 .ops-app .ow-job-main{flex-basis:100%}
 .ops-app .ow-job-action{flex-direction:row;flex-wrap:wrap;justify-content:flex-start;width:100%}
 .ops-app .ow-preparation-heading{grid-template-columns:1fr}
 .ops-app .ow-preparation-heading .heading-actions{grid-column:1;grid-row:3;justify-content:flex-start;margin-top:5px}
}
@media(prefers-reduced-motion:reduce){.ops-app .btn{transition:none}}
/* Compact order queue: identity, state and an explicit next action. */
.ops-app .oq-order{padding:12px 0;min-width:0;border-bottom:1px solid #e9eff2}
.ops-app .oq-order:last-child{border-bottom:0;padding-bottom:2px}
.ops-app .oq-order header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ops-app .oq-number{font-size:12px;font-weight:600;color:#30536b;text-decoration:none;line-height:1.8}
.ops-app .oq-order .op-badge{font-size:10px;padding:1px 6px}
.ops-app .oq-customer{font-size:11px;color:#587589;margin:4px 0 7px;line-height:1.8;overflow-wrap:anywhere}
.ops-app .oq-customer span{color:#718695;font-size:10.5px}
.ops-app .oq-order footer{display:flex;justify-content:space-between;align-items:center;gap:10px}
.ops-app .oq-timing{min-width:0;flex:1}
.ops-app .oq-order .oq-due{font-size:10.5px;line-height:1.8;margin:0;color:#6e8492}
.ops-app .oq-order .oq-due.is-overdue{color:#986b25}
.ops-app .oq-order .btn{min-height:34px;font-size:11px;padding:5px 10px;border-radius:7px;gap:5px}
.ops-app .oq-order .btn .icon{width:12px;height:12px}
@media(max-width:380px){.ops-app .oq-order footer{align-items:flex-start;flex-wrap:wrap;gap:7px}.ops-app .oq-timing{flex-basis:100%}.ops-app .oq-order .btn{min-height:36px}.ops-app .oq-order header{align-items:flex-start}}
/* Breadcrumb ancestors are real links; the current step is a readable label. */
.ops-app .op-breadcrumb{margin-bottom:12px;color:#617c8d;font-size:11px}
.ops-app .op-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:0;list-style:none;margin:0;padding:0;min-width:0}
.ops-app .op-breadcrumb li{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%;line-height:1.8}
.ops-app .op-breadcrumb a{display:inline-flex;align-items:center;min-height:32px;padding:3px 5px;border-radius:5px;color:#56798d;text-decoration:none;overflow-wrap:anywhere}
.ops-app .op-breadcrumb a:hover{color:#237a68;background:#edf5f0;text-decoration:underline;text-underline-offset:3px}
.ops-app .op-crumb-separator{display:inline-flex;align-items:center;padding-inline:2px;color:#9aadb6}
.ops-app .op-breadcrumb [aria-current=page]{font-weight:500;color:#355869;padding:3px 5px;overflow-wrap:anywhere}
@media(max-width:600px){.ops-app .op-breadcrumb{font-size:10.5px}.ops-app .op-breadcrumb a{min-height:34px;padding-inline:4px}.ops-app .op-breadcrumb li{gap:2px}}