.order-flow-section{background:#f8fafb}.order-flow{margin-top:40px;border:1px solid #cbdce7;background:white;color:#284c69;padding:26px}.order-flow-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #dbe5ed;padding-bottom:20px;font-size:13px;font-weight:700}.order-flow-toolbar span{display:block;font-size:10px;color:#7b91a2;font-weight:400;margin:8px 0 0 17px}.order-flow button{background:#f4f8fa;border:1px solid #cbdce7;color:#3d627c;padding:10px 12px;font-size:11px}.order-flow button:focus-visible{outline:3px solid #419c85;outline-offset:3px}.order-flow-steps{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin-top:24px}.order-flow-steps button{text-align:left;padding:12px 9px;min-width:0;line-height:1.5}.order-flow-steps b{display:block;font-size:10px;margin-bottom:6px;color:#86a1b5}.order-flow-steps button[aria-pressed=true]{background:#244c68;color:white;border-color:#244c68}.order-flow-steps button.is-done{background:#eaf5f0;border-color:#beddd0;color:#3e7c65}.order-flow-heading{display:flex;align-items:start;gap:20px;margin:30px 0 25px;min-height:120px}.order-flow-heading>span:first-child{font-size:12px;color:#7b9d95;white-space:nowrap;padding-top:8px}.order-flow-heading h3{font-size:27px;line-height:1.25;margin:0 0 12px}.order-flow-heading p{font-size:13px;color:#738ba0;max-width:720px;margin:0;line-height:1.8}.order-flow-live{margin-left:auto;font-size:8px;letter-spacing:1px;white-space:nowrap;border:1px solid #bdd8cc;background:#f0f8f4;color:#6b9380;padding:8px}.order-flow-table-wrap{overflow:auto}.order-flow-table{border-collapse:collapse;width:100%;font-size:12px;text-align:left}.order-flow-table caption{text-align:left;font-size:10px;letter-spacing:1px;color:#8097a7;padding-bottom:14px}.order-flow-table thead{background:#eaf1f6;color:#63849c}.order-flow-table th,.order-flow-table td{padding:17px 12px;border-bottom:1px solid #dbe5ed;line-height:1.6}.order-flow-table tbody th{font-weight:600}.order-flow-table th small{display:block;color:#8198aa;font-size:10px;font-weight:400}.order-flow-table td:nth-child(3),.order-flow-table td:nth-child(4){font-size:22px;font-variant-numeric:tabular-nums;color:#306d66}.order-flow-table td:last-child{font-size:11px}.order-flow-panels{display:grid;grid-template-columns:1.5fr 1fr;gap:22px;margin-top:28px}.order-operation{background:#142d43;color:#d2e5ed;padding:24px;min-width:0}.order-operation-head{display:grid;gap:8px;border-bottom:1px solid #3c596c;padding-bottom:16px}.order-operation-head span{font-size:11px;color:#9ac6b9}.order-operation-head strong{font-size:12px;min-height:18px}.order-operation-art{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:35px 0}.order-station{display:grid;justify-items:center;gap:14px;color:#7893a6;min-width:0}.order-station span{font-size:7px;letter-spacing:.5px;text-align:center}.order-station b{display:grid;place-items:center;width:58px;height:58px;font-size:30px;border:1px solid #56798c;background:#1b3b51;font-weight:400}.order-station i{height:4px;width:25px;background:#496678}.order-transfer{font-size:20px;color:#6d99a7}.order-flow[data-active=supplier] .station-supplier,.order-flow[data-active=workshop] .station-workshop,.order-flow[data-active=warehouse] .station-warehouse,.order-flow[data-active=invoice] .station-invoice{color:#c8f1de}.order-flow[data-active=supplier] .station-supplier b,.order-flow[data-active=workshop] .station-workshop b,.order-flow[data-active=warehouse] .station-warehouse b,.order-flow[data-active=invoice] .station-invoice b{border-color:#a2d9bf;background:#2d615f}.order-playing[data-active=workshop] .station-workshop b{animation:order-work 2s ease-in-out infinite}.order-playing .order-transfer{animation:order-transfer 2s ease-in-out infinite}.order-playing .order-transfer:nth-of-type(4){animation-delay:.5s}.order-task{display:grid;gap:12px;min-height:100px}.order-task span{font-size:10px;color:#83a3b6}.order-task strong{font-size:13px;line-height:1.9;font-weight:400}.order-operation progress{width:100%;height:6px;accent-color:#a3dcc2}.order-flow-controls{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:20px}.order-flow-controls button{background:transparent;color:#bdd6e3;border-color:#507084;font-size:10px}.order-flow-controls button:disabled{opacity:.35;cursor:default}.order-flow-controls span{font-size:10px;color:#8fabbc;white-space:nowrap}.order-materials{background:#f0f5f7;padding:24px;min-width:0}.order-panel-label{font-size:9px;letter-spacing:1px;color:#7390a2}.order-materials>div{padding:20px 0;border-bottom:1px solid #d1e0e8}.order-materials strong{font-size:12px}.order-materials p{font-size:11px;line-height:1.9;color:#7c92a3;margin:10px 0}.order-materials div>span{display:block;font-size:12px;color:#377a68;background:#e1efe8;padding:10px;line-height:1.6;min-height:50px}.order-materials .order-document-note{border-bottom:0;padding-bottom:0}.order-flow-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:24px;border-top:1px solid #dbe5ed;padding-top:20px}.order-flow-footer span{font-size:10px;color:#879aa9;line-height:1.8}@keyframes order-transfer{50%{color:#b8edd4;transform:translateX(4px)}}@keyframes order-work{50%{transform:scale(.92);box-shadow:0 0 0 5px #8bceb51c}}
@media(max-width:1000px){.order-flow-steps{grid-template-columns:repeat(4,1fr)}.order-flow-live{display:none}.order-flow-panels{grid-template-columns:1fr 1fr}.order-operation{padding:18px}.order-station b{width:42px;height:46px;font-size:24px}.order-operation-art{gap:4px}.order-station span{font-size:6px}.order-transfer{font-size:14px}.order-flow-controls{flex-wrap:wrap}.order-flow-heading{min-height:140px}}
@media(max-width:740px){.order-flow{padding:16px}.order-flow-toolbar{gap:12px}.order-flow-toolbar>button{max-width:125px}.order-flow-heading{gap:12px;min-height:180px}.order-flow-heading h3{font-size:23px}.order-flow-heading p{font-size:12px}.order-flow-table{min-width:650px}.order-flow-panels{grid-template-columns:1fr}.order-flow-footer{align-items:start}.order-flow-footer button{flex-shrink:0}.order-station b{width:49px;height:50px}.order-flow-steps button{font-size:9px;padding:9px 7px}.order-flow-controls{flex-wrap:nowrap}.order-operation-art{padding:28px 0}.order-materials{padding:20px}}
@media(prefers-reduced-motion:reduce){.order-flow *{animation:none!important;transition:none!important}}
.order-station b{position:relative}.order-flow[data-active=workshop] .station-workshop b:before,.order-flow[data-active=workshop] .station-workshop b:after{content:'';position:absolute;width:9px;height:9px;background:#cfdfc3;border:1px solid #a8ccab;bottom:-15px;left:5px}.order-flow[data-active=workshop] .station-workshop b:after{left:auto;right:5px;background:#87b9c5}.order-playing[data-active=workshop] .station-workshop b:before{animation:order-assemble-a 2s infinite}.order-playing[data-active=workshop] .station-workshop b:after{animation:order-assemble-b 2s infinite}.order-playing[data-active=supplier] .station-supplier b:after,.order-playing[data-active=warehouse] .station-warehouse b:after{content:'';position:absolute;width:12px;height:12px;background:#cdaf83;border:1px solid #e1c79f;left:0;bottom:-17px;animation:order-box 2.5s ease-in-out infinite}@keyframes order-assemble-a{60%,90%{transform:translateX(12px)}}@keyframes order-assemble-b{60%,90%{transform:translateX(-12px)}}@keyframes order-box{0%{transform:translateX(-15px);opacity:0}25%{opacity:1}75%{opacity:1}100%{transform:translateX(65px);opacity:0}}@media(prefers-reduced-motion:reduce){.order-flow *:before,.order-flow *:after{animation:none!important}}
