:root{color-scheme:light;font-family:Inter,Noto Sans TC,Microsoft JhengHei,system-ui,sans-serif;--bg: #f6f7f9;--surface: #ffffff;--surface-soft: #eef4f8;--line: #d9e0e7;--ink: #18212c;--muted: #657282;--blue: #0b5cab;--blue-soft: #e7f0fb;--green: #12805c;--green-soft: #e7f6ef;--amber: #a86512;--red: #c2413b;--shadow: 0 12px 28px rgba(25, 36, 52, .08)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.app-shell{min-height:100vh;padding:14px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px;background:#f6f7f9eb;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand,.topbar-actions,.preview-actions,.quote-actions,.date-row,.mobile-total,.cart-money{display:flex;align-items:center}.brand{min-width:0;gap:10px}.brand img{width:42px;height:42px;border-radius:8px}.brand h1,.panel-heading h2,.preview-toolbar h2{margin:0;font-size:20px;line-height:1.2}.brand p,.eyebrow{margin:2px 0 0;color:var(--muted);font-size:12px}.topbar-actions{gap:8px}.workspace{display:grid;grid-template-columns:minmax(340px,1.05fr) minmax(380px,1.25fr) minmax(300px,.85fr);gap:14px;padding-top:14px}.catalog-panel,.quote-panel,.customer-panel{min-width:0;height:calc(100vh - 108px);overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--surface);box-shadow:var(--shadow)}.catalog-panel,.quote-panel{display:flex;flex-direction:column}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--line)}.count-pill,.total-chip{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border-radius:999px;background:var(--green-soft);color:var(--green);font-weight:700;white-space:nowrap}.total-chip{background:var(--blue-soft);color:var(--blue)}.search-box{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin:14px 16px 10px;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#fbfcfd}.search-box input,.field input,.mini-field input,.stepper input,.preview-actions select{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink)}.category-strip{display:flex;gap:8px;overflow-x:auto;padding:0 16px 12px;scrollbar-width:thin}.category-chip,.space-tab,.secondary-button,.primary-button,.date-row button,.update-banner button{min-height:38px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font-weight:650}.category-chip,.space-tab{flex:0 0 auto;padding:0 12px;white-space:nowrap}.space-tab[draggable=true],.drag-index{cursor:grab}.space-tab.is-dragging,.cart-row.is-dragging{opacity:.55}.category-chip.is-active,.space-tab.is-active,.view-tabs .is-active{border-color:var(--blue);background:var(--blue-soft);color:var(--blue)}.product-list,.cart-list{overflow:auto;padding:0 16px 16px}.product-list,.cart-list{flex:1;min-height:0}.product-card{display:grid;grid-template-columns:72px 1fr 42px;align-items:center;gap:12px;min-height:98px;margin-bottom:10px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.product-thumb,.cart-thumb{width:72px;height:72px;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff}.product-thumb.is-empty{padding:0;display:grid;place-items:center;color:var(--blue);font-weight:800;cursor:pointer}.product-main{min-width:0}.product-topline{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.product-topline strong,.cart-title strong{overflow-wrap:anywhere;font-size:15px}.product-topline span{color:var(--blue);font-weight:750;white-space:nowrap}.product-main p,.cart-title span{margin:3px 0 0;color:var(--muted);font-size:13px;line-height:1.35;overflow-wrap:anywhere}.product-meta{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.product-meta span{padding:3px 7px;border-radius:999px;background:var(--surface-soft);color:#475569;font-size:11px}.icon-button{-webkit-appearance:none;appearance:none;display:inline-grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--blue);line-height:1}.icon-button svg{display:block;flex-shrink:0}.icon-button.add,.primary-button{border-color:var(--blue);background:var(--blue);color:#fff}.icon-button.ghost{background:transparent}.icon-button.danger{color:var(--red)}.secondary-button,.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px}.space-tabs{display:flex;gap:8px;overflow-x:auto;padding:14px 16px 10px}.custom-item-form,.form-grid{display:grid;gap:10px;padding:0 16px 12px}.space-controls{display:grid;grid-template-columns:132px minmax(0,1fr) 40px;align-items:end;gap:10px;padding:10px 16px 12px;border-top:1px solid var(--line);background:#fbfcfd}.space-tab-editor{display:flex;align-items:center;min-width:132px;padding:0 8px}.space-tab-editor input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--blue);font-weight:750}.discount-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;min-height:40px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#fff}.discount-input-row input{width:100%;min-width:0;border:0;outline:0;background:transparent;text-align:right}.discount-input-row span,.space-bottom-total span{color:var(--muted);font-size:12px;font-weight:650}.space-bottom-total{display:grid;gap:3px;min-width:0;justify-items:end;align-self:center}.space-bottom-total span{overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}.space-bottom-total strong{color:var(--blue);font-size:16px}.field,.mini-field{display:grid;gap:5px}.field span,.mini-field span{color:var(--muted);font-size:12px;font-weight:650}.field input,.preview-actions select{min-height:40px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#fbfcfd}.discount-field input{min-height:auto;padding:0;border:0;border-radius:0;background:transparent}.field.narrow input,.mini-field input,.stepper input{text-align:right}.quote-actions{justify-content:space-between;gap:10px;padding:0 16px 12px}.toggle-row{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-weight:650}.toggle-row input{width:18px;height:18px}.custom-item-form{grid-template-columns:minmax(110px,1fr) minmax(150px,1.2fr) 90px 74px minmax(96px,auto) 78px;align-items:end;margin:0 16px 12px;padding:12px;border:1px dashed #9fb4c8;border-radius:8px;background:#f8fbfd}.cart-row{margin-bottom:10px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.cart-row.is-expanded{padding-bottom:12px}.cart-list.is-sorting .cart-row{transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.cart-drop-placeholder{display:grid;place-items:center;margin-bottom:10px;border:2px dashed rgba(11,92,171,.48);border-radius:8px;background:#e7f0fbb8;color:var(--blue);font-size:13px;font-weight:750;box-shadow:inset 0 0 0 1px #ffffffa6}.cart-drop-placeholder span{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;background:#fff;box-shadow:0 6px 16px #141d2b14}.cart-drag-ghost{position:fixed;top:0;left:0;z-index:80;padding:12px;border:1px solid rgba(11,92,171,.42);border-radius:8px;background:#fffffff5;box-shadow:0 18px 42px #141d2b33;pointer-events:none}.cart-row-head{display:grid;grid-template-columns:48px minmax(0,1fr) 34px 38px;align-items:center;gap:10px}.cart-row-head.has-cart-image{grid-template-columns:48px auto minmax(0,1fr) 34px 38px}.cart-title{min-width:0}.cart-summary-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-top:5px;color:var(--muted);font-size:12px;font-weight:650}.cart-summary-line strong{color:var(--blue);font-size:13px;white-space:nowrap}.item-toggle{width:34px;height:34px}.item-toggle svg{transition:transform .16s ease}.item-toggle.is-open svg{transform:rotate(180deg)}.drag-index{display:flex;align-items:center;gap:4px;color:#8a98a8;touch-action:none;-webkit-user-select:none;user-select:none}.drag-index svg{flex:0 0 auto}.line-number{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;background:var(--surface-soft);color:var(--muted);font-size:12px;font-weight:800}.cart-thumb{width:54px;height:54px}.cart-details{margin-top:10px}.cart-controls{display:grid;grid-template-columns:132px 1fr 84px;gap:10px;align-items:end}.stepper{display:grid;grid-template-columns:36px 1fr 36px;min-height:38px;overflow:hidden;border:1px solid var(--line);border-radius:8px}.stepper button{display:grid;place-items:center;border:0;background:var(--surface-soft);color:var(--blue)}.stepper input,.mini-field input{min-height:38px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:#fbfcfd}.stepper input{border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);border-radius:0;text-align:center}.readonly-field strong{display:flex;align-items:center;justify-content:flex-end;min-height:38px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#f3f6f9;color:var(--ink);font-weight:650}.cart-money{justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px}.cart-money strong{color:var(--blue);font-size:15px}.customer-panel{overflow:auto}.form-grid{grid-template-columns:1fr 1fr;padding-top:14px}.field.wide{grid-column:1 / -1}.date-row{gap:8px;min-height:40px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:#fbfcfd}.date-row input{flex:1;border:0;background:transparent}.date-row button{min-height:30px;padding:0 8px}.view-tabs{display:none}.mobile-total{position:fixed;right:18px;bottom:18px;z-index:25;justify-content:space-between;gap:14px;width:min(360px,calc(100vw - 36px));padding:12px;border:1px solid var(--line);border-radius:8px;background:#fffffff5;box-shadow:0 16px 38px #141d2b29;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.mobile-total div{display:grid;gap:2px;min-width:0}.mobile-total span{overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.mobile-total strong{color:var(--blue)}.empty-state,.inline-alert,.update-banner,.cache-progress,.toast,.export-status{color:var(--muted)}.empty-state{padding:22px;text-align:center}.update-banner,.inline-alert{display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:10px 12px;border-radius:8px}.update-banner{background:#fff7e8;color:#6f4308}.update-banner button{display:inline-flex;align-items:center;gap:6px;padding:0 10px}.inline-alert{background:#fff1f0;color:var(--red)}.cache-progress{display:grid;grid-template-columns:auto minmax(120px,1fr);align-items:center;gap:12px;margin:10px 0 0;padding:9px 12px;border-radius:8px;background:var(--blue-soft);color:var(--blue);font-size:13px;font-weight:700}.cache-progress progress{width:100%;height:8px;accent-color:var(--blue)}.toast{position:fixed;left:50%;bottom:18px;z-index:60;transform:translate(-50%);max-width:min(520px,calc(100vw - 24px));padding:10px 14px;border-radius:999px;background:#172032;color:#fff;box-shadow:var(--shadow)}.modal-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:16px;background:#11182773}.preview-modal{display:grid;grid-template-rows:auto 1fr auto;width:min(1120px,100%);max-height:calc(100vh - 32px);overflow:hidden;border-radius:8px;background:var(--surface);box-shadow:0 24px 70px #00000038}.expiration-modal{display:grid;gap:14px;width:min(380px,calc(100vw - 32px));padding:18px;border-radius:8px;background:var(--surface);box-shadow:0 24px 70px #00000038}.expiration-modal h2{margin:0;font-size:22px}.expiration-options{display:grid;gap:10px}.expiration-options button{justify-content:space-between;min-height:46px}.expiration-options button span{font-size:12px;font-weight:650;opacity:.82}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line)}.preview-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px}.preview-actions select{width:auto;min-width:118px}.preview-scroll{overflow:auto;padding:18px;background:#e9edf2}.preview-pages{display:grid;width:max-content;margin:0 auto;gap:18px}.quote-preview{width:794px;min-height:1123px;margin:0 auto;padding:30px 34px;background:#fff;color:#111;font-family:Microsoft JhengHei,Noto Sans TC,Arial,sans-serif;box-shadow:0 10px 30px #141d2b1f}.quote-sheet{break-inside:avoid;page-break-inside:avoid}.preview-header,.template-letterhead{display:grid;grid-template-columns:122px 1fr;gap:14px;align-items:start;margin-bottom:8px}.preview-logo{width:106px;height:auto}.preview-card{justify-self:end;max-width:427px;width:100%;height:auto}.template-title-row{display:grid;grid-template-columns:1fr auto;align-items:end;gap:12px;margin:4px 0 8px}.template-title-row h1{margin:0;font-size:28px;font-weight:800;letter-spacing:0}.template-title-row span{color:#334155;font-size:13px;font-weight:700}.template-meta,.template-table{width:100%;border-collapse:collapse;table-layout:fixed}.template-meta{margin-bottom:8px;font-size:12px}.template-meta td{height:25px;padding:3px 6px;border:1px solid #222222;vertical-align:middle;overflow-wrap:anywhere}.template-meta strong{font-weight:800}.template-table{font-size:11px}.template-table th,.template-table td{min-height:25px;padding:4px 5px;border:1px solid #222222;vertical-align:middle;overflow-wrap:anywhere}.template-table th{background:#fff;text-align:center;font-weight:800}.template-table tfoot th,.template-table tfoot td{background:#fff;font-weight:800}.template-table .number,.template-table .money{text-align:right;white-space:nowrap}.template-col-no{width:5%}.template-col-name{width:25%}.template-col-model{width:14%}.template-col-qty{width:6%}.template-col-unit{width:11%}.template-col-amount{width:12%}.template-col-note{width:17%}.template-col-retail{width:10%}.template-image-row td{height:88px}.template-note-cell{text-align:center}.template-images{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px}.template-images img{max-width:52px;max-height:52px;object-fit:contain}.template-notice{color:#111;font-size:10px;font-weight:500;text-align:left}.template-grand-total{font-size:13px}.template-footer{display:grid;grid-template-columns:1fr 1fr;gap:3px 18px;margin-top:6px;font-size:9.8px;line-height:1.33}.template-footer p{margin:0 0 2px}.template-valid-date{display:inline-block;min-width:70px;margin-left:4px;font-weight:800}.template-handler{grid-column:2;display:grid;grid-template-columns:auto 1fr auto;gap:4px 6px;align-items:center;margin-top:2px;font-size:11px}.template-handler strong{min-height:16px;font-weight:700}.template-signatures{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:18px;min-height:62px;margin-top:6px;padding-top:8px;font-size:14px;font-weight:800}.preview-meta{display:grid;grid-template-columns:1fr .72fr;gap:18px;margin-bottom:18px;padding:12px;border:1px solid #cfd7df}.preview-meta dl{display:grid;grid-template-columns:1fr;gap:7px;margin:0}.preview-meta div{display:grid;grid-template-columns:86px 1fr;gap:8px;min-height:24px}.preview-meta dt{color:#52616f;font-weight:700}.preview-meta dd{margin:0;overflow-wrap:anywhere}.preview-section{break-inside:avoid;margin-top:18px}.preview-table tr{break-inside:avoid}.preview-section h3{margin:0 0 8px;color:var(--blue);font-size:18px}.preview-table{width:100%;border-collapse:collapse;font-size:12px}.preview-table th,.preview-table td{padding:7px 8px;border:1px solid #cfd7df;vertical-align:middle}.preview-table th{background:#eef4f8;text-align:left}.preview-table tfoot td{background:#f9fafb;font-weight:800}.preview-table .number,.preview-table .money{text-align:right;white-space:nowrap}.image-column{width:76px}.image-cell{text-align:center}.preview-product-image{max-width:58px;max-height:58px;object-fit:contain}.preview-total{display:flex;justify-content:flex-end;gap:18px;margin-top:22px;padding-top:12px;border-top:2px solid #18212c;font-size:20px}.preview-total strong{color:var(--blue)}.export-status{padding:10px 14px;border-top:1px solid var(--line);background:#fbfcfd}.export-status.error{background:#fff1f0;color:var(--red)}.export-status.success{background:var(--green-soft);color:var(--green)}.export-status-action{display:flex;justify-content:flex-end}.export-status-action .secondary-button{min-height:40px}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1160px){.workspace{grid-template-columns:1fr 1fr}.customer-panel{grid-column:1 / -1;height:auto}}@media(max-width:860px){.app-shell{padding:0 0 80px}.topbar{align-items:flex-start;padding:8px 12px}.brand h1{font-size:15px}.brand img{width:32px;height:32px}.brand p{font-size:11px}.topbar-actions .total-chip{display:none}.topbar-actions .secondary-button{min-width:78px}.topbar-actions{gap:4px}.topbar-actions .icon-button{width:34px;height:34px}.cache-progress{grid-template-columns:1fr;gap:4px;margin:6px 10px 0;padding:7px 10px}.view-tabs{position:sticky;top:51px;z-index:19;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:6px 12px;background:#f6f7f9f2;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.view-tabs button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);font-weight:750}.view-tabs span{display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--green);color:#fff;font-size:11px}.workspace{display:block;padding:8px 10px 0}.catalog-panel,.quote-panel,.customer-panel{height:auto;min-height:calc(100vh - 184px);overflow:visible;box-shadow:none}.catalog-panel .panel-heading{min-height:40px;padding:8px 12px}.catalog-panel .panel-heading h2{font-size:20px}.catalog-panel .count-pill{min-height:28px;padding:0 9px;font-size:13px}.catalog-panel .search-box{min-height:36px;margin:8px 12px 6px;padding:0 9px}.catalog-panel .category-strip{gap:6px;padding:0 12px 8px}.catalog-panel .category-chip{min-height:32px;padding:0 10px;border-radius:7px;font-size:13px}.catalog-panel .product-list{padding:0 10px 10px}.catalog-panel .product-card{grid-template-columns:56px minmax(0,1fr) 34px;gap:8px;min-height:76px;margin-bottom:7px;padding:7px 8px}.catalog-panel .product-thumb{width:56px;height:56px;border-radius:7px}.catalog-panel .product-topline{gap:6px}.catalog-panel .product-topline strong,.catalog-panel .product-topline span{font-size:14px;line-height:1.18}.catalog-panel .product-main p{display:-webkit-box;margin-top:2px;overflow:hidden;font-size:12px;line-height:1.24;-webkit-box-orient:vertical;-webkit-line-clamp:2}.catalog-panel .product-meta{gap:4px;max-height:18px;margin-top:3px;overflow:hidden}.catalog-panel .product-meta span{padding:2px 6px;font-size:10.5px}.catalog-panel .icon-button.add{width:34px;height:34px;border-radius:7px}.quote-panel .panel-heading{min-height:38px;padding:6px 12px}.quote-panel .panel-heading>div{display:none}.quote-panel .total-chip{min-height:28px;padding:0 9px;font-size:13px}.quote-panel .space-tabs{gap:6px;padding:8px 12px 6px}.quote-panel .space-tab,.quote-panel .secondary-button,.quote-panel .primary-button{min-height:32px;padding:0 9px;border-radius:7px;font-size:13px}.quote-panel .quote-actions{gap:8px;padding:0 12px 8px}.quote-panel .toggle-row{gap:6px;font-size:13px}.quote-panel .toggle-row input{width:16px;height:16px}.quote-panel .cart-list{padding:0 12px 10px}.quote-panel .cart-row{margin-bottom:8px;padding:8px 10px}.app-shell[data-view=products] .quote-panel,.app-shell[data-view=products] .customer-panel,.app-shell[data-view=quote] .catalog-panel,.app-shell[data-view=quote] .customer-panel,.app-shell[data-view=customer] .catalog-panel,.app-shell[data-view=customer] .quote-panel{display:none}.product-list,.cart-list,.quote-panel .cart-list{height:auto;overflow:visible}.custom-item-form,.form-grid,.cart-controls{grid-template-columns:1fr 1fr}.custom-item-form{margin:0 12px 12px}.custom-item-form .primary-button,.custom-item-form .toggle-row,.field.wide{grid-column:1 / -1}.mobile-total{left:0;right:0;bottom:0;width:auto;gap:12px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--line);border-right:0;border-bottom:0;border-left:0;border-radius:0;box-shadow:none}.modal-backdrop{padding:0}.preview-modal{width:100%;height:100vh;max-height:none;border-radius:0}.preview-toolbar{align-items:flex-start}.preview-scroll{padding:12px}.quote-preview{transform-origin:top left}}@media(max-width:430px){.product-card{grid-template-columns:64px 1fr 38px;gap:9px}.product-thumb{width:64px;height:64px}.space-controls{grid-template-columns:118px minmax(0,1fr) 38px;padding-right:12px;padding-left:12px}.cart-row-head{grid-template-columns:40px minmax(0,1fr) 34px 38px;gap:8px}.cart-row-head.has-cart-image{grid-template-columns:40px 48px minmax(0,1fr) 34px 38px;gap:8px}.cart-thumb{display:block;width:46px;height:46px}.date-row{flex-wrap:wrap;padding:8px}}