:root{color:#17201f;background:#f5f7f4;font-family:Inter,Segoe UI,PingFang SC,Microsoft YaHei,Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(180deg,#fffc,#f2f6f4f0),#f5f7f4}button,input,textarea{font:inherit}button{border:0}button:disabled{cursor:not-allowed;opacity:.45}input,textarea{width:100%;min-width:0;border:1px solid #cad6d1;border-radius:6px;background:#fff;color:#17201f;outline:none;padding:.58rem .65rem;transition:border-color .16s ease,box-shadow .16s ease}textarea{min-height:118px;line-height:1.5;resize:vertical}input:focus,textarea:focus{border-color:#17827f;box-shadow:0 0 0 3px #17827f24}.app-shell{width:min(1500px,100%);margin:0 auto;padding:24px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.eyebrow{margin:0 0 6px;color:#6e7b78;font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{margin-bottom:0;color:#122423;font-size:2rem;line-height:1.15;letter-spacing:0}h2{margin-bottom:0;color:#17201f;font-size:1rem;line-height:1.25;letter-spacing:0}h3{margin-bottom:0;color:#17201f;font-size:.96rem;line-height:1.25;letter-spacing:0}.header-actions,.cargo-heading,.cargo-actions,.result-bar{display:flex;align-items:center;gap:10px}.header-actions{flex-wrap:wrap;justify-content:flex-end}.button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border-radius:7px;cursor:pointer;font-weight:700;transition:transform .15s ease,background-color .15s ease,box-shadow .15s ease}.button:active,.icon-button:active{transform:translateY(1px)}.button.primary{background:#17827f;color:#fff;padding:0 16px;box-shadow:0 10px 22px #17827f38}.button.primary:hover{background:#0f716e}.button.ghost,.button.compact{background:#fff;color:#263633;border:1px solid #cad6d1;padding:0 13px}.button.ghost:hover,.button.compact:hover,.icon-button:hover{background:#eef4f2}.button.compact{min-height:36px}.icon-button{width:36px;height:36px;color:#934335;background:transparent}.icon-button.neutral{color:#53625f}.workbench{display:grid;grid-template-columns:minmax(430px,.88fr) minmax(520px,1.12fr);gap:18px;align-items:start;min-width:0}.input-panel,.visual-panel{border:1px solid #d7e0dc;border-radius:8px;background:#ffffffeb;box-shadow:0 14px 42px #18262314;min-width:0}.input-panel{overflow:hidden;padding:18px}.visual-panel{overflow:hidden}.panel-heading{display:flex;justify-content:space-between;gap:12px;margin-bottom:14px}.panel-heading p,.result-message,.result-messages p,.empty-table p{margin-bottom:0;color:#66736f;font-size:.9rem}.dimension-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:20px}.container-catalog{overflow:hidden;border:1px solid #dce5e1;border-radius:8px;background:#f8fbfa;margin-bottom:20px}.container-catalog-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;background:#fff;color:#17201f;cursor:pointer;padding:12px 14px;text-align:left}.container-catalog-toggle:hover{background:#f4f8f6}.container-catalog-title{display:grid;gap:4px;min-width:0}.container-catalog-title strong{color:#17201f;font-size:1rem;line-height:1.2}.container-catalog-title span{color:#64716d;font-size:.82rem;font-weight:700}.container-chip-row{display:flex;flex-wrap:wrap;gap:7px;border-top:1px solid #e5ece8;padding:10px 14px 12px}.container-chip{display:inline-flex;align-items:center;min-height:24px;border:1px solid #cddbd6;border-radius:6px;background:#edf5f2;color:#203633;font-size:.78rem;font-weight:800;padding:0 8px}.container-chip.disabled{opacity:.38}.container-catalog-panel{border-top:1px solid #dce5e1;background:#fff}.container-catalog-actions{display:flex;justify-content:flex-end;gap:8px;padding:10px 12px}.container-config-table{border-top:1px solid #edf2ef}.container-config-head,.container-config-row{display:grid;grid-template-columns:54px minmax(92px,.75fr) minmax(150px,1.25fr) 214px;align-items:center;gap:10px;padding:8px 12px}.container-config-head{min-height:32px;background:#f7faf8;color:#64716d;font-size:.74rem;font-weight:800}.container-config-row{min-height:50px;border-top:1px solid #edf2ef}.container-config-row.disabled{opacity:.46}.container-enable-cell{display:inline-flex;align-items:center;justify-content:center}.container-enable-cell input{width:16px;height:16px;margin:0;padding:0;accent-color:#17827f}.container-code-cell,.container-dimension-cell{display:grid;gap:3px;min-width:0}.container-code-cell strong{color:#17201f;font-size:.9rem}.container-code-cell span,.container-dimension-cell span{color:#64716d;font-size:.76rem;font-weight:700}.container-dimension-cell strong{color:#263633;font-size:.82rem;font-weight:800}.container-limit-cell{display:flex;align-items:center;justify-content:flex-end;gap:8px}.limit-segmented{position:relative;display:inline-flex;flex:0 0 auto;gap:3px;border:1px solid #cad6d1;border-radius:7px;background:#fff;margin:0;padding:3px}.limit-segmented legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.limit-segmented label{position:relative;border-radius:5px;color:#53625f;cursor:pointer;font-size:.78rem;font-weight:800;line-height:1;padding:7px 8px;white-space:nowrap}.limit-segmented label.active{background:#dff4ea;color:#0d5e42}.limit-segmented input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.container-limit-cell>input{flex:0 0 64px;width:64px;padding:.42rem .45rem}.number-field{display:grid;grid-template-columns:1fr;gap:6px}.number-field span{color:#53625f;font-size:.84rem;font-weight:700}.number-field{position:relative}.number-field small{position:absolute;right:10px;bottom:9px;color:#77837f;font-size:.75rem;pointer-events:none}.number-field input{padding-right:38px}.cargo-heading{justify-content:space-between;margin-bottom:10px}.cargo-actions{flex-wrap:wrap;justify-content:flex-end}.import-panel{display:grid;gap:12px;border:1px solid #d8e2dd;border-radius:8px;background:#f8fbf9;margin-bottom:14px;padding:14px}.import-panel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.import-panel-header p{margin:5px 0 0;color:#66736f;font-size:.84rem}.textarea-field{display:grid;gap:6px}.textarea-field>span,.batch-stack-control>span{color:#53625f;font-size:.84rem;font-weight:700}.import-options{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.segmented-control{position:relative;display:inline-flex;gap:4px;min-width:0;border:1px solid #cad6d1;border-radius:7px;background:#fff;margin:0;padding:3px}.segmented-control legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.segmented-control label{position:relative;border-radius:5px;color:#53625f;cursor:pointer;font-size:.86rem;font-weight:800;padding:7px 10px;transition:background-color .16s ease,color .16s ease;white-space:nowrap}.segmented-control label.active{background:#dff4ea;color:#0d5e42}.segmented-control input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.batch-stack-control{display:inline-flex;align-items:center;gap:9px}.import-errors{border:1px solid #ffd2c8;border-radius:7px;background:#fff1ed;padding:9px 10px}.import-errors p{margin:0 0 5px;color:#8f2e22;font-size:.85rem;font-weight:700}.import-errors p:last-child{margin-bottom:0}.import-actions{display:flex;justify-content:flex-end;gap:10px}.cargo-table-wrap,.placement-table-wrap{width:100%;min-width:0;overflow-x:auto}.cargo-table,.placement-table{width:100%;border-collapse:collapse;table-layout:fixed}.cargo-table th,.cargo-table td,.placement-table th,.placement-table td{border-bottom:1px solid #e3e9e6;padding:9px 7px;text-align:left;vertical-align:middle}.cargo-table th,.placement-table th{color:#586763;font-size:.78rem;font-weight:800}.cargo-table th:nth-child(1){width:25%}.cargo-table th:nth-child(2),.cargo-table th:nth-child(3),.cargo-table th:nth-child(4){width:13%}.cargo-table th:nth-child(5){width:12%}.cargo-table th:nth-child(6),.cargo-table th:nth-child(7){width:9%}.cargo-table input{padding:.48rem .5rem}.switch{display:inline-flex;align-items:center;justify-content:center;width:42px;height:24px;cursor:pointer}.switch input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.switch span{position:relative;display:block;width:40px;height:22px;border-radius:999px;background:#c8d2ce;transition:background-color .16s ease}.switch span:after{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;content:"";transition:transform .16s ease}.switch input:checked+span{background:#17827f}.switch input:checked+span:after{transform:translate(18px)}.result-bar{justify-content:space-between;padding:16px 18px;border-bottom:1px solid #dfe7e3;background:#fbfcfb}.status{display:inline-flex;align-items:center;min-height:34px;border-radius:7px;padding:0 12px;font-weight:800;white-space:nowrap}.status.neutral{color:#53625f;background:#edf1ef}.status.packed{color:#0d5e42;background:#dff4ea}.status.impossible{color:#8f2e22;background:#ffe4dd}.status.not-found{color:#7a5200;background:#fff1c7}.metrics{display:grid;grid-template-columns:repeat(4,minmax(72px,1fr));gap:8px}.metric{min-width:72px;border-left:1px solid #dbe4e0;padding-left:10px}.metric span{display:block;color:#6e7b78;font-size:.76rem;font-weight:700}.metric strong{display:block;margin-top:2px;color:#17201f;font-size:.98rem}.viewer{height:460px;min-height:360px;background:linear-gradient(180deg,#eef4f1,#f9fbfa 55%,#eef2ef)}.viewer canvas{display:block}.container-tabs{display:flex;gap:8px;overflow-x:auto;border-bottom:1px solid #dfe7e3;background:#fbfcfb;padding:10px 18px}.container-tabs button{flex:0 0 auto;min-height:32px;border:1px solid #cad6d1;border-radius:7px;background:#fff;color:#53625f;cursor:pointer;font-size:.84rem;font-weight:800;padding:0 11px}.container-tabs button.active{border-color:#17827f;background:#dff4ea;color:#0d5e42}.result-message,.result-messages{padding:14px 18px 0}.result-messages p{margin-bottom:6px}.placement-table-wrap,.empty-table{padding:14px 18px 18px}.placement-table-wrap h2,.empty-table h2{margin-bottom:10px}.placement-table{min-width:860px}.placement-table th:nth-child(1){width:13%}.placement-table th:nth-child(2){width:24%}.placement-table td{color:#263633;font-size:.9rem}.color-chip{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:8px;box-shadow:inset 0 0 0 1px #00000029}@media (max-width: 1080px){.workbench{grid-template-columns:1fr}.viewer{height:420px}}@media (max-width: 720px){.app-shell{padding:16px}.app-header,.result-bar{align-items:stretch;flex-direction:column}.header-actions{justify-content:stretch}.header-actions .button{flex:1}h1{font-size:1.65rem}.input-panel{padding:14px}.dimension-grid{grid-template-columns:1fr}.container-catalog-toggle{align-items:flex-start}.container-catalog-actions{justify-content:stretch}.container-catalog-actions .button{flex:1}.container-config-head{display:none}.container-config-row{grid-template-columns:28px minmax(0,1fr);grid-template-areas:"enable code" "dimension dimension" "limit limit";align-items:start;gap:8px 10px;padding:11px 12px}.container-enable-cell{grid-area:enable;justify-content:flex-start;padding-top:2px}.container-code-cell{grid-area:code}.container-dimension-cell{grid-area:dimension;grid-template-columns:minmax(0,1fr) auto;align-items:center}.container-limit-cell{grid-area:limit;justify-content:space-between}.cargo-heading{align-items:flex-start;flex-direction:column}.cargo-actions,.import-actions{width:100%}.cargo-actions .button,.import-actions .button{flex:1}.import-options{align-items:stretch;flex-direction:column}.segmented-control{width:100%}.segmented-control label{flex:1;text-align:center}.batch-stack-control{justify-content:space-between}.cargo-table{min-width:0}.cargo-table thead{display:none}.cargo-table tbody{display:grid;gap:10px}.cargo-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;border:1px solid #e1e8e5;border-radius:7px;padding:10px}.cargo-table th,.cargo-table td{border-bottom:0}.cargo-table td{display:grid;gap:5px;padding:0}.cargo-table td:before{color:#586763;content:attr(data-label);font-size:.76rem;font-weight:800}.cargo-table td:first-child{grid-column:1 / -1}.cargo-table td:last-child:before{content:""}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{border-left:0;padding-left:0}.viewer{height:340px}}