/* ===== 瓦楞箱报价器 — 牛皮纸棕褐配色体系（贴切瓦楞纸箱本色，与彩盒 Teal 反差）===== */
/* 主色 #8B4513 / 浅主 #B45309 / 深主 #5C3309 / 背景 #F5E9D6 / 浅底 #F3E2C0 / 边框 #E2B97A */
/* 强调色 #EA580C（橙）保留为两页统一锚点（总价/删除/告警） */
/* 仅呈现层，不改任何算价逻辑 */

/* ===== 全局 ===== */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Plus Jakarta Sans','PingFang SC','Microsoft YaHei',sans-serif;background:linear-gradient(180deg,#F5E9D6 0%,#F2E6D2 100%);min-height:100vh;padding:20px;color:#3A2A18}
.container{max-width:800px;margin:0 auto}

/* 暗色模式全局色彩平滑过渡（仅过渡颜色，不动布局/动画） */
body,body *{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}

/* ===== 悬浮按钮组（置顶/置底/清空） ===== */
.fab-group{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:9999}
.fab-btn{width:40px;height:40px;border-radius:50%;border:none;background:#EA580C;color:#fff;font-size:1.2rem;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 12px rgba(234,88,12,.35);transition:transform .15s ease,background .15s ease,box-shadow .15s;font-family:inherit;user-select:none}
.fab-btn:hover{background:#D4520A;transform:scale(1.08);box-shadow:0 5px 18px rgba(234,88,12,.45)}
.fab-btn:active{transform:scale(.94)}

/* ===== 卡片 ===== */
.card{background:#fff;border-radius:12px;padding:20px;margin-bottom:14px;box-shadow:0 2px 12px rgba(139,69,19,.06),0 1px 3px rgba(0,0,0,.04);border:1px solid #F3E2C0;transition:box-shadow .2s,background-color .3s ease,color .3s ease,border-color .3s ease}
.card:hover{box-shadow:0 4px 18px rgba(139,69,19,.10),0 1px 4px rgba(0,0,0,.05)}
.card h2{font-size:1rem;color:#5C3309;margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid #E2B97A;font-weight:600;cursor:default}
.card h2[onclick],.card h2[style*="cursor:pointer"]{cursor:pointer}
.row{display:flex;flex-wrap:wrap;gap:10px}
.field{flex:1;min-width:100px}
.field label{display:block;font-size:0.78rem;color:#8B4513;margin-bottom:3px;font-weight:500}
.req::after{content:' *';color:#EA580C;font-weight:700}

/* ===== 输入框 / 下拉框（统一基线，不硬编码 height/width） ===== */
.field input,.field select{width:100%;padding:10px;border:1.5px solid #E2B97A;border-radius:8px;font-size:0.9rem;text-align:center;background:#FCFCFF;color:#3A2A18;transition:border-color .15s,box-shadow .15s,background .15s;font-family:inherit}
.field input:focus,.field select:focus{outline:none;border-color:#8B4513;box-shadow:0 0 0 4px rgba(139,69,19,.14);background:#fff}
.field input[readonly]{background:#F5E9D6;color:#8B4513;cursor:default}
.field input::placeholder{color:#94A3B8}
/* 必填项即时反馈（与彩盒一致） */
.field input.input-ok{border-color:#8B4513;box-shadow:0 0 0 2px rgba(139,69,19,.14);background:#FCFCFF}
/* 随自定义裁切开关切换的「当前重点填写项」高亮（正向靛蓝强调，非错误警告）
   注意：只改 border-color + box-shadow + background，绝不改 border-width/padding，
   避免状态切换时盒模型顶动导致输入框轻微跳动（对齐彩盒 color-box.css:34 原则） */
.field input.hl-emph{border-color:#5C3309;background:#F5E9D6;box-shadow:0 0 0 3px rgba(139,69,19,.16)}
.field input.hl-emph:focus{outline:none;border-color:#5C3309;box-shadow:0 0 0 4px rgba(139,69,19,.22);background:#fff}
.field input.input-warn{border-color:#DC2626;box-shadow:0 0 0 2px rgba(220,38,38,.12);background:#FFF6F6}
/* 自定义裁切开关打开后禁用的输入框：变灰 */
.field input.input-disabled,.field select.input-disabled{background:#F1F5F9!important;color:#94A3B8!important;border-color:#E2E8F0!important;cursor:not-allowed;opacity:.7}
/* 「其他」卡片主次区分：主输入(加工费/数量)保持标准靛蓝描边，次级输入降权退后 */
.card h2 ~ .row .field:not(.field-primary) input:not([readonly]):not(.input-disabled),
.card h2 ~ .row .field:not(.field-primary) select:not(.input-disabled){border-color:#E2E8F0;color:#475569;background:#F8FAFC}
.card h2 ~ .row .field:not(.field-primary) input:not([readonly]):not(.input-disabled):focus,
.card h2 ~ .row .field:not(.field-primary) select:not(.input-disabled):focus{border-color:#94A3B8;box-shadow:0 0 0 3px rgba(148,163,184,.14);background:#fff}
.card h2 ~ .row .field:not(.field-primary) label{color:#64748B}
/* 下拉框统一青绿箭头 */
.field select,.toolbar-input,.unit-select,.set-input,.panel select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%234F46E5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}
/* 主表单数字框隐藏原生上下箭头 */
.field input[type=number]::-webkit-inner-spin-button,.field input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.field input[type=number]{-moz-appearance:textfield}
.field input::-webkit-outer-spin-button,.field input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* 其他成本/优惠 单位下拉框：Teal 语义色 */
.unit-select{flex:0 0 auto;min-width:84px;padding:10px 26px 10px 12px!important;text-align:center;font-weight:600;font-size:0.8rem;border-radius:8px;cursor:pointer;box-sizing:border-box;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%234F46E5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right 10px center}
.field select.unit-select{width:auto}
.unit-select.unit-green{border:1.5px solid #8B4513;background-color:#F5E9D6;color:#8B4513}
.unit-select.unit-orange{border:1.5px solid #EA580C;background-color:#FFF7ED;color:#EA580C}
.unit-select.unit-blue{border:1.5px solid #8B4513;background-color:#F5E9D6;color:#8B4513}
.flex-input{flex:1;min-width:0;width:auto}
/* 并排容器内的 input：用 flex 填充剩余空间（覆盖通用 width:100%） */
.field > div[style*="display:flex"]{align-items:stretch}
.field > div[style*="display:flex"] > input{flex:1;min-width:0;width:auto}

/* 搜索/筛选排统一输入框 */
.toolbar-input{flex:0 0 auto;padding:10px 14px;border:1.5px solid #E2B97A;border-radius:8px;font-size:0.85rem;background:#FCFCFF;color:#3A2A18;font-family:inherit;transition:border-color .15s,box-shadow .15s,background .15s;box-sizing:border-box}
.toolbar-input:focus{outline:none;border-color:#8B4513;box-shadow:0 0 0 3px rgba(139,69,19,.12);background:#fff}
#searchInput.toolbar-input{flex:1;padding:11px 14px}

/* ===== 辅助标签 / 提示气泡 ===== */
.auto-tag{font-size:0.65rem;margin-left:4px;font-weight:600;padding:1px 7px;border-radius:10px;letter-spacing:.3px;background:#F3E2C0;color:#8B4513;border:1px solid #E2B97A}
.auto-tag[data-mode="auto"]{background:#F3E2C0;color:#8B4513;border:1px solid #E2B97A}
.auto-tag[data-mode="manual"]{background:#FFF5EF;color:#EA580C;border:1px solid #FED7AA}
/* 自定义裁切药丸开关（对齐彩盒 .toggle-row 体系，打开色用瓦楞 Indigo） */
.toggle-row{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;font-size:0.85rem;color:#3A2A18}
.toggle-text{line-height:1;white-space:nowrap}
.toggle{position:relative;display:inline-block;width:42px;height:24px;flex:0 0 auto}
.toggle input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.toggle-track{position:absolute;inset:0;background:#CBD5E1;border-radius:24px;transition:background .2s;pointer-events:none}
.toggle-track::after{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.toggle input:checked + .toggle-track{background:#8B4513}
.toggle input:checked + .toggle-track::after{transform:translateX(18px)}
.help-tip{position:relative;cursor:help;color:#94A3B8;font-size:0.8rem;margin-left:4px}
.help-tip:hover::after{content:attr(data-tip);position:absolute;left:0;top:24px;background:#3A2A18;color:#fff;padding:8px 12px;border-radius:6px;font-size:0.75rem;white-space:pre-line;line-height:1.6;z-index:999;min-width:220px;box-shadow:0 4px 12px rgba(0,0,0,.2)}

/* ===== 页签切换 ===== */
.mode-tabs{display:flex;gap:0;margin-bottom:14px;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(139,69,19,.10)}
.mode-tab{flex:1;padding:12px;text-align:center;font-size:0.95rem;font-weight:600;cursor:pointer;border:none;background:#F3E2C0;color:#8B4513;transition:all .2s;text-decoration:none;display:block;font-family:inherit}
.mode-tab.active{background:linear-gradient(135deg,#8B4513,#8B4513);color:#fff}

/* ===== 步进器（高度对齐彩盒 42px，不破坏同行统一高度） ===== */
.stepper{display:flex;align-items:stretch;height:42px;border:1.5px solid #E2B97A;border-radius:8px;overflow:hidden;background:#fff}
.stepper button{flex:0 0 auto;padding:0 14px;border:none;background:#fff;cursor:pointer;font-size:1.35rem;line-height:1;color:#B07A45;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .12s,color .15s;font-family:inherit;user-select:none}
.stepper button:hover{background:#8B4513;color:#fff}
.stepper button:active{transform:scale(.92)}
.stepper input{flex:1;min-width:0;text-align:center;border:none;font-size:0.9rem;font-family:inherit;color:#3A2A18;background:#fff}
.stepper input:focus{outline:none;box-shadow:inset 0 0 0 2px rgba(139,69,19,.18)}

/* ===== 按钮体系 ===== */
.btn{display:block;width:100%;padding:14px;border:none;border-radius:10px;background:linear-gradient(135deg,#8B4513,#8B4513);color:#fff;font-size:1.1rem;font-weight:600;cursor:pointer;margin-top:8px;transition:transform .1s,box-shadow .15s;font-family:inherit;letter-spacing:.3px}
.btn:hover{box-shadow:0 4px 16px rgba(139,69,19,.35)}
.btn:active{transform:scale(.98)}
.btn-copy{flex:1.4;padding:14px;border:none;border-radius:10px;background:linear-gradient(135deg,#8B4513,#5C3309);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .1s,box-shadow .15s;font-family:inherit}
.btn-copy:hover{box-shadow:0 4px 14px rgba(139,69,19,.35)}
.btn-copy:active{transform:scale(.98)}
.btn-secondary{flex:1;padding:12px;border:1.5px solid #E2B97A;background:#fff;color:#8B4513;border-radius:10px;font-size:0.85rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s;font-family:inherit}
.btn-secondary:hover{background:#F5E9D6;border-color:#8B4513}
.btn-secondary.blue{border-color:#E2B97A;color:#8B4513}
.btn-secondary.blue:hover{background:#F5E9D6}
.btn-secondary.gray{border-color:#D8E8E6;color:#64748B}
.btn-secondary.gray:hover{background:#F5FAF9}

/* ===== 吸底操作栏 ===== */
.sticky-actions{position:sticky;bottom:0;z-index:50;background:linear-gradient(0deg,rgba(240,253,250,.98) 85%,rgba(240,253,250,0) 100%);padding:12px 0 16px;margin:-12px 0 0;backdrop-filter:blur(4px)}
.sticky-actions .btn{margin-top:0}

/* ===== 结果区 ===== */
.result-card{padding:0;overflow:hidden;border:1px solid #E2B97A;animation:cardIn .35s ease-out}
#actionBtns{animation:cardIn .35s ease-out;display:flex;gap:8px}
.result-header{background:linear-gradient(135deg,#8B4513,#8B4513);color:#fff;padding:24px 20px;text-align:center}
.result-header .rh-label{font-size:0.85rem;opacity:0.85;letter-spacing:1px;font-weight:500}
.result-header .rh-total{font-size:2.8rem;font-weight:700;margin:6px 0;font-family:'Plus Jakarta Sans',monospace;letter-spacing:-1px}
.result-header .rh-sub{font-size:0.8rem;opacity:0.85}
.result-header .rh-tax{font-size:0.72rem;opacity:0.65;margin-top:4px}

/* ===== 成本链 ===== */
.cost-chain{display:flex;padding:14px 16px;background:#FCFCFF;border-bottom:1px solid #F3E2C0;gap:4px;align-items:center}
.cost-chain .cc-item{flex:1;text-align:center}
.cost-chain .cc-label{font-size:0.7rem;color:#64748B;font-weight:500}
.cost-chain .cc-val{font-size:1rem;font-weight:600;color:#3A2A18;font-family:'Plus Jakarta Sans',monospace}
.cost-chain .cc-val.accent{font-size:1.1rem;font-weight:700;color:#EA580C}
.cost-chain .cc-arrow{color:#94A3B8;font-size:1.2rem}

/* ===== 成本明细表 ===== */
.cost-table{width:100%;border-collapse:collapse;font-size:0.8rem}
.cost-table th{padding:6px 8px;text-align:left;border-bottom:2px solid #E2B97A;background:#F5E9D6;color:#5C3309;font-weight:600}
.cost-table th.num{text-align:right}
.cost-table td{padding:5px 8px;border-bottom:1px solid #F3E2C0}
.cost-table td.num{text-align:right;font-family:'Plus Jakarta Sans',monospace}
.cost-table td.muted{color:#64748B;font-size:0.75rem}
.cost-table .cat-header td{padding:4px 8px;font-size:0.72rem;font-weight:600;border-bottom:1px solid #F3E2C0}
.cost-table .cat-header.cat-material{color:#8B4513;background:#F3E2C0}
.cost-table .cat-header.cat-process{color:#8E44AD;background:#F8F0FF}
.cost-table .cat-header.cat-other{color:#8B4513;background:#F3E2C0}
.cost-table .total-row{background:#FCFCFF}
.cost-table .total-row td{padding:8px;font-weight:700}
.cost-table .total-row .total-val{color:#EA580C;font-size:1rem;font-family:'Plus Jakarta Sans',monospace}

/* ===== 公式区 ===== */
.formula-toggle{border-top:1px solid #F3E2C0;padding:10px 16px;text-align:center;cursor:pointer;user-select:none}
.formula-toggle span{font-size:0.78rem;color:#8B4513;font-weight:500}
.formula-detail{max-height:0;opacity:0;padding:0 16px;overflow:hidden;background:#FCFCFF;font-size:0.75rem;color:#8B4513;line-height:2;border-top:1px solid transparent;transition:max-height .28s ease,opacity .28s ease,padding .28s ease}
.formula-detail.open{max-height:4000px;opacity:1;padding:12px 16px;border-top-color:#F3E2C0}

/* ===== 结果占位卡 ===== */
.result-placeholder{background:linear-gradient(135deg,#F5E9D6,#F2E6D2);border:2px dashed #E2B97A;border-radius:12px;padding:48px 20px;text-align:center;color:#94A3B8}
.result-placeholder .ph-icon{font-size:2.6rem;margin-bottom:10px}
.result-placeholder .ph-title{font-size:1rem;font-weight:600;color:#8B4513;margin-bottom:6px}
.result-placeholder .ph-sub{font-size:0.8rem;color:#99B5B2}

/* ===== 统计栏 ===== */
.stats-bar{display:flex;gap:0;margin-bottom:12px;border-radius:10px;overflow:hidden;box-shadow:0 1px 4px rgba(139,69,19,.08)}
.stat-item{flex:1;padding:10px 8px;text-align:center;background:#FCFCFF;border-right:1px solid #F3E2C0}
.stat-item:last-child{border-right:none}
.stat-item .stat-num{font-size:1.2rem;font-weight:700;color:#8B4513}
.stat-item .stat-label{font-size:0.7rem;color:#64748B;margin-top:2px;font-weight:500}
.stat-item.accent .stat-num{color:#EA580C}

/* ===== 历史记录表 ===== */
.history-table{width:100%;border-collapse:collapse;font-size:0.8rem}
.history-table th{padding:8px;border-bottom:2px solid #E2B97A;text-align:left;background:#F5E9D6;white-space:nowrap;color:#5C3309;font-weight:600}
.history-table td{padding:6px 8px;border-bottom:1px solid #F3E2C0}
.history-table tr:hover{background:#F5E9D6}
.history-table .col-cb{width:30px;text-align:center}
.history-table .col-name{cursor:pointer}
.history-table .col-time{white-space:nowrap;font-size:0.75rem;color:#64748B}
.history-table .col-num{text-align:right;white-space:nowrap}
.history-table .col-action{text-align:center;white-space:nowrap}
.history-table .action-btn{background:#8B4513;color:#fff;border:none;padding:3px 8px;border-radius:6px;cursor:pointer;font-size:0.72rem;margin:0 1px;transition:background .15s;font-family:inherit}
.history-table .action-btn:hover{background:#5C3309}
.history-table .action-btn.del{background:#EA580C}
.history-table .action-btn.del:hover{background:#D4520A}
.history-table .action-btn.exp{background:#8B4513}

/* ===== 客户标签 ===== */
.cust-tag{display:inline-block;padding:1px 6px;border-radius:4px;font-size:0.72rem;font-weight:500}
.cust-tag.c1{background:#F3E2C0;color:#8B4513}
.cust-tag.c2{background:#E0F2FE;color:#0EA5E9}
.cust-tag.c3{background:#FFF5EF;color:#EA580C}
.cust-tag.c4{background:#F8F0FF;color:#8E44AD}
.cust-tag.c5{background:#FEF2F2;color:#DC2626}
.cust-tag.c0{background:#F0F2F5;color:#999}
.no-result{text-align:center;color:#94A3B8;padding:20px;font-size:0.85rem}

/* ===== 页脚 ===== */
.footer{text-align:center;color:#94A3B8;font-size:0.7rem;margin-top:20px;font-weight:500}
.foot-update{text-align:center;color:#94A3B8;font-size:0.75rem;padding:14px 0 22px;margin-top:10px;border-top:1px solid #F3E2C0}

/* ===== 弹窗通用 ===== */
.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(15,23,42,.55);z-index:100;justify-content:center;align-items:center;backdrop-filter:blur(2px)}
.overlay.show{display:flex}
.panel{background:#fff;border-radius:16px;padding:28px;max-width:700px;width:95%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.35);animation:panelPop .18s ease-out}
.panel h3{font-size:1.1rem;margin-bottom:16px;color:#3A2A18;font-weight:700}
@keyframes panelPop{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes cardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ===== 后台设置表单（对齐彩盒 .set 体系） ===== */
.set-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.set-card{background:#fff;border:1px solid #F3E2C0;border-left:4px solid #8B4513;border-radius:12px;padding:14px;box-shadow:0 2px 10px rgba(139,69,19,.06)}
.set-card h4{font-size:0.82rem;margin-bottom:10px;color:#3A2A18;font-weight:700}
.set-card .srow{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.set-card .srow label{font-size:0.82rem;color:#3A2A18;min-width:120px;font-weight:500;white-space:normal;line-height:1.3}
.set-input{width:90px;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:7px;font-size:0.82rem;text-align:right;background:#FCFCFF;transition:border-color .15s,box-shadow .15s;color:#3A2A18;font-family:inherit}
.set-input:focus{outline:none;border-color:#8B4513;box-shadow:0 0 0 3px rgba(139,69,19,.12);background:#fff}
.set-card .srow .unit{font-size:0.78rem;color:#64748B;min-width:38px}
.set-card .srow span{font-size:0.78rem;color:#64748B;margin:0 2px}
.set-card .srow textarea{width:100%;min-height:50px;padding:8px;border:1.5px solid #E2B97A;border-radius:7px;font-size:0.82rem;font-family:inherit;resize:vertical;color:#3A2A18;background:#FCFCFF;box-sizing:border-box}
.set-card .srow textarea:focus{outline:none;border-color:#8B4513;box-shadow:0 0 0 3px rgba(139,69,19,.12);background:#fff}

/* ===== 统一小按钮（弹窗/工具栏用） ===== */
.btn-sm{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:9px 18px;font-size:0.85rem;font-weight:600;border-radius:8px;border:none;cursor:pointer;transition:background .15s,transform .1s;font-family:inherit}
.btn-sm:hover{filter:brightness(.95)}
.btn-sm:active{transform:scale(.97)}
.btn-sm.green{background:#8B4513;color:#fff}
.btn-sm.blue{background:#8B4513;color:#fff}
.btn-sm.orange{background:#EA580C;color:#fff}
.btn-sm.red{background:#EA580C;color:#fff}
.btn-sm.gray{background:#F3E2C0;color:#8B4513}
.btn-sm.gray:hover{background:#E2B97A}

/* ===== 密码弹窗 ===== */
.pwd-panel{background:#fff;border-radius:16px;padding:0;max-width:320px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.35);overflow:hidden;animation:panelPop .18s ease-out}
.pwd-body{padding:24px 24px 22px;text-align:center}
.pwd-body h3{font-size:1.1rem;margin:0 0 18px;color:#3A2A18;font-weight:700}
.pwd-input{width:100%;padding:11px 12px;border:1.5px solid #E2B97A;border-radius:9px;font-size:16px;text-align:center;background:#FCFCFF;transition:border-color .15s,box-shadow .15s;box-sizing:border-box;font-family:inherit;color:#3A2A18}
.pwd-input:focus{outline:none;border-color:#8B4513;box-shadow:0 0 0 3px rgba(139,69,19,.12);background:#fff}
.pwd-err{font-size:0.75rem;color:#DC2626;margin-top:10px;display:none}
.pwd-actions{display:flex;gap:10px;margin-top:16px}
.pwd-actions .btn-sm{flex:1}

/* ===== 保存弹窗 ===== */
.modal-mask{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:10000;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(2px)}
.modal-card{position:relative;width:340px;max-width:92vw;background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.35);padding:18px 18px 14px;box-sizing:border-box;animation:panelPop .18s ease-out;overflow:hidden}
.modal-close{position:absolute;top:10px;right:12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:1.05rem;line-height:1;color:#94A3B8;cursor:pointer;border-radius:5px;user-select:none}
.modal-close:hover{background:#F5E9D6;color:#3A2A18}
.modal-title{font-size:1rem;font-weight:700;color:#3A2A18;margin-bottom:4px}
.modal-sub{font-size:0.72rem;color:#64748B;margin-bottom:12px;line-height:1.4}
.modal-form{display:flex;flex-direction:column;gap:9px}
.modal-row{display:flex;align-items:center;gap:8px}
.modal-row label{flex:0 0 64px;font-size:0.8rem;color:#8B4513;text-align:right}
.modal-row input,.modal-row textarea{flex:1;min-width:0;box-sizing:border-box;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:6px;font-size:0.85rem;font-family:inherit;line-height:1.4;resize:vertical;color:#3A2A18;background:#FCFCFF}
.modal-row input:focus,.modal-row textarea:focus{outline:none;border-color:#8B4513}
.spec-group{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.spec-group input{flex:1;min-width:0;box-sizing:border-box;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:6px;font-size:0.85rem;font-family:inherit;line-height:1.4;color:#3A2A18;background:#FCFCFF}
.spec-group input:focus{outline:none;border-color:#8B4513}
.spec-x{flex:0 0 auto;color:#94A3B8;font-size:0.85rem}
.paper-group{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.gram-wrap{flex:1;min-width:0;display:flex;align-items:center;gap:3px;box-sizing:border-box;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:6px;font-size:0.85rem;font-family:inherit;line-height:1.4;background:#FCFCFF}
.gram-wrap input{flex:1;min-width:0;border:none;outline:none;padding:0;font-size:0.85rem;font-family:inherit;background:transparent;color:#3A2A18}
.gram-wrap input:focus{outline:none}
.gram-unit{flex:0 0 auto;color:#64748B;font-size:0.85rem}
.paper-group select{flex:1;min-width:0;box-sizing:border-box;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:6px;font-size:0.85rem;font-family:inherit;line-height:1.4;background:#FCFCFF;color:#3A2A18}
.paper-group select:focus{outline:none;border-color:#8B4513}
.flute-group{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.flute-group input[type=text]{flex:1;min-width:0;box-sizing:border-box;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:6px;font-size:0.85rem;font-family:inherit;line-height:1.4;color:#3A2A18;background:#FCFCFF}
.flute-group input[type=text]:focus{outline:none;border-color:#8B4513}
.flute-group select{flex:1;min-width:0;box-sizing:border-box;padding:7px 9px;border:1.5px solid #E2B97A;border-radius:6px;font-size:0.85rem;font-family:inherit;line-height:1.4;background:#FCFCFF;color:#3A2A18}
.flute-group select:focus{outline:none;border-color:#8B4513}
.cross-label{flex:0 0 auto;display:flex;align-items:center;gap:3px;font-size:0.8rem;color:#8B4513;white-space:nowrap;cursor:pointer}
.cross-label input[type=checkbox]{width:15px;height:15px;cursor:pointer}
.modal-actions{display:flex;gap:10px;margin-top:16px}
.modal-actions button{flex:1;padding:11px 0;border-radius:8px;font-size:0.88rem;font-weight:600;cursor:pointer;border:none;transition:background .15s,transform .1s;font-family:inherit}
.modal-actions button:active{transform:scale(.97)}
.btn-cancel{background:#F3E2C0;color:#8B4513}
.btn-cancel:hover{background:#E2B97A}
.btn-confirm{background:#8B4513;color:#fff}
.btn-confirm:hover{background:#5C3309}
.modal-input-err,.modal-input-err:focus{border:2px solid #DC2626 !important;background:#FFF6F6 !important;outline:none}

/* ===== 全局提示条 ===== */
.gtip{background:#3A2A18;color:#fff;padding:10px 14px;border-radius:8px;font-size:0.7rem;max-width:320px;line-height:1.7;box-shadow:0 4px 20px rgba(0,0,0,.4);pointer-events:auto;text-align:left;z-index:99999}
.gtip hr{border-color:#3A2A18;margin:4px 0}
.tip-edit{margin-top:8px;text-align:right}
.tip-edit .action-btn{background:#8B4513;color:#fff;border:none;border-radius:5px;padding:5px 10px;font-size:0.7rem;cursor:pointer}
.tip-edit .action-btn:hover{background:#5C3309}

/* ===== 移动端 ===== */
@media (max-width: 768px) {
  html{scroll-behavior:smooth;scroll-padding-top:20px}
  body{-webkit-overflow-scrolling:touch}
  .container{max-width:100%;padding:8px}
  .card{padding:10px;scroll-margin-top:20px}
  input[type=password],.field input,.field select,.panel input,.panel select{font-size:16px!important;padding:10px 8px}
  .mode-tab{font-size:0.85rem;padding:10px}
  h2{font-size:0.95rem}
  .btn{padding:12px;font-size:1rem}
  .set-grid{grid-template-columns:1fr}
  .set-card .srow input{width:60px}
  .overlay .panel{width:95%;max-height:90vh;overflow-y:auto}
  #actionBtns{flex-wrap:wrap}
  #actionBtns .btn{flex:1 1 45%!important;min-width:45%;font-size:0.85rem!important;padding:10px 8px!important}
  #multiQtyTable{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .qb-textarea{font-size:0.8rem!important;min-height:200px}
  .cost-table td .desc{display:block;font-size:0.7rem;margin-top:2px}

  /* —— 手机端参数卡片：每行最多 2 个 field，杜绝输入框被压成 60px —— */
  .row{display:flex;flex-wrap:wrap;gap:10px}
  /* !important 覆盖 HTML 内联 flex（如其他成本 flex:1.5），移动端统一两列等宽 */
  .field{flex:1 1 calc(50% - 5px) !important;min-width:0 !important;max-width:100% !important}
  /* 标题允许换行，但给固定最小高度（单行高），保证同一行各 field 的输入框顶部对齐、不参差不齐 */
  .field label{white-space:normal;min-height:1.05rem;line-height:1.05rem;display:flex;align-items:baseline;flex-wrap:wrap}
  .auto-tag,.help-tip{flex:0 0 auto;white-space:nowrap;align-self:baseline}
  /* 带下拉的 field 也保持两列等宽 */
  .field select{width:100%}
  /* 复合横排字段（input + 单位选择器等）整行显示，避免被挤成 60px */
  .field:has(> div[style*="display:flex"]){flex:1 0 100% !important}
  /* 复合横排字段内部：input/select 改竖排堆叠（先 input 占满，下一行 select 全宽） */
  .field > div[style*="display:flex"]{flex-wrap:wrap;gap:6px}
  .field > div[style*="display:flex"] > input,
  .field > div[style*="display:flex"] > select{flex:1 0 100% !important;min-width:0 !important}
}

/* ===== 暗色模式 ===== */
body.dark{background:linear-gradient(180deg,#0A1019 0%,#151D29 100%);color:#CBD5E1}
body.dark .card{background:#161F2B;border-color:#2D3A4D;box-shadow:0 2px 12px rgba(0,0,0,.4)}
body.dark .card h2{color:#E2B97A;border-bottom-color:#3A2A18}
body.dark .field label{color:#94A3B8}
body.dark .field input,.dark .field select{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .field input:focus,.dark .field select:focus{border-color:#8B4513;box-shadow:0 0 0 4px rgba(180,83,9,.18)}
body.dark .field input.hl-emph{border-color:#E2B97A;background:#3A2A18;box-shadow:0 0 0 3px rgba(139,69,19,.32)}
body.dark .field input.hl-emph:focus{outline:none;border-color:#E2B97A;box-shadow:0 0 0 4px rgba(139,69,19,.42);background:#1E293B}
body.dark .field input[readonly]{background:#1A2333;color:#E2B97A}
body.dark .field input.input-disabled,body.dark .field select.input-disabled{background:#1E293B!important;color:#64748B!important;border-color:#334155!important;opacity:.6}
body.dark .card h2 ~ .row .field:not(.field-primary) input:not([readonly]):not(.input-disabled),
body.dark .card h2 ~ .row .field:not(.field-primary) select:not(.input-disabled){border-color:#334155;color:#94A3B8;background:#0F172A}
body.dark .card h2 ~ .row .field:not(.field-primary) input:not([readonly]):not(.input-disabled):focus,
body.dark .card h2 ~ .row .field:not(.field-primary) select:not(.input-disabled):focus{border-color:#64748B;background:#1E293B}
body.dark .card h2 ~ .row .field:not(.field-primary) label{color:#94A3B8}
body.dark .btn{background:linear-gradient(135deg,#5C3309,#8B4513)}
body.dark .btn-copy{background:linear-gradient(135deg,#5C3309,#8B4513)}
body.dark .btn-secondary{background:#1E293B;border-color:#334155;color:#E2B97A}
body.dark .btn-secondary:hover{background:#0F172A}
body.dark .btn-secondary.gray{border-color:#334155;color:#94A3B8}
body.dark .mode-tab{background:#1E293B;color:#94A3B8}
body.dark .mode-tab.active{background:linear-gradient(135deg,#5C3309,#8B4513);color:#fff}
body.dark .stepper button{background:#0F172A;border-color:#334155;color:#E2B97A}
body.dark .stepper button:hover{background:#8B4513;color:#0F172A;box-shadow:0 2px 6px rgba(139,69,19,.32)}
body.dark .stepper input{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .unit-select.unit-green{background:#3A2A18;border-color:#8B4513;color:#E2B97A}
body.dark .unit-select.unit-orange{background:#3D1A0A;border-color:#F97316;color:#FDBA74}
body.dark .unit-select.unit-blue{background:#3A2A18;border-color:#8B4513;color:#E2B97A}
body.dark .toolbar-input{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .toolbar-input:focus{border-color:#8B4513;box-shadow:0 0 0 3px rgba(217,119,6,.15)}
body.dark .field select,.dark .toolbar-input,.dark .unit-select,.dark .set-input,.dark .panel select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23FCD9A8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>")}
body.dark .auto-tag{background:#3A2A18;color:#E2B97A;border-color:#5C3309}
body.dark .auto-tag[data-mode="manual"]{background:#3D1A0A;color:#F97316;border-color:#7C2D12}
body.dark .toggle-row{color:#E2E8F0}
body.dark .toggle-track{background:#334155}
body.dark .toggle input:checked + .toggle-track{background:#8B4513}
body.dark .result-card{border-color:#3A2A18}
body.dark .result-header{background:linear-gradient(135deg,#5C3309,#8B4513)}
body.dark .cost-chain{background:#1E293B;border-bottom-color:#334155}
body.dark .cost-chain .cc-val{color:#E2E8F0}
body.dark .cost-table th{background:#3A2A18;border-bottom-color:#5C3309;color:#E2B97A}
body.dark .cost-table td{border-bottom-color:#334155}
body.dark .cost-table .cat-header.cat-material{background:#3A2A18;color:#E2B97A}
body.dark .cost-table .cat-header.cat-process{background:#3A2A18;color:#E2B97A}
body.dark .cost-table .cat-header.cat-other{background:#3A2A18;color:#E2B97A}
body.dark .cost-table .total-row{background:#1E293B}
body.dark .cost-table .total-row .total-val{color:#F97316}
body.dark .formula-toggle{border-top-color:#334155}
body.dark .formula-toggle span{color:#E2B97A}
body.dark .formula-detail{background:#1E293B;color:#94A3B8}
body.dark .formula-detail.open{border-top-color:#334155}
body.dark .result-placeholder{background:linear-gradient(135deg,#1E293B,#0F172A);border-color:#334155;color:#475569}
body.dark .result-placeholder .ph-title{color:#94A3B8}
body.dark .stats-bar{box-shadow:0 1px 4px rgba(0,0,0,.3)}
body.dark .stat-item{background:#1E293B;border-right-color:#334155}
body.dark .stat-item .stat-num{color:#E2B97A}
body.dark .stat-item .stat-label{color:#94A3B8}
body.dark .stat-item.accent .stat-num{color:#F97316}
body.dark .history-table th{background:#3A2A18;border-bottom-color:#5C3309;color:#E2B97A}
body.dark .history-table td{border-bottom-color:#334155}
body.dark .history-table tr:hover{background:#1A2333}
body.dark .history-table .action-btn{background:#5C3309}
body.dark .history-table .action-btn.del{background:#B91C1C}
body.dark .footer{color:#475569}
body.dark .foot-update{color:#475569;border-top-color:#334155}
body.dark .help-tip{color:#475569}
body.dark .btn-sm.gray{background:#334155;color:#94A3B8}
body.dark .overlay{background:rgba(0,0,0,.7)}
body.dark .panel{background:#1E293B;box-shadow:0 20px 60px rgba(0,0,0,.5)}
body.dark .panel h3{color:#E2E8F0}
body.dark .set-card{background:#1E293B;border-color:#334155}
body.dark .set-card h4{color:#E2E8F0}
body.dark .set-card .srow{border-bottom-color:#334155}
body.dark .set-card .srow label{color:#94A3B8}
body.dark .set-card .srow input,.dark .set-input{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .set-card .srow input:focus,.dark .set-input:focus{border-color:#8B4513}
body.dark .set-card .srow textarea{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .set-card .srow textarea:focus{border-color:#8B4513}
body.dark .set-card .srow .unit{color:#475569}
body.dark .set-card .srow span{color:#475569}
body.dark .pwd-input{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .pwd-input:focus{border-color:#8B4513}
body.dark .modal-card{background:#1E293B}
body.dark .modal-title{color:#E2E8F0}
body.dark .modal-sub{color:#94A3B8}
body.dark .modal-row label{color:#94A3B8}
body.dark .modal-row input,.dark .modal-row textarea{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .modal-row input:focus,.dark .modal-row textarea:focus{border-color:#8B4513}
body.dark .spec-group input{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .gram-wrap{background:#0F172A;border-color:#334155}
body.dark .gram-wrap input{color:#E2E8F0}
body.dark .paper-group select,.dark .flute-group select,.dark .flute-group input[type=text]{background:#0F172A;border-color:#334155;color:#E2E8F0}
body.dark .btn-cancel{background:#334155;color:#94A3B8}
body.dark .btn-confirm{background:#5C3309}
body.dark .cross-label{color:#94A3B8}
body.dark .cust-tag.c1{background:#3A2A18;color:#E2B97A}
body.dark .cust-tag.c2{background:#1E3A5F;color:#7DD3FC}
body.dark .cust-tag.c3{background:#3D1A0A;color:#F97316}
body.dark .cust-tag.c4{background:#1E1035;color:#A78BFA}
body.dark .cust-tag.c5{background:#2D1111;color:#FCA5A5}
body.dark .cust-tag.c0{background:#1E293B;color:#475569}
body.dark .gtip{background:#0F172A}