@charset "UTF-8";
:root{font-family:"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif;color:#233630;background:#f4f6f7;font-size:16px;font-synthesis:none;--green:#183e33;--green-light:#e5f0e9;--border:#e5e9e8;--muted:#7a8882;--red:#bd5146;--amber:#ac711d}
html,body{overscroll-behavior-x:none}
.dye-status-panel{margin:22px 0;padding:18px;border:1px solid #cbded1;border-radius:10px;background:#f5faf6}.dye-status-panel .section-head{flex-wrap:wrap}.dye-status-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:16px}.dye-status-option{border:1px solid #cddbd0;background:white;border-radius:8px;min-height:58px;padding:10px 5px;font-size:15px;font-weight:600}.dye-status-option:hover{border-color:var(--green);background:var(--green-light)}.dye-status-option.selected{background:var(--green);color:white;border-color:var(--green)}.dye-status-option small{display:block;margin-top:4px;font-size:11px;font-weight:400}.dye-status-panel .form-error{margin-top:10px}:where(html[data-layout="mobile"]) .dye-status-panel{padding:12px}:where(html[data-layout="mobile"]) .dye-status-options{grid-template-columns:repeat(3,minmax(0,1fr))}:where(html[data-layout="mobile"]) .dye-status-option{min-height:56px;font-size:14px}
.daily-summary{white-space:normal;line-height:1.7;max-width:280px}.daily-checklist{margin:20px 0;padding:16px;border:1px solid var(--border);border-radius:8px;background:#f8faf7}.daily-checklist ul{list-style:none;margin:12px 0 0;padding:0}.daily-checklist li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-size:14px;flex-wrap:wrap}.daily-checklist .form-help{margin-top:8px}.daily-checklist strong{font-weight:500}
.role-checks{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.role-choice{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid var(--border);border-radius:7px;background:#fff;font-size:14px;cursor:pointer}.role-choice input{width:auto;margin:0;accent-color:var(--green)}
.login-divider{display:flex;align-items:center;gap:12px;margin:24px 0 4px;color:#87968d;font-size:12px}.login-divider:before,.login-divider:after{content:"";height:1px;background:#e1e7e2;flex:1}.login-divider span{white-space:nowrap}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible{outline:3px solid #45a686;outline-offset:3px}a{color:inherit}input,select,textarea{min-width:0;border:1px solid #dbe1de;border-radius:7px;background:white;color:#263a31;padding:11px 12px;font-size:14px;outline:none}input:focus,select:focus,textarea:focus{border-color:#4a8c70;box-shadow:0 0 0 3px #dbece2}input[type=file]{width:100%}textarea{resize:vertical;min-height:104px;line-height:1.8}select{cursor:pointer}h1,h2,h3,p{margin:0}h1{font-size:30px;letter-spacing:.02em;font-weight:650;line-height:1.5}h2{font-size:18px;font-weight:650}h3{font-size:16px}p{line-height:1.8}small{font-size:12px}button{border:0;background:none;color:inherit}a{text-decoration:none}.icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle}.button{display:inline-flex;gap:8px;justify-content:center;align-items:center;padding:11px 17px;border-radius:7px;min-height:42px;font-size:14px;font-weight:600;white-space:nowrap}.primary{background:var(--green);color:#fff}.primary:hover{background:#275444}.secondary{border:1px solid #d9e1db;background:#fff}.secondary:hover{background:#f0f5f2}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:7px}.icon-button:hover{background:#ffffff14}.text-button{color:#39775e;font-size:14px}.text-button:hover{text-decoration:underline}.full{width:100%}.muted{color:var(--muted);font-size:14px}.eyebrow{font-size:12px;letter-spacing:.1em;color:#75877e;margin-bottom:8px}.red-text{color:var(--red)!important}.orange-text{color:var(--amber)}.boot{padding:100px 30px;text-align:center}.workspace{display:flex;min-height:100vh}.sidebar{width:222px;position:fixed;inset:0 auto 0 0;background:#153b31;color:#d9e6dd;display:flex;flex-direction:column;padding:31px 17px 14px;z-index:10}.brand{display:flex;align-items:center;gap:10px;padding:0 13px}.brand img{height:41px;width:41px}.brand>span{font-size:25px;font-weight:650;line-height:1.2;letter-spacing:.09em;color:#fff}.brand small{display:block;font-size:11px;font-weight:400;letter-spacing:.15em;margin-top:7px;color:#b2c5ba}.workspace-label{font-size:12px;color:#9bb5a7;margin:42px 13px 22px;line-height:1.8}.workspace-label span{display:block;font-size:10px;letter-spacing:.13em;color:#6a927e;margin-top:3px}.nav-item{display:flex;width:100%;align-items:center;gap:12px;font-size:14px;text-align:left;padding:13px 15px;border-radius:7px;margin-bottom:6px;color:#b8ccbf}.nav-item:hover{background:#ffffff0b}.nav-item.active{background:#e2edc4;color:#244b38;font-weight:650}.nav-item b{margin-left:auto;font-size:12px;padding:1px 6px;background:#ffffff15;border-radius:4px}.nav-item.active b{background:#d0ddb0}.nav-divider{height:1px;background:#ffffff14;margin:23px 12px}.sidebar-bottom{margin-top:auto;padding-top:36px}.demo-badge{margin:0 7px 17px;padding:10px;text-align:center;font-size:12px;color:#c7d5b0;border:1px solid #ffffff20;border-radius:6px}.user-card{display:flex;align-items:center;gap:10px;padding:14px 6px 0;border-top:1px solid #ffffff17}.avatar,.top-avatar,.mini-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#dce9de;color:#2f5745;flex-shrink:0}.avatar{width:37px;height:37px;font-size:14px}.user-card strong{font-size:14px;display:block;color:#edf4ef}.user-card small{display:block;margin-top:4px;color:#96b1a0}.user-card .icon-button{margin-left:auto}.workspace-main{width:calc(100% - 222px);margin-left:222px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 34px;gap:20px}.breadcrumbs{font-size:13px;color:#8a9690}.breadcrumbs span{padding:0 14px;color:#b1bcb5}.breadcrumbs strong{color:#45574c;font-weight:500}.topbar-right{display:flex;align-items:center;gap:22px}.today{font-size:12px;color:#7d8a82}.top-avatar{height:31px;width:31px;font-size:13px}.notify{position:relative}.notify i{position:absolute;top:4px;right:5px;background:#b88439;width:5px;height:5px;border-radius:50%}.main-content{padding:29px 32px 40px;max-width:1720px;width:100%;margin:auto;flex:1}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.page-heading p{color:#7b8982;font-size:14px;margin-top:5px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;margin-bottom:25px}.stat{background:#fff;border:1px solid var(--border);border-radius:10px;text-align:left;padding:19px 20px 16px;transition:transform .15s,border-color .15s}.stat:hover{transform:translateY(-2px);border-color:#b7cdc0}.stat-top{display:flex;justify-content:space-between;font-size:14px;color:#64776a;gap:5px}.stat-top .icon{color:#789e86;background:#f2f7f3;box-sizing:content-box;padding:7px;border-radius:8px;margin-top:-5px}.stat strong{font-size:40px;display:block;font-weight:550;letter-spacing:-1px;margin:8px 0 13px;line-height:1}.stat strong small{font-size:12px;font-weight:400;color:#90a095;margin-left:8px}.stat-hint{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#8b9890;border-top:1px solid #f0f3f1;padding-top:12px;gap:6px}.stat-hint .icon{width:14px;height:14px}.stat-alert strong{color:#b25749}.stat-alert .stat-top .icon{color:#b27764;background:#fbf2ec}.pipeline{border:1px solid var(--border);background:#fff;border-radius:10px;padding:20px 21px;margin-bottom:25px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.section-head h2{font-size:16px}.section-head .muted{font-size:12px}.pipeline-steps{display:flex;margin-top:22px;align-items:stretch;gap:1px}.pipeline-step{display:flex;align-items:center;gap:9px;flex:1;padding:8px 2px;border-radius:5px;text-align:left;font-size:13px;white-space:nowrap}.pipeline-step.selected{background:#e6f1e8}.step-index{display:flex;justify-content:center;align-items:center;background:#eef4ee;border:1px solid #dce7dc;color:#62806a;width:27px;height:27px;border-radius:50%;font-size:12px}.pipeline-step small{display:block;color:#8c998f;font-size:12px;margin-top:5px}.pipeline-step>.icon{color:#cbd6ce;width:15px;height:15px;margin-left:auto;margin-right:4px}.products-panel{border:1px solid var(--border);border-radius:10px;background:#fff;overflow:hidden}.products-panel>.section-head{padding:22px 22px 0}.count{font-size:12px;color:#758678;background:#edf3ee;padding:2px 7px;border-radius:5px;margin-left:6px;font-weight:500}.table-toolbar{padding:18px 21px 17px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}.filter-tabs{display:flex;gap:4px;flex-wrap:wrap}.filter-tab{font-size:13px;padding:7px 10px;color:#7e8a82;border-radius:5px;white-space:nowrap}.filter-tab.selected{background:#edf3ec;color:#345d42;font-weight:600}.table-search{display:flex;align-items:center;gap:10px}.search-field{display:flex;align-items:center;position:relative}.search-field .icon{width:16px;height:16px;position:absolute;left:11px;color:#9aa69e}.search-field input{padding:9px 10px 9px 33px;width:230px;font-size:12px;background:#fbfcfb}.table-search select{font-size:12px;padding:9px 8px;max-width:140px;background:#fbfcfb}.table-scroll{overflow-x:auto}.product-table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap;font-size:14px}.product-table thead{background:#f7f9f7;color:#8b968e}.product-table th{font-size:12px;font-weight:500;padding:13px 18px}.product-table td{padding:16px 18px;border-bottom:1px solid #eef1ee;vertical-align:middle}.product-table th:first-child,.product-table td:first-child{padding-left:22px}.product-table tbody tr:hover{background:#fbfcfa}.product-link{display:flex;text-align:left;gap:13px;align-items:center;padding:0;max-width:330px}.product-link strong{font-size:14px;font-weight:600;display:block;white-space:normal;line-height:1.5}.product-link small{display:block;color:#8d9a90;margin-top:6px;font-size:12px}.photo-empty,.product-photo{height:51px;width:46px;border-radius:6px;object-fit:cover;flex-shrink:0}.photo-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#edf2ef;border:1px dashed #d5dfd6;color:#a1afa3;gap:3px}.photo-empty .icon{width:19px;height:19px}.photo-empty span{font-size:10px}.urgent-tag{font-size:10px;font-weight:500;background:#f7eee5;color:#b08a50;border-radius:3px;padding:2px 4px;white-space:nowrap;vertical-align:middle}.stage-badge{display:inline-flex;align-items:center;padding:4px 9px;background:#edf3ed;color:#658364;border-radius:4px;font-size:12px;white-space:nowrap}.stage-dyeing{background:#edeafa;color:#8572a8}.stage-ordered{background:#f0f2f4;color:#75818b}.stage-knitting{background:#eaf0fa;color:#6181b2}.stage-greige_done{background:#f8efe0;color:#ac8a4c}.stage-finishing{background:#e7f1f0;color:#5c9390}.stage-setting{background:#f8eee5;color:#b18a62}.stage-completed{background:#e3eee4;color:#548256}.cell-sub{display:block;margin-top:7px;color:#92a093;font-size:12px}.owner{display:inline-flex;align-items:center;gap:7px;font-size:13px}.mini-avatar{width:24px;height:24px;font-size:10px;background:#eef0e6;color:#929767}.tiny-tag{font-size:10px;border-radius:3px;background:#f8ece8;padding:2px 4px}.next-cell{max-width:210px;min-width:130px}.next-cell>span{display:block;max-width:200px;overflow:hidden;text-overflow:ellipsis;font-size:13px}.next-cell .icon{width:14px;height:14px;margin-right:5px}.row-action{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#517e5b;padding:7px 2px;white-space:nowrap}.row-action .icon{width:14px;height:14px}.table-footer{display:flex;justify-content:space-between;padding:15px 22px;font-size:12px;color:#8c998f}.app-footer{display:flex;justify-content:space-between;padding:0 32px 22px;color:#a6afa9;font-size:11px}.empty-state{padding:56px 25px;text-align:center}.empty-state>.icon{width:37px;height:37px;color:#91af93;background:#eef5ee;padding:8px;box-sizing:content-box;border-radius:50%;margin-bottom:15px}.empty-state p{font-size:14px;color:#8b988c;margin:12px 0 19px}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#203e32;color:white;padding:13px 22px;border-radius:8px;z-index:1000;font-size:14px;transition:opacity .15s,transform .15s;max-width:90vw;box-shadow:0 6px 25px #152d2420}#toast.visible{opacity:1;transform:translate(-50%,0)}dialog{border:0;padding:0;color:inherit;background:#fff;box-shadow:0 25px 100px #14352930;max-height:92vh;width:min(600px,calc(100% - 32px));border-radius:14px}dialog::backdrop{background:#142b2855;backdrop-filter:blur(2px)}dialog.drawer{margin:0 0 0 auto;height:100dvh;max-height:100dvh;width:min(830px,100%);border-radius:0;overflow-y:auto}.modal-head{padding:24px 28px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:18px;position:sticky;top:0;background:#fff;z-index:3}.modal-head h2{font-size:21px}.modal-head .icon-button{color:#839086}.detail-body{padding:26px 28px}.detail-intro{display:flex;gap:17px;align-items:center}.photo-empty.large,.product-photo.large{width:78px;height:89px}.detail-intro h3{font-size:15px;margin:10px 0 5px}.detail-intro p{font-size:12px;color:#95a094}.detail-intro .button{margin-left:auto}.detail-progress{display:flex;margin:30px 0 27px;gap:2px}.detail-progress>div{flex:1;text-align:center;position:relative}.detail-progress>div:before{content:"";height:2px;position:absolute;background:#e9eee9;top:13px;left:50%;width:100%}.detail-progress>div:last-child:before{display:none}.detail-progress span{display:flex;align-items:center;justify-content:center;position:relative;z-index:1;border:1px solid #e2e9e2;background:#f3f6f3;color:#adb8ae;border-radius:50%;width:29px;height:29px;font-size:12px;margin:0 auto}.detail-progress small{display:block;font-size:11px;margin-top:9px;color:#96a293}.detail-progress .done span{background:#deeadb;color:#58854e;border-color:#cbdcc6}.detail-progress .done:before{background:#cfdfc9}.detail-progress .current span{background:#295c3e;color:#fff;border-color:#295c3e;box-shadow:0 0 0 4px #e5eee2}.detail-progress .current small{color:#3f714b;font-weight:600}.detail-progress .icon{height:14px;width:14px}.responsibility{display:grid;grid-template-columns:1.5fr 1fr 1fr;border:1px solid var(--border);background:#f8faf7;border-radius:8px;padding:16px 20px;gap:15px}.responsibility small{display:block;color:#929d90;font-size:12px}.responsibility strong{font-size:14px;font-weight:600;display:block;margin-top:8px}.notice{display:flex;align-items:flex-start;gap:10px;padding:13px 15px;font-size:14px;border-radius:7px;line-height:1.8;margin-top:16px}.notice.amber{background:#faf3e7;color:#a88440}.notice.danger{background:#fbefeb;color:#bb6b5b}.notice.danger .icon{margin-top:3px}.next-step-box{padding:18px 0}.field-label{font-size:13px;color:#83917e;display:block;margin-bottom:9px}.next-step-box p{font-size:15px}.detail-actions{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 24px}.detail-section{padding:23px 0;border-top:1px solid var(--border)}.detail-section h3{margin-bottom:15px}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px 17px;margin:18px 0 0}.info-grid dt{font-size:12px;color:#929d90}.info-grid dd{margin:7px 0 0;font-size:14px;word-break:break-word}.photo-placeholder{padding:25px;border:1px dashed #dce5da;border-radius:8px;text-align:center;background:#fafcf9;font-size:13px;color:#95a18f}.photo-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.photo-gallery img{width:100%;height:120px;object-fit:cover;border-radius:6px}.photo-gallery small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#91a08e;margin-top:5px}.timeline{padding-top:8px}.timeline-item{display:flex;gap:14px;position:relative;padding:0 0 27px}.timeline-item:before{position:absolute;content:"";left:14px;top:29px;width:1px;height:calc(100% - 29px);background:#e5ece1}.timeline-item:last-child:before{display:none}.timeline-dot{display:flex;align-items:center;justify-content:center;width:29px;height:29px;flex-shrink:0;background:#f0f5ec;color:#88a176;border-radius:50%}.timeline-dot .icon{width:13px;height:13px}.timeline-item>div{flex:1;min-width:0}.timeline-meta{display:flex;gap:9px;align-items:center;flex-wrap:wrap;min-height:29px}.timeline-meta strong{font-size:13px}.timeline-meta span{color:#91a18a;font-size:12px}.timeline-meta time{margin-left:auto;color:#a0ab9a;font-size:11px}.timeline-item p{font-size:14px;white-space:pre-wrap;word-break:break-word;margin:8px 0 5px;color:#586b50}.timeline-item small{color:#8b9b83;line-height:1.7}.stage-change{font-size:12px;display:flex;align-items:center;gap:9px;margin-top:8px;color:#54834c}.stage-change .icon{width:13px;height:13px}.login-page{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}.login-story{background:#153b31;padding:55px 60px 35px;display:flex;flex-direction:column;color:#eaf0e8;min-height:100vh}.login-story .brand{padding:0}.login-intro{margin:auto 0;padding:70px 0}.login-intro .eyebrow{color:#a8c09c;font-size:13px;letter-spacing:.15em}.login-intro h1{font-size:clamp(40px,4.4vw,68px);font-weight:500;letter-spacing:.03em;line-height:1.4;margin:22px 0 30px}.login-intro p{color:#a9c1ad;font-size:15px;line-height:2}.login-steps{margin-top:55px;display:flex;gap:15px;align-items:center;flex-wrap:wrap;font-size:13px;color:#d6e2ca}.login-steps .icon{width:16px;color:#69977b}.login-footer{font-size:12px;color:#739982}.login-panel{display:flex;justify-content:center;align-items:center;padding:50px 35px;background:#f8faf8}.login-box{width:380px;max-width:100%}.login-box h2{font-size:27px;font-weight:600;margin-bottom:12px}.login-box>.muted{font-size:14px;line-height:1.9}.demo-pick{margin-top:29px}.demo-person{display:flex;align-items:center;text-align:left;width:100%;gap:13px;padding:14px 15px;margin-top:10px;border:1px solid #dfe7df;border-radius:8px;background:#fff;transition:border-color .15s,transform .15s}.demo-person:hover{border-color:#84ac87;transform:translateX(3px)}.demo-person strong{font-size:14px;display:block}.demo-person small{color:#98a38f;margin-top:5px;display:block;font-size:12px}.demo-person>.icon{margin-left:auto;color:#8aab7f;width:17px}.login-note{font-size:12px;color:#8b9e81;display:flex;align-items:center;gap:9px;margin-top:32px}.login-note .icon{width:16px;height:16px}.stack{display:flex;flex-direction:column;gap:18px;margin-top:26px}.stack label,.form-grid label{display:flex;flex-direction:column;gap:8px;font-size:14px;color:#596c4f}.form-body{padding:24px 28px 28px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 17px}.span-2{grid-column:1/-1}.form-error{font-size:14px;color:#b45546;line-height:1.7;white-space:pre-wrap}.form-error:empty{display:none}.form-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:23px;border-top:1px solid var(--border);padding-top:21px}.form-help{font-size:12px;color:#8a9e82;line-height:1.8;margin-top:15px}.board-scroll{overflow-x:auto;padding-bottom:15px}.board{display:grid;grid-template-columns:repeat(8,260px);gap:14px}.board-column{background:#edf1ec;border:1px solid #e2e9df;border-radius:8px;padding:13px;min-height:350px}.board-column h3{display:flex;align-items:center;justify-content:space-between;font-size:14px;padding:5px 2px 16px}.board-card{background:#fff;border:1px solid #dfe7db;border-radius:7px;margin-bottom:12px;padding:15px;width:100%;text-align:left}.board-card:hover{border-color:#99b88b}.board-card .code{color:#9fa994;font-size:11px}.board-card strong{font-size:14px;display:block;line-height:1.6;margin:7px 0 5px}.board-card p{font-size:12px;color:#8e9e81}.board-card .card-footer{margin-top:15px;padding-top:11px;border-top:1px solid #edf1e8;display:flex;justify-content:space-between;align-items:center;font-size:12px}.board-card .card-note{font-size:12px;white-space:normal;line-height:1.8;margin-top:12px}.plain-panel{background:#fff;border:1px solid var(--border);border-radius:10px;padding:24px}.activity-item{padding:18px 0;border-bottom:1px solid var(--border)}.activity-item:last-child{border-bottom:0}.activity-product{display:flex;align-items:center;gap:10px;margin-bottom:10px}.activity-product button{font-weight:600;font-size:15px;padding:0}.activity-product small{color:#8a9a80}.member-table{width:100%;border-collapse:collapse;font-size:14px}.member-table th{text-align:left;color:#91a187;font-size:12px;font-weight:400;padding:14px;border-bottom:1px solid var(--border)}.member-table td{padding:17px 14px;border-bottom:1px solid #eef2e9}.member-actions{display:flex;gap:12px}.reminder-list{display:grid;gap:12px;margin-top:22px}.reminder{display:flex;align-items:center;justify-content:space-between;text-align:left;padding:18px 20px;background:#fff;border:1px solid var(--border);border-radius:8px;gap:20px}.reminder strong{font-size:14px}.reminder p{font-size:13px;color:#8e9d83;margin-top:6px}.reminder>div:last-child{text-align:right;flex-shrink:0}.reminder>div:last-child span{display:block}.tabs-row{display:flex;gap:9px;margin:20px 0}.ding-status{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#eff5ea;padding:16px;border-radius:8px;margin-top:18px}.ding-status p{font-size:13px;color:#7d9470}.mobile-only{display:none}
@media(min-width:1600px){:where(html:not([data-layout="mobile"])) .product-table td{padding-top:19px;padding-bottom:19px}:where(html:not([data-layout="mobile"])) .main-content{padding-top:36px}:where(html:not([data-layout="mobile"])) .page-heading{margin-bottom:29px}:where(html:not([data-layout="mobile"])) .stats{margin-bottom:29px}:where(html:not([data-layout="mobile"])) .pipeline{margin-bottom:29px}}
@media(max-width:1250px){:where(html:not([data-layout-mode="desktop"])) .sidebar{width:192px;padding-left:12px;padding-right:12px}:where(html:not([data-layout-mode="desktop"])) .workspace-main{margin-left:192px;width:calc(100% - 192px)}:where(html:not([data-layout-mode="desktop"])) .main-content{padding:25px 22px 30px}:where(html:not([data-layout-mode="desktop"])) .pipeline-steps{overflow-x:auto;gap:10px}:where(html:not([data-layout-mode="desktop"])) .pipeline-step{min-width:95px}:where(html:not([data-layout-mode="desktop"])) .stat{padding:17px 15px}:where(html:not([data-layout-mode="desktop"])) .stat-hint{font-size:11px}:where(html:not([data-layout-mode="desktop"])) .stat strong{font-size:36px}:where(html:not([data-layout-mode="desktop"])) .topbar{padding:0 23px}:where(html:not([data-layout-mode="desktop"])) .product-table td{padding:15px 13px}:where(html:not([data-layout-mode="desktop"])) .table-toolbar{gap:12px}:where(html:not([data-layout-mode="desktop"])) .table-search{margin-left:auto}:where(html:not([data-layout-mode="desktop"])) .next-cell{max-width:170px}:where(html:not([data-layout-mode="desktop"])) .login-story{padding-left:40px;padding-right:40px}}
@media(max-width:950px){:where(html:not([data-layout-mode="desktop"])) .sidebar{width:74px;padding:25px 10px 15px}:where(html:not([data-layout-mode="desktop"])) .sidebar .brand{padding:0;justify-content:center}:where(html:not([data-layout-mode="desktop"])) .sidebar .brand>span,:where(html:not([data-layout-mode="desktop"])) .workspace-label,:where(html:not([data-layout-mode="desktop"])) .nav-item>span,:where(html:not([data-layout-mode="desktop"])) .nav-item>b,:where(html:not([data-layout-mode="desktop"])) .user-card>div,:where(html:not([data-layout-mode="desktop"])) .user-card>.icon-button,:where(html:not([data-layout-mode="desktop"])) .demo-badge{display:none}:where(html:not([data-layout-mode="desktop"])) .sidebar nav{margin-top:40px}:where(html:not([data-layout-mode="desktop"])) .nav-item{justify-content:center;padding:13px 10px}:where(html:not([data-layout-mode="desktop"])) .user-card{padding:15px 0 0;justify-content:center}:where(html:not([data-layout-mode="desktop"])) .workspace-main{margin-left:74px;width:calc(100% - 74px)}:where(html:not([data-layout-mode="desktop"])) .stats{gap:12px}:where(html:not([data-layout-mode="desktop"])) .stat-hint .icon{display:none}:where(html:not([data-layout-mode="desktop"])) .login-page{grid-template-columns:.9fr 1.1fr}:where(html:not([data-layout-mode="desktop"])) .login-story{padding:36px 28px}:where(html:not([data-layout-mode="desktop"])) .login-intro h1{font-size:45px}:where(html:not([data-layout-mode="desktop"])) .login-steps{gap:7px;font-size:11px}:where(html:not([data-layout-mode="desktop"])) .login-steps .icon{width:12px}}
:where(html[data-layout="mobile"]) .sidebar{width:100%;height:62px;inset:auto 0 0;display:block;padding:0 3px;background:#163d31;border-top:1px solid #335743}:where(html[data-layout="mobile"]) .sidebar>.brand,:where(html[data-layout="mobile"]) .sidebar-bottom,:where(html[data-layout="mobile"]) .nav-divider{display:none}:where(html[data-layout="mobile"]) .sidebar nav{display:flex;margin:0;align-items:center;height:100%;justify-content:space-around}:where(html[data-layout="mobile"]) .nav-item{width:auto;flex:1;padding:9px 0;border-radius:0;margin:0;gap:4px;display:flex;flex-direction:column;font-size:10px}:where(html[data-layout="mobile"]) .nav-item>span{display:block;font-size:10px}:where(html[data-layout="mobile"]) .nav-item[data-view=activity],:where(html[data-layout="mobile"]) .nav-item[data-view=team]{display:none}:where(html[data-layout="mobile"]) .nav-item .icon{width:20px;height:20px}:where(html[data-layout="mobile"]) .nav-item.active{background:transparent;color:#e0edac}:where(html[data-layout="mobile"]) .workspace-main{margin:0;width:100%;padding-bottom:62px}:where(html[data-layout="mobile"]) .topbar{height:56px;padding:0 17px}:where(html[data-layout="mobile"]) .breadcrumbs{font-size:12px}:where(html[data-layout="mobile"]) .topbar-right{gap:10px}:where(html[data-layout="mobile"]) .today{display:none}:where(html[data-layout="mobile"]) .main-content{padding:21px 15px 28px}:where(html[data-layout="mobile"]) .page-heading{align-items:flex-start;gap:12px;margin-bottom:21px}:where(html[data-layout="mobile"]) .page-heading .eyebrow{font-size:10px}:where(html[data-layout="mobile"]) .page-heading h1{font-size:25px}:where(html[data-layout="mobile"]) .page-heading p{font-size:12px;max-width:245px}:where(html[data-layout="mobile"]) .page-heading>.button{padding:9px 11px;font-size:12px;margin-top:21px;min-height:36px}:where(html[data-layout="mobile"]) .stats{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:17px}:where(html[data-layout="mobile"]) .stat{padding:15px}:where(html[data-layout="mobile"]) .stat-top{font-size:12px}:where(html[data-layout="mobile"]) .stat-top .icon{width:15px;height:15px;padding:5px}:where(html[data-layout="mobile"]) .stat strong{font-size:34px;margin-top:12px}:where(html[data-layout="mobile"]) .stat-hint{font-size:10px}:where(html[data-layout="mobile"]) .pipeline{padding:17px 14px;margin-bottom:17px}:where(html[data-layout="mobile"]) .pipeline .section-head .muted{font-size:10px}:where(html[data-layout="mobile"]) .pipeline-steps{margin-top:14px}:where(html[data-layout="mobile"]) .pipeline-step{min-width:104px}:where(html[data-layout="mobile"]) .products-panel>.section-head{padding:18px 15px 0}:where(html[data-layout="mobile"]) .table-toolbar{padding:15px;gap:12px}:where(html[data-layout="mobile"]) .table-search{width:100%;margin:0;gap:7px}:where(html[data-layout="mobile"]) .search-field{flex:1}:where(html[data-layout="mobile"]) .search-field input{width:100%}:where(html[data-layout="mobile"]) .table-search select{width:105px}:where(html[data-layout="mobile"]) .filter-tabs{gap:0}:where(html[data-layout="mobile"]) .filter-tab{font-size:11px;padding:7px 8px}:where(html[data-layout="mobile"]) .product-table{white-space:normal}:where(html[data-layout="mobile"]) .product-table th,:where(html[data-layout="mobile"]) .product-table td{padding:13px 10px}:where(html[data-layout="mobile"]) .product-table th:first-child,:where(html[data-layout="mobile"]) .product-table td:first-child{padding-left:15px}:where(html[data-layout="mobile"]) .product-table th:nth-child(3),:where(html[data-layout="mobile"]) .product-table td:nth-child(3),:where(html[data-layout="mobile"]) .product-table th:nth-child(4),:where(html[data-layout="mobile"]) .product-table td:nth-child(4),:where(html[data-layout="mobile"]) .product-table th:nth-child(5),:where(html[data-layout="mobile"]) .product-table td:nth-child(5){display:none}:where(html[data-layout="mobile"]) .product-link{gap:9px;min-width:160px}:where(html[data-layout="mobile"]) .product-link strong{font-size:12px;max-width:145px}:where(html[data-layout="mobile"]) .product-link small{font-size:10px}:where(html[data-layout="mobile"]) .photo-empty,:where(html[data-layout="mobile"]) .product-photo{width:36px;height:43px}:where(html[data-layout="mobile"]) .photo-empty span{font-size:9px}:where(html[data-layout="mobile"]) .photo-empty .icon{width:15px;height:15px}:where(html[data-layout="mobile"]) .stage-badge{font-size:10px;padding:4px 6px}:where(html[data-layout="mobile"]) .cell-sub{font-size:10px;white-space:nowrap}:where(html[data-layout="mobile"]) .row-action{font-size:10px;gap:3px;min-height:34px}:where(html[data-layout="mobile"]) .row-action .icon{width:11px}:where(html[data-layout="mobile"]) .table-footer{font-size:10px;padding:14px}:where(html[data-layout="mobile"]) .app-footer{font-size:9px;padding:0 15px 17px;gap:9px}:where(html[data-layout="mobile"]) .detail-body{padding:20px 17px}:where(html[data-layout="mobile"]) .modal-head{padding:18px 19px}:where(html[data-layout="mobile"]) .modal-head h2{font-size:19px}:where(html[data-layout="mobile"]) .detail-intro{gap:12px;flex-wrap:wrap}:where(html[data-layout="mobile"]) .detail-intro .button{font-size:12px;padding:8px 11px}:where(html[data-layout="mobile"]) .photo-empty.large,:where(html[data-layout="mobile"]) .product-photo.large{width:61px;height:71px}:where(html[data-layout="mobile"]) .detail-intro h3{font-size:13px}:where(html[data-layout="mobile"]) .detail-progress{overflow-x:auto;gap:3px}:where(html[data-layout="mobile"]) .detail-progress>div{min-width:41px}:where(html[data-layout="mobile"]) .detail-progress small{font-size:9px}:where(html[data-layout="mobile"]) .detail-progress span{width:25px;height:25px}:where(html[data-layout="mobile"]) .responsibility{padding:14px 12px;gap:8px;grid-template-columns:1.3fr .7fr 1fr}:where(html[data-layout="mobile"]) .responsibility small{font-size:10px}:where(html[data-layout="mobile"]) .responsibility strong{font-size:12px}:where(html[data-layout="mobile"]) .detail-actions .button{font-size:12px;padding:10px 12px}:where(html[data-layout="mobile"]) .info-grid{grid-template-columns:repeat(2,1fr)}:where(html[data-layout="mobile"]) .photo-gallery{grid-template-columns:repeat(3,1fr)}:where(html[data-layout="mobile"]) .photo-gallery img{height:95px}:where(html[data-layout="mobile"]) .form-body{padding:22px 20px}:where(html[data-layout="mobile"]) .form-grid{gap:17px 12px}:where(html[data-layout="mobile"]) .form-grid label{font-size:12px}:where(html[data-layout="mobile"]) .form-grid input,:where(html[data-layout="mobile"]) .form-grid select,:where(html[data-layout="mobile"]) .form-grid textarea{font-size:14px;padding:10px}:where(html[data-layout="mobile"]) .span-mobile{grid-column:1/-1}:where(html[data-layout="mobile"]) .login-page{display:block}:where(html[data-layout="mobile"]) .login-story{min-height:auto;padding:24px 25px 27px}:where(html[data-layout="mobile"]) .login-story .brand img{width:32px;height:32px}:where(html[data-layout="mobile"]) .login-story .brand>span{font-size:22px}:where(html[data-layout="mobile"]) .login-story .brand small{display:none}:where(html[data-layout="mobile"]) .login-intro{padding:30px 0 0}:where(html[data-layout="mobile"]) .login-intro h1{font-size:36px;margin:7px 0 0;line-height:1.4}:where(html[data-layout="mobile"]) .login-intro h1 br{display:none}:where(html[data-layout="mobile"]) .login-intro>.eyebrow,:where(html[data-layout="mobile"]) .login-intro>p,:where(html[data-layout="mobile"]) .login-steps,:where(html[data-layout="mobile"]) .login-footer{display:none}:where(html[data-layout="mobile"]) .login-panel{padding:29px 25px 35px}:where(html[data-layout="mobile"]) .login-box{width:100%}:where(html[data-layout="mobile"]) .login-box h2{font-size:23px}:where(html[data-layout="mobile"]) .login-box>.eyebrow{display:none}:where(html[data-layout="mobile"]) .demo-pick{margin-top:23px}:where(html[data-layout="mobile"]) .login-note{font-size:11px;line-height:1.6}:where(html[data-layout="mobile"]) .plain-panel{padding:17px 14px}:where(html[data-layout="mobile"]) .member-table th,:where(html[data-layout="mobile"]) .member-table td{padding:13px 8px}:where(html[data-layout="mobile"]) .member-table{min-width:520px}:where(html[data-layout="mobile"]) .reminder{padding:16px;gap:10px}:where(html[data-layout="mobile"]) .reminder p{font-size:12px}:where(html[data-layout="mobile"]) .reminder>div:last-child{font-size:11px}:where(html[data-layout="mobile"]) .ding-status{align-items:flex-start;flex-direction:column}:where(html[data-layout="mobile"]) .board{grid-template-columns:repeat(8,235px)}:where(html[data-layout="mobile"]) .timeline-meta time{font-size:10px}:where(html[data-layout="mobile"]) .timeline-item p{font-size:13px}:where(html[data-layout="mobile"]) .detail-actions .text-button{font-size:12px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.activity-filter{flex-wrap:wrap;justify-content:space-between;margin-bottom:12px}.activity-filter label{font-size:14px}.board-scroll{padding:0 17px 17px}.stat-top .icon,.step-index{flex-shrink:0}.stat{display:flex;flex-direction:column}.stat-hint{margin-top:auto;min-height:39px}.top-avatar{cursor:pointer}.top-avatar:hover{background:#c8decd}.form-dialog input,.form-dialog textarea{scroll-margin:85px}
.mobile-summary{display:none}
:where(html[data-layout="mobile"]) .mobile-summary{display:block;line-height:1.8;margin-top:7px;color:#718170;font-size:12px}:where(html[data-layout="mobile"]) .stat-hint{display:none}:where(html[data-layout="mobile"]) .stat{padding:14px 15px}:where(html[data-layout="mobile"]) .stat strong{font-size:31px;margin:10px 0 2px}:where(html[data-layout="mobile"]) .pipeline-step{flex-direction:column;text-align:center;justify-content:center}:where(html[data-layout="mobile"]) .pipeline-step .step-index{display:none}:where(html[data-layout="mobile"]) .product-table td{vertical-align:top}:where(html[data-layout="mobile"]) .row-action{min-height:42px}:where(html[data-layout="mobile"]) .product-link{min-height:42px}
/* 关键业务信息保持易读，辅助元数据至少 12px。 */
.product-table th,.next-cell>span,.owner,.row-action,.filter-tab,.pipeline-step,.stage-badge{font-size:14px}.search-field input,.table-search select{font-size:14px}.today,.app-footer,.brand small,.workspace-label span,.photo-empty span,.urgent-tag,.tiny-tag,.photo-gallery small,.timeline-meta time,.detail-progress small,.board-card .code{font-size:12px}.muted,.cell-sub,.stat-hint,.photo-placeholder,.form-help{color:#718170}.timeline-item small,.timeline-meta span,.timeline-meta time,.product-link small{color:#748471}.pipeline-step{gap:7px}.pipeline-step small{color:#758773}
@media(max-width:1250px){:where(html:not([data-layout-mode="desktop"])) .stat-hint{font-size:12px}:where(html:not([data-layout-mode="desktop"])) .pipeline-steps{flex-wrap:wrap;overflow:visible;row-gap:14px}:where(html:not([data-layout-mode="desktop"])) .pipeline-step{min-width:calc(25% - 12px);flex:1}:where(html:not([data-layout-mode="desktop"])) .pipeline-step:nth-child(4)>.icon{visibility:hidden}}
:where(html[data-layout="mobile"]) .page-heading p,:where(html[data-layout="mobile"]) .filter-tab,:where(html[data-layout="mobile"]) .cell-sub,:where(html[data-layout="mobile"]) .row-action,:where(html[data-layout="mobile"]) .stage-badge,:where(html[data-layout="mobile"]) .photo-empty span,:where(html[data-layout="mobile"]) .product-link small,:where(html[data-layout="mobile"]) .app-footer,:where(html[data-layout="mobile"]) .table-footer,:where(html[data-layout="mobile"]) .detail-progress small,:where(html[data-layout="mobile"]) .responsibility small,:where(html[data-layout="mobile"]) .stat-hint,:where(html[data-layout="mobile"]) .timeline-meta time{font-size:12px}:where(html[data-layout="mobile"]) .product-link strong,:where(html[data-layout="mobile"]) .next-cell>span,:where(html[data-layout="mobile"]) .owner{font-size:14px}:where(html[data-layout="mobile"]) .product-link{min-width:135px}:where(html[data-layout="mobile"]) .product-table th{font-size:12px}:where(html[data-layout="mobile"]) .product-table td{padding-left:7px;padding-right:7px}:where(html[data-layout="mobile"]) .product-table th:first-child,:where(html[data-layout="mobile"]) .product-table td:first-child{padding-left:12px}:where(html[data-layout="mobile"]) .photo-empty,:where(html[data-layout="mobile"]) .product-photo{display:none}:where(html[data-layout="mobile"]) .detail-intro .photo-empty,:where(html[data-layout="mobile"]) .detail-intro .product-photo{display:flex}:where(html[data-layout="mobile"]) .row-action .icon{display:none}:where(html[data-layout="mobile"]) .table-search select{max-width:115px}:where(html[data-layout="mobile"]) .detail-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 4px;overflow:visible}:where(html[data-layout="mobile"]) .detail-progress>div:nth-child(4):before{display:none}:where(html[data-layout="mobile"]) .detail-progress small{font-size:12px}:where(html[data-layout="mobile"]) .pipeline-step{min-width:calc(25% - 12px);font-size:12px;gap:4px;white-space:normal}:where(html[data-layout="mobile"]) .pipeline-step>.icon{display:none}:where(html[data-layout="mobile"]) .pipeline-steps{column-gap:8px}:where(html[data-layout="mobile"]) .step-index{width:22px;height:22px;font-size:12px}:where(html[data-layout="mobile"]) .nav-item>span{font-size:12px}:where(html[data-layout="mobile"]) .app-footer{flex-direction:column;gap:6px}:where(html[data-layout="mobile"]) .stat-top{font-size:14px}:where(html[data-layout="mobile"]) .stat-hint{line-height:1.6}:where(html[data-layout="mobile"]) .form-grid label{font-size:14px}:where(html[data-layout="mobile"]) .reminder{align-items:flex-start;flex-direction:column;gap:10px}:where(html[data-layout="mobile"]) .reminder>div:last-child{text-align:left}:where(html[data-layout="mobile"]) .photo-gallery{grid-template-columns:repeat(2,1fr)}:where(html[data-layout="mobile"]) .table-search select,:where(html[data-layout="mobile"]) .search-field input{font-size:14px}
.board{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:260px}
.greige-options{grid-template-columns:repeat(3,minmax(0,1fr))}
.status-choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:82px;padding:12px 8px;border:2px solid #dce5e1;border-radius:12px;background:#fff;color:#304e43;cursor:pointer;text-align:center;font-weight:700}
.status-choice input{position:absolute;opacity:0;width:1px;height:1px}
.status-choice small{font-size:11px;font-weight:400;line-height:1.4}
.status-choice:hover{border-color:#86b4a0;background:#f4faf7}
.status-choice:has(input:checked){border-color:#19734d;background:#e9f5ee;color:#155b3e;box-shadow:0 0 0 1px #19734d}
.status-choice:has(input:focus-visible){outline:3px solid #5aa4e6;outline-offset:3px}
.progress-extras{border-top:1px solid var(--border);padding-top:12px}
.progress-extras summary{cursor:pointer;color:#607769;font-size:13px;padding:5px 0}
.progress-extras[open]>.stack{margin-top:16px}
#status-progress-form .dye-status-panel{margin-top:0}
:where(html[data-layout="mobile"]) .board{grid-auto-columns:235px}:where(html[data-layout="mobile"]) .status-choice{min-height:78px;padding:10px 5px}:where(html[data-layout="mobile"]) .status-choice small{font-size:11px}
.fabric-type-filter{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:18px 24px 0}
.fabric-type-filter>span{font-size:13px;color:#718170;margin-right:8px}
:where(html[data-layout="mobile"]) .fabric-type-filter{padding:16px 15px 0;gap:3px}:where(html[data-layout="mobile"]) .fabric-type-filter>span{margin-right:4px}
.operation-filter{display:flex;flex-wrap:wrap;gap:14px;align-items:end;margin-bottom:16px}.operation-filter label{display:grid;gap:7px;flex:1;min-width:180px}.operation-entry{padding:18px 0;border-bottom:1px solid #e2e8e3;overflow-wrap:anywhere}.operation-entry p{white-space:pre-wrap;margin:8px 0}.operation-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:9px}.operation-meta time{margin-left:auto;color:#718170;font-size:12px}.operation-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:18px}:where(html[data-layout="mobile"]) .operation-meta time{width:100%;margin-left:0}:where(html[data-layout="mobile"]) .operation-filter label{min-width:100%}
#monthly-results .product-table{min-width:760px;table-layout:auto}
#monthly-results .product-table th,#monthly-results .product-table td{display:table-cell!important;white-space:nowrap;width:auto}
#monthly-results h3{margin:24px 0 12px}


/* Device display modes. The switch is outside #app so re-renders never reset it. */
:root { --layout-controls-height:calc(58px + env(safe-area-inset-bottom, 0px)); --mobile-nav-height:68px; }
body { padding-bottom:var(--layout-controls-height); }
.workspace,.workspace-main,.login-page { min-height:calc(100dvh - var(--layout-controls-height)); }
.sidebar { bottom:var(--layout-controls-height); overflow-y:auto; }
.layout-controls { position:fixed; z-index:30; bottom:0; left:0; width:100%; height:var(--layout-controls-height); display:flex; justify-content:center; align-items:center; gap:5px; padding:7px 10px calc(7px + env(safe-area-inset-bottom, 0px)); background:#fff; border-top:1px solid #dce5df; box-shadow:0 -3px 18px #193c3207; }
.layout-controls-label { color:#7a8882; font-size:12px; margin-right:12px; }
.layout-controls button { min-height:44px; padding:9px 17px; border-radius:8px; font-size:13px; color:#63786d; white-space:nowrap; }
.layout-controls button[aria-pressed="true"] { background:#e7efe8; color:#214e3c; font-weight:650; box-shadow:inset 0 0 0 1px #cdded0; }
.layout-controls button:hover { background:#f0f5f1; }
.layout-controls button[aria-pressed="true"]:hover { background:#e1ebdf; }
#toast { bottom:calc(var(--layout-controls-height) + 16px); }
.mobile-nav,.mobile-products { display:none; }
html[data-layout-mode="desktop"] .workspace,html[data-layout-mode="desktop"] .login-page { min-width:1120px; }
html[data-layout-mode="desktop"] .workspace-main { min-width:898px; }
.profile-card { display:flex; align-items:center; gap:14px; padding:22px; border:1px solid var(--border); border-radius:14px; background:#fff; }
.profile-card .avatar { width:48px; height:48px; font-size:20px; }
.profile-card>div { flex:1; min-width:0; }
.profile-card h2 { overflow-wrap:anywhere; }
.profile-card p { margin-top:5px; font-size:13px; color:var(--muted); }
.profile-links { background:#fff; border:1px solid var(--border); border-radius:14px; padding:0 16px; margin:18px 0; }
.profile-links button { display:flex; align-items:center; gap:14px; width:100%; padding:19px 3px; text-align:left; border-bottom:1px solid #edf1ee; }
.profile-links button:last-child { border-bottom:0; }
.profile-links button>.icon { color:#6c8b78; }
.profile-links button>.icon:last-child { margin-left:auto; width:16px; }
.profile-help { color:var(--muted); font-size:13px; }
/* A genuine mobile layout, including when it is chosen on a desktop screen. */
html[data-layout="mobile"] #app { width:100%; max-width:520px; margin:0 auto; background:#f3f6f3; }
html[data-layout="mobile"] .sidebar { display:none; }
html[data-layout="mobile"] .workspace { display:block; min-width:0; }
html[data-layout="mobile"] .workspace-main { width:100%; min-width:0; margin:0; padding-bottom:calc(var(--mobile-nav-height) + 12px); }
html[data-layout="mobile"] .layout-controls-label { display:none; }
html[data-layout="mobile"] .mobile-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); position:fixed; z-index:20; left:50%; transform:translateX(-50%); bottom:var(--layout-controls-height); width:100%; max-width:520px; height:var(--mobile-nav-height); padding:5px 12px; background:#fff; border-top:1px solid #dce5df; }
html[data-layout="mobile"] .mobile-nav button { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:5px; font-size:12px; color:#829088; border-radius:10px; position:relative; }
html[data-layout="mobile"] .mobile-nav button[aria-current="page"] { color:#214e3c; background:#eef4eb; font-weight:650; }
html[data-layout="mobile"] .mobile-nav b { position:absolute; top:1px; left:calc(50% + 8px); font-size:10px; background:#ad683f; color:#fff; padding:1px 5px; border-radius:10px; }
html[data-layout="mobile"] .topbar { height:60px; min-height:60px; padding:0 20px; }
html[data-layout="mobile"] .topbar .icon-button,html[data-layout="mobile"] .top-avatar { width:44px; height:44px; }
html[data-layout="mobile"] .top-avatar { border:6px solid #fff; }
html[data-layout="mobile"] .main-content { padding:24px 16px 26px; min-width:0; }
html[data-layout="mobile"] .page-heading { flex-wrap:wrap; align-items:center; gap:12px; }
html[data-layout="mobile"] .page-heading h1 { font-size:26px; }
html[data-layout="mobile"] .page-heading p { font-size:13px; max-width:100%; }
html[data-layout="mobile"] .page-heading>.button { min-height:44px; margin:0; padding:10px 14px; font-size:14px; }
html[data-layout="mobile"] .button { min-height:44px; font-size:14px; }
html[data-layout="mobile"] .text-button { min-height:44px; }
html[data-layout="mobile"] .stats { gap:10px; }
html[data-layout="mobile"] .stat { border-radius:12px; padding:16px; min-width:0; }
html[data-layout="mobile"] .stat-top { font-size:13px; }
html[data-layout="mobile"] .stat-hint { display:none; }
html[data-layout="mobile"] .stat strong { font-size:32px; margin:12px 0 0; }
html[data-layout="mobile"] .pipeline { border-radius:12px; }
html[data-layout="mobile"] .pipeline .section-head { flex-wrap:wrap; gap:6px; }
html[data-layout="mobile"] .pipeline-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; overflow:visible; }
html[data-layout="mobile"] .pipeline-step { min-width:0; min-height:56px; padding:10px 3px; background:#f6f8f5; }
html[data-layout="mobile"] .pipeline-step.selected { background:#e2eddc; box-shadow:inset 0 0 0 1px #afc9a0; }
html[data-layout="mobile"] .products-panel { border:0; background:transparent; overflow:visible; }
html[data-layout="mobile"] .products-panel>.section-head { padding:4px 0 0; flex-wrap:wrap; }
html[data-layout="mobile"] .fabric-type-filter { padding:12px 0 0; }
html[data-layout="mobile"] .fabric-type-filter>span { width:100%; font-size:12px; }
html[data-layout="mobile"] .table-toolbar { padding:10px 0 16px; gap:12px; }
html[data-layout="mobile"] .filter-tabs { flex-wrap:nowrap; overflow-x:auto; max-width:100%; width:100%; gap:4px; padding:2px 1px; }
html[data-layout="mobile"] .filter-tab { min-height:44px; flex-shrink:0; font-size:13px; padding:10px; }
html[data-layout="mobile"] .table-search { display:grid; grid-template-columns:minmax(0,1fr) 114px; width:100%; min-width:0; gap:8px; }
html[data-layout="mobile"] .search-field { min-width:0; }
html[data-layout="mobile"] .search-field input { min-height:44px; font-size:16px; width:100%; min-width:0; }
html[data-layout="mobile"] .table-search select { min-height:44px; font-size:16px; width:100%; max-width:none; padding:9px 6px; }
html[data-layout="mobile"] .desktop-products { display:none; }
html[data-layout="mobile"] .mobile-products { display:block; }
.product-cards { display:grid; gap:14px; }
.product-card { border:1px solid #dfe7df; border-radius:14px; background:#fff; padding:16px; min-width:0; box-shadow:0 3px 9px #183e3303; }
.product-card-heading { display:flex; gap:12px; width:100%; text-align:left; align-items:center; padding:0 0 14px; }
.product-card-heading>span { flex:1; min-width:0; }
.product-card-heading strong { display:block; font-size:17px; line-height:1.5; margin:3px 0; overflow-wrap:anywhere; }
.product-card-heading small { display:block; font-size:12px; color:#7f8e83; line-height:1.6; overflow-wrap:anywhere; }
.product-card-heading>.icon { color:#94a69a; width:16px; }
html[data-layout="mobile"] .product-card .photo-empty,html[data-layout="mobile"] .product-card .product-photo { display:flex; width:56px; height:66px; border-radius:9px; }
.product-card-stage { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.product-card-stage>span:last-child { font-size:12px; color:#89968d; }
html[data-layout="mobile"] .product-card .stage-badge { padding:5px 9px; font-size:12px; }
.product-card-facts { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0; }
.product-card-facts dt { font-size:12px; color:#8a968f; margin-bottom:6px; }
.product-card-facts dd { font-size:14px; margin:0; font-weight:600; overflow-wrap:anywhere; }
.product-card-next { background:#f4f7f3; border-radius:8px; padding:10px 12px; color:#5e7262; font-size:13px; overflow-wrap:anywhere; white-space:pre-wrap; }
.product-card-next span { display:block; font-size:11px; color:#829483; margin-bottom:2px; }
.product-card-next.is-blocked { background:#fbf1ed; color:#b06450; }
.product-card-next.is-blocked span { color:#b06450; }
.product-card-daily { padding:10px 0 0; }
html[data-layout="mobile"] .product-card-daily .daily-summary { max-width:none; margin:0; white-space:normal; font-size:12px; overflow-wrap:anywhere; }
.product-card-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:8px; margin-top:14px; }
html[data-layout="mobile"] .product-card-actions .button { padding:11px 7px; font-size:13px; gap:6px; }
html[data-layout="mobile"] .table-footer { display:flex; gap:8px; flex-wrap:wrap; padding:16px 2px; }
html[data-layout="mobile"] .board-scroll { overflow:visible; }
html[data-layout="mobile"] .board { display:grid; grid-template-columns:minmax(0,1fr); grid-auto-flow:row; grid-auto-columns:auto; min-width:0; }
html[data-layout="mobile"] .board-column { min-width:0; min-height:100px; }
html[data-layout="mobile"] .board-card { width:100%; }
html[data-layout="mobile"] .profile-card { flex-wrap:wrap; padding:18px; }
html[data-layout="mobile"] .profile-card .button { width:100%; }
html[data-layout="mobile"] #toast { bottom:calc(var(--layout-controls-height) + var(--mobile-nav-height) + 12px); max-width:min(90vw,480px); }
html[data-layout="mobile"] dialog { width:min(520px,100%); max-width:100%; max-height:100dvh; height:100dvh; margin:0 auto; inset:0; border-radius:0; overflow-y:auto; overscroll-behavior:contain; scroll-padding:88px 0; }
html[data-layout="mobile"] .modal-head { padding:16px 18px; min-height:72px; }
html[data-layout="mobile"] .modal-head h2 { font-size:20px; overflow-wrap:anywhere; }
html[data-layout="mobile"] .modal-head .icon-button { width:44px; height:44px; flex-shrink:0; }
html[data-layout="mobile"] .form-body,html[data-layout="mobile"] .detail-body { padding:20px 18px calc(24px + env(safe-area-inset-bottom, 0px)); }
html[data-layout="mobile"] .form-grid { grid-template-columns:minmax(0,1fr); gap:18px; }
html[data-layout="mobile"] input,html[data-layout="mobile"] select,html[data-layout="mobile"] textarea { font-size:16px; min-height:44px; max-width:100%; }
html[data-layout="mobile"] .form-grid input,html[data-layout="mobile"] .form-grid select,html[data-layout="mobile"] .form-grid textarea { font-size:16px; }
html[data-layout="mobile"] input[type="checkbox"],html[data-layout="mobile"] input[type="radio"] { min-height:0; }
html[data-layout="mobile"] .role-choice { min-height:44px; }
html[data-layout="mobile"] .dye-status-options,html[data-layout="mobile"] .greige-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
html[data-layout="mobile"] .status-choice { min-height:70px; font-size:15px; }
html[data-layout="mobile"] .form-footer { flex-wrap:wrap; }
html[data-layout="mobile"] .form-footer .button { flex:1; }
html[data-layout="mobile"] .responsibility { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
html[data-layout="mobile"] .responsibility>div:first-child { grid-column:1/-1; }
html[data-layout="mobile"] .detail-actions { display:grid; grid-template-columns:minmax(0,1fr); }
html[data-layout="mobile"] .detail-actions .button { font-size:15px; }
html[data-layout="mobile"] .daily-checklist li { display:block; }
html[data-layout="mobile"] .daily-checklist strong { display:block; margin-top:4px; }
html[data-layout="mobile"] .plain-panel { min-width:0; }
html[data-layout="mobile"] .table-scroll { max-width:100%; overscroll-behavior-x:contain; }
html[data-layout="mobile"] .login-page { min-width:0; }
html[data-layout="mobile"] .login-story { min-height:0; }
html[data-layout="mobile"] .login-panel { padding:28px 24px 40px; }
@media(max-width:480px) { .layout-controls-label { display:none; } .layout-controls button { padding-left:14px; padding-right:14px; } }