@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap";:root{--bg: #0c1118;--bg-2: #121a24;--panel: #161f2b;--panel-2: #1b2634;--line: #2a384a;--text: #e8eef4;--muted: #8b9bb0;--amber: #d4a24c;--amber-2: #f0d7a2;--teal: #4db8a8;--danger: #c9786a;--shadow: 0 18px 40px rgba(0, 0, 0, .28);--radius: 16px;--font: "IBM Plex Sans", "Source Han Sans SC", "Noto Sans SC", sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--font)}body{min-height:100dvh;background:radial-gradient(1200px 480px at 8% -10%,rgba(77,184,168,.08),transparent 55%),radial-gradient(900px 420px at 100% 0%,rgba(212,162,76,.08),transparent 50%),var(--bg)}button,input{font:inherit}h2{margin:0;font-size:16px;letter-spacing:.02em}p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.app{height:100dvh;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr)}.topbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;border-bottom:1px solid var(--line);background:#0c1118e0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.data-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.data-msg{font-size:12px}.data-msg.ok{color:var(--teal)}.tabs{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border:1px solid var(--line);border-radius:14px;background:var(--bg-2)}.tabs button{border:0;background:transparent;color:var(--muted);padding:8px 14px;border-radius:10px;cursor:pointer}.tabs button.on{background:#243246;color:var(--text)}.tabs em{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:999px;background:var(--amber);color:#1a1408;font-size:11px;font-style:normal;font-family:var(--mono)}.workspace{min-height:0;display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr);gap:14px;padding:14px}.workspace>*{min-width:0;min-height:0;grid-column:1;grid-row:1}.brand{display:flex;align-items:center;gap:12px}.brand .mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--amber) 0 42%,transparent 42% 58%,var(--teal) 58%),#22303f;box-shadow:inset 0 0 0 1px #ffffff14}.brand strong{display:block;font-size:15px}.brand small{color:var(--muted)}.pane,.config,.table-panel,.viewer,.calc-panel,.result-panel{min-height:0;background:linear-gradient(180deg,var(--panel),var(--bg-2));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.config,.table-panel,.viewer,.calc-panel,.result-panel{display:flex;flex-direction:column;overflow:hidden}.config-head,.table-head,.viewer-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:16px 16px 12px}.stat{text-align:right;color:var(--muted);font-size:12px}.stat strong{display:block;color:var(--amber-2);font-size:22px;font-family:var(--mono);line-height:1}.toolbar,.table-head{gap:10px}.toolbar{display:grid;gap:10px;padding:0 16px 12px}.toolbar-actions{display:flex;gap:8px}.search{display:grid;gap:6px}.search span{font-size:11px;color:var(--muted)}.search input,.search select,.cargo-table input,.plan-name,.add-pallet select{width:100%;border:1px solid var(--line);background:#0e1620;color:var(--text);border-radius:10px;padding:9px 11px;outline:none}.search input:focus,.search select:focus,.cargo-table input:focus,.plan-name:focus,.add-pallet select:focus{border-color:#4d6a86}.ghost{border:1px solid var(--line);background:#1a2532;color:var(--text);border-radius:999px;padding:7px 12px;cursor:pointer}.ghost:hover{border-color:#4d6a86}.ghost.sm{padding:4px 9px;font-size:12px}.ghost.on{background:#243246;border-color:#4d6a86}.ghost.danger{color:#f0b4aa}.ghost:disabled{opacity:.45;cursor:not-allowed}.primary{border:0;background:linear-gradient(180deg,#e0b25d,#c7923a);color:#1a1408;font-weight:600;border-radius:999px;padding:8px 14px;cursor:pointer}.primary.sm{padding:4px 10px;font-size:12px}.groups,.table-wrap{flex:1;min-height:0;overflow:auto}.groups{padding:0 10px 14px}.group{margin-bottom:10px;border:1px solid var(--line);border-radius:12px;background:#0c111859}.group-head,.group li{display:flex;align-items:center;justify-content:space-between;gap:8px}.group-head{padding:9px 10px;border-bottom:1px solid var(--line)}.group ul{list-style:none;margin:0;padding:4px}.group li{padding:7px 8px;border-radius:8px;cursor:pointer}.group li:hover,.group li.current{background:#223246}.group li.off,tr.off{opacity:.55}.check{display:flex;align-items:center;gap:8px;cursor:pointer}.plane,.name{font-weight:600}.size,.count{color:var(--muted);font-family:var(--mono);font-size:11px}.table-panel .search{min-width:180px}.table-wrap{padding:0 10px 12px}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#182230;color:var(--muted);font-weight:500;z-index:1}.num{text-align:right;font-family:var(--mono)}.col-check{width:48px;text-align:center}tbody tr{cursor:pointer}tbody tr:hover,tbody tr.current{background:#4db8a814}tr.plane-row,tr.plane-row:hover{cursor:default;background:#0c111873}tr.plane-row td{padding-top:10px;padding-bottom:10px;color:var(--muted)}tr.plane-row strong{display:inline;margin-right:8px;color:var(--text)}td strong{display:block}td small{color:var(--muted)}.type,.status,.viewer-head em{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px}.type{color:var(--c);background:color-mix(in srgb,var(--c) 16%,transparent)}.status,.viewer-head em{color:var(--teal);background:#4db8a81f}.viewer-head em.off{color:var(--danger);background:#c9786a1f}.viewer-head{align-items:center}.canvas-host{position:relative;flex:1;min-height:280px;margin:0 12px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#101821}.canvas-host canvas,.label-layer{position:absolute;top:0;right:0;bottom:0;left:0}.label-layer{pointer-events:none}.dim-label{color:var(--amber-2);font-family:var(--mono);font-size:12px;padding:3px 7px;background:#0c1118db;border:1px solid rgba(212,162,76,.4);border-radius:6px;white-space:nowrap}.dim-label.is-trans{color:#cfe4ff;border-color:#7eb6ff73}.dim-label.is-meta{color:#d7e4ef;border-color:#8b9bb066}.dim-label.is-tick{padding:1px 4px;font-size:11px;color:#d7e4ef;background:#0c1118c7;border-color:#8b9bb047}.dim-label.is-axis-end{font-weight:600}.hint,.empty{padding:10px 16px 14px;color:var(--muted);font-size:12px}.calc-body>.hint{padding:0}.calc-body{flex:1;min-height:0;overflow:auto;padding:0 14px 14px;display:flex;flex-direction:column;gap:10px}.calc-body>:not(.cargo-table-wrap){flex-shrink:0}.result-body{flex:1;min-height:0;overflow:hidden;padding:0 14px 14px;display:flex;flex-direction:column;gap:10px}.switch{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#0c111859;cursor:pointer}.switch small{display:block;color:var(--muted);font-size:12px;margin-top:3px}.switch input{margin-top:3px}.editor-table tbody tr,.editor-table tbody tr:hover{cursor:default;background:transparent}.batch-paste{display:flex;align-items:stretch;gap:8px}.batch-paste textarea{flex:1;min-width:0;min-height:68px;resize:vertical;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#0c111880;color:var(--text);font:inherit;line-height:1.45}.batch-paste textarea:focus{outline:none;border-color:#4db8a8b3}.batch-paste button{align-self:flex-start}.batch-paste.compact{padding:8px 10px 0}.batch-paste.compact textarea{min-height:52px}.cargo-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px}.pane-calc .cargo-table-wrap{flex:0 0 auto;min-height:calc(100dvh - 180px)}.cargo-table input{padding:7px 8px;min-width:64px}.calc-actions{display:flex;flex-wrap:wrap;gap:8px}.picker-head{display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--muted);font-size:12px}.pallet-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;flex:0 0 auto;max-height:min(46dvh,480px);overflow:auto}.pick-item{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid var(--line);border-radius:10px;background:#0c111859}.add-pallet{display:grid;gap:6px}.add-pallet span{font-size:11px;color:var(--muted)}.pick-item.on{border-color:#4d6a86;background:#223246}.pick-copy{flex:1;min-width:0}.pick-item small{display:block;color:var(--muted);font-family:var(--mono);font-size:11px}.qty-field{display:grid;gap:4px;min-width:72px}.qty-field em{font-style:normal;color:var(--muted);font-size:11px}.qty-field input{width:72px;border:1px solid var(--line);background:#0e1620;color:var(--text);border-radius:8px;padding:6px 8px}.list-title{margin:8px 0 0;font-size:13px}.pack-block{border:1px solid var(--line);border-radius:10px;padding:8px;background:#0c111859}.pack-block header{font-size:12px;margin-bottom:6px;color:var(--amber-2)}.pack-block ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.pack-block li{display:flex;align-items:center;gap:8px;font-size:12px}.pack-block li span{flex:1}.pack-block li em{font-style:normal;font-family:var(--mono);color:var(--muted);font-size:11px}.pack-block.leftover header{color:var(--danger)}.board-tabs{display:flex;flex-wrap:wrap;gap:6px}.msg{margin:0;font-size:12px}.msg.ok{color:var(--teal)}.warn{color:var(--danger);font-size:12px;margin:0}.plan-list{display:grid;gap:8px;flex:1;min-height:0;overflow:auto;align-content:start}.result-split{flex:1;min-width:0;min-height:0;display:grid;grid-template-rows:minmax(160px,.4fr) minmax(0,1fr);gap:10px}.plan-table-wrap{min-height:0;overflow:auto;border:1px solid var(--line);border-radius:12px}.plan-table td{white-space:normal;vertical-align:top}.stack-cell{display:grid;gap:2px;min-width:120px;font-size:12px;line-height:1.4}.cell-input{width:100%;min-width:72px;border:1px solid var(--line);background:#0e1620;color:var(--text);border-radius:8px;padding:6px 8px}.num-input{width:76px;min-width:64px;text-align:right;font-family:var(--mono)}.col-actions{white-space:nowrap}.col-actions button+button{margin-left:6px}.plan-table .col-check{width:auto;text-align:left}.plan-table .check span{color:var(--muted);font-size:12px}.result-detail{min-height:0;overflow:auto;display:flex;flex-direction:column;gap:10px}.detail-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px}.detail-head strong{margin-right:8px}.detail-head span,.detail-head .msg{color:var(--muted);font-size:12px}.detail-grid{display:grid;grid-template-columns:minmax(220px,320px) minmax(0,1fr);gap:10px}.detail-block{min-width:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;background:#0c111847}.detail-block .picker-head{padding:8px 10px 0}.detail-block .cargo-table-wrap{border:0;border-radius:0;flex:1}.cargo-table tbody tr,.cargo-table tbody tr:hover{cursor:default;background:transparent}.pack-result-table td{white-space:nowrap}.pack-result-table .swatch{margin-right:6px;vertical-align:middle}.pack-result-table tr.is-left td{color:var(--danger)}.plan-card{position:relative;display:grid;grid-template-columns:1fr auto;gap:8px 12px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#0c111859;cursor:pointer}.plan-card .plan-main{min-width:0}.plan-card .plan-actions{display:flex;align-items:flex-start;gap:8px}.plan-card.on{border-color:#4d6a86;background:#223246}.plan-card p,.plan-card small{margin:4px 0 0}.plan-card .ghost{position:static}.result-meta{display:flex;align-items:baseline;gap:8px}.result-meta strong{font-family:var(--mono);font-size:22px;color:var(--amber-2)}.select-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:var(--muted);font-size:12px}.legend{list-style:none;margin:0;padding:0;display:grid;gap:6px}.legend li{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:7px 8px;border-radius:8px;background:#0c111859}.legend em{color:var(--muted);font-style:normal;font-family:var(--mono);font-size:11px}.swatch{width:12px;height:12px;border-radius:4px;display:inline-block}.pack-viewer{flex:1;min-height:240px;display:flex;flex-direction:column}.pack-canvas{margin:0;min-height:220px}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;padding:12px;background:#060a10b8}.modal{width:min(1080px,100%);height:min(840px,100%);max-width:calc(100dvw - 24px);max-height:calc(100dvh - 24px);display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(180deg,var(--panel),var(--bg-2));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.modal-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:16px 16px 10px}.modal-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:0 12px 12px}.modal-body .viewer,.modal-body .pack-viewer{flex:1;border:0;box-shadow:none;background:transparent;min-height:0}.modal.is-plan{width:min(1280px,100%);height:min(900px,100%);max-width:calc(100dvw - 24px);max-height:calc(100dvh - 24px)}.plan-preview{flex:1;min-width:0;min-height:0;overflow:hidden;display:grid;grid-template-columns:minmax(240px,360px) minmax(0,1fr);grid-template-areas:"side viewer";gap:12px;width:100%;height:100%}.editor-pallets{display:grid;gap:6px}.editor-pallet{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px}.editor-pallet input{width:72px;border:1px solid var(--line);background:#0e1620;color:var(--text);border-radius:8px;padding:6px 8px}.editor-table{max-height:220px}.plan-preview-side .msg{margin:0;font-size:12px}.plan-preview-side{grid-area:side;min-width:0;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:10px}.plan-preview .pack-viewer{grid-area:viewer;min-width:0;min-height:0;overflow:hidden}.plan-preview .canvas-host,.plan-preview .pack-canvas{min-height:0}.plan-preview .pack-viewer .hint{flex-shrink:0;padding:8px 4px 0}@media(max-width:820px){.topbar{flex-direction:column;align-items:stretch}.workspace{padding:10px}.table-head{flex-direction:column}.canvas-host{min-height:52dvh}.modal,.modal.is-plan{height:100%;width:100%;max-width:100dvw;max-height:100dvh;border-radius:0}.modal .canvas-host{min-height:0}.plan-preview{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) minmax(160px,38%);grid-template-areas:"viewer" "side"}.result-split{grid-template-rows:minmax(180px,.45fr) minmax(0,1fr)}.detail-grid{grid-template-columns:1fr}.batch-paste{flex-direction:column}.batch-paste button{align-self:stretch}.plan-card{grid-template-columns:1fr}}