:root{--font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;--bg: #0e0e10;--bg-sunken: #0a0a0b;--surface: #141416;--surface-2: #1a1a1d;--hover: #202024;--line: #26262b;--line-strong: #34343a;--text: #ececef;--text-2: #a1a1aa;--text-3: #6b6b74;--accent: #f0b429;--accent-hover: #f5c451;--accent-ink: #1a1405;--accent-soft: rgba(240, 180, 41, .12);--accent-line: rgba(240, 180, 41, .45);--danger: #f2555a;--danger-soft: rgba(242, 85, 90, .1);--dot: rgba(255, 255, 255, .06);--sheet-shadow: 0 1px 0 rgba(255, 255, 255, .04), 0 12px 32px -12px rgba(0, 0, 0, .8);--r-sm: 4px;--r-md: 6px;--r-lg: 8px;--ease: cubic-bezier(.2, 0, 0, 1);--t-fast: .12s var(--ease);--t: .2s var(--ease);--topbar-h: 52px;--sidebar-w: 320px;color-scheme:dark}:root[data-theme=light]{--bg: #f6f6f4;--bg-sunken: #efefec;--surface: #ffffff;--surface-2: #fafaf9;--hover: #f1f1ef;--line: #e4e4e0;--line-strong: #d4d4cf;--text: #18181b;--text-2: #52525b;--text-3: #8a8a93;--accent: #e8a317;--accent-hover: #d6950f;--accent-ink: #1a1405;--accent-soft: rgba(232, 163, 23, .14);--accent-line: rgba(200, 138, 10, .55);--danger: #d93a40;--danger-soft: rgba(217, 58, 64, .08);--dot: rgba(0, 0, 0, .08);--sheet-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 8px 24px -10px rgba(0, 0, 0, .18);color-scheme:light}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:var(--font-sans);font-size:13px;line-height:1.45;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overflow:hidden}.mono{font-family:var(--font-mono);font-feature-settings:"zero" 1}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}kbd{font-family:var(--font-mono);font-size:10.5px;line-height:1;padding:3px 5px;border-radius:3px;border:1px solid var(--line-strong);border-bottom-width:2px;color:var(--text-2);background:var(--surface-2)}.icon{width:15px;height:15px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}::selection{background:var(--accent-soft)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line);border:3px solid transparent;background-clip:padding-box;border-radius:10px}::-webkit-scrollbar-thumb:hover{background-color:var(--line-strong)}:focus-visible{outline:2px solid var(--accent-line);outline-offset:1px}.app{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);grid-template-rows:var(--topbar-h) minmax(0,1fr);grid-template-areas:"top top" "side main";height:100vh}.topbar{grid-area:top;display:flex;align-items:center;justify-content:space-between;padding:0 12px 0 16px;border-bottom:1px solid var(--line);background:var(--surface)}.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand-mark{width:22px;height:22px;fill:var(--accent)}.brand-name{font-weight:600;font-size:14px;letter-spacing:-.01em}.brand-sep{color:var(--line-strong);font-size:16px}.brand-context{color:var(--text-2)}.topbar-actions{display:flex;align-items:center;gap:6px}.topbar-divider{width:1px;height:20px;background:var(--line);margin:0 4px}.sidebar{grid-area:side;overflow-y:auto;border-right:1px solid var(--line);background:var(--surface)}.panel-block{padding:16px;border-bottom:1px solid var(--line)}.block-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}.block-head h2,.group>summary{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-3)}.block-hint{font-size:11px;color:var(--text-3);display:inline-flex;align-items:center;gap:5px}.group{border-bottom:1px solid var(--line)}.group>summary{list-style:none;cursor:pointer;padding:13px 16px;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none;transition:color var(--t-fast)}.group>summary::-webkit-details-marker{display:none}.group>summary:after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform var(--t);margin-right:2px}.group[open]>summary:after{transform:rotate(45deg) translate(-1px,-1px)}.group>summary:hover{color:var(--text)}.group-body{padding:0 16px 16px;display:flex;flex-direction:column;gap:12px}.group[open] .group-body{animation:reveal .22s var(--ease)}@keyframes reveal{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.workspace{grid-area:main;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:20px;background:var(--bg)}.surface{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);display:flex;flex-direction:column;min-height:0}.surface-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;border-bottom:1px solid var(--line)}.surface-title{display:flex;align-items:baseline;gap:10px}.surface-title h2{font-size:13px;font-weight:600}.count{font-size:11.5px;color:var(--text-3)}.surface-hint{font-size:12px;color:var(--text-3)}.form{display:flex;flex-direction:column;gap:12px}.row{display:flex;gap:10px}.field{display:flex;flex-direction:column;gap:5px;min-width:0}.field.grow{flex:1}.field.qty{width:76px}label{font-size:12px;font-weight:500;color:var(--text-2)}input[type=text],input[type=number],select{width:100%;height:32px;padding:0 10px;font:inherit;font-size:13px;color:var(--text);background:var(--bg-sunken);border:1px solid var(--line);border-radius:var(--r-md);outline:none;transition:border-color var(--t-fast),box-shadow var(--t-fast),background-color var(--t-fast)}input.mono{font-family:var(--font-mono)}input::placeholder{color:var(--text-3)}input[type=text]:hover,input[type=number]:hover,select:hover{border-color:var(--line-strong)}input[type=text]:focus,input[type=number]:focus,select:focus{border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:28px;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--text-3) 50%),linear-gradient(135deg,var(--text-3) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 10px) 50%;background-size:4px 4px;background-repeat:no-repeat}select option{background:var(--surface);color:var(--text)}.unit-input{position:relative}.unit-input input{font-family:var(--font-mono);padding-right:34px}.unit-input span{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:11px;color:var(--text-3);pointer-events:none}.presets{display:grid;grid-template-columns:1fr 1fr;gap:8px}.preset{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 11px;font:inherit;text-align:left;color:var(--text);background:var(--bg-sunken);border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer;transition:border-color var(--t-fast),background-color var(--t-fast)}.preset:hover{border-color:var(--line-strong);background:var(--hover)}.preset:active{border-color:var(--accent-line)}.preset-name{font-weight:500}.preset-dim{font-size:11px;color:var(--text-3)}.switches{gap:2px}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 8px;margin:0 -8px;border-radius:var(--r-md);font-size:13px;font-weight:400;color:var(--text);cursor:pointer;transition:background-color var(--t-fast)}.switch-row:hover{background:var(--hover)}.switch-row small{display:block;font-size:11.5px;color:var(--text-3)}.switch-row input{position:absolute;opacity:0;pointer-events:none}.switch{position:relative;flex-shrink:0;width:28px;height:16px;border-radius:16px;background:var(--line-strong);transition:background-color var(--t)}.switch:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0000004d;transition:transform var(--t)}.switch-row input:checked+.switch{background:var(--accent)}.switch-row input:checked+.switch:after{transform:translate(12px)}.switch-row input:focus-visible+.switch{outline:2px solid var(--accent-line);outline-offset:2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:32px;padding:0 12px;font:inherit;font-size:13px;font-weight:500;white-space:nowrap;text-decoration:none;color:var(--text);background:transparent;border:1px solid transparent;border-radius:var(--r-md);cursor:pointer;transition:background-color var(--t-fast),border-color var(--t-fast),color var(--t-fast),transform var(--t-fast)}.btn:active{transform:translateY(1px)}.btn-block{width:100%}.btn-sm{height:28px;padding:0 9px;font-size:12.5px}.btn-primary{background:var(--accent);color:var(--accent-ink);font-weight:600}.btn-primary:hover{background:var(--accent-hover)}.btn-primary kbd{background:#00000014;border-color:#0000002e;color:#1a1405b3;margin-left:2px}.btn-secondary{background:var(--surface-2);border-color:var(--line)}.btn-secondary:hover{background:var(--hover);border-color:var(--line-strong)}.btn-ghost{color:var(--text-2)}.btn-ghost:hover{background:var(--hover);color:var(--text)}.btn-icon{width:32px;padding:0;color:var(--text-2)}.btn-icon:hover{background:var(--hover);color:var(--text)}.btn-danger-text:hover{color:var(--danger);background:var(--danger-soft)}.icon-sun{display:none}:root[data-theme=light] .icon-sun{display:block}:root[data-theme=light] .icon-moon{display:none}.list-surface{flex-shrink:0}.table-wrapper{max-height:340px;overflow:auto}table{width:100%;border-collapse:collapse;table-layout:fixed}th{position:sticky;top:0;z-index:1;height:34px;padding:0 16px;font-size:11px;font-weight:500;text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);background:var(--surface);border-bottom:1px solid var(--line)}.col-code{width:18%}.col-supplier{width:22%}.col-desc{width:auto}.col-qty{width:84px;text-align:right}.col-actions{width:52px}td{height:40px;padding:0 10px;border-bottom:1px solid var(--line);vertical-align:middle}tbody tr{transition:background-color var(--t-fast)}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--surface-2)}td:nth-child(1) .editable-cell{font-family:var(--font-mono);font-size:12.5px}td:nth-child(2) .editable-cell{color:var(--text-2)}td:nth-child(4) .editable-cell{font-family:var(--font-mono);text-align:right!important;font-weight:500!important}.editable-cell{padding:5px 6px;border:1px solid transparent;border-radius:var(--r-sm);outline:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:28px;transition:border-color var(--t-fast),background-color var(--t-fast)}.editable-cell:hover{border-color:var(--line);cursor:text}.editable-cell:focus{white-space:normal;background:var(--bg-sunken);border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}.btn-icon-danger{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;color:var(--text-3);background:transparent;border:none;border-radius:var(--r-sm);cursor:pointer;opacity:0;transition:opacity var(--t-fast),color var(--t-fast),background-color var(--t-fast)}.btn-icon-danger svg{width:15px;height:15px}tbody tr:hover .btn-icon-danger,.btn-icon-danger:focus-visible{opacity:1}.btn-icon-danger:hover{color:var(--danger);background:var(--danger-soft)}.empty-state-row td{height:auto;padding:0}.empty-state-row:hover{background:transparent!important}.empty-state{display:flex;flex-direction:column;align-items:center;gap:6px;padding:48px 24px;text-align:center}.empty-state strong{font-weight:500;color:var(--text)}.empty-state p{max-width:360px;color:var(--text-3)}.preview-surface{flex:1 0 auto}.canvas{flex:1;min-height:320px;overflow:auto;padding:32px;display:flex;justify-content:center;background-color:var(--bg-sunken);background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:16px 16px;border-radius:0 0 var(--r-lg) var(--r-lg)}.labels-container{display:flex;flex-direction:column;align-items:center;gap:24px}.preview-empty{padding:64px 0;color:var(--text-3);text-align:center}.print-sheet{background-color:#fff;color:#000;border:1px solid #ddd;box-sizing:border-box;display:grid;align-content:start;justify-content:center;page-break-after:always;position:relative}.labels-container .print-sheet{transform-origin:top center;border:none;box-shadow:var(--sheet-shadow);border-radius:2px;animation:sheet-in .26s var(--ease) both}@keyframes sheet-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.label-item{box-sizing:border-box;border:1px dashed #000;background-color:#fff;color:#000;display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;overflow:hidden;position:relative;font-family:Arial,Helvetica,sans-serif}.labels-container .label-item{border-color:#c8c8c8}.label-item.layout-vertical{padding:0!important;position:relative;overflow:hidden}.label-vertical-wrapper{position:absolute;top:0;left:0;transform-origin:top left;display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;box-sizing:border-box}.label-item.layout-vertical .label-desc{width:100%;margin-bottom:1px}.label-item.layout-vertical .label-barcode-wrapper{margin:1px 0}.print-only .label-item{border:1px transparent}.label-desc{font-weight:700;width:100%;word-wrap:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.2}.label-barcode-wrapper{width:100%;display:flex;justify-content:center;align-items:center;margin:2px 0;overflow:visible}.label-barcode-image{display:block;max-width:100%;max-height:100%;transform-origin:center center}.label-meta-row{display:flex;justify-content:space-between;width:100%;font-size:.85em;font-weight:600;border-top:1px solid #eee;padding-top:2px}.label-code{text-align:left}.print-only{display:none}.labels-container .blank-label{border:1px dashed rgba(0,0,0,.15)!important;background-color:#fafafa!important}@media (max-width: 900px){body{overflow:auto}.app{height:auto;grid-template-columns:1fr;grid-template-rows:auto auto auto;grid-template-areas:"top" "side" "main"}.topbar{height:auto;flex-wrap:wrap;gap:8px;padding:10px 16px}.topbar-actions{flex-wrap:wrap}.topbar-actions .btn span:not(.sr-only),.btn-primary kbd{display:none}.topbar-actions #btn-print span{display:inline}.sidebar{border-right:none;border-bottom:1px solid var(--line);overflow:visible}.workspace{overflow:visible;padding:16px}.surface-hint{display:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media print{.no-print,.no-print *{display:none!important}html,body{background-color:#fff!important;color:#000!important;margin:0!important;padding:0!important;height:auto!important;min-height:100vh!important;overflow:visible!important}.print-only{display:block!important;width:100%!important}.print-sheet{box-shadow:none!important;border:none!important;background-color:#fff!important;page-break-after:always!important;page-break-inside:avoid!important}.label-item{border:1px dashed #000!important;page-break-inside:avoid!important}#print-area:not(.print-with-borders) .label-item{border-color:transparent!important}.blank-label{border:1px dashed transparent!important;background-color:#fff!important}}
