:root{--navy:#183442;--navy-dark:#142b38;--blue:#255e78;--teal:#2a726f;--ink:#243640;--muted:#829098;--line:#e8edef;--bg:#f4f6f7;--white:#fff;--orange:#b87339;--red:#b85b51;--green:#4c7f69;--radius:12px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);font-size:14px;line-height:1.5}
*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button,a{transition:background .15s,color .15s,box-shadow .15s}a{color:inherit;text-decoration:none}button{border:0;background:none;color:inherit}i{display:inline-flex;flex-shrink:0}svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}button:focus-visible,a:focus-visible{outline:3px solid #8dbbc8;outline-offset:3px}[hidden]{display:none!important}
.sidebar{width:218px;height:100vh;position:fixed;inset:0 auto 0 0;background:var(--navy-dark);color:#b0c2cd;padding:30px 18px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:12px;color:white;margin:0 10px 48px;font-size:22px;font-weight:650;letter-spacing:2.5px}.brand small{display:block;font-size:10px;font-weight:400;letter-spacing:2px;color:#95adba;margin-top:4px}.brand-mark{position:relative;font-size:30px;line-height:1;border:1px solid #7b9dac;width:40px;height:44px;border-radius:9px;display:grid;place-items:center;letter-spacing:-3px;padding-right:4px}.brand-mark span{position:absolute;background:#8faea5;width:7px;height:7px;border:2px solid var(--navy-dark);border-radius:50%;right:-4px;bottom:6px}.nav-label{font-size:10px;letter-spacing:1.7px;padding:0 14px;color:#647e8d;margin-bottom:12px}.nav-item{display:flex;gap:12px;align-items:center;width:100%;text-align:left;padding:13px 14px;border-radius:8px;font-size:13px;margin-bottom:6px;color:#a6becd}.nav-item.active{background:#294652;color:#fff}.nav-item:hover{background:#233e4d;color:white}.nav-item.active::before{content:"";height:19px;width:3px;background:#a0c6b3;border-radius:3px;position:absolute;left:18px}.nav-item span{margin-left:auto;background:#3d5864;color:#d7e3e6;font-size:10px;padding:1px 6px;border-radius:4px}.sidebar-note{border:1px solid #304754;border-radius:10px;margin:58px 6px 20px;padding:17px 15px;position:relative;overflow:hidden}.sidebar-note strong{font-size:12px;font-weight:500;color:#bcd0d8}.sidebar-note p{font-size:11px;color:#7e9aaa;line-height:1.9;margin:7px 0 0}.orbit{position:absolute;width:90px;height:90px;border:1px solid #456270;border-radius:50%;right:-47px;top:-35px}.orbit:after{content:"";position:absolute;width:60px;height:60px;border:1px solid #3b5664;border-radius:50%;top:14px;left:14px}.sidebar-bottom{margin-top:auto}.sidebar-bottom .nav-item{font-size:11px}.workspace{border-top:1px solid #2b4350;margin:17px 8px -5px;padding-top:20px;font-size:11px;display:flex;align-items:center;gap:8px;color:#98afba}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#78a48d;flex-shrink:0}.version{margin-left:auto;font-size:10px;opacity:.6}.shell{margin-left:218px}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px}.breadcrumb{font-size:12px;color:#8a979d}.breadcrumb span{padding:0 14px;color:#c6cfd3}.breadcrumb strong{font-weight:500;color:#5e727d}.top-right{display:flex;align-items:center;gap:24px;font-size:11px;color:#92a0a8}.avatar{width:31px;height:31px;display:grid;place-items:center;background:#eaf0f0;border-radius:50%;color:#4b6873;font-weight:600;font-size:11px}main{padding:34px 36px 25px;max-width:1900px;margin:auto}.page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:29px}.eyebrow{font-size:9px;letter-spacing:2px;color:#9aa8ae;font-weight:650}h1{font-size:27px;font-weight:600;letter-spacing:.5px;margin:5px 0 7px}h2{font-size:22px;font-weight:600;margin:4px 0}h3{font-size:15px;font-weight:600}.page-head p,.dialog-head p{margin:0;color:#8b989f;font-size:12px}.head-actions{display:flex;gap:10px}.button{min-height:39px;border-radius:7px;padding:9px 15px;font-size:12px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}.primary{background:var(--blue);color:#fff;box-shadow:0 2px 3px #123b4910}.primary:hover{background:#1a4c64}.secondary{border:1px solid #dae3e7;background:#fff;color:#5b6e79}.secondary:hover{background:#f7fafb}.button svg{width:16px;height:16px}.icon-button{width:32px;height:32px;display:inline-grid;place-items:center;color:#8b9aa2;border-radius:6px}.icon-button:hover{background:#eef3f5;color:var(--blue)}.text-button{color:var(--blue);font-size:12px;padding:6px 0}.muted{color:var(--muted);font-size:12px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:25px}.stat{background:#fff;border:1px solid var(--line);padding:20px 23px;border-radius:var(--radius);position:relative;min-height:118px}.stat>span{font-size:11px;color:#89979e;display:block}.stat strong{display:block;font-size:29px;font-weight:580;letter-spacing:-.8px;margin-top:7px;font-variant-numeric:tabular-nums}.stat strong small{font-size:11px;color:#9ba7ae;font-weight:400;margin-left:7px;letter-spacing:0}.stat .stat-icon{position:absolute;right:20px;top:20px;color:#8eaab7;background:#f1f6f7;padding:7px;border-radius:7px}.stat .stat-icon svg{width:16px;height:16px}.stat.alert strong{color:var(--red)}.stat.soon strong{color:var(--orange)}.stat-caption{font-size:9px;color:#adb6bc;display:inline;margin-left:9px;font-weight:400;letter-spacing:0}.orders-card{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 2px 3px #16354102}.list-tabs{display:flex;align-items:center;border-bottom:1px solid var(--line);padding:0 22px;gap:24px;height:58px}.list-tabs>button{height:100%;font-size:12px;position:relative;color:#91a0a8;padding:0 2px;white-space:nowrap}.list-tabs>button.active{color:#24566c;font-weight:600}.list-tabs>button.active:after{content:"";position:absolute;bottom:0;height:2px;left:0;right:0;background:#2c677d}.list-tabs>button span{font-size:10px;font-weight:400;margin-left:6px;padding:1px 6px;background:#eef3f5;border-radius:4px;color:#68818f}.list-caption{margin-left:auto;font-size:10px;color:#a1adb4;display:flex;align-items:center;gap:7px}.filters{display:flex;gap:10px;align-items:center;padding:19px 21px}.search{display:flex;align-items:center;border:1px solid #e2e9ed;border-radius:7px;padding:0 11px;height:37px;gap:9px;min-width:200px;flex:1;max-width:395px;color:#9daab2;background:#fff}.search:focus-within{border-color:#8fb3c4;box-shadow:0 0 0 2px #eaf2f5}.search input{border:0;outline:0;width:100%;font-size:11px;min-width:0;color:var(--ink);background:none}.search input::placeholder{color:#a9b4bb}.search svg{width:16px;height:16px}.search button{color:#8498a4;font-size:20px;padding:0}.filters>select,.pagination select{font-size:11px;width:133px;min-height:37px;border:1px solid #e2e9ed;border-radius:7px;background:#fff;color:#748791;padding:0 26px 0 11px;outline:none}.filters>select:focus{border-color:#8fb3c4}.filter-toggle{border:1px solid #e2e9ed;width:37px;height:37px}.extra-filters{padding:0 22px 18px;display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}.extra-filters label{display:flex;flex-direction:column;font-size:10px;color:#8b9ca4;gap:4px}.extra-filters select,.extra-filters input{font-size:11px;border:1px solid #dde6eb;padding:7px;border-radius:6px;color:#526c7a;background:#fff}.active-filter{margin:0 22px 16px;display:flex;gap:8px}.filter-chip{background:#edf4f6;color:#426d80;font-size:10px;padding:4px 9px;border-radius:5px;display:inline-flex;gap:12px;align-items:center}.table-wrap{overflow:auto}.orders-table{border-collapse:collapse;width:100%;white-space:nowrap}.orders-table thead{background:#f7f9fa}.orders-table th{font-size:10px;font-weight:500;color:#95a2ab;padding:13px 13px;text-align:left;border-top:1px solid #f0f3f4;border-bottom:1px solid var(--line)}.orders-table th:first-child{padding-left:23px}.orders-table td{padding:15px 13px;border-bottom:1px solid #f0f3f5;font-size:11px;color:#647983;height:80px}.orders-table tbody tr{cursor:pointer}.orders-table tbody tr:hover{background:#f8fbfc}.orders-table td:first-child{padding-left:22px}.orders-table tr:last-child td{border-bottom:0}.numeric{text-align:right!important;font-variant-numeric:tabular-nums}.product-cell{display:flex;align-items:center;gap:12px;min-width:225px}.thumb{width:46px;height:49px;object-fit:contain;border:1px solid #e9edef;border-radius:6px;background:#fff;flex-shrink:0}.no-image{display:grid;place-items:center;background:#f5f7f8;color:#bcc8ce;border:1px solid #ecf0f2}.no-image svg{width:20px;height:20px}.product-cell strong{font-size:12px;font-weight:550;color:#304c5a;letter-spacing:.1px}.product-description{font-size:10px;color:#a0adb4;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-top:4px}.po-number{font-variant-numeric:tabular-nums;letter-spacing:.4px;color:#476678!important;font-weight:500}.market-pill{font-size:9px;letter-spacing:.2px;border:1px solid #e7ecef;background:#f8fafb;border-radius:4px;padding:3px 7px;color:#7f929e;max-width:96px;display:inline-block;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}.qty{font-weight:550;color:#3f5b6c!important}.blank{color:#adb7bf!important;font-size:10px}.due{font-size:11px;font-variant-numeric:tabular-nums;color:#667f8e}.due-note{font-size:9px;margin-top:4px;color:#b2bcc2}.due-note.overdue{color:#bc7c6e}.due-note.soon{color:#bd955d}.status{font-size:9px;border-radius:4px;padding:4px 8px;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}.status:before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}.status.unplaced{color:#8b9399;background:#f0f3f5}.status.production{color:#537c9b;background:#edf3f8}.status.inspection{color:#b78d53;background:#faf3e9}.status.ready{color:#587f72;background:#edf5f0}.status.picked_up,.status.completed{color:#4e8978;background:#eaf4f0}.pagination{height:69px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 22px;font-size:10px;color:#9aa9b2}.pagination>div{display:flex;align-items:center;gap:12px}.pagination select{height:30px;min-height:30px;width:105px;font-size:10px}#page-number{min-width:36px;text-align:center;font-variant-numeric:tabular-nums}.page-foot{display:flex;justify-content:space-between;font-size:9px;color:#a8b3ba;padding:19px 3px}.error-banner{background:#fff0ee;border:1px solid #f0d9d4;padding:12px 16px;border-radius:8px;color:#9f5b51;margin-bottom:16px;font-size:12px}.loading-cell,.empty-cell{padding:70px 20px!important;text-align:center!important;color:#a3b0b8!important;height:200px!important}.empty-cell strong{font-size:14px;display:block;color:#6b818e;margin-bottom:8px}.styles-toolbar{display:flex;gap:20px;align-items:center;margin:0 0 24px}.style-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:20px}.style-card{border:1px solid var(--line);border-radius:11px;background:#fff;overflow:hidden}.style-photo{height:205px;background:#fbfcfc;padding:14px;display:flex;align-items:center;justify-content:center;cursor:zoom-in;border-bottom:1px solid #f1f4f5}.style-photo img{max-width:100%;max-height:100%;object-fit:contain}.style-photo.empty{color:#a8bac3;cursor:default;flex-direction:column;gap:12px;font-size:11px}.style-content{padding:17px}.style-content strong{font-size:14px}.style-content p{font-size:11px;color:#8e9da6;min-height:34px;margin:8px 0}.style-yarn{font-size:10px;color:#9caab2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.style-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:16px;border-top:1px solid var(--line);padding-top:12px}.style-card-footer span{font-size:10px;color:#8a9da7}.style-actions{display:flex;gap:10px}.style-actions button{font-size:10px;color:var(--blue)}.info-banner{display:flex;gap:10px;align-items:center;font-size:12px;background:#edf4f6;padding:14px 18px;border:1px solid #dce8ed;border-radius:8px;color:#6a8796;margin-bottom:22px}.history-row{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;gap:16px;align-items:center}.history-row:last-child{border:0}.history-icon{background:#edf4f5;border-radius:8px;padding:10px;color:#6091a2}.history-text strong{font-size:13px;font-weight:500}.history-text p{color:#98a7af;font-size:11px;margin:4px 0 0}.history-row>span{margin-left:auto;color:#8296a2;font-size:11px}.backdrop{position:fixed;inset:0;background:#16313f55;z-index:80;backdrop-filter:blur(2px)}.drawer{position:fixed;right:0;top:0;bottom:0;width:min(745px,96vw);background:white;z-index:90;box-shadow:-12px 0 50px #132b3b18;display:flex;flex-direction:column}.drawer-header{padding:23px 27px 16px;border-bottom:1px solid var(--line)}.drawer-top{display:flex;justify-content:space-between;gap:15px}.drawer-top small{font-size:10px;letter-spacing:1px;color:#93a5af}.drawer-top h2{font-size:23px;margin:5px 0 12px}.detail-product{display:flex;gap:16px;margin:5px 0 16px;align-items:center}.detail-product .thumb{width:78px;height:77px;cursor:zoom-in}.detail-product strong{font-size:13px}.detail-product p{font-size:11px;color:#8e9ea8;margin:5px 0;line-height:1.6}.detail-tags{display:flex;gap:8px;align-items:center;font-size:10px;color:#a0afb8}.drawer-tabs{display:flex;gap:27px;padding-top:4px}.drawer-tabs button{font-size:11px;padding:10px 1px;border-bottom:2px solid transparent;color:#91a2ad}.drawer-tabs button.active{border-color:#2d6c84;color:#2d6279;font-weight:600}.drawer-body{overflow-y:auto;padding:22px 27px;flex:1}.drawer-footer{padding:16px 27px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff}.drawer-footer>div{display:flex;gap:10px}.drawer-footer>span{font-size:10px;color:#9bacb6}.section-title{font-size:12px;font-weight:550;margin:4px 0 17px;display:flex;align-items:center;gap:9px}.section-title:before{content:"";width:3px;height:12px;background:#88a8b5;border-radius:3px}.form-section{margin-bottom:26px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}.form-field label{font-size:10px;color:#8e9fa9;display:block;margin-bottom:7px}.form-field input,.form-field select,.form-field textarea{height:38px;border:1px solid #e0e8ec;border-radius:6px;background:white;padding:8px 10px;font-size:12px;color:#486370;width:100%;outline:none}.form-field input:focus,.form-field select:focus{border-color:#87aebf;box-shadow:0 0 0 2px #f0f7fa}.form-field.wide{grid-column:1/-1}.form-field textarea{height:60px;resize:vertical}.field-hint{font-size:10px;color:#a3b1b9;margin:6px 0 0;line-height:1.6}.field-label-row{display:flex;align-items:center;justify-content:space-between}.field-label-row button{font-size:10px;padding:0 0 6px;color:#58869b}.warning-box{background:#fdf7ed;border:1px solid #f2e7d4;color:#ad884f;border-radius:7px;padding:12px 15px;font-size:11px;margin-bottom:20px}.warning-box summary{cursor:pointer}.warning-box ul{padding-left:15px;margin:9px 0 0;font-size:10px;line-height:1.8}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:15px;background:#f5f8f9;border-radius:8px;margin-bottom:23px}.metric-grid span{font-size:9px;color:#96a6af;display:block}.metric-grid strong{font-size:16px;font-weight:550;color:#456b7d;display:block;margin-top:5px;font-variant-numeric:tabular-nums}.metric-grid strong.negative{color:#b56d60}.source-links{display:flex;flex-direction:column;gap:6px;margin-top:15px}.source-links a{font-size:10px;color:#7694a4;text-decoration:underline;text-underline-offset:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.color-group{margin-bottom:20px;border:1px solid var(--line);border-radius:8px;overflow:hidden}.color-group h3{padding:10px 14px;background:#f6f9fa;margin:0;font-size:12px;font-weight:500;display:flex;justify-content:space-between;color:#577788}.color-group h3 span{font-weight:400;font-size:10px;color:#9eafb8}.sku-table{width:100%;border-collapse:collapse}.sku-table th{font-size:9px;color:#a4b0b8;font-weight:400;text-align:left;padding:8px 12px}.sku-table td{font-size:11px;padding:7px 12px;border-top:1px solid #f1f4f5;color:#6d8593}.sku-table input{width:84px;padding:6px 8px;border:1px solid #e4ebee;border-radius:5px;font-size:11px;color:#476c81}.sku-table input[type=date]{width:135px}.change-row{padding:0 0 20px 20px;margin-left:5px;border-left:1px solid #e1e9ee;position:relative}.change-row:before{content:"";width:7px;height:7px;border-radius:50%;position:absolute;left:-4px;top:5px;background:#9db6c4;border:2px solid #fff}.change-row strong{font-size:12px;font-weight:500}.change-row time{font-size:10px;color:#a5b4be;margin-left:12px}.change-details{font-size:10px;color:#8ea2ae;margin-top:7px;line-height:1.9;word-break:break-word}.detail-error{margin-bottom:16px;border-radius:6px;padding:10px;background:#fdf0ed;color:#b26352;font-size:11px}dialog{border:0;padding:0;border-radius:14px;box-shadow:0 24px 100px #183b4c38;color:var(--ink)}dialog::backdrop{background:#16313f66;backdrop-filter:blur(2px)}.import-dialog{width:min(980px,94vw);max-height:88vh}.dialog-head{display:flex;justify-content:space-between;gap:20px;padding:25px 28px 20px;border-bottom:1px solid var(--line)}.dialog-head h2{margin-top:5px}.dialog-body{padding:24px 28px;overflow-y:auto;max-height:64vh}.dialog-footer{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;border-top:1px solid var(--line)}.dialog-footer>div{display:flex;gap:10px}.dialog-footer .muted{font-size:10px}.dropzone{border:1.5px dashed #c6d9e1;background:#f8fbfc;border-radius:10px;display:flex;align-items:center;flex-direction:column;padding:31px 15px;cursor:pointer;gap:9px;color:#638397}.dropzone.dragging{background:#e9f4f7;border-color:#457b94}.dropzone strong{font-size:13px;font-weight:500}.dropzone>span:last-child{font-size:10px;color:#a3b3bd}.upload-cloud{padding:13px;background:#eaf2f5;color:#5f91a8;border-radius:12px;display:inline-flex;margin-bottom:3px}.upload-cloud svg{width:24px;height:24px}.import-summary{display:flex;align-items:center;justify-content:space-between;margin:20px 0 14px;font-size:12px}.update-toggle{font-size:10px;color:#7c929f;display:flex;align-items:center;gap:6px}.preview-table{width:100%;border-collapse:collapse;white-space:nowrap}.preview-table td,.preview-table th{padding:12px 9px;border-bottom:1px solid var(--line);font-size:11px;text-align:left}.preview-table th{font-size:10px;color:#9baab3;background:#f7f9fa;font-weight:400}.preview-table input[type=checkbox]{accent-color:var(--blue)}.import-state{font-size:9px;border-radius:4px;padding:3px 6px;background:#edf5f0;color:#618b73}.import-state.changed{background:#faf1e5;color:#b28c54}.import-state.duplicate{background:#f0f3f5;color:#93a4af}.preview-warnings{font-size:10px;color:#b88b53;white-space:normal;max-width:280px}.import-error{background:#fdf0ee;color:#ad6c5f;padding:10px 13px;border-radius:6px;margin-top:12px;font-size:11px}.import-error strong{display:block;font-weight:500}.busy-text{padding:35px;text-align:center;font-size:12px;color:#7d99a8}.spinner{display:inline-block;width:15px;height:15px;border:2px solid #dbe8ed;border-top-color:#638d9f;border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;margin-right:10px}@keyframes spin{to{transform:rotate(360deg)}}.help-dialog{max-width:650px;width:90vw}.prose{font-size:12px;color:#8196a3;line-height:1.9}.prose h3{font-size:13px;color:#4d6c7d;margin-top:23px}.prose h3:first-child{margin-top:0}.prose p{margin:8px 0 17px}.image-dialog{max-width:92vw;max-height:94vh;background:#fff}.image-dialog>.close-dialog{position:absolute;right:10px;top:10px;background:#ffffffdc;z-index:1}.image-dialog img{display:block;max-width:90vw;max-height:90vh;object-fit:contain;padding:15px}.toast{position:fixed;bottom:28px;left:calc(50% + 109px);transform:translateX(-50%);background:#244957;color:#fff;box-shadow:0 5px 25px #18344022;border-radius:8px;padding:12px 21px;font-size:12px;z-index:150}.toast.error{background:#9b5f53}
@media(min-width:1600px){main{padding-left:48px;padding-right:48px}.product-description{max-width:300px}.orders-table td{padding-top:18px;padding-bottom:18px}.table-wrap{min-height:240px}}
@media(max-width:1200px){.sidebar{width:190px;padding-left:13px;padding-right:13px}.shell{margin-left:190px}.brand{font-size:19px;gap:10px;margin-left:6px}.brand small{font-size:9px}.topbar{padding:0 27px}main{padding:27px 23px}.filters{gap:8px}.filters>select{width:112px}.search{min-width:160px}.stat{padding:17px}.stat strong{font-size:25px}.list-caption{display:none}.toast{left:calc(50% + 95px)}}
@media(max-width:900px){.sidebar{width:74px;padding:25px 12px}.brand{margin:0 0 40px}.brand>span:last-child,.nav-label,.nav-item>span,.sidebar-note,.workspace,.nav-item{font-size:0}.nav-item{padding:14px;justify-content:center}.nav-item i{font-size:14px}.brand-mark{font-size:28px!important;flex-shrink:0}.sidebar-bottom .nav-item{font-size:0}.nav-item.active:before{left:12px}.shell{margin-left:74px}.topbar{height:60px;padding:0 24px}main{padding:24px 20px}.page-head{margin-bottom:22px}.page-head p{max-width:250px}.stats{gap:10px}.stat{padding:16px;min-height:105px}.stat .stat-icon{display:none}.stat strong{font-size:24px}.stat>span{font-size:10px}.filters{flex-wrap:wrap}.search{max-width:none}.filters>select{flex:1}.filters .search{flex-basis:100%}.head-actions .secondary{display:none}.style-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.toast{left:calc(50% + 37px)}}
@media(max-width:600px){.sidebar{width:56px;padding:20px 7px}.brand-mark{width:34px;height:36px;font-size:23px!important}.nav-item{padding:12px 10px}.nav-item.active:before{left:7px}.shell{margin-left:56px}main{padding:22px 13px}.topbar{padding:0 17px}.top-right{gap:10px}.top-right>#today-label{display:none}h1{font-size:23px}.eyebrow{font-size:8px}.page-head p{font-size:10px;max-width:170px}.page-head{gap:8px}.head-actions .button{padding:9px 10px;font-size:10px}.stats{grid-template-columns:repeat(2,1fr)}.stat{min-height:97px}.stat strong{font-size:24px}.list-tabs{gap:19px;padding:0 15px;height:52px}.list-tabs>button{font-size:11px}.filters{padding:15px}.filters>select{font-size:10px;width:80px;padding-left:7px}.pagination{padding:0 13px}.pagination select{display:none}.page-foot>span:last-child{display:none}.drawer{width:100vw}.drawer-header,.drawer-body{padding-left:19px;padding-right:19px}.drawer-tabs{gap:20px}.drawer-footer{padding:14px 18px}.form-grid{gap:13px}.dialog-head,.dialog-body{padding:20px}.dialog-footer{padding:16px 20px}.dialog-footer>span{max-width:140px;line-height:1.5}.style-grid{grid-template-columns:1fr}.style-photo{height:250px}.metric-grid{gap:8px;padding:12px}.metric-grid strong{font-size:14px}.toast{left:50%;max-width:90vw;white-space:nowrap}.history-row{padding:16px;gap:12px}.history-row>span{font-size:10px}.preview-table{min-width:620px}.dropzone>span:last-child{font-size:9px;text-align:center}}

@media(max-width:900px){.brand>span:last-child,.nav-label,.sidebar-note,.workspace,.nav-item>span{display:none}.nav-item{overflow:hidden;white-space:nowrap}.brand{margin-left:0}}
.stat[data-stat]{cursor:pointer}.stat[data-stat]:hover{border-color:#cbdce4;box-shadow:0 3px 12px #163e4d06}

.style-specs{margin:15px 0 20px;padding:12px 14px;border:1px solid var(--line);border-radius:7px;font-size:11px;color:#6b8290}.style-card .style-specs{padding:10px;margin-bottom:0;font-size:10px}.style-specs summary{cursor:pointer;color:#55798d}.style-specs dl{display:grid;grid-template-columns:85px 1fr;gap:7px;margin:13px 0;font-size:10px}.style-specs dt{color:#95a6b0}.style-specs dd{margin:0;overflow-wrap:anywhere}.weight-chips{display:flex;flex-wrap:wrap;gap:7px}.weight-chips span{padding:4px 7px;background:#f2f6f8;border-radius:4px;font-size:10px}.weight-chips strong{font-weight:500;margin-left:5px}.period-note{margin:-12px 0 24px;padding:12px 15px;background:#f5f8f9;border-radius:6px;font-size:11px;color:#688391}.period-note span{display:block;margin-top:4px;font-size:10px;color:#99aab4}
.tracker-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:32px}.tracker-guide article{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px}.tracker-guide article>span{color:#94adb9;font-size:12px;letter-spacing:1px}.tracker-guide h3{font-size:16px;margin:12px 0}.tracker-guide p{font-size:12px;color:#869ba6;line-height:1.9;margin-bottom:20px}.tracker-history-title{font-size:14px;color:#637f8f;margin:15px 0}.tracker-dialog{width:min(1150px,96vw);max-height:94vh}.tracker-dialog .dialog-body{max-height:72vh}.tracker-summary{padding-top:20px}.tracker-summary strong{font-size:13px;overflow-wrap:anywhere}.tracker-summary p{font-size:12px;color:#77909e;margin:6px 0}.tracker-summary .attention{color:#b47e48}.tracker-baseline{font-size:11px;color:#7c99a6;line-height:1.8;padding:12px 15px;background:#f2f7f8;border-radius:7px}.tracker-select-tools{display:flex;align-items:center;flex-wrap:wrap;gap:16px;padding:12px 0 20px;font-size:11px}.tracker-select-tools button{color:var(--blue);padding:0}.tracker-select-tools label{color:#a18461;margin-left:auto}.tracker-select-tools input,.tracker-diff input{accent-color:var(--blue)}.tracker-group{border:1px solid var(--line);border-radius:8px;margin:0 0 20px;overflow:hidden}.tracker-group h3{margin:0;padding:14px 18px;font-size:12px;font-weight:550;background:#f6f9fa;display:flex;justify-content:space-between;gap:15px;color:#557789}.tracker-group h3 span{font-size:10px;font-weight:400;color:#96a9b3}.tracker-diff-scroll{overflow-x:auto}.tracker-diff{border-collapse:collapse;table-layout:fixed;width:100%;font-size:11px}.tracker-diff th{padding:11px 16px;text-align:left;font-size:10px;font-weight:400;color:#94a6b0;border-bottom:1px solid var(--line)}.tracker-diff th:first-child{width:27%}.tracker-diff td{padding:13px 16px;vertical-align:top;border-bottom:1px solid #eef3f5;word-break:break-word;color:#64818f}.tracker-diff tbody tr:last-child td{border:0}.tracker-diff td label{display:flex;align-items:flex-start;gap:8px;color:#567381}.tracker-diff td small{display:block;font-size:10px;color:#bd8452;margin:7px 0 0 21px}.tracker-diff .is-conflict{background:#fff9ef}.tracker-diff .is-clearing{background:#fdf8f6}.empty-value{color:#aebbc2}.line-diff summary{cursor:pointer;color:#3f6d83}.line-diff-scroll{overflow-x:auto;max-height:300px;margin-top:10px}.line-diff table{border-collapse:collapse;min-width:360px;width:100%;font-size:10px}.line-diff table td,.line-diff table th{padding:6px;font-size:9px;white-space:nowrap;border:1px solid #e9eff3}.diff-object{margin:0;font-size:10px;line-height:1.8}.diff-object dt{color:#9aaeb9}.diff-object dd{margin:0 0 8px}.diff-image{height:95px;width:95px;object-fit:contain;background:#f7f9fa;border-radius:6px}.tracker-no-changes{padding:25px;text-align:center;color:#5d8674;font-size:12px}.tracker-dialog .import-error p{margin:5px 0;font-size:10px}.tracker-dialog .dialog-footer{gap:10px}.tracker-dialog .dialog-footer .muted{max-width:40%}
@media(max-width:1150px){.page-head{flex-wrap:wrap}.head-actions{flex-wrap:wrap}.head-actions .button{font-size:11px;padding:9px 12px}}@media(max-width:900px){.head-actions .tracker-entry{display:inline-flex}.tracker-guide{grid-template-columns:1fr}.tracker-guide article{padding:20px}.tracker-guide p{margin-bottom:10px}}@media(max-width:600px){.head-actions{width:100%;gap:7px}.head-actions .button{font-size:10px;flex:1;padding:9px 7px}.tracker-dialog .dialog-head{padding:18px}.tracker-dialog .dialog-head h2{font-size:20px}.tracker-dialog .dialog-head p{font-size:11px;line-height:1.7}.tracker-dialog .dialog-body{padding:16px}.tracker-diff{min-width:600px}.tracker-select-tools label{margin:0}.tracker-group h3{padding:12px}.tracker-dialog .dialog-footer .button{font-size:10px;padding:9px}.tracker-dialog .dialog-footer .muted{font-size:9px}.tracker-dialog .dialog-footer{padding:14px}}
.history-row>.history-icon{margin-left:0}
/* Yarn purchasing workspace */
.y-stats .stat{min-height:135px}.y-stats .stat p{font-size:10px;color:#9aabb4;margin:6px 0 0}.y-tabs{gap:26px}.y-refresh{margin-left:auto!important;color:#6d8b98!important;font-size:10px!important}.y-source{margin-left:auto;font-size:10px}.y-table{border-collapse:collapse;width:100%;font-size:11px}.y-table th{background:#f8fafb;padding:12px 18px;text-align:left;font-size:10px;color:#94a5af;font-weight:400;border-bottom:1px solid var(--line);white-space:nowrap}.y-table td{padding:17px 18px;border-bottom:1px solid #edf2f4;color:#64808f;vertical-align:middle;line-height:1.7}.y-table tr:last-child td{border-bottom:0}.y-table strong{font-weight:550;color:#476879}.y-table .numeric{font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}.y-row-title{font-size:12px;color:#365f72;padding:0;text-align:left;font-weight:550}.y-row-title:hover{text-decoration:underline;text-underline-offset:3px}.y-subline{display:block;color:#99aab4;font-size:10px;line-height:1.7;margin-top:4px;max-width:330px;overflow-wrap:anywhere}.y-orange{color:#b7864f!important}.y-danger{color:#b36454!important}.y-green{color:#4f8b76!important}.y-pill{display:inline-block;border-radius:4px;padding:3px 7px;font-size:10px;white-space:nowrap;background:#edf3f8;color:#64869d}.y-pill.draft,.y-pill.cancelled{background:#f0f3f4;color:#96a5ad}.y-pill.partial{background:#faf3e9;color:#b68a4d}.y-pill.received{background:#edf6f0;color:#578b72}.y-pill.danger{background:#fbeeea;color:#b77565}.y-empty{padding:55px 24px 60px;display:flex;align-items:center;flex-direction:column;text-align:center}.y-empty-icon{background:#f1f6f7;color:#7b9baa;width:54px;height:54px;border-radius:15px;display:grid;place-items:center}.y-empty-icon svg{width:25px;height:25px}.y-empty h3{font-size:15px;color:#5a7888;margin:18px 0 9px}.y-empty p{font-size:11px;color:#99aab4;max-width:450px;margin:0 0 24px;line-height:1.9}.y-reminder-note{display:flex;gap:10px;align-items:center;margin:0 21px 15px;padding:12px 15px;border-radius:6px;background:#f4f8fa;color:#93a7b1;font-size:10px;line-height:1.8}.y-reminders{padding:0 21px 20px}.y-reminder{display:flex;gap:14px;align-items:center;border:1px solid #e6eef2;border-radius:8px;padding:18px;margin-bottom:12px;border-left:3px solid #a5bdc8}.y-reminder.danger{border-left-color:#c58778;background:#fdfaf9}.y-reminder.warning{border-left-color:#d2b27f;background:#fffdf8}.y-reminder-icon{color:#8fa9b5;display:flex}.y-reminder.danger .y-reminder-icon{color:#c08c7c}.y-reminder.warning .y-reminder-icon{color:#c5a975}.y-reminder strong{display:block;font-size:12px;font-weight:500;color:#617b8a}.y-reminder small{display:block;color:#9faeb6;margin-top:6px;font-size:10px}.y-reminder>button{margin-left:auto;flex-shrink:0}.yarn-dialog{width:min(1080px,96vw);max-height:94vh}.yarn-dialog .dialog-head h2{font-size:22px;overflow-wrap:anywhere}.yarn-dialog .dialog-head p{font-size:11px;margin-top:6px;line-height:1.7}.yarn-dialog .dialog-body{max-height:72vh}.y-field{display:flex;flex-direction:column;gap:7px;font-size:11px;color:#8da1ac;min-width:0}.y-field input,.y-field select,.y-field textarea,.y-table input[type=number],.y-manual-row input,.y-manual-row select{font-size:12px;color:#486b7b;border:1px solid #dce7ec;background:#fff;border-radius:6px;padding:9px 10px;width:100%;outline:none;min-width:0}.y-field textarea{min-height:70px;resize:vertical;line-height:1.8}.y-field input:focus,.y-field select:focus,.y-field textarea:focus,.y-table input:focus{border-color:#8ab0c1;box-shadow:0 0 0 2px #edf5f8}.y-field.wide{grid-column:1/-1}.yarn-dialog .form-grid{margin-bottom:22px}.y-pick-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:20px 0 14px}.y-pick-head h3{font-size:13px}.y-pick-head h3 span{font-size:10px;color:#8aa0ad;margin-left:8px}.y-picker-results{max-height:330px;overflow:auto;border:1px solid var(--line);border-radius:7px}.y-picker-results .y-table th{position:sticky;top:0}.y-picker-results .y-table td{padding:10px 14px}.y-picker-results input[type=checkbox],.yarn-dialog input[type=checkbox],.yarn-dialog input[type=radio]{accent-color:var(--blue)}.y-chips{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.y-chips>button,.y-chips>span{font-size:10px;background:#eef4f6;color:#71909f;border-radius:5px;padding:5px 9px;overflow-wrap:anywhere}.y-mini-empty{padding:22px;font-size:11px;color:#9eafb8;text-align:center;line-height:1.8}.y-calc-options{display:flex;gap:25px;padding:20px 0;font-size:12px;color:#6f8c9a}.y-calc-options label{display:flex;align-items:center;gap:7px}.y-form-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:25px;margin-top:20px;border-top:1px solid var(--line)}.y-form-actions>span{font-size:11px;color:#9caeb8}.y-manual-row{display:grid;grid-template-columns:1.6fr 2fr 1.2fr 1fr 28px;gap:8px;margin:12px 0}.y-selected-fixed{padding:15px;background:#f3f7f9;border-radius:7px;color:#698796;font-size:12px;line-height:1.9}.y-calculation{border:1px solid var(--line);border-radius:7px;margin:22px 0;color:#6c8998;font-size:11px;padding:15px}.y-calculation summary{cursor:pointer;color:#4b7285}.y-calculation article{padding:16px 0;border-bottom:1px solid var(--line)}.y-calculation p{font-size:10px;color:#96aab5;line-height:1.8}.y-meta-summary{display:flex;gap:16px;flex-wrap:wrap;padding:15px;background:#f5f9fa;border-radius:7px;margin-top:20px;font-size:12px;color:#7895a4}.y-meta-summary p{width:100%;font-size:11px;margin:0}.y-detail-top{display:flex;gap:26px;align-items:center;flex-wrap:wrap;padding:18px;background:#f5f8f9;border-radius:8px;font-size:11px;color:#8ea2af}.y-detail-top strong{font-size:15px;font-weight:550;color:#557a8d;display:block;margin-top:5px}.y-note{font-size:11px;color:#91a7b3;line-height:1.9;white-space:pre-wrap}.y-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 28px}.y-linked-order{padding:16px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--line)}.y-linked-order .y-subline{max-width:none}.y-linked-order .text-button{flex-shrink:0}.y-receipt-item{border:1px solid var(--line);border-radius:9px;margin-top:20px;overflow:hidden}.y-receipt-item>.y-linked-order{padding:16px 18px;background:#f8fafb}.y-receipt-item .y-linked-order strong{font-size:12px;color:#587b8e}.y-void{opacity:.6}.y-void td:nth-child(2){text-decoration:line-through}.y-history{padding:14px 0;border-bottom:1px solid var(--line);font-size:11px;color:#809caa}.y-history strong{font-weight:500}.y-history time{color:#adbac1;margin-left:20px;font-size:10px}.y-success{padding:15px;background:#edf6f1;border-radius:7px;color:#5d8c76;font-size:12px}.y-production-info{font-size:11px;line-height:1.9;margin-top:25px}.order-yarn-summary{padding:16px;border:1px solid var(--line);border-radius:8px;margin-bottom:22px}.order-yarn-summary p{font-size:11px;color:#7e98a5}
@media(max-width:1000px){.y-source{display:none}.y-tabs{gap:19px}.y-tabs button{font-size:11px}.y-table{min-width:730px}.yarn-dialog .y-table{min-width:600px}}@media(max-width:600px){.y-stats .stat{min-height:120px}.y-stats .stat strong{font-size:22px}.y-stats .stat p{font-size:9px}.y-tabs{gap:18px;overflow-x:auto;height:55px;padding:0 14px}.y-tabs button{font-size:10px}.y-tabs button span{display:none}.y-tabs .y-refresh{display:none}.y-reminder{padding:13px;gap:10px;flex-wrap:wrap}.y-reminder>div{flex:1}.y-reminder>button{margin-left:26px}.y-reminder-note{align-items:flex-start;margin:0 14px 14px;font-size:9px}.y-reminders{padding:0 14px 14px}.yarn-dialog .dialog-body{padding:18px}.yarn-dialog .dialog-head{padding:20px}.yarn-dialog .dialog-footer{padding:14px 18px;gap:10px}.yarn-dialog .dialog-footer>.muted{max-width:45%;font-size:9px}.yarn-dialog .dialog-footer .button{font-size:10px;padding:8px}.y-pick-head{flex-wrap:wrap;gap:8px}.y-pick-head .search{flex-basis:100%;max-width:none}.y-calc-options{gap:13px;font-size:11px}.y-manual-row{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:15px}.y-manual-row select{width:100%}.y-manual-row input{width:45%;flex:1}.y-detail-top{gap:20px}.y-toolbar .button{font-size:10px;padding:8px}.y-linked-order{gap:10px}.y-linked-order .button{font-size:10px}.y-form-actions{gap:10px}.y-form-actions>span{max-width:45%;font-size:10px}.y-dialog .form-grid{gap:13px}.y-history time{display:block;margin:5px 0 0}}
/* Local account access */
.auth-pending>.sidebar,.auth-pending>.shell,.auth-pending>#drawer,.auth-pending>#drawer-backdrop{display:none}.auth-screen{min-height:100vh;background:linear-gradient(120deg,#172f3d 0%,#233f4e 37%,#f1f5f6 37%,#f1f5f6 100%);display:flex;justify-content:center;align-items:center;padding:45px 20px}.auth-card{width:470px;max-width:100%;border:1px solid #e2eaed;border-radius:18px;padding:38px 42px 28px;background:#fff;box-shadow:0 22px 80px #132d3b20}.auth-brand{display:flex;align-items:center;gap:13px;color:#284f63;margin-bottom:39px}.auth-brand .brand-mark{width:39px;height:43px;border-color:#7a9aaa;color:#294f61}.auth-brand .brand-mark span{border-color:#fff}.auth-brand strong{font-size:21px;letter-spacing:2px;font-weight:650}.auth-brand small{display:block;font-size:9px;letter-spacing:2px;color:#93a8b4;margin-top:3px;font-weight:400}.auth-eyebrow{font-size:9px;color:#9bafb8;letter-spacing:2px}.auth-card h1{font-size:25px;color:#2b4c5c;margin-top:7px}.auth-subtitle{font-size:12px;color:#8ca1ad;line-height:1.9;margin:8px 0 25px}.auth-label{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#7e97a5;margin-bottom:17px}.auth-label input{width:100%;padding:11px 12px;min-height:42px;background:white;border:1px solid #dce6eb;border-radius:6px;outline:none;color:#416576;font-size:13px}.auth-label input:focus{border-color:#79a7bc;box-shadow:0 0 0 3px #edf5f8}.auth-label small{font-size:9px;color:#a4b4bd;min-height:0}.auth-label small:empty{display:none}.auth-label input:disabled{background:#f5f8fa;color:#8da2ae}.auth-submit{width:100%;min-height:43px;margin-top:6px}.auth-note{font-size:11px;color:#9baeb7;line-height:1.9;margin:17px 0 0}.auth-owner-note{font-size:10px;line-height:1.9;color:#809eac;background:#f1f6f8;padding:13px 15px;border-radius:7px;margin:18px 0}.auth-footer{display:flex;align-items:center;justify-content:center;gap:7px;margin:30px 0 0;border-top:1px solid #edf2f4;padding-top:20px;font-size:9px;color:#a9b9c2}.account-button{display:flex;gap:10px;align-items:center;font-size:11px;color:#7a94a1;padding:0}.account-button:hover .avatar{background:#dce9ee}.account-dialog{width:min(480px,94vw)}.account-dialog .dialog-head p{font-size:11px}.account-dialog .dialog-body{max-height:75vh}.account-grants{display:flex;gap:6px;flex-wrap:wrap}.account-grants span{background:#edf4f7;color:#65899b;border-radius:4px;padding:4px 7px;font-size:10px}.account-grants .owner{background:#edf5f0;color:#5f8c78}.account-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px}.users-overview{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:22px}.users-overview h3{font-size:15px;color:#4e7183;margin:0 0 8px}.users-overview p{font-size:11px;color:#97aab5;margin:0}.users-table{width:100%;border-collapse:collapse;font-size:11px;min-width:800px}.users-table th{font-size:10px;color:#9aacb6;font-weight:400;text-align:left;padding:14px 20px;background:#f8fafb;border-bottom:1px solid var(--line)}.users-table td{padding:20px;color:#7893a2;border-bottom:1px solid var(--line)}.users-table td strong{font-size:12px;color:#54788b;font-weight:550}.users-table td small{display:block;font-size:10px;color:#a3b4be;margin-top:5px}.users-table td>.text-button{margin-right:16px;font-size:10px;white-space:nowrap}.role-guide{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin:25px 0}.role-guide article{padding:23px;background:#fff;border:1px solid var(--line);border-radius:11px}.role-guide article>span{font-size:12px;color:#7ba0b0;background:#eef5f7;border-radius:5px;display:inline-grid;place-items:center;width:25px;height:25px}.role-guide h3{font-size:13px;color:#587d8f;margin:14px 0 9px}.role-guide p{font-size:11px;color:#96acb8;line-height:1.9;margin:0}.user-dialog{width:min(590px,94vw);max-height:94vh}.user-dialog .dialog-body{max-height:74vh}.user-dialog .dialog-head p{font-size:11px;line-height:1.8}.grants-fieldset{border:1px solid var(--line);border-radius:8px;padding:16px;margin:22px 0}.grants-fieldset legend{color:#7e9aa9;font-size:12px;padding:0 6px}.grants-fieldset legend small{font-size:9px;color:#acbac3;display:block}.grant-shortcuts{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:17px}.grant-shortcuts button{padding:5px 9px;background:#f0f6f8;border-radius:5px;font-size:10px;color:#698fa3}.grant-shortcuts button:hover{background:#e0edf2}.grant-choice{display:flex;gap:9px;align-items:center;font-size:12px;color:#6f91a3;margin:12px 0}.grant-choice input{accent-color:var(--blue);width:15px;height:15px}.active-account{margin:22px 0}.account-events{padding:18px;background:#fff;border:1px solid var(--line);border-radius:9px;margin-top:25px;color:#6d90a3;font-size:12px}.account-events summary{cursor:pointer}.account-event{display:flex;gap:20px;align-items:center;padding:14px 5px;border-bottom:1px solid var(--line);font-size:11px}.account-event strong{font-weight:500}.account-event span{color:#97aebb;margin-left:auto}.account-event time{font-size:10px;color:#a9bac4}.form-field input:disabled,.form-field select:disabled,.form-field input[readonly],.sku-table input:disabled{background:#f7f9fa;color:#8fa4af;box-shadow:none;cursor:default}.sidebar-bottom [data-nav=users]{font-size:11px}.top-right .avatar{font-size:10px;letter-spacing:0}
@media(max-width:900px){.sidebar-bottom [data-nav=users]{font-size:0}.account-button>#account-name{display:none}.role-guide{grid-template-columns:1fr}.users-overview{align-items:flex-start}.users-overview p{line-height:1.8}}@media(max-width:600px){.auth-screen{padding:20px 16px;background:#f1f5f6}.auth-card{padding:29px 25px 25px}.auth-brand{margin-bottom:30px}.auth-card h1{font-size:23px}.users-overview{flex-direction:column;gap:15px}.users-overview>.button{width:100%}.account-event{flex-wrap:wrap;gap:7px}.account-event time{width:100%}.user-dialog .dialog-head,.user-dialog .dialog-body{padding:20px}.grants-fieldset{padding:13px}.account-button .avatar{width:30px;height:30px}}
.auth-checking>.shell,.auth-checking>.sidebar{visibility:hidden}

/* PO lifecycle: grey, half-colour, then full-colour at each milestone. */
.order-flow{padding:14px 14px 12px;margin:17px 0 9px;background:#f8fbfc;border:1px solid #e3ebef;border-radius:11px}.order-flow-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 2px 14px}.order-flow-head h3{font-size:12px;font-weight:600;color:#426372;margin:0}.order-flow-head>span{font-size:10px;color:#8b9faa}.order-flow-scroll{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#d5e3e9 transparent}.order-flow-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;margin:0;gap:24px}.order-flow-step{--flow-colour:#3f839a;--flow-tint:#e4f1f6;position:relative;min-width:0;text-align:center}.order-flow-step[data-order-stage=factory]{--flow-colour:#b78846;--flow-tint:#f9efdf}.order-flow-step[data-order-stage=yarn]{--flow-colour:#438c96;--flow-tint:#e2f1f3}.order-flow-step[data-order-stage=inspection]{--flow-colour:#8174b2;--flow-tint:#eee9f7}.order-flow-step[data-order-stage=shipping]{--flow-colour:#528b70;--flow-tint:#e7f3eb}.order-flow-node{display:flex;flex-direction:column;align-items:center;width:100%;padding:2px 0 5px;border-radius:7px;line-height:1.6;color:#708996}.order-flow-node:hover{background:#edf4f7}.order-flow-node:focus-visible{outline:2px solid #80aaba;outline-offset:3px}.order-flow-symbol{position:relative;display:block;width:52px;height:52px;margin-bottom:8px}.order-flow-symbol-base,.order-flow-symbol-colour{position:absolute;inset:0;display:grid;place-items:center;border:1px solid #dce6eb;border-radius:50%;color:#b0bec6;background:#f1f5f7}.order-flow-symbol-colour{color:var(--flow-colour);background:var(--flow-tint);border-color:var(--flow-colour);clip-path:inset(100% 0 0 0)}.order-flow-symbol svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}.order-flow-step.half .order-flow-symbol-colour{clip-path:inset(50% 0 0 0)}.order-flow-step.done .order-flow-symbol-colour{clip-path:inset(0)}.order-flow-check{position:absolute;right:-1px;bottom:-1px;width:16px;height:16px;display:grid;place-items:center;border:2px solid white;border-radius:50%;color:white;background:var(--flow-colour)}.order-flow-check svg{width:10px;height:10px;stroke-width:2.4}.order-flow-label{font-size:11px;font-weight:550;color:#617e8c;white-space:nowrap}.order-flow-state{display:block;font-size:10px;line-height:1.6;color:#98aab4;margin-top:3px;min-height:16px;white-space:nowrap}.order-flow-step.half .order-flow-state,.order-flow-step.done .order-flow-state{color:var(--flow-colour)}.order-flow-step.needs-attention .order-flow-state{color:#b66b5a;background:#fcf0ec;padding:0 5px;border-radius:3px}.order-flow-details{display:grid;gap:1px;max-width:100%;height:31px;font-size:9px;color:#99aab4;line-height:1.6;margin-top:4px;text-align:center;overflow:hidden}.order-flow-details>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;font-variant-numeric:tabular-nums}.order-flow-arrow{position:absolute;right:-19px;top:16px;color:#b6c8d1;pointer-events:none}.order-flow-arrow svg{width:15px;height:15px;stroke-width:1.5}.order-flow-legend{display:flex;align-items:center;gap:12px;border-top:1px solid #e6eef2;padding-top:9px;margin-top:9px;color:#95a7b1;font-size:9px}.order-flow-legend>span{display:flex;align-items:center;gap:4px;white-space:nowrap}.order-flow-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;border:1px solid #ccdbe3;background:#e3ebef}.order-flow-legend i.half{background:linear-gradient(to bottom,#e3ebef 50%,#6497aa 50%);border-color:#9bb9c6}.order-flow-legend i.done{background:#6497aa;border-color:#6497aa}.order-flow-legend small{font-size:9px;margin-left:auto;line-height:1.6;text-align:right}.drawer-header,.drawer-footer{flex-shrink:0}.drawer-body{min-height:0}.drawer-body .form-section{scroll-margin-top:5px}
@media(max-width:600px){.order-flow{padding:12px 10px;margin:13px 0 7px}.order-flow-stages{min-width:565px;gap:18px}.order-flow-legend{gap:10px;flex-wrap:wrap}.order-flow-legend small{width:100%;text-align:left;margin-left:0}.order-flow-head>span{font-size:9px}.order-flow-scroll{padding-bottom:5px}.order-flow-details{font-size:9px}.order-flow-head{margin-bottom:10px}}
@media(max-height:650px){.drawer{display:block;overflow-y:auto}.drawer-body{overflow:visible}.drawer-footer{position:sticky;bottom:0;z-index:3}.order-flow{margin-top:10px}}

/* Expand PO entry without keeping the product and progress summary fixed. */
.drawer-content{display:contents}.drawer-top{padding:23px 27px 0;flex-shrink:0}.drawer-title{min-width:0}.drawer-top-actions{display:flex;align-items:flex-start;gap:10px;flex-shrink:0}.drawer-top-actions .button{font-size:11px;padding:9px 12px;gap:7px;white-space:nowrap}.drawer-top-actions .button svg{width:15px;height:15px}.drawer-header{padding-top:0;padding-bottom:6px;border-bottom:0}.drawer-tabs{padding:4px 27px 0;border-bottom:1px solid var(--line);flex-shrink:0}.drawer.full-page-entry{left:0;width:100%;display:flex;overflow:hidden}.full-page-entry .drawer-top{align-items:center;padding:14px 32px;border-bottom:1px solid var(--line);background:white}.full-page-entry .drawer-title{display:flex;align-items:center;gap:16px}.full-page-entry .drawer-top h2{font-size:21px;margin:0}.full-page-entry .drawer-top-actions{align-items:center}.full-page-entry .drawer-content{display:block;flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scroll-padding-top:48px}.full-page-entry .drawer-header,.full-page-entry .drawer-body{max-width:1280px;margin-inline:auto;width:100%;padding-left:32px;padding-right:32px}.full-page-entry .drawer-header{padding-top:20px}.full-page-entry .drawer-tabs{position:sticky;top:0;z-index:3;background:white;padding-left:max(32px,calc((100% - 1280px)/2 + 32px));padding-right:32px}.full-page-entry .drawer-body{overflow:visible;flex:none;min-height:calc(100% - 48px)}.full-page-entry .drawer-body .form-section,.full-page-entry .detail-error{scroll-margin-top:48px}.full-page-entry .drawer-footer{position:static;padding-left:32px;padding-right:32px}.full-page-entry .order-flow{margin-top:12px}
@media(min-width:1050px){.full-page-entry .drawer-header{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(550px,1.7fr);align-items:center;gap:28px;padding-bottom:20px}.full-page-entry .detail-product{margin:0;align-items:flex-start}.full-page-entry .order-flow{margin:0}.full-page-entry .detail-product>div:last-child{min-width:0}.full-page-entry .detail-product p{line-height:1.8}}
@media(max-width:600px){.drawer-top{padding-left:19px;padding-right:19px;gap:8px}.drawer-top h2{font-size:20px}.drawer-top-actions{gap:6px}.drawer-top-actions .button{font-size:10px;padding:8px 9px;gap:5px}.drawer-tabs{padding-left:19px;padding-right:19px}.full-page-entry .drawer-top{padding:12px 19px}.full-page-entry .drawer-title small{display:none}.full-page-entry .drawer-top h2{font-size:19px}.full-page-entry .drawer-header,.full-page-entry .drawer-body,.full-page-entry .drawer-tabs,.full-page-entry .drawer-footer{padding-left:19px;padding-right:19px}}