{"id":6020,"date":"2026-07-03T03:42:08","date_gmt":"2026-07-03T03:42:08","guid":{"rendered":"https:\/\/primetoolhub.com\/?page_id=6020"},"modified":"2026-07-04T15:28:03","modified_gmt":"2026-07-04T15:28:03","slug":"csv-to-label-maker","status":"publish","type":"page","link":"https:\/\/schoolict.net\/tools\/csv-to-label-maker\/","title":{"rendered":"CSV to Label Maker &#8211; Free Offline Custom Labels Generator"},"content":{"rendered":"<div class=\"pth-hero-section\">\n<div class=\"pth-hero-content\">\n<h2>Offline Custom Labels Generator<\/h2>\n<p>Free online CSV label maker \u2014 design, customize and print labels from any spreadsheet. QR codes, 8 templates, batch export. 100% offline.<\/p>\n<div id=\"pth-toc-placeholder\"><\/div>\n<\/p>\n<\/div>\n<div class=\"pth-hero-image\">\n    <img data-no-lazy=\"1\"\n         src=\"https:\/\/schoolict.net\/tools\/wp-content\/uploads\/2026\/07\/CSV-to-Label-Maker-800x447.jpeg\"\n         width=\"800\"\n         height=\"447\"\n         alt=\"CSV to Label Maker\"\n         fetchpriority=\"high\"\n         loading=\"eager\"\n         decoding=\"async\"\n         style=\"width:100%; height:auto; display:block;\">\n  <\/div>\n<\/div>\n\n\n<div class=\"wp-block-rank-math-toc-block\" id=\"rank-math-toc\"><h2>Table of Contents<\/h2><nav><ul><li><a href=\"#\ud83d\udd34-what-a-csv-label-maker-actually-does-and-why-spreadsheet-data-is-the-right-starting-point\">\ud83d\udd34 What a CSV Label Maker Actually Does \u2014 and Why Spreadsheet Data Is the Right Starting Point<\/a><\/li><li><a href=\"#\ud83d\udfe1-the-8-label-templates-when-to-use-each-one\">\ud83d\udfe1 The 8 Label Templates \u2014 When to Use Each One<\/a><ul><li><a href=\"#\ud83d\udfe2-name-badge-280-140-conferences-events-staff-id\">\ud83d\udfe2 Name Badge (280\u00d7140) \u2014 Conferences, Events, Staff ID<\/a><\/li><li><a href=\"#\ud83d\udfe2-shipping-label-384-192-courier-post-dispatch\">\ud83d\udfe2 Shipping Label (384\u00d7192) \u2014 Courier, Post, Dispatch<\/a><\/li><li><a href=\"#\ud83d\udfe2-inventory-label-240-90-warehouse-assets-stock\">\ud83d\udfe2 Inventory Label (240\u00d790) \u2014 Warehouse, Assets, Stock<\/a><\/li><li><a href=\"#\ud83d\udfe2-event-pass-320-160-tickets-wristbands-vip-passes\">\ud83d\udfe2 Event Pass (320\u00d7160) \u2014 Tickets, Wristbands, VIP Passes<\/a><\/li><\/ul><\/li><li><a href=\"#\ud83d\udd34-offline-qr-code-generation-how-it-works-inside-the-browser\">\ud83d\udd34 Offline QR Code Generation \u2014 How It Works Inside the Browser<\/a><\/li><li><a href=\"#\ud83d\udfe2-the-fields-tab-building-complex-label-layouts-row-by-row\">\ud83d\udfe2 The Fields Tab \u2014 Building Complex Label Layouts Row by Row<\/a><\/li><\/ul><\/nav><\/div>\n\n\n<!-- LSCACHE_DISABLE -->\r\n<style>\r\n\/* ==========================================================================\r\n   PTH LABEL STUDIO PRO v6.0 \u2014 Persistent Live Preview | Data+Fields Merged\r\n   Custom Image Fields | Quick Adjust Panel | WCAG 2.1 AA | WP\/LiteSpeed Safe\r\n   ========================================================================== *\/\r\n#pth-ls6-wrap{font-family:'Inter',system-ui,-apple-system,sans-serif;width:100%;max-width:1400px;margin:0 auto;box-sizing:border-box;color:#1e293b;font-weight:500;}\r\n#pth-ls6-wrap *{box-sizing:border-box;min-width:0;}\r\n#pth-ls6-wrap h2,#pth-ls6-wrap h3{color:#0f172a;font-weight:800;margin-top:0;}\r\n\/* Layout *\/\r\n#pth-ls6-wrap .ls6-outer{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start;}\r\n#pth-ls6-wrap .ls6-outer.ls6-full{grid-template-columns:100%;}\r\n#pth-ls6-wrap .ls6-outer.ls6-full .ls6-right{display:none;}\r\n\/* Card *\/\r\n#pth-ls6-wrap .ls6-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:20px;margin-bottom:16px;box-shadow:0 2px 8px rgba(0,0,0,0.04);}\r\n\/* Meta *\/\r\n#pth-ls6-wrap .ls6-title{font-size:22px;font-weight:800;color:#1d4ed8;margin:0;display:flex;align-items:center;gap:7px;}\r\n#pth-ls6-wrap .ls6-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:13px;}\r\n#pth-ls6-wrap .ls6-badge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:4px;}\r\n#pth-ls6-wrap .lb-blue{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe;}\r\n#pth-ls6-wrap .lb-green{background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0;}\r\n\/* Tabs *\/\r\n#pth-ls6-wrap .ls6-tabs{display:flex;gap:3px;background:#e2e8f0;padding:4px;border-radius:10px;margin-bottom:16px;flex-wrap:wrap;}\r\n#pth-ls6-wrap .ls6-tab{flex:1;min-width:100px;padding:9px 6px;border:none;background:transparent;color:#334155;font-weight:700;font-size:12px;border-radius:7px;cursor:pointer;transition:all 0.18s;font-family:'Inter',sans-serif;white-space:nowrap;}\r\n#pth-ls6-wrap .ls6-tab.on{background:#fff;color:#1d4ed8;box-shadow:0 2px 6px rgba(0,0,0,0.1);}\r\n#pth-ls6-wrap .ls6-tab:hover:not(.on){background:#f1f5f9;}\r\n#pth-ls6-wrap .ls6-panel{display:none;}\r\n#pth-ls6-wrap .ls6-panel.on{display:block;}\r\n\/* Buttons *\/\r\n#pth-ls6-wrap .ls6-btn{padding:8px 15px;border-radius:8px;font-weight:700;cursor:pointer;border:none;font-family:'Inter',sans-serif;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:5px;transition:background 0.18s,transform 0.12s;}\r\n#pth-ls6-wrap .ls6-btn:hover{transform:translateY(-1px);}\r\n#pth-ls6-wrap .bn-blue{background:#2563eb;color:#fff;}\r\n#pth-ls6-wrap .bn-blue:hover{background:#1d4ed8;}\r\n#pth-ls6-wrap .bn-grey{background:#f1f5f9;color:#0f172a;border:1px solid #e2e8f0;}\r\n#pth-ls6-wrap .bn-grey:hover{background:#e2e8f0;}\r\n#pth-ls6-wrap .bn-red{background:#fef2f2;color:#991b1b;border:1px solid #fecaca;}\r\n#pth-ls6-wrap .bn-red:hover{background:#fee2e2;}\r\n#pth-ls6-wrap .bn-green{background:#f0fdf4;color:#047857;border:1px solid #bbf7d0;}\r\n#pth-ls6-wrap .bn-green:hover{background:#dcfce7;}\r\n#pth-ls6-wrap .bn-purple{background:#f5f3ff;color:#6d28d9;border:1px solid #ddd6fe;}\r\n#pth-ls6-wrap .bn-purple:hover{background:#ede9fe;}\r\n#pth-ls6-wrap .bn-orange{background:#fff7ed;color:#c2410c;border:1px solid #fed7aa;}\r\n#pth-ls6-wrap .bn-orange:hover{background:#ffedd5;}\r\n#pth-ls6-wrap .ls6-smpl{background:#d1fae5;color:#047857;border:1px solid #6ee7b7;font-size:12px;padding:5px 12px;border-radius:6px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:4px;}\r\n\/* Form *\/\r\n#pth-ls6-wrap label{font-weight:700;color:#0f172a;margin-bottom:4px;display:block;font-size:11px;text-transform:uppercase;letter-spacing:0.4px;}\r\n#pth-ls6-wrap input[type=\"text\"],#pth-ls6-wrap input[type=\"number\"],#pth-ls6-wrap select,#pth-ls6-wrap textarea{width:100%;padding:8px 10px;border:2px solid #e2e8f0;border-radius:7px;font-family:'Inter',sans-serif;color:#0f172a;background:#fff;font-size:0.84rem;transition:border-color 0.18s;}\r\n#pth-ls6-wrap input:focus,#pth-ls6-wrap select:focus,#pth-ls6-wrap textarea:focus{border-color:#2563eb;outline:none;box-shadow:0 0 0 3px rgba(37,99,235,0.1);}\r\n#pth-ls6-wrap input[type=\"color\"]{height:34px;padding:2px;cursor:pointer;border-radius:6px;border:2px solid #e2e8f0;width:100%;}\r\n#pth-ls6-wrap input[type=\"range\"]{accent-color:#2563eb;width:100%;padding:0;}\r\n#pth-ls6-wrap input[type=\"checkbox\"]{accent-color:#2563eb;width:14px;height:14px;cursor:pointer;}\r\n#pth-ls6-wrap .ls6-g2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}\r\n#pth-ls6-wrap .ls6-g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px;}\r\n#pth-ls6-wrap .ls6-g4{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:8px;}\r\n#pth-ls6-wrap .ls6-fld{display:flex;flex-direction:column;gap:4px;margin-bottom:9px;}\r\n#pth-ls6-wrap .ls6-srow{display:flex;align-items:center;gap:7px;}\r\n#pth-ls6-wrap .ls6-sval{font-family:monospace;font-weight:700;font-size:11px;min-width:30px;text-align:right;color:#1d4ed8;}\r\n\/* Drop zone *\/\r\n#pth-ls6-wrap .ls6-dz{border:2px dashed #93c5fd;border-radius:10px;padding:20px 14px;text-align:center;background:#eff6ff;cursor:pointer;transition:all 0.18s;}\r\n#pth-ls6-wrap .ls6-dz:hover,#pth-ls6-wrap .ls6-dz.over{border-color:#2563eb;background:#dbeafe;}\r\n#pth-ls6-wrap .ls6-dz-icon{font-size:26px;margin-bottom:4px;}\r\n#pth-ls6-wrap .ls6-dz p{margin:0;font-size:0.8rem;}\r\n#pth-ls6-wrap .ls6-dz strong{color:#1d4ed8;font-size:0.88rem;}\r\n\/* Tags *\/\r\n#pth-ls6-wrap .ls6-tags{display:flex;flex-wrap:wrap;gap:5px;padding:11px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;margin-bottom:11px;}\r\n#pth-ls6-wrap .ls6-tag{background:#eff6ff;border:1px solid #bfdbfe;padding:3px 9px;border-radius:13px;font-size:11px;font-weight:700;color:#1d4ed8;}\r\n\/* Section heading *\/\r\n#pth-ls6-wrap .ls6-sh{font-size:11px;font-weight:800;color:#2563eb;text-transform:uppercase;letter-spacing:0.6px;margin:12px 0 7px;padding-bottom:5px;border-bottom:2px solid #eff6ff;}\r\n\/* Template grid *\/\r\n#pth-ls6-wrap .ls6-tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:7px;margin-bottom:12px;}\r\n#pth-ls6-wrap .ls6-tpl{border:2px solid #e2e8f0;border-radius:8px;padding:9px 5px;text-align:center;cursor:pointer;transition:all 0.18s;background:#fff;}\r\n#pth-ls6-wrap .ls6-tpl:hover{border-color:#2563eb;background:#eff6ff;transform:translateY(-2px);}\r\n#pth-ls6-wrap .ls6-tpl.on{border-color:#2563eb;background:#dbeafe;box-shadow:0 0 0 3px rgba(37,99,235,0.12);}\r\n#pth-ls6-wrap .ls6-tpl-icon{font-size:20px;margin-bottom:2px;}\r\n#pth-ls6-wrap .ls6-tpl-name{font-size:10px;font-weight:800;color:#0f172a;}\r\n#pth-ls6-wrap .ls6-tpl-sz{font-size:9px;color:#64748b;margin-top:1px;}\r\n\/* Field rows *\/\r\n#pth-ls6-wrap .ls6-frow{background:#f8fafc;border:1px solid #e2e8f0;border-radius:9px;padding:10px;margin-bottom:7px;}\r\n#pth-ls6-wrap .ls6-frow-top{display:grid;gap:6px;align-items:center;margin-bottom:6px;}\r\n#pth-ls6-wrap .ls6-frow-bot{display:grid;grid-template-columns:1fr 1fr;gap:6px;}\r\n#pth-ls6-wrap .ls6-tbadge{font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;display:inline-flex;align-items:center;gap:3px;margin-bottom:3px;}\r\n#pth-ls6-wrap .tb-csv{background:#dbeafe;color:#1d4ed8;}\r\n#pth-ls6-wrap .tb-txt{background:#fef3c7;color:#92400e;}\r\n#pth-ls6-wrap .tb-qr{background:#dcfce7;color:#047857;}\r\n#pth-ls6-wrap .tb-div{background:#f5f3ff;color:#6d28d9;}\r\n#pth-ls6-wrap .tb-img{background:#fff7ed;color:#c2410c;}\r\n#pth-ls6-wrap .tb-bc{background:#1e293b;color:#f8fafc;}\r\n\/* Warning \/ info inline boxes *\/\r\n#pth-ls6-wrap .ls6-warn-box{border-radius:7px;padding:8px 11px;margin-top:7px;font-size:0.73rem;font-weight:600;line-height:1.5;}\r\n#pth-ls6-wrap .ls6-warn-yellow{background:#fffbeb;border:1px solid #fcd34d;color:#92400e;}\r\n#pth-ls6-wrap .ls6-warn-blue{background:#eff6ff;border:1px solid #93c5fd;color:#1e40af;}\r\n\/* Language bar *\/\r\n#pth-ls6-wrap .ls6-lang-bar{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap;padding:9px 11px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;}\r\n#pth-ls6-wrap .ls6-lang-lbl{font-size:11px;font-weight:700;color:#334155;white-space:nowrap;}\r\n#pth-ls6-wrap .ls6-lang-sel{font-size:12px;padding:5px 10px;border:2px solid #e2e8f0;border-radius:7px;background:#fff;color:#0f172a;font-weight:600;cursor:pointer;font-family:'Inter',sans-serif;flex:1;min-width:0;}\r\n#pth-ls6-wrap .ls6-lang-sel:focus{border-color:#2563eb;outline:none;}\r\n#pth-ls6-wrap .ls6-delbtn{background:#fef2f2;color:#dc2626;border:1px solid #fecaca;border-radius:6px;cursor:pointer;width:30px;height:30px;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s;}\r\n#pth-ls6-wrap .ls6-delbtn:hover{background:#fee2e2;}\r\n#pth-ls6-wrap .ls6-addrow{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px;}\r\n\/* Paste area *\/\r\n#pth-ls6-wrap .ls6-paste{display:none;margin-bottom:11px;}\r\n#pth-ls6-wrap .ls6-paste textarea{min-height:80px;font-family:monospace;font-size:0.76rem;resize:vertical;}\r\n\/* Chip *\/\r\n#pth-ls6-wrap .ls6-chip{display:inline-flex;align-items:center;gap:4px;background:#f1f5f9;border:1px solid #e2e8f0;color:#334155;font-size:10px;font-weight:700;padding:2px 8px;border-radius:12px;}\r\n\/* Error *\/\r\n#pth-ls6-wrap .ls6-err{display:none;background:#fef2f2;border-left:4px solid #ef4444;color:#991b1b;padding:9px 12px;margin-bottom:11px;border-radius:7px;font-weight:700;font-size:12px;}\r\n\/* Export cards *\/\r\n#pth-ls6-wrap .ls6-ex-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px;}\r\n#pth-ls6-wrap .ls6-ex-card{border:2px solid #e2e8f0;border-radius:9px;padding:13px 8px;text-align:center;cursor:pointer;transition:all 0.18s;background:#fff;}\r\n#pth-ls6-wrap .ls6-ex-card:hover{border-color:#2563eb;background:#eff6ff;transform:translateY(-2px);}\r\n#pth-ls6-wrap .ls6-ex-icon{font-size:24px;margin-bottom:4px;}\r\n#pth-ls6-wrap .ls6-ex-name{font-size:12px;font-weight:800;color:#0f172a;}\r\n#pth-ls6-wrap .ls6-ex-desc{font-size:10px;color:#475569;margin-top:2px;}\r\n\/* RIGHT PANEL \u2014 persistent preview *\/\r\n#pth-ls6-wrap .ls6-right{position:sticky;top:16px;}\r\n#pth-ls6-wrap .ls6-pv-wrap{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.06);}\r\n#pth-ls6-wrap .ls6-pv-head{background:#f8fafc;padding:9px 13px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:5px;}\r\n#pth-ls6-wrap .ls6-pv-title{font-size:11px;font-weight:800;color:#1d4ed8;text-transform:uppercase;letter-spacing:0.5px;}\r\n#pth-ls6-wrap .ls6-pv-grid{background:#cbd5e1;padding:12px;min-height:200px;display:flex;flex-wrap:wrap;gap:7px;justify-content:center;align-content:flex-start;overflow-y:auto;max-height:640px;}\r\n#pth-ls6-wrap .ls6-pv-empty{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:36px 0;color:#475569;font-size:12px;font-weight:600;}\r\n#pth-ls6-wrap .ls6-qa{padding:11px;border-top:1px solid #e2e8f0;background:#f8fafc;}\r\n#pth-ls6-wrap .ls6-qa-title{font-size:10px;font-weight:800;color:#1d4ed8;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:7px;}\r\n\/* Sidebar tips *\/\r\n#pth-ls6-wrap .ls6-sc{background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;margin-top:14px;}\r\n#pth-ls6-wrap .ls6-sc-head{background:#f8fafc;padding:8px 13px;border-bottom:1px solid #e2e8f0;font-size:11px;font-weight:800;color:#1d4ed8;text-transform:uppercase;letter-spacing:0.5px;}\r\n#pth-ls6-wrap .ls6-sc-body{padding:12px;}\r\n#pth-ls6-wrap .ls6-tip{display:flex;gap:8px;margin-bottom:9px;align-items:flex-start;}\r\n#pth-ls6-wrap .ls6-tip:last-child{margin-bottom:0;}\r\n#pth-ls6-wrap .ls6-tip-icon{font-size:16px;flex-shrink:0;margin-top:1px;}\r\n#pth-ls6-wrap .ls6-tip-text{font-size:0.76rem;color:#334155;line-height:1.5;}\r\n#pth-ls6-wrap .ls6-tip-text strong{color:#0f172a;display:block;font-weight:700;margin-bottom:1px;}\r\n\/* Mobile *\/\r\n@media(max-width:900px){\r\n  #pth-ls6-wrap .ls6-outer{grid-template-columns:100% !important;}\r\n  #pth-ls6-wrap .ls6-right{position:static;margin-top:14px;}\r\n  #pth-ls6-wrap .ls6-outer.ls6-full .ls6-right{display:block !important;}\r\n  #pth-ls6-wrap .ls6-pv-grid{max-height:260px;}\r\n}\r\n@media(max-width:640px){\r\n  #pth-ls6-wrap .ls6-card{padding:12px;}\r\n  #pth-ls6-wrap .ls6-g3,#pth-ls6-wrap .ls6-g4{grid-template-columns:1fr 1fr;}\r\n  #pth-ls6-wrap .ls6-tab{font-size:11px;padding:7px 4px;min-width:70px;}\r\n  #pth-ls6-wrap .ls6-ex-grid{grid-template-columns:1fr;}\r\n}\r\n<\/style>\r\n\r\n<div id=\"pth-ls6-toast\" role=\"status\" aria-live=\"polite\" style=\"position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;\"><\/div>\r\n\r\n<div id=\"pth-ls6-wrap\">\r\n<div class=\"ls6-outer\" id=\"pth-ls6-outer\">\r\n\r\n<!-- LEFT: CONTROLS -->\r\n<div>\r\n<div class=\"ls6-card\">\r\n<div style=\"display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:9px;flex-wrap:wrap;gap:7px;\">\r\n<h2 class=\"ls6-title\">\ud83c\udff7\ufe0f Label Studio Pro<\/h2>\r\n<button class=\"ls6-btn bn-grey\" id=\"pth-ls6-fw\" aria-label=\"Toggle full width\">\u26f6 Full Width<\/button>\r\n<\/div>\r\n<div class=\"ls6-meta\">\r\n<span class=\"ls6-badge lb-blue\">v6.0<\/span>\r\n<span class=\"ls6-badge lb-green\">\ud83d\udd12 100% Offline<\/span>\r\n<\/div>\r\n<!-- LANGUAGE PICKER -->\r\n<div class=\"ls6-lang-bar\">\r\n<span class=\"ls6-lang-lbl\" id=\"pth-ls6-lang-lbl\">\ud83c\udf10 Language:<\/span>\r\n<select class=\"ls6-lang-sel\" id=\"pth-ls6-lang\" aria-label=\"Interface language\">\r\n<option value=\"en\">\ud83c\uddec\ud83c\udde7 English<\/option>\r\n<option value=\"si\">\ud83c\uddf1\ud83c\uddf0 \u0dc3\u0dd2\u0d82\u0dc4\u0dbd<\/option>\r\n<option value=\"fr\">\ud83c\uddeb\ud83c\uddf7 Fran\u00e7ais<\/option>\r\n<option value=\"de\">\ud83c\udde9\ud83c\uddea Deutsch<\/option>\r\n<option value=\"es\">\ud83c\uddea\ud83c\uddf8 Espa\u00f1ol<\/option>\r\n<option value=\"ar\">\ud83c\uddf8\ud83c\udde6 \u0627\u0644\u0639\u0631\u0628\u064a\u0629<\/option>\r\n<option value=\"zh\">\ud83c\udde8\ud83c\uddf3 \u4e2d\u6587<\/option>\r\n<option value=\"ja\">\ud83c\uddef\ud83c\uddf5 \u65e5\u672c\u8a9e<\/option>\r\n<option value=\"ko\">\ud83c\uddf0\ud83c\uddf7 \ud55c\uad6d\uc5b4<\/option>\r\n<option value=\"hi\">\ud83c\uddee\ud83c\uddf3 \u0939\u093f\u0928\u094d\u0926\u0940<\/option>\r\n<option value=\"pt\">\ud83c\udde7\ud83c\uddf7 Portugu\u00eas<\/option>\r\n<option value=\"ru\">\ud83c\uddf7\ud83c\uddfa \u0420\u0443\u0441\u0441\u043a\u0438\u0439<\/option>\r\n<option value=\"tr\">\ud83c\uddf9\ud83c\uddf7 T\u00fcrk\u00e7e<\/option>\r\n<option value=\"id\">\ud83c\uddee\ud83c\udde9 Bahasa Indonesia<\/option>\r\n<option value=\"ms\">\ud83c\uddf2\ud83c\uddfe Bahasa Melayu<\/option>\r\n<\/select>\r\n<\/div>\r\n\r\n<div style=\"display:flex;gap:7px;margin-bottom:13px;flex-wrap:wrap;align-items:center;\">\r\n<button class=\"ls6-smpl\" id=\"pth-ls6-sample\" aria-label=\"Load sample\">\ud83d\udca1 Load Sample<\/button>\r\n<button class=\"ls6-btn bn-red\" id=\"pth-ls6-clear\" style=\"font-size:11px;padding:4px 10px;border-radius:6px;\" aria-label=\"Clear all\">\ud83d\uddd1\ufe0f Clear<\/button>\r\n<\/div>\r\n<div class=\"ls6-err\" id=\"pth-ls6-err\" role=\"alert\" aria-live=\"assertive\"><\/div>\r\n\r\n<!-- TABS: 3 tabs now \u2014 Data+Fields merged -->\r\n<div class=\"ls6-tabs\" role=\"tablist\">\r\n<button class=\"ls6-tab on\" id=\"pth-t-data\" role=\"tab\" aria-selected=\"true\" aria-controls=\"pth-p-data\">\ud83d\udccb Data & Fields<\/button>\r\n<button class=\"ls6-tab\" id=\"pth-t-design\" role=\"tab\" aria-selected=\"false\" aria-controls=\"pth-p-design\">\ud83c\udfa8 Design<\/button>\r\n<button class=\"ls6-tab\" id=\"pth-t-export\" role=\"tab\" aria-selected=\"false\" aria-controls=\"pth-p-export\">\ud83d\udda8\ufe0f Export<\/button>\r\n<\/div>\r\n\r\n<!-- TAB 1: DATA & FIELDS -->\r\n<div class=\"ls6-panel on\" id=\"pth-p-data\" role=\"tabpanel\" aria-labelledby=\"pth-t-data\">\r\n<div style=\"display:flex;gap:6px;margin-bottom:9px;\">\r\n<button class=\"ls6-btn bn-grey\" id=\"pth-show-up\" style=\"font-size:11px;padding:4px 10px;\" aria-label=\"Show file upload\">\ud83d\udcc2 Upload File<\/button>\r\n<button class=\"ls6-btn bn-grey\" id=\"pth-show-ps\" style=\"font-size:11px;padding:4px 10px;\" aria-label=\"Show paste\">\ud83d\udccb Paste CSV<\/button>\r\n<\/div>\r\n<div class=\"ls6-dz\" id=\"pth-ls6-dz\" role=\"button\" tabindex=\"0\" aria-label=\"Upload CSV\">\r\n<div class=\"ls6-dz-icon\">\ud83d\udcc2<\/div>\r\n<p><strong>Click or Drag & Drop CSV File<\/strong><\/p>\r\n<p style=\"color:#475569;margin-top:3px;\">100% offline \u2014 no upload to server<\/p>\r\n<\/div>\r\n<input type=\"file\" id=\"pth-ls6-fin\" accept=\".csv\" style=\"display:none;\" aria-label=\"CSV file\">\r\n<div class=\"ls6-paste\" id=\"pth-ls6-paste\">\r\n<label for=\"pth-ls6-pastea\">Paste CSV (first row = headers)<\/label>\r\n<em style=\"font-size:11px;color:#475569;display:block;margin-bottom:4px;font-style:italic;\">Name,Email,City then data below<\/em>\r\n<textarea id=\"pth-ls6-pastea\" aria-label=\"Paste CSV\" placeholder=\"Name,City&#10;Jane,London\"><\/textarea>\r\n<button class=\"ls6-btn bn-blue\" id=\"pth-ls6-parsecsv\" style=\"margin-top:6px;font-size:11px;padding:5px 12px;\" aria-label=\"Parse CSV\">\u26a1 Parse & Load<\/button>\r\n<\/div>\r\n<div id=\"pth-ls6-la\" style=\"display:none;\">\r\n<div style=\"display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:6px;\">\r\n<span class=\"ls6-sh\" style=\"margin:0;border:none;\">\ud83d\udccc CSV Columns<\/span>\r\n<div style=\"display:flex;gap:5px;align-items:center;\">\r\n<span class=\"ls6-chip\" id=\"pth-ls6-rc\">0 records<\/span>\r\n<input type=\"text\" id=\"pth-ls6-cs\" placeholder=\"\ud83d\udd0d Filter...\" style=\"width:110px;font-size:11px;padding:4px 7px;\" aria-label=\"Filter columns\">\r\n<\/div>\r\n<\/div>\r\n<div class=\"ls6-tags\" id=\"pth-ls6-ct\"><\/div>\r\n<\/div>\r\n<div style=\"border-top:2px dashed #e2e8f0;margin:12px 0;\"><\/div>\r\n<div class=\"ls6-sh\">\ud83d\udcd0 Label Content Fields<\/div>\r\n<p style=\"font-size:0.78rem;color:#475569;margin:0 0 9px;font-style:italic;\">Each row = one content line. Order = top to bottom on label.<\/p>\r\n<div id=\"pth-ls6-fields\"><\/div>\r\n<div class=\"ls6-addrow\">\r\n<button class=\"ls6-btn bn-blue\"   id=\"pth-add-csv\" style=\"font-size:11px;padding:5px 11px;\" aria-label=\"Add CSV field\">+ CSV Column<\/button>\r\n<button class=\"ls6-btn bn-grey\"   id=\"pth-add-txt\" style=\"font-size:11px;padding:5px 11px;\" aria-label=\"Add text field\">+ Custom Text<\/button>\r\n<button class=\"ls6-btn bn-green\"  id=\"pth-add-qr\"  style=\"font-size:11px;padding:5px 11px;\" aria-label=\"Add QR field\">+ QR Code<\/button>\r\n<button class=\"ls6-btn bn-purple\" id=\"pth-add-div\" style=\"font-size:11px;padding:5px 11px;\" aria-label=\"Add divider\">+ Divider<\/button>\r\n<button class=\"ls6-btn bn-orange\" id=\"pth-add-img\" style=\"font-size:11px;padding:5px 11px;\" aria-label=\"Add image field\">+ Image<\/button>\r\n<button class=\"ls6-btn\" id=\"pth-add-bc\" style=\"font-size:11px;padding:5px 11px;background:#1e293b;color:#f8fafc;border:none;\" aria-label=\"Add barcode field\">\u258a\u258c Barcode<\/button>\r\n<\/div>\r\n<div style=\"background:#fffbeb;border:1px solid #fcd34d;border-radius:7px;padding:9px 11px;margin-top:9px;font-size:0.75rem;font-weight:600;color:#92400e;display:none;\" id=\"pth-ls6-bc-warn\">\r\n\u26a0\ufe0f <strong id=\"pth-ls6-bc-warn-title\">Barcode Limitation:<\/strong> <span id=\"pth-ls6-bc-warn-body\">Code 128 barcodes support ASCII characters only. Non-ASCII characters (Arabic, Chinese, Japanese, Korean, Hindi, Sinhala, accented letters) will be automatically stripped. Use QR Code for multilingual data.<\/span>\r\n<\/div>\r\n<div style=\"display:none;\" id=\"pth-ls6-dummy-close\">\r\n<\/div>\r\n<div style=\"background:#fff7ed;border:1px solid #fed7aa;border-radius:7px;padding:9px 11px;margin-top:9px;font-size:0.76rem;color:#92400e;font-weight:600;\">\r\n\ud83d\uddbc\ufe0f <strong>Image field<\/strong> \u2014 upload a shared image (logo, stamp) used on all labels, or map a CSV column containing per-record image URLs. Supports Square, Circle, Rounded shapes.\r\n<\/div>\r\n<\/div>\r\n\r\n<!-- TAB 2: DESIGN -->\r\n<div class=\"ls6-panel\" id=\"pth-p-design\" role=\"tabpanel\" aria-labelledby=\"pth-t-design\">\r\n<div class=\"ls6-sh\">\ud83d\uddbc\ufe0f Label Templates<\/div>\r\n<div class=\"ls6-tpl-grid\" id=\"pth-ls6-tg\">\r\n<div class=\"ls6-tpl on\" data-tpl=\"name-badge\" role=\"button\" tabindex=\"0\" aria-label=\"Name Badge\"><div class=\"ls6-tpl-icon\">\ud83d\udc64<\/div><div class=\"ls6-tpl-name\">Name Badge<\/div><div class=\"ls6-tpl-sz\">280\u00d7140<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"address\" role=\"button\" tabindex=\"0\" aria-label=\"Address\"><div class=\"ls6-tpl-icon\">\ud83d\udcee<\/div><div class=\"ls6-tpl-name\">Address<\/div><div class=\"ls6-tpl-sz\">260\u00d7130<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"shipping\" role=\"button\" tabindex=\"0\" aria-label=\"Shipping\"><div class=\"ls6-tpl-icon\">\ud83d\udce6<\/div><div class=\"ls6-tpl-name\">Shipping<\/div><div class=\"ls6-tpl-sz\">384\u00d7192<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"product\" role=\"button\" tabindex=\"0\" aria-label=\"Product Tag\"><div class=\"ls6-tpl-icon\">\ud83c\udff7\ufe0f<\/div><div class=\"ls6-tpl-name\">Product Tag<\/div><div class=\"ls6-tpl-sz\">200\u00d7100<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"qr-card\" role=\"button\" tabindex=\"0\" aria-label=\"QR Card\"><div class=\"ls6-tpl-icon\">\ud83d\udcf1<\/div><div class=\"ls6-tpl-name\">QR Card<\/div><div class=\"ls6-tpl-sz\">300\u00d7150<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"inventory\" role=\"button\" tabindex=\"0\" aria-label=\"Inventory\"><div class=\"ls6-tpl-icon\">\ud83d\udcca<\/div><div class=\"ls6-tpl-name\">Inventory<\/div><div class=\"ls6-tpl-sz\">240\u00d790<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"event-pass\" role=\"button\" tabindex=\"0\" aria-label=\"Event Pass\"><div class=\"ls6-tpl-icon\">\ud83c\udfab<\/div><div class=\"ls6-tpl-name\">Event Pass<\/div><div class=\"ls6-tpl-sz\">320\u00d7160<\/div><\/div>\r\n<div class=\"ls6-tpl\" data-tpl=\"square\" role=\"button\" tabindex=\"0\" aria-label=\"Square\"><div class=\"ls6-tpl-icon\">\u2b1c<\/div><div class=\"ls6-tpl-name\">Square<\/div><div class=\"ls6-tpl-sz\">160\u00d7160<\/div><\/div>\r\n<\/div>\r\n<div class=\"ls6-sh\">\ud83d\udcd0 Dimensions<\/div>\r\n<div class=\"ls6-g3\">\r\n<div class=\"ls6-fld\"><label for=\"pth-d-w\">Width (px)<\/label><input type=\"number\" id=\"pth-d-w\" value=\"280\" min=\"60\" max=\"1200\" aria-label=\"Width\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-h\">Height (px)<\/label><input type=\"number\" id=\"pth-d-h\" value=\"140\" min=\"40\" max=\"800\" aria-label=\"Height\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-pad\">Padding (px)<\/label><input type=\"number\" id=\"pth-d-pad\" value=\"12\" min=\"0\" max=\"60\" aria-label=\"Padding\"><\/div>\r\n<\/div>\r\n<div class=\"ls6-sh\">\ud83c\udfa8 Colors & Font<\/div>\r\n<div class=\"ls6-g4\">\r\n<div class=\"ls6-fld\"><label for=\"pth-d-bg\">Background<\/label><input type=\"color\" id=\"pth-d-bg\" value=\"#ffffff\" aria-label=\"BG color\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-fg\">Text<\/label><input type=\"color\" id=\"pth-d-fg\" value=\"#0f172a\" aria-label=\"Text color\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-ac\">Accent<\/label><input type=\"color\" id=\"pth-d-ac\" value=\"#2563eb\" aria-label=\"Accent color\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-sc\">Stripe<\/label><input type=\"color\" id=\"pth-d-sc\" value=\"#2563eb\" aria-label=\"Stripe color\"><\/div>\r\n<\/div>\r\n<div class=\"ls6-g2\" style=\"margin-bottom:9px;\">\r\n<div class=\"ls6-fld\"><label for=\"pth-d-font\">Font Family<\/label>\r\n<select id=\"pth-d-font\" aria-label=\"Font\">\r\n<option value=\"'Inter',system-ui,sans-serif\">Inter (Modern)<\/option>\r\n<option value=\"Arial,sans-serif\">Arial<\/option>\r\n<option value=\"Georgia,serif\">Georgia<\/option>\r\n<option value=\"'Courier New',monospace\">Courier New<\/option>\r\n<option value=\"'Times New Roman',serif\">Times New Roman<\/option>\r\n<option value=\"'Noto Sans',sans-serif\">Noto Sans (Multilingual)<\/option>\r\n<option value=\"'Noto Sans Arabic',sans-serif\">Noto Arabic (\u0639\u0631\u0628\u064a)<\/option>\r\n<option value=\"'Noto Sans SC',sans-serif\">Noto SC (\u4e2d\u6587)<\/option>\r\n<option value=\"'Noto Sans JP',sans-serif\">Noto JP (\u65e5\u672c\u8a9e)<\/option>\r\n<option value=\"'Noto Sans KR',sans-serif\">Noto KR (\ud55c\uad6d\uc5b4)<\/option>\r\n<\/select><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-align\">Text Align<\/label>\r\n<select id=\"pth-d-align\" aria-label=\"Alignment\">\r\n<option value=\"left\">Left<\/option>\r\n<option value=\"center\">Center<\/option>\r\n<option value=\"right\">Right<\/option>\r\n<\/select><\/div>\r\n<\/div>\r\n<div class=\"ls6-sh\">\u2728 Style Effects<\/div>\r\n<div class=\"ls6-g2\" style=\"margin-bottom:9px;\">\r\n<div class=\"ls6-fld\"><label for=\"pth-d-border\">Border<\/label>\r\n<select id=\"pth-d-border\" aria-label=\"Border\">\r\n<option value=\"1px solid #cbd5e1\">Light Solid<\/option>\r\n<option value=\"2px solid #0f172a\">Dark Bold<\/option>\r\n<option value=\"2px dashed #94a3b8\">Dashed<\/option>\r\n<option value=\"2px dotted #94a3b8\">Dotted<\/option>\r\n<option value=\"3px solid #2563eb\">Blue Bold<\/option>\r\n<option value=\"none\">No Border<\/option>\r\n<\/select><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-radius\">Radius (px)<\/label><input type=\"number\" id=\"pth-d-radius\" value=\"8\" min=\"0\" max=\"80\" aria-label=\"Radius\"><\/div>\r\n<\/div>\r\n<div class=\"ls6-g2\" style=\"margin-bottom:9px;\">\r\n<div class=\"ls6-fld\"><label for=\"pth-d-shadow\">Box Shadow<\/label>\r\n<select id=\"pth-d-shadow\" aria-label=\"Shadow\">\r\n<option value=\"none\">None<\/option>\r\n<option value=\"0 2px 8px rgba(0,0,0,0.10)\">Subtle<\/option>\r\n<option value=\"0 4px 16px rgba(0,0,0,0.15)\" selected>Medium<\/option>\r\n<option value=\"0 8px 24px rgba(0,0,0,0.20)\">Strong<\/option>\r\n<option value=\"0 4px 16px rgba(37,99,235,0.25)\">Blue Glow<\/option>\r\n<\/select><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-d-stripe\">Top Stripe<\/label>\r\n<select id=\"pth-d-stripe\" aria-label=\"Stripe\">\r\n<option value=\"0\">None<\/option>\r\n<option value=\"4\">4px<\/option>\r\n<option value=\"6\" selected>6px<\/option>\r\n<option value=\"8\">8px<\/option>\r\n<option value=\"12\">12px<\/option>\r\n<\/select><\/div>\r\n<\/div>\r\n<div class=\"ls6-sh\">\ud83d\uddbc\ufe0f Watermark \/ Background Image<\/div>\r\n<div class=\"ls6-g2\">\r\n<div class=\"ls6-fld\">\r\n<label>Upload Image<\/label>\r\n<input type=\"file\" id=\"pth-d-bgi\" accept=\"image\/*\" style=\"font-size:11px;\" aria-label=\"BG image\">\r\n<button class=\"ls6-btn bn-red\" id=\"pth-d-bgi-clr\" style=\"display:none;margin-top:5px;font-size:10px;padding:3px 9px;\" aria-label=\"Remove BG image\">\u2715 Remove<\/button>\r\n<\/div>\r\n<div class=\"ls6-fld\">\r\n<label for=\"pth-d-bgop\">Opacity<\/label>\r\n<div class=\"ls6-srow\"><input type=\"range\" id=\"pth-d-bgop\" min=\"5\" max=\"100\" value=\"15\" aria-label=\"BG opacity\"><span class=\"ls6-sval\" id=\"pth-d-bgop-v\">15%<\/span><\/div>\r\n<label for=\"pth-d-bgfit\" style=\"margin-top:6px;\">Fit<\/label>\r\n<select id=\"pth-d-bgfit\" aria-label=\"BG fit\"><option value=\"cover\">Cover<\/option><option value=\"contain\">Contain<\/option><option value=\"auto\">Actual Size<\/option><\/select>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<!-- TAB 3: EXPORT -->\r\n<div class=\"ls6-panel\" id=\"pth-p-export\" role=\"tabpanel\" aria-labelledby=\"pth-t-export\">\r\n<div class=\"ls6-sh\">\ud83d\udcd0 Print Layout<\/div>\r\n<div class=\"ls6-g3\">\r\n<div class=\"ls6-fld\"><label for=\"pth-ex-cols\">Per Row<\/label>\r\n<select id=\"pth-ex-cols\" aria-label=\"Per row\">\r\n<option value=\"1\">1<\/option><option value=\"2\">2<\/option><option value=\"3\" selected>3<\/option><option value=\"4\">4<\/option><option value=\"5\">5<\/option>\r\n<\/select><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-ex-gap\">Gap<\/label>\r\n<select id=\"pth-ex-gap\" aria-label=\"Gap\">\r\n<option value=\"6\">Small<\/option><option value=\"10\" selected>Medium<\/option><option value=\"16\">Large<\/option>\r\n<\/select><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-ex-margin\">Margin<\/label>\r\n<select id=\"pth-ex-margin\" aria-label=\"Margin\">\r\n<option value=\"0.3cm\">Minimal<\/option><option value=\"0.5cm\" selected>Standard<\/option><option value=\"1cm\">Wide<\/option>\r\n<\/select><\/div>\r\n<\/div>\r\n<div class=\"ls6-sh\">\ud83d\udce4 Export<\/div>\r\n<div class=\"ls6-ex-grid\">\r\n<div class=\"ls6-ex-card\" id=\"pth-ex-print\" role=\"button\" tabindex=\"0\" aria-label=\"Print\"><div class=\"ls6-ex-icon\">\ud83d\udda8\ufe0f<\/div><div class=\"ls6-ex-name\">Print Labels<\/div><div class=\"ls6-ex-desc\">Opens print dialog<\/div><\/div>\r\n<div class=\"ls6-ex-card\" id=\"pth-ex-pdf\" role=\"button\" tabindex=\"0\" aria-label=\"PDF\"><div class=\"ls6-ex-icon\">\ud83d\udcc4<\/div><div class=\"ls6-ex-name\">Save as PDF<\/div><div class=\"ls6-ex-desc\">Choose PDF in dialog<\/div><\/div>\r\n<div class=\"ls6-ex-card\" id=\"pth-ex-html\" role=\"button\" tabindex=\"0\" aria-label=\"HTML\"><div class=\"ls6-ex-icon\">\ud83d\udcbe<\/div><div class=\"ls6-ex-name\">Download HTML<\/div><div class=\"ls6-ex-desc\">Offline standalone file<\/div><\/div>\r\n<div class=\"ls6-ex-card\" id=\"pth-ex-prev\" role=\"button\" tabindex=\"0\" aria-label=\"Preview\"><div class=\"ls6-ex-icon\">\ud83d\udc41\ufe0f<\/div><div class=\"ls6-ex-name\">Preview All<\/div><div class=\"ls6-ex-desc\">All records, new tab<\/div><\/div>\r\n<\/div>\r\n<div style=\"background:#f0fdf4;border:1px solid #bbf7d0;border-radius:7px;padding:9px 11px;font-size:0.76rem;color:#047857;font-weight:600;\">\r\n\ud83d\udca1 QR codes and custom images are fully embedded \u2014 all export modes work offline including PDF.\r\n<\/div>\r\n<\/div>\r\n\r\n<\/div><!-- end left card -->\r\n<\/div><!-- end left col -->\r\n\r\n<!-- RIGHT: PERSISTENT LIVE PREVIEW \u2014 always visible -->\r\n<div class=\"ls6-right\">\r\n<div class=\"ls6-pv-wrap\">\r\n<div class=\"ls6-pv-head\">\r\n<span class=\"ls6-pv-title\">\ud83d\udc41\ufe0f Live Preview<\/span>\r\n<div style=\"display:flex;gap:5px;align-items:center;\">\r\n<span class=\"ls6-chip\" id=\"pth-ls6-pc\">0\/0<\/span>\r\n<button class=\"ls6-btn bn-grey\" id=\"pth-ls6-bgd\" style=\"font-size:10px;padding:3px 8px;\" aria-label=\"Toggle BG\">\u2600\ufe0f BG<\/button>\r\n<\/div>\r\n<\/div>\r\n<div class=\"ls6-pv-grid\" id=\"pth-ls6-pg\">\r\n<div class=\"ls6-pv-empty\"><span style=\"font-size:28px;\">\ud83c\udff7\ufe0f<\/span><span id='pth-ls6-pv-empty-txt'>Preview updates live as you design<\/span><\/div>\r\n<\/div>\r\n<!-- Quick Adjust pinned below preview -->\r\n<div class=\"ls6-qa\">\r\n<div class=\"ls6-qa-title\">\u26a1 Quick Adjust<\/div>\r\n<div style=\"display:grid;grid-template-columns:1fr 1fr;gap:7px;\">\r\n<div class=\"ls6-fld\"><label for=\"pth-q-w\" style=\"font-size:10px;\">Width<\/label><input type=\"number\" id=\"pth-q-w\" value=\"280\" min=\"60\" max=\"1200\" aria-label=\"Quick width\" style=\"font-size:11px;padding:5px 7px;\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-q-h\" style=\"font-size:10px;\">Height<\/label><input type=\"number\" id=\"pth-q-h\" value=\"140\" min=\"40\" max=\"800\" aria-label=\"Quick height\" style=\"font-size:11px;padding:5px 7px;\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-q-bg\" style=\"font-size:10px;\">Background<\/label><input type=\"color\" id=\"pth-q-bg\" value=\"#ffffff\" aria-label=\"Quick BG\" style=\"height:28px;\"><\/div>\r\n<div class=\"ls6-fld\"><label for=\"pth-q-fg\" style=\"font-size:10px;\">Text Color<\/label><input type=\"color\" id=\"pth-q-fg\" value=\"#0f172a\" aria-label=\"Quick FG\" style=\"height:28px;\"><\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<!-- Tips -->\r\n<div class=\"ls6-sc\">\r\n<div class=\"ls6-sc-head\">\ud83d\udca1 Tips<\/div>\r\n<div class=\"ls6-sc-body\">\r\n<div class=\"ls6-tip\"><span class=\"ls6-tip-icon\">\u258a\u258c<\/span><div class=\"ls6-tip-text\"><strong id=\"pth-tip-bc-t\">Code 128 Barcode<\/strong><span id=\"pth-tip-bc-b\">Real scannable barcode from any CSV column. ASCII only (0-127). Non-ASCII auto-stripped.<\/span><\/div><\/div>\r\n<div class=\"ls6-tip\"><span class=\"ls6-tip-icon\">\ud83d\udcf1<\/span><div class=\"ls6-tip-text\"><strong id=\"pth-tip-qr-t\">QR Code<\/strong><span id=\"pth-tip-qr-b\">Supports ALL Unicode \u2014 multilingual text, Arabic, Chinese, Hindi, Sinhala. Best for multilingual.<\/span><\/div><\/div>\r\n<div class=\"ls6-tip\"><span class=\"ls6-tip-icon\">\ud83c\udf10<\/span><div class=\"ls6-tip-text\"><strong id=\"pth-tip-lang-t\">Multilingual Labels<\/strong><span id=\"pth-tip-lang-b\">Select Noto Sans fonts in Design tab. Arabic auto-sets RTL direction.<\/span><\/div><\/div>\r\n<div class=\"ls6-tip\"><span class=\"ls6-tip-icon\">\u26a1<\/span><div class=\"ls6-tip-text\"><strong id=\"pth-tip-qa-t\">Quick Adjust<\/strong><span id=\"pth-tip-qa-b\">Change size and colors here without switching tabs.<\/span><\/div><\/div<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div><!-- end right -->\r\n\r\n<\/div><!-- end outer -->\r\n<\/div><!-- end wrap -->\r\n\r\n<script data-no-optimize=\"1\" data-no-minify=\"1\" data-cfasync=\"false\">\r\n(function(){\r\n'use strict';\r\n\r\n\/* ============================================================\r\n   i18n \u2014 15 languages. Keys used via S.t('key')\r\n   ============================================================ *\/\r\nvar LANG={\r\nen:{loadSample:'Load Sample',clear:'Clear',uploadFile:'Upload File',pasteCSV:'Paste CSV',parseLoad:'Parse & Load',addCsv:'CSV Column',addText:'Custom Text',addQR:'QR Code',addBarcode:'Barcode',addDivider:'Divider',addImage:'Image',selectCol:'-- Select Column --',imgUrlCol:'-- CSV image URL col --',sharedImg:'\u2014 or upload shared image \u2014',noMatch:'No columns match',removeField:'Remove',fontWeight:'Weight',fieldAlign:'Align',inherit:'Inherit',wLeft:'Left',wCenter:'Center',wRight:'Right',wReg:'Regular',wMed:'Medium',wSemi:'SemiBold',wBold:'Bold',wExtra:'ExtraBold',imgShapeSquare:'Square',imgShapeCircle:'Circle',imgShapeRounded:'Rounded',fitContain:'Contain',fitCover:'Cover',fitActual:'Actual',showBcText:'Show text below barcode',bcHeight:'Bar height (px)',bcColor:'Bar color',livePreview:'\ud83d\udc41\ufe0f Live Preview',previewEmpty:'Preview updates live as you design',quickAdjust:'\u26a1 Quick Adjust',tipsTitle:'\ud83d\udca1 Tips',tipBcTitle:'Code 128 Barcode',tipBcBody:'Real scannable barcode from any CSV column. ASCII only \u2014 numbers, letters, symbols. Non-ASCII stripped automatically.',tipQrTitle:'QR Code',tipQrBody:'Supports all Unicode including multilingual text. Best choice for Arabic, Chinese, Hindi, Sinhala etc.',tipLangTitle:'Multilingual Labels',tipLangBody:'Select Noto Sans fonts in Design tab for non-Latin scripts. Arabic auto-sets RTL.',tipQaTitle:'Quick Adjust',tipQaBody:'Change size and colors without switching tabs.',\r\nwarnBcTitle:'\u26a0\ufe0f Barcode Limitation',warnBcBody:'Code 128 barcodes support ASCII characters only (0\u2013127). Non-ASCII characters \u2014 Arabic, Chinese, Japanese, Korean, Hindi, Sinhala, accented letters \u2014 will be automatically stripped. For multilingual data, use the QR Code field instead.',warnQrTitle:'\u2139\ufe0f QR Code',warnQrBody:'QR codes support all Unicode characters including Arabic, Chinese, Japanese, Korean, Hindi, Sinhala, and all accented text. Best choice for multilingual labels.',warnRtlTitle:'\u2139\ufe0f RTL Language',warnRtlBody:'Arabic is right-to-left. Text alignment set to Right. Select \"Noto Arabic\" font in Design tab for best results.',livePreviewSub:'Updates on every change',exportNote:'QR codes and barcodes fully embedded \u2014 all export modes work offline including PDF.',tplApplied:'Template applied'},\r\n\r\nsi:{loadSample:'\u0db1\u0dd2\u0daf\u0dbb\u0dca\u0dc1\u0db1\u0dba',clear:'\u0db8\u0d9a\u0db1\u0dca\u0db1',uploadFile:'\u0d9c\u0ddc\u0db1\u0dd4\u0dc0',pasteCSV:'CSV \u0d87\u0dbd\u0dc0\u0dd3\u0db8',parseLoad:'\u0dc0\u0dd2\u0dc1\u0dca\u0dbd\u0dda\u0dc2\u0dab\u0dba',addCsv:'CSV \u0dad\u0dd3\u0dbb\u0dd4\u0dc0',addText:'\u0db4\u0dcf\u0da8\u0dba',addQR:'QR \u0d9a\u0dda\u0dad\u0dba',addBarcode:'\u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dba',addDivider:'\u0db6\u0dd9\u0daf\u0dd4\u0db8',addImage:'\u0dbb\u0dd6\u0db4\u0dba',selectCol:'-- \u0dad\u0dd3\u0dbb\u0dd4\u0dc0 \u0dad\u0ddd\u0dbb\u0db1\u0dca\u0db1 --',imgUrlCol:'-- CSV \u0dbb\u0dd6\u0db4 URL --',sharedImg:'\u2014 \u0dc4\u0ddd \u0dbb\u0dd6\u0db4\u0dba\u0d9a\u0dca \u0d8b\u0da9\u0dd4\u0d9c\u0dad \u0d9a\u0dbb\u0db1\u0dca\u0db1 \u2014',noMatch:'\u0d9c\u0dd0\u0dbd\u0db4\u0dd9\u0db1 \u0db1\u0dd0\u0dad',removeField:'\u0d89\u0dc0\u0dad\u0dca \u0d9a\u0dbb\u0db1\u0dca\u0db1',fontWeight:'\u0d9d\u0db1\u0dad\u0dca\u0dc0\u0dba',fieldAlign:'\u0db4\u0dd9\u0dc5\u0d9c\u0dd0\u0dc3\u0dca\u0db8',inherit:'\u0d8b\u0dbb\u0dd4\u0db8',wLeft:'\u0dc0\u0db8\u0da7',wCenter:'\u0db8\u0dd0\u0daf\u0da7',wRight:'\u0daf\u0d9a\u0dd4\u0dab\u0da7',wReg:'\u0dc3\u0dcf\u0db8\u0dcf\u0db1\u0dca\u200d\u0dba',wMed:'\u0db8\u0db0\u0dca\u200d\u0dba\u0db8',wSemi:'\u0d85\u0dbb\u0dca\u0db0 \u0dad\u0daf',wBold:'\u0dad\u0daf',wExtra:'\u0d89\u0dad\u0dcf \u0dad\u0daf',imgShapeSquare:'\u0da0\u0dad\u0dd4\u0dbb\u0dc1\u0dca\u200d\u0dbb',imgShapeCircle:'\u0d9a\u0dc0\u0dba',imgShapeRounded:'\u0dc0\u0da7\u0d9a\u0dd4\u0dbb\u0dd4',fitContain:'\u0d87\u0dad\u0dd4\u0dc5\u0dad',fitCover:'\u0d86\u0dc0\u0dbb\u0dab\u0dba',fitActual:'\u0dc3\u0dad\u0dca\u200d\u0dba',showBcText:'\u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dba \u0dba\u0da7 \u0db4\u0dcf\u0da8\u0dba',bcHeight:'\u0dad\u0dd3\u0dbb\u0dd4 \u0d8b\u0dc3',bcColor:'\u0dad\u0dd3\u0dbb\u0dd4 \u0dc0\u0dbb\u0dca\u0dab\u0dba',livePreview:'\ud83d\udc41\ufe0f \u0dc3\u0da2\u0dd3\u0dc0\u0dd3 \u0db4\u0dd9\u0dbb\u0daf\u0dbb\u0dca\u0dc1\u0db1\u0dba',previewEmpty:'\u0d94\u0db6 \u0db1\u0dd2\u0dbb\u0dca\u0db8\u0dcf\u0dab\u0dba \u0d9a\u0dbb\u0db1 \u0dc0\u0dd2\u0da7 \u0dba\u0dcf\u0dc0\u0dad\u0dca\u0d9a\u0dcf\u0dbd\u0dd3\u0db1 \u0dc0\u0dda',quickAdjust:'\u26a1 \u0d89\u0d9a\u0dca\u0db8\u0db1\u0dca \u0dc3\u0d9a\u0dc3',tipsTitle:'\ud83d\udca1 \u0d89\u0d9f\u0dd2',tipBcTitle:'Code 128 \u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dba',tipBcBody:'\u0d95\u0db1\u0dd1\u0db8 CSV \u0dad\u0dd3\u0dbb\u0dd4\u0dc0\u0d9a\u0dd2\u0db1\u0dca \u0dc3\u0dd0\u0db6\u0dd1 \u0dc3\u0dca\u0d9a\u0dd1\u0db1\u0dca \u0d9a\u0dc5 \u0dc4\u0dd0\u0d9a\u0dd2 \u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dba. ASCII \u0d85\u0d9a\u0dca\u0dc2\u0dbb \u0db4\u0db8\u0dab\u0dd2. \u0dc3\u0dd2\u0d82\u0dc4\u0dbd, \u0d85\u0dbb\u0dcf\u0db6\u0dd2 \u0dc3\u0dca\u0dc0\u0dba\u0d82\u0d9a\u0dca\u200d\u0dbb\u0dd3\u0dba\u0dc0 \u0d89\u0dc0\u0dad\u0dca \u0d9a\u0dd9\u0dbb\u0dda.',tipQrTitle:'QR \u0d9a\u0dda\u0dad\u0dba',tipQrBody:'\u0dc3\u0dd2\u0d82\u0dc4\u0dbd, \u0d85\u0dbb\u0dcf\u0db6\u0dd2, \u0da0\u0dd3\u0db1 \u0dc3\u0dd2\u0dba\u0dbd\u0dd4 Unicode \u0dc3\u0db3\u0dc4\u0dcf \u0d9a\u0dca\u200d\u0dbb\u0dd2\u0dba\u0dcf \u0d9a\u0dbb\u0dba\u0dd2. \u0db6\u0dc4\u0dd4\u0db7\u0dcf\u0dc2\u0dcf \u0dbd\u0dda\u0db6\u0dbd\u0dca \u0dc3\u0db3\u0dc4\u0dcf QR \u0dc4\u0ddc\u0db3\u0db8.',tipLangTitle:'\u0db6\u0dc4\u0dd4\u0db7\u0dcf\u0dc2\u0dcf \u0dbd\u0dda\u0db6\u0dbd\u0dca',tipLangBody:'Noto Sans \u0d85\u0d9a\u0dd4\u0dbb\u0dd4 \u0db7\u0dcf\u0dc0\u0dd2\u0dad\u0dcf \u0d9a\u0dbb\u0db1\u0dca\u0db1. \u0dc3\u0dd2\u0d82\u0dc4\u0dbd, \u0d85\u0dbb\u0dcf\u0db6\u0dd2, \u0da0\u0dd3\u0db1, \u0da2\u0db4\u0db1\u0dca \u0d87\u0dad\u0dd4\u0dc5\u0dd4 \u0dc3\u0dd2\u0dba\u0dbd\u0dd4.',tipQaTitle:'\u0d89\u0d9a\u0dca\u0db8\u0db1\u0dca \u0dc3\u0d9a\u0dc3',tipQaBody:'\u0da7\u0dd0\u0db6\u0dca \u0db8\u0dcf\u0dbb\u0dd4 \u0db1\u0ddc\u0d9a\u0dbb \u0db4\u0dca\u200d\u0dbb\u0db8\u0dcf\u0dab\u0dba \u0dc3\u0dc4 \u0dc0\u0dbb\u0dca\u0dab \u0dc0\u0dd9\u0db1\u0dc3\u0dca \u0d9a\u0dbb\u0db1\u0dca\u0db1.',\r\nwarnBcTitle:'\u26a0\ufe0f \u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dca \u0dc3\u0dd3\u0db8\u0dcf\u0dc0',warnBcBody:'Code 128 \u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dca ASCII \u0d85\u0d9a\u0dca\u0dc2\u0dbb \u0db4\u0db8\u0dab\u0d9a\u0dca \u0dc3\u0db3\u0dc4\u0dcf \u0d9a\u0dca\u200d\u0dbb\u0dd2\u0dba\u0dcf \u0d9a\u0dbb\u0dba\u0dd2 (0\u2013127). \u0dc3\u0dd2\u0d82\u0dc4\u0dbd, \u0d85\u0dbb\u0dcf\u0db6\u0dd2, \u0da0\u0dd3\u0db1, \u0da2\u0db4\u0db1\u0dca, \u0d9a\u0ddc\u0dbb\u0dd2\u0dba\u0dcf\u0db1\u0dd4, \u0dc4\u0dd2\u0db1\u0dca\u0daf\u0dd2 \u0d87\u0dad\u0dd4\u0dc5\u0dd4 ASCII \u0db1\u0ddc\u0dc0\u0db1 \u0d85\u0d9a\u0dca\u0dc2\u0dbb \u0dc3\u0dca\u0dc0\u0dba\u0d82\u0d9a\u0dca\u200d\u0dbb\u0dd3\u0dba\u0dc0 \u0d89\u0dc0\u0dad\u0dca \u0d9a\u0dd9\u0dbb\u0dda. \u0db6\u0dc4\u0dd4\u0db7\u0dcf\u0dc2\u0dcf \u0daf\u0dad\u0dca\u0dad \u0dc3\u0db3\u0dc4\u0dcf QR Code \u0d9a\u0dca\u0dc2\u0dda\u0dad\u0dca\u200d\u0dbb\u0dba \u0db7\u0dcf\u0dc0\u0dd2\u0dad\u0dcf \u0d9a\u0dbb\u0db1\u0dca\u0db1.',warnQrTitle:'\u2139\ufe0f QR \u0d9a\u0dda\u0dad',warnQrBody:'QR \u0d9a\u0dda\u0dad \u0dc3\u0dd2\u0d82\u0dc4\u0dbd, \u0d85\u0dbb\u0dcf\u0db6\u0dd2, \u0da0\u0dd3\u0db1, \u0da2\u0db4\u0db1\u0dca, \u0d9a\u0ddc\u0dbb\u0dd2\u0dba\u0dcf\u0db1\u0dd4, \u0dc4\u0dd2\u0db1\u0dca\u0daf\u0dd2 \u0d87\u0dad\u0dd4\u0dc5\u0dd4 \u0dc3\u0dd2\u0dba\u0dbd\u0dd4 Unicode \u0dc3\u0db3\u0dc4\u0dcf \u0dc3\u0dc4\u0dba \u0daf\u0d9a\u0dca\u0dc0\u0dba\u0dd2. \u0db6\u0dc4\u0dd4\u0db7\u0dcf\u0dc2\u0dcf \u0dbd\u0dda\u0db6\u0dbd\u0dca \u0dc3\u0db3\u0dc4\u0dcf QR Code \u0dc1\u0dca\u200d\u0dbb\u0dda\u0dc2\u0dca\u0da8.',warnRtlTitle:'\u2139\ufe0f RTL \u0db7\u0dcf\u0dc2\u0dcf\u0dc0',warnRtlBody:'\u0d85\u0dbb\u0dcf\u0db6\u0dd2 \u0daf\u0d9a\u0dd4\u0dab\u0dda \u0dc3\u0dd2\u0da7 \u0dc0\u0db8\u0da7. \u0db4\u0dd9\u0dc5 \u0db4\u0dd9\u0dc5\u0d9c\u0dd0\u0dc3\u0dca\u0db8 \u0daf\u0d9a\u0dd4\u0dab\u0da7 \u0dc3\u0d9a\u0dc3\u0dca \u0d9a\u0dd9\u0dbb\u0dd2\u0dab.',livePreviewSub:'\u0dc3\u0dd1\u0db8 \u0dc0\u0dd9\u0db1\u0dc3\u0d9a\u0daf\u0dd3\u0db8 \u0dba\u0dcf\u0dc0\u0dad\u0dca\u0d9a\u0dcf\u0dbd\u0dd3\u0db1',exportNote:'QR \u0d9a\u0dda\u0dad \u0dc3\u0dc4 \u0db6\u0dcf\u0d9a\u0ddd\u0da9\u0dca \u0dc3\u0db8\u0dca\u0db4\u0dd6\u0dbb\u0dca\u0dab\u0dba\u0dd9\u0db1\u0dca \u0d87\u0dad\u0dd4\u0dc5\u0dad\u0dca \u2014 PDF \u0d87\u0dad\u0dd4\u0dc5\u0dd4 \u0dc3\u0dd2\u0dba\u0dbd\u0dd4 \u0d85\u0db4\u0db1\u0dba\u0db1 \u0d9a\u0dca\u200d\u0dbb\u0db8 \u0d95\u0dc6\u0dca\u0dbd\u0dba\u0dd2\u0db1\u0dca \u0d9a\u0dca\u200d\u0dbb\u0dd2\u0dba\u0dcf \u0d9a\u0dbb\u0dba\u0dd2.',tplApplied:'\u0dc3\u0dd0\u0d9a\u0dd2\u0dbd\u0dca\u0dbd \u0dba\u0dd9\u0daf\u0dd4\u0dab\u0dd2'},\r\n\r\nfr:{loadSample:'Charger exemple',clear:'Effacer',uploadFile:'T\u00e9l\u00e9charger',pasteCSV:'Coller CSV',parseLoad:'Analyser',addCsv:'Colonne CSV',addText:'Texte',addQR:'Code QR',addBarcode:'Code-barres',addDivider:'S\u00e9parateur',addImage:'Image',selectCol:'-- S\u00e9lectionner --',noMatch:'Aucune correspondance',removeField:'Supprimer',fontWeight:'Graisse',fieldAlign:'Alignement',inherit:'H\u00e9riter',wLeft:'Gauche',wCenter:'Centre',wRight:'Droite',wReg:'Normal',wMed:'Moyen',wSemi:'Semi-gras',wBold:'Gras',wExtra:'Extra-gras',showBcText:'Texte sous code-barres',bcHeight:'Hauteur (px)',bcColor:'Couleur',livePreview:'\ud83d\udc41\ufe0f Aper\u00e7u en direct',previewEmpty:'L\\'aper\u00e7u se met \u00e0 jour en temps r\u00e9el',quickAdjust:'\u26a1 Ajustement rapide',tipsTitle:'\ud83d\udca1 Conseils',tipBcTitle:'Code 128',tipBcBody:'Code-barres scannable r\u00e9el. ASCII uniquement. Caract\u00e8res non-ASCII supprim\u00e9s automatiquement.',tipQrTitle:'Code QR',tipQrBody:'Supporte tous les caract\u00e8res Unicode y compris le texte multilingue.',tipLangTitle:'\u00c9tiquettes multilingues',tipLangBody:'Polices Noto Sans pour scripts non-latins.',tipQaTitle:'Ajustement rapide',tipQaBody:'Changer taille et couleurs sans changer d\\'onglet.',\r\nwarnBcTitle:'\u26a0\ufe0f Limitation code-barres',warnBcBody:'Code 128 supporte uniquement les caract\u00e8res ASCII (0\u2013127). Arabe, chinois, japonais, cor\u00e9en, hindi et caract\u00e8res accentu\u00e9s seront automatiquement supprim\u00e9s. Utilisez QR Code pour donn\u00e9es multilingues.',warnQrTitle:'\u2139\ufe0f Code QR',warnQrBody:'Les codes QR supportent tous les caract\u00e8res Unicode y compris le texte multilingue.',warnRtlTitle:'\u2139\ufe0f Langue RTL',warnRtlBody:'L\\'arabe s\\'\u00e9crit de droite \u00e0 gauche. Alignement d\u00e9fini sur Droite.',livePreviewSub:'Mise \u00e0 jour \u00e0 chaque changement',exportNote:'Codes QR et barres enti\u00e8rement int\u00e9gr\u00e9s.',tplApplied:'Mod\u00e8le appliqu\u00e9'},\r\n\r\nde:{loadSample:'Beispiel laden',clear:'L\u00f6schen',uploadFile:'Hochladen',pasteCSV:'CSV einf\u00fcgen',parseLoad:'Analysieren',addCsv:'CSV-Spalte',addText:'Text',addQR:'QR-Code',addBarcode:'Barcode',addDivider:'Trennlinie',addImage:'Bild',selectCol:'-- Ausw\u00e4hlen --',noMatch:'Keine Treffer',removeField:'Entfernen',fontWeight:'St\u00e4rke',fieldAlign:'Ausrichtung',inherit:'Erben',wLeft:'Links',wCenter:'Mitte',wRight:'Rechts',wReg:'Normal',wMed:'Mittel',wSemi:'Halbfett',wBold:'Fett',wExtra:'Extrafett',showBcText:'Text unter Barcode',bcHeight:'H\u00f6he (px)',bcColor:'Farbe',livePreview:'\ud83d\udc41\ufe0f Live-Vorschau',previewEmpty:'Vorschau aktualisiert sich live',quickAdjust:'\u26a1 Schnellanpassung',tipsTitle:'\ud83d\udca1 Tipps',tipBcTitle:'Code 128 Barcode',tipBcBody:'Echter scanbarer Barcode. Nur ASCII. Nicht-ASCII wird automatisch entfernt.',tipQrTitle:'QR-Code',tipQrBody:'Unterst\u00fctzt alle Unicode-Zeichen einschlie\u00dflich mehrsprachigem Text.',tipLangTitle:'Mehrsprachige Etiketten',tipLangBody:'Noto Sans Schriften f\u00fcr nicht-lateinische Schriften.',tipQaTitle:'Schnellanpassung',tipQaBody:'Gr\u00f6\u00dfe und Farben ohne Tab-Wechsel \u00e4ndern.',\r\nwarnBcTitle:'\u26a0\ufe0f Barcode-Einschr\u00e4nkung',warnBcBody:'Code 128 unterst\u00fctzt nur ASCII-Zeichen (0\u2013127). Arabisch, Chinesisch, Japanisch, Koreanisch, Hindi und akzentuierte Zeichen werden automatisch entfernt. QR-Code f\u00fcr mehrsprachige Daten verwenden.',warnQrTitle:'\u2139\ufe0f QR-Code',warnQrBody:'QR-Codes unterst\u00fctzen alle Unicode-Zeichen einschlie\u00dflich mehrsprachigem Text.',warnRtlTitle:'\u2139\ufe0f RTL-Sprache',warnRtlBody:'Arabisch ist von rechts nach links. Ausrichtung auf Rechts gesetzt.',livePreviewSub:'Aktualisiert bei jeder \u00c4nderung',exportNote:'QR-Codes und Barcodes vollst\u00e4ndig eingebettet.',tplApplied:'Vorlage angewendet'},\r\n\r\nes:{loadSample:'Cargar ejemplo',clear:'Borrar',uploadFile:'Subir',pasteCSV:'Pegar CSV',parseLoad:'Analizar',addCsv:'Columna CSV',addText:'Texto',addQR:'C\u00f3digo QR',addBarcode:'C\u00f3digo barras',addDivider:'Divisor',addImage:'Imagen',selectCol:'-- Seleccionar --',noMatch:'Sin coincidencias',removeField:'Eliminar',fontWeight:'Peso',fieldAlign:'Alineaci\u00f3n',inherit:'Heredar',wLeft:'Izquierda',wCenter:'Centro',wRight:'Derecha',wReg:'Normal',wMed:'Medio',wSemi:'Seminegrita',wBold:'Negrita',wExtra:'Extranegrita',showBcText:'Texto bajo c\u00f3digo',bcHeight:'Alto (px)',bcColor:'Color',livePreview:'\ud83d\udc41\ufe0f Vista previa',previewEmpty:'La vista previa se actualiza en vivo',quickAdjust:'\u26a1 Ajuste r\u00e1pido',tipsTitle:'\ud83d\udca1 Consejos',tipBcTitle:'C\u00f3digo barras 128',tipBcBody:'C\u00f3digo escaneable real. Solo ASCII. No-ASCII eliminado autom\u00e1ticamente.',tipQrTitle:'C\u00f3digo QR',tipQrBody:'Soporta todos los Unicode incluido texto multilingue.',tipLangTitle:'Etiquetas multilingues',tipLangBody:'Use fuentes Noto Sans para scripts no latinos.',tipQaTitle:'Ajuste r\u00e1pido',tipQaBody:'Cambia tama\u00f1o y colores sin cambiar de pesta\u00f1a.',\r\nwarnBcTitle:'\u26a0\ufe0f Limitaci\u00f3n c\u00f3digo barras',warnBcBody:'Code 128 solo soporta ASCII (0\u2013127). \u00c1rabe, chino, japon\u00e9s, coreano, hindi, caracteres acentuados ser\u00e1n eliminados autom\u00e1ticamente. Use QR Code para datos multilingues.',warnQrTitle:'\u2139\ufe0f C\u00f3digo QR',warnQrBody:'Soporta todos Unicode incluyendo texto multilingue.',warnRtlTitle:'\u2139\ufe0f Idioma RTL',warnRtlBody:'El \u00e1rabe es de derecha a izquierda. Alineaci\u00f3n ajustada a Derecha.',livePreviewSub:'Se actualiza en cada cambio',exportNote:'C\u00f3digos QR y barras completamente integrados.',tplApplied:'Plantilla aplicada'}\r\n};\r\n\r\n\/* For remaining languages \u2014 English fallback with key overrides *\/\r\nvar LANG_EXTRA={\r\nar:{loadSample:'\u062a\u062d\u0645\u064a\u0644 \u0646\u0645\u0648\u0630\u062c',clear:'\u0645\u0633\u062d',addCsv:'\u0639\u0645\u0648\u062f CSV',addText:'\u0646\u0635 \u0645\u062e\u0635\u0635',addQR:'\u0631\u0645\u0632 QR',addBarcode:'\u0627\u0644\u0628\u0627\u0631\u0643\u0648\u062f',addDivider:'\u0641\u0627\u0635\u0644',addImage:'\u0635\u0648\u0631\u0629',selectCol:'-- \u0627\u062e\u062a\u0631 \u0627\u0644\u0639\u0645\u0648\u062f --',removeField:'\u062d\u0630\u0641',showBcText:'\u0646\u0635 \u0623\u0633\u0641\u0644 \u0627\u0644\u0628\u0627\u0631\u0643\u0648\u062f',bcHeight:'\u0627\u0631\u062a\u0641\u0627\u0639',bcColor:'\u0644\u0648\u0646',livePreview:'\ud83d\udc41\ufe0f \u0645\u0639\u0627\u064a\u0646\u0629 \u0645\u0628\u0627\u0634\u0631\u0629',quickAdjust:'\u26a1 \u0636\u0628\u0637 \u0633\u0631\u064a\u0639',warnBcTitle:'\u26a0\ufe0f \u0642\u064a\u0648\u062f \u0627\u0644\u0628\u0627\u0631\u0643\u0648\u062f',warnBcBody:'\u0627\u0644\u0628\u0627\u0631\u0643\u0648\u062f Code 128 \u064a\u062f\u0639\u0645 \u0623\u062d\u0631\u0641 ASCII \u0641\u0642\u0637 (0\u2013127). \u0627\u0644\u0623\u062d\u0631\u0641 \u0627\u0644\u0639\u0631\u0628\u064a\u0629 \u0648\u0627\u0644\u0635\u064a\u0646\u064a\u0629 \u0648\u0627\u0644\u064a\u0627\u0628\u0627\u0646\u064a\u0629 \u0648\u0627\u0644\u0643\u0648\u0631\u064a\u0629 \u0648\u0627\u0644\u0647\u0646\u062f\u064a\u0629 \u0633\u062a\u064f\u062d\u0630\u0641 \u062a\u0644\u0642\u0627\u0626\u064a\u0627\u064b. \u0627\u0633\u062a\u062e\u062f\u0645 \u0631\u0645\u0632 QR \u0644\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0645\u062a\u0639\u062f\u062f\u0629 \u0627\u0644\u0644\u063a\u0627\u062a.',warnQrTitle:'\u2139\ufe0f \u0631\u0645\u0632 QR',warnQrBody:'\u0631\u0645\u0648\u0632 QR \u062a\u062f\u0639\u0645 \u062c\u0645\u064a\u0639 Unicode \u0628\u0645\u0627 \u0641\u064a\u0647\u0627 \u0627\u0644\u0639\u0631\u0628\u064a\u0629 \u0648\u0643\u0644 \u0627\u0644\u0644\u063a\u0627\u062a.',warnRtlTitle:'\u2139\ufe0f \u0644\u063a\u0629 RTL',warnRtlBody:'\u0627\u0644\u0639\u0631\u0628\u064a\u0629 \u0645\u0646 \u0627\u0644\u064a\u0645\u064a\u0646 \u0625\u0644\u0649 \u0627\u0644\u064a\u0633\u0627\u0631. \u062a\u0645 \u0636\u0628\u0637 \u0627\u0644\u0645\u062d\u0627\u0630\u0627\u0629 \u0639\u0644\u0649 \u0627\u0644\u064a\u0645\u064a\u0646 \u0648\u062a\u062d\u062f\u064a\u062b \u0627\u0644\u062e\u0637.',tplApplied:'\u062a\u0645 \u062a\u0637\u0628\u064a\u0642 \u0627\u0644\u0642\u0627\u0644\u0628'},\r\nzh:{loadSample:'\u52a0\u8f7d\u793a\u4f8b',clear:'\u6e05\u9664',addCsv:'CSV\u5217',addText:'\u81ea\u5b9a\u4e49\u6587\u672c',addQR:'\u4e8c\u7ef4\u7801',addBarcode:'\u6761\u5f62\u7801',addDivider:'\u5206\u9694\u7ebf',addImage:'\u56fe\u7247',selectCol:'-- \u9009\u62e9\u5217 --',removeField:'\u5220\u9664',showBcText:'\u6761\u7801\u4e0b\u65b9\u6587\u5b57',bcHeight:'\u9ad8\u5ea6(px)',bcColor:'\u989c\u8272',livePreview:'\ud83d\udc41\ufe0f \u5b9e\u65f6\u9884\u89c8',quickAdjust:'\u26a1 \u5feb\u901f\u8c03\u6574',warnBcTitle:'\u26a0\ufe0f \u6761\u5f62\u7801\u9650\u5236',warnBcBody:'Code 128\u6761\u5f62\u7801\u4ec5\u652f\u6301ASCII\u5b57\u7b26(0\u2013127)\u3002\u4e2d\u6587\u3001\u65e5\u6587\u3001\u97e9\u6587\u3001\u963f\u62c9\u4f2f\u6587\u7b49\u975eASCII\u5b57\u7b26\u5c06\u88ab\u81ea\u52a8\u5220\u9664\u3002\u8bf7\u4f7f\u7528\u4e8c\u7ef4\u7801\u5904\u7406\u591a\u8bed\u8a00\u6570\u636e\u3002',warnQrTitle:'\u2139\ufe0f \u4e8c\u7ef4\u7801',warnQrBody:'\u4e8c\u7ef4\u7801\u652f\u6301\u6240\u6709Unicode\u5b57\u7b26\uff0c\u5305\u62ec\u4e2d\u6587\u7b49\u591a\u8bed\u8a00\u6587\u672c\u3002',warnRtlTitle:'\u2139\ufe0f RTL',warnRtlBody:'',tplApplied:'\u6a21\u677f\u5df2\u5e94\u7528'},\r\nja:{loadSample:'\u30b5\u30f3\u30d7\u30eb\u8aad\u8fbc',clear:'\u30af\u30ea\u30a2',addCsv:'CSV\u5217',addText:'\u30c6\u30ad\u30b9\u30c8',addQR:'QR\u30b3\u30fc\u30c9',addBarcode:'\u30d0\u30fc\u30b3\u30fc\u30c9',addDivider:'\u533a\u5207\u308a\u7dda',addImage:'\u753b\u50cf',selectCol:'-- \u5217\u3092\u9078\u629e --',removeField:'\u524a\u9664',showBcText:'\u30d0\u30fc\u30b3\u30fc\u30c9\u4e0b\u30c6\u30ad\u30b9\u30c8',bcHeight:'\u9ad8\u3055(px)',bcColor:'\u8272',livePreview:'\ud83d\udc41\ufe0f \u30e9\u30a4\u30d6\u30d7\u30ec\u30d3\u30e5\u30fc',quickAdjust:'\u26a1 \u30af\u30a4\u30c3\u30af\u8abf\u6574',warnBcTitle:'\u26a0\ufe0f \u30d0\u30fc\u30b3\u30fc\u30c9\u5236\u9650',warnBcBody:'Code 128\u306fASCII\u6587\u5b57\u306e\u307f\u5bfe\u5fdc(0\u2013127)\u3002\u65e5\u672c\u8a9e\u30fb\u4e2d\u56fd\u8a9e\u30fb\u97d3\u56fd\u8a9e\u30fb\u30a2\u30e9\u30d3\u30a2\u8a9e\u306f\u81ea\u52d5\u524a\u9664\u3055\u308c\u307e\u3059\u3002\u591a\u8a00\u8a9e\u30c7\u30fc\u30bf\u306b\u306fQR\u30b3\u30fc\u30c9\u3092\u4f7f\u7528\u3057\u3066\u304f\u3060\u3055\u3044\u3002',warnQrTitle:'\u2139\ufe0f QR\u30b3\u30fc\u30c9',warnQrBody:'QR\u30b3\u30fc\u30c9\u306f\u65e5\u672c\u8a9e\u3092\u542b\u3080\u3059\u3079\u3066\u306eUnicode\u306b\u5bfe\u5fdc\u3057\u3066\u3044\u307e\u3059\u3002',warnRtlTitle:'\u2139\ufe0f RTL',warnRtlBody:'',tplApplied:'\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u9069\u7528'},\r\nko:{loadSample:'\uc0d8\ud50c \ubd88\ub7ec\uc624\uae30',clear:'\uc9c0\uc6b0\uae30',addCsv:'CSV \uc5f4',addText:'\ud14d\uc2a4\ud2b8',addQR:'QR \ucf54\ub4dc',addBarcode:'\ubc14\ucf54\ub4dc',addDivider:'\uad6c\ubd84\uc120',addImage:'\uc774\ubbf8\uc9c0',selectCol:'-- \uc5f4 \uc120\ud0dd --',removeField:'\uc0ad\uc81c',showBcText:'\ubc14\ucf54\ub4dc \uc544\ub798 \ud14d\uc2a4\ud2b8',bcHeight:'\ub192\uc774(px)',bcColor:'\uc0c9\uc0c1',livePreview:'\ud83d\udc41\ufe0f \uc2e4\uc2dc\uac04 \ubbf8\ub9ac\ubcf4\uae30',quickAdjust:'\u26a1 \ube60\ub978 \uc870\uc815',warnBcTitle:'\u26a0\ufe0f \ubc14\ucf54\ub4dc \uc81c\ud55c',warnBcBody:'Code 128\uc740 ASCII \ubb38\uc790\ub9cc \uc9c0\uc6d0\ud569\ub2c8\ub2e4(0\u2013127). \ud55c\uad6d\uc5b4, \uc911\uad6d\uc5b4, \uc77c\ubcf8\uc5b4, \uc544\ub78d\uc5b4 \ub4f1\uc740 \uc790\ub3d9\uc73c\ub85c \uc81c\uac70\ub429\ub2c8\ub2e4. \ub2e4\uad6d\uc5b4 \ub370\uc774\ud130\uc5d0\ub294 QR \ucf54\ub4dc\ub97c \uc0ac\uc6a9\ud558\uc138\uc694.',warnQrTitle:'\u2139\ufe0f QR \ucf54\ub4dc',warnQrBody:'QR \ucf54\ub4dc\ub294 \ud55c\uad6d\uc5b4\ub97c \ud3ec\ud568\ud55c \ubaa8\ub4e0 Unicode\ub97c \uc9c0\uc6d0\ud569\ub2c8\ub2e4.',warnRtlTitle:'\u2139\ufe0f RTL',warnRtlBody:'',tplApplied:'\ud15c\ud50c\ub9bf \uc801\uc6a9'},\r\nhi:{loadSample:'\u0928\u092e\u0942\u0928\u093e',clear:'\u0938\u093e\u092b',addCsv:'CSV \u0915\u0949\u0932\u092e',addText:'\u091f\u0947\u0915\u094d\u0938\u094d\u091f',addQR:'QR \u0915\u094b\u0921',addBarcode:'\u092c\u093e\u0930\u0915\u094b\u0921',addDivider:'\u0935\u093f\u092d\u093e\u091c\u0915',addImage:'\u091b\u0935\u093f',selectCol:'-- \u0915\u0949\u0932\u092e \u091a\u0941\u0928\u0947\u0902 --',removeField:'\u0939\u091f\u093e\u090f\u0902',showBcText:'\u092c\u093e\u0930\u0915\u094b\u0921 \u0915\u0947 \u0928\u0940\u091a\u0947 \u091f\u0947\u0915\u094d\u0938\u094d\u091f',bcHeight:'\u090a\u0902\u091a\u093e\u0908(px)',bcColor:'\u0930\u0902\u0917',livePreview:'\ud83d\udc41\ufe0f \u0932\u093e\u0907\u0935 \u092a\u094d\u0930\u0940\u0935\u094d\u092f\u0942',quickAdjust:'\u26a1 \u0924\u094d\u0935\u0930\u093f\u0924 \u0938\u092e\u093e\u092f\u094b\u091c\u0928',warnBcTitle:'\u26a0\ufe0f \u092c\u093e\u0930\u0915\u094b\u0921 \u0938\u0940\u092e\u093e',warnBcBody:'Code 128 \u0915\u0947\u0935\u0932 ASCII \u0915\u093e \u0938\u092e\u0930\u094d\u0925\u0928 \u0915\u0930\u0924\u093e \u0939\u0948 (0\u2013127)\u0964 \u0939\u093f\u0902\u0926\u0940, \u0905\u0930\u092c\u0940, \u091a\u0940\u0928\u0940 \u0906\u0926\u093f \u0938\u094d\u0935\u0924\u0903 \u0939\u091f\u093e \u0926\u093f\u090f \u091c\u093e\u090f\u0902\u0917\u0947\u0964 \u092c\u0939\u0941\u092d\u093e\u0937\u0940 \u0915\u0947 \u0932\u093f\u090f QR Code \u0909\u092a\u092f\u094b\u0917 \u0915\u0930\u0947\u0902\u0964',warnQrTitle:'\u2139\ufe0f QR \u0915\u094b\u0921',warnQrBody:'QR \u0915\u094b\u0921 \u0939\u093f\u0902\u0926\u0940 \u0938\u0939\u093f\u0924 \u0938\u092d\u0940 Unicode \u0915\u093e \u0938\u092e\u0930\u094d\u0925\u0928 \u0915\u0930\u0924\u093e \u0939\u0948\u0964',warnRtlTitle:'\u2139\ufe0f RTL',warnRtlBody:'',tplApplied:'\u091f\u0947\u092e\u094d\u092a\u0932\u0947\u091f \u0932\u093e\u0917\u0942'},\r\npt:{loadSample:'Exemplo',clear:'Limpar',addCsv:'Coluna CSV',addText:'Texto',addQR:'C\u00f3digo QR',addBarcode:'C\u00f3digo barras',addDivider:'Divisor',addImage:'Imagem',selectCol:'-- Selecionar --',removeField:'Remover',warnBcTitle:'\u26a0\ufe0f Limita\u00e7\u00e3o',warnBcBody:'Code 128 suporta apenas ASCII (0\u2013127). Caracteres n\u00e3o-ASCII ser\u00e3o removidos. Use QR Code para dados multil\u00edngues.',warnQrTitle:'\u2139\ufe0f QR',warnQrBody:'QR suporta todos Unicode incluindo multil\u00edngue.',warnRtlTitle:'',warnRtlBody:'',tplApplied:'Modelo aplicado'},\r\nru:{loadSample:'\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c',clear:'\u041e\u0447\u0438\u0441\u0442\u0438\u0442\u044c',addCsv:'\u0421\u0442\u043e\u043b\u0431\u0435\u0446 CSV',addText:'\u0422\u0435\u043a\u0441\u0442',addQR:'QR-\u043a\u043e\u0434',addBarcode:'\u0428\u0442\u0440\u0438\u0445\u043a\u043e\u0434',addDivider:'\u0420\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u0435\u043b\u044c',addImage:'\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435',selectCol:'-- \u0412\u044b\u0431\u0440\u0430\u0442\u044c --',removeField:'\u0423\u0434\u0430\u043b\u0438\u0442\u044c',warnBcTitle:'\u26a0\ufe0f \u041e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u0435',warnBcBody:'Code 128 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e ASCII (0\u2013127). \u041a\u0438\u0440\u0438\u043b\u043b\u0438\u0446\u0430, \u0430\u0440\u0430\u0431\u0441\u043a\u0438\u0439, \u043a\u0438\u0442\u0430\u0439\u0441\u043a\u0438\u0439 \u0431\u0443\u0434\u0443\u0442 \u0443\u0434\u0430\u043b\u0435\u043d\u044b. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 QR-\u043a\u043e\u0434 \u0434\u043b\u044f \u043c\u043d\u043e\u0433\u043e\u044f\u0437\u044b\u0447\u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445.',warnQrTitle:'\u2139\ufe0f QR-\u043a\u043e\u0434',warnQrBody:'QR \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0432\u0441\u0435 Unicode \u0441\u0438\u043c\u0432\u043e\u043b\u044b.',warnRtlTitle:'',warnRtlBody:'',tplApplied:'\u0428\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u0438\u043c\u0435\u043d\u0451\u043d'},\r\ntr:{loadSample:'\u00d6rnek y\u00fckle',clear:'Temizle',addCsv:'CSV S\u00fctunu',addText:'Metin',addQR:'QR Kod',addBarcode:'Barkod',addDivider:'B\u00f6l\u00fcc\u00fc',addImage:'Resim',selectCol:'-- S\u00fctun se\u00e7in --',removeField:'Kald\u0131r',warnBcTitle:'\u26a0\ufe0f Barkod s\u0131n\u0131r\u0131',warnBcBody:'Code 128 yaln\u0131zca ASCII destekler (0\u2013127). T\u00fcrk\u00e7e, Arap\u00e7a vb. otomatik kald\u0131r\u0131l\u0131r. \u00c7ok dilli i\u00e7in QR Kod kullan\u0131n.',warnQrTitle:'\u2139\ufe0f QR',warnQrBody:'QR t\u00fcm Unicode destekler.',warnRtlTitle:'',warnRtlBody:'',tplApplied:'\u015eablon uyguland\u0131'},\r\nid:{loadSample:'Muat contoh',clear:'Hapus',addCsv:'Kolom CSV',addText:'Teks',addQR:'Kode QR',addBarcode:'Kode batang',addDivider:'Pemisah',addImage:'Gambar',selectCol:'-- Pilih kolom --',removeField:'Hapus',warnBcTitle:'\u26a0\ufe0f Batasan barcode',warnBcBody:'Code 128 hanya mendukung ASCII (0\u2013127). Karakter non-ASCII dihapus otomatis. Gunakan QR Code untuk data multibahasa.',warnQrTitle:'\u2139\ufe0f QR',warnQrBody:'QR mendukung semua Unicode termasuk multibahasa.',warnRtlTitle:'',warnRtlBody:'',tplApplied:'Template diterapkan'},\r\nms:{loadSample:'Muatkan',clear:'Padam',addCsv:'Lajur CSV',addText:'Teks',addQR:'Kod QR',addBarcode:'Kod bar',addDivider:'Pemisah',addImage:'Imej',selectCol:'-- Pilih lajur --',removeField:'Buang',warnBcTitle:'\u26a0\ufe0f Had kod bar',warnBcBody:'Code 128 hanya menyokong ASCII (0\u2013127). Aksara bukan-ASCII dipadam secara automatik. Gunakan QR Code untuk data berbilang bahasa.',warnQrTitle:'\u2139\ufe0f QR',warnQrBody:'QR menyokong semua Unicode termasuk berbilang bahasa.',warnRtlTitle:'',warnRtlBody:'',tplApplied:'Templat digunakan'}\r\n};\r\n\/* Merge extra langs with English fallback *\/\r\nObject.keys(LANG_EXTRA).forEach(function(code){\r\nvar merged={};\r\nvar enk=Object.keys(LANG.en);\r\nfor(var i=0;i<enk.length;i++) merged[enk[i]]=LANG.en[enk[i]];\r\nvar ek=Object.keys(LANG_EXTRA[code]);\r\nfor(var j=0;j<ek.length;j++) merged[ek[j]]=LANG_EXTRA[code][ek[j]];\r\nLANG[code]=merged;\r\n});\r\n\r\n\/* ============================================================\r\n   CODE 128 BARCODE ENGINE \u2014 real scannable output via SVG\r\n   ============================================================ *\/\r\nvar C128_PATTERNS=[\r\n'11011001100','11001101100','11001100110','10010011000','10010001100',\r\n'10001001100','10011001000','10011000100','10001100100','11001001000',\r\n'11001000100','11000100100','10110011100','10011011100','10011001110',\r\n'10111001100','10011101100','10011100110','11001110010','11001011100',\r\n'11001001110','11011100100','11001110100','11101101110','11101001100',\r\n'11100101100','11100100110','11101100100','11100110100','11100110010',\r\n'11011011000','11011000110','11000110110','10100011000','10001011000',\r\n'10001000110','10110001000','10001101000','10001100010','11010001000',\r\n'11000101000','11000100010','10110111000','10110001110','10001101110',\r\n'10111011000','10111000110','10001110110','11101110110','11010001110',\r\n'11000101110','11011101000','11011100010','11011101110','11101011000',\r\n'11101000110','11100010110','11101101000','11101100010','11100011010',\r\n'11101111010','11001000010','11110001010','10100110000','10100001100',\r\n'10010110000','10010000110','10000101100','10000100110','10110010000',\r\n'10110000100','10011010000','10011000010','10000110100','10000110010',\r\n'11000010010','11001010000','11110111010','11000010100','10001111010',\r\n'10100111100','10010111100','10010011110','10111100100','10011110100',\r\n'10011110010','11110100100','11110010100','11110010010','11011011110',\r\n'11011110110','11110110110','10101111000','10100011110','10001011110',\r\n'10111101000','10111100010','11110101000','11110100010','10111011110',\r\n'10111101110','11101011110','11110101110','11010000100','11010010000',\r\n'11010011100','11000111010'\r\n];\r\nvar C128_START_B=104, C128_STOP=106;\r\n\r\nfunction encodeCode128(text){\r\n\/* Strip all non-ASCII (>127) \u2014 Code 128 cannot encode them *\/\r\nvar clean='';\r\nfor(var i=0;i<text.length;i++){\r\nvar c=text.charCodeAt(i);\r\nif(c>=0&&c<=127) clean+=text[i];\r\n}\r\nif(!clean) return null;\r\nvar vals=[C128_START_B];\r\nfor(var j=0;j<clean.length;j++){\r\nvar v=clean.charCodeAt(j)-32;\r\nif(v>=0&&v<=95) vals.push(v);\r\n}\r\nif(vals.length===1) return null; \/* only start, no data *\/\r\nvar check=vals[0];\r\nfor(var k=1;k<vals.length;k++) check=(check+k*vals[k])%103;\r\nvals.push(check);\r\nvals.push(C128_STOP);\r\nvar bars='';\r\nfor(var bi=0;bi<vals.length;bi++) bars+=C128_PATTERNS[vals[bi]]||'';\r\nbars+='11'; \/* final terminator *\/\r\nreturn{bars:bars,clean:clean};\r\n}\r\n\r\nfunction buildBarcodeSVG(text,height,color,showText){\r\nvar res=encodeCode128(text);\r\nif(!res) return null;\r\nvar mw=1.8; \/* module width px *\/\r\nvar tw=res.bars.length*mw;\r\nvar txtH=showText?14:0;\r\nvar th=height+txtH+4;\r\nvar svg='<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"'+Math.ceil(tw)+'\" height=\"'+th+'\" viewBox=\"0 0 '+Math.ceil(tw)+' '+th+'\" role=\"img\" aria-label=\"Barcode\">';\r\nsvg+='<rect width=\"'+Math.ceil(tw)+'\" height=\"'+th+'\" fill=\"#fff\"\/>';\r\nvar x=0;\r\nfor(var i=0;i<res.bars.length;i++){\r\nif(res.bars[i]==='1'){\r\nsvg+='<rect x=\"'+x.toFixed(2)+'\" y=\"2\" width=\"'+mw+'\" height=\"'+height+'\" fill=\"'+color+'\"\/>';\r\n}\r\nx+=mw;\r\n}\r\nif(showText){\r\nsvg+='<text x=\"'+(tw\/2).toFixed(1)+'\" y=\"'+(height+txtH).toFixed(1)+'\" text-anchor=\"middle\" font-family=\"monospace\" font-size=\"10\" fill=\"'+color+'\">'+res.clean+'<\/text>';\r\n}\r\nsvg+='<\/svg>';\r\nreturn svg;\r\n}\r\n\r\n\/* ============================================================\r\n   MAIN APP\r\n   ============================================================ *\/\r\nwindow.pthLs6App={\r\ninitialized:false,headers:[],data:[],fields:[],bgData:null,nextFid:1,bgDark:false,curLang:'en',\r\n\r\nt:function(key){\r\nvar L=LANG[this.curLang];\r\nreturn(L&&L[key]!==undefined)?L[key]:(LANG.en[key]||key);\r\n},\r\ntpl:{\r\n'name-badge':{w:280,h:140,bg:'#eff6ff',fg:'#1e3a8a',ac:'#2563eb',sc:'#2563eb',font:\"'Inter',system-ui,sans-serif\",border:'2px solid #2563eb',radius:10,pad:14,align:'center',stripe:'6',shadow:'0 4px 16px rgba(37,99,235,0.18)'},\r\n'address':{w:260,h:130,bg:'#ffffff',fg:'#0f172a',ac:'#64748b',sc:'#94a3b8',font:\"'Inter',system-ui,sans-serif\",border:'1px solid #cbd5e1',radius:6,pad:12,align:'left',stripe:'0',shadow:'0 2px 8px rgba(0,0,0,0.10)'},\r\n'shipping':{w:384,h:192,bg:'#ffffff',fg:'#0f172a',ac:'#0f172a',sc:'#0f172a',font:'Arial,sans-serif',border:'2px solid #0f172a',radius:4,pad:16,align:'left',stripe:'0',shadow:'none'},\r\n'product':{w:200,h:100,bg:'#fefce8',fg:'#78350f',ac:'#d97706',sc:'#d97706',font:\"'Inter',system-ui,sans-serif\",border:'2px solid #d97706',radius:8,pad:10,align:'center',stripe:'6',shadow:'0 2px 8px rgba(217,119,6,0.18)'},\r\n'qr-card':{w:300,h:150,bg:'#f0fdf4',fg:'#064e3b',ac:'#059669',sc:'#059669',font:\"'Inter',system-ui,sans-serif\",border:'1px solid #6ee7b7',radius:10,pad:12,align:'left',stripe:'6',shadow:'0 4px 12px rgba(5,150,105,0.12)'},\r\n'inventory':{w:240,h:90,bg:'#1e293b',fg:'#f8fafc',ac:'#38bdf8',sc:'#38bdf8',font:\"'Courier New',monospace\",border:'none',radius:6,pad:10,align:'left',stripe:'4',shadow:'none'},\r\n'event-pass':{w:320,h:160,bg:'#4f46e5',fg:'#ffffff',ac:'#a5b4fc',sc:'#a5b4fc',font:\"'Inter',system-ui,sans-serif\",border:'none',radius:12,pad:16,align:'center',stripe:'0',shadow:'0 8px 24px rgba(79,70,229,0.25)'},\r\n'barcode-label':{w:300,h:120,bg:'#ffffff',fg:'#0f172a',ac:'#0f172a',sc:'#2563eb',font:\"'Courier New',monospace\",border:'1px solid #cbd5e1',radius:4,pad:10,align:'center',stripe:'6',shadow:'0 2px 8px rgba(0,0,0,0.08)'},\r\n'square':{w:160,h:160,bg:'#ffffff',fg:'#0f172a',ac:'#e2e8f0',sc:'#2563eb',font:\"'Inter',system-ui,sans-serif\",border:'1px solid #e2e8f0',radius:8,pad:12,align:'center',stripe:'0',shadow:'0 2px 8px rgba(0,0,0,0.08)'}\r\n},\r\ntoast:function(m,t){\r\nvar c=document.getElementById('pth-ls6-toast');if(!c)return;\r\nvar el=document.createElement('div');\r\nvar bg=t==='error'?'#dc2626':(t==='info'?'#2563eb':'#059669');\r\nel.style.cssText='padding:11px 18px;border-radius:10px;font-size:13px;font-weight:600;color:#fff;pointer-events:auto;box-shadow:0 4px 15px rgba(0,0,0,0.15);font-family:Inter,system-ui,sans-serif;background:'+bg+';';\r\nel.textContent=m;c.appendChild(el);\r\nsetTimeout(function(){if(el.parentNode)el.parentNode.removeChild(el);},3500);\r\n},\r\nerr:function(m){\r\nvar el=document.getElementById('pth-ls6-err');if(el){el.textContent=m;el.style.display='block';}\r\nsetTimeout(function(){var e=document.getElementById('pth-ls6-err');if(e)e.style.display='none';},5000);\r\n},\r\nesc:function(s){\r\nif(s===null||s===undefined)return'';\r\nreturn String(s).replace(\/[&<>'\"]\/g,function(c){return{'&':'&amp;','<':'&lt;','>':'&gt;',\"'\":'&#39;','\"':'&quot;'}[c];});\r\n},\r\ninit:function(){\r\nthis.attachEvents();\r\nthis.addField('csv');this.addField('csv');\r\nthis.renderFields();this.renderPreview();\r\n},\r\nswitchTab:function(tab){\r\n['data','design','export'].forEach(function(t){\r\nvar b=document.getElementById('pth-t-'+t),p=document.getElementById('pth-p-'+t),on=t===tab;\r\nif(b){b.classList.toggle('on',on);b.setAttribute('aria-selected',on?'true':'false');}\r\nif(p)p.classList.toggle('on',on);\r\n});\r\n},\r\nattachEvents:function(){\r\nvar S=this;\r\n\/* Tabs *\/\r\n['data','design','export'].forEach(function(t){var b=document.getElementById('pth-t-'+t);if(b)b.addEventListener('click',function(){S.switchTab(t);});});\r\n\/* FW *\/\r\nvar fw=document.getElementById('pth-ls6-fw');\r\nif(fw)fw.addEventListener('click',function(){var o=document.getElementById('pth-ls6-outer');if(!o)return;o.classList.toggle('ls6-full');fw.textContent=o.classList.contains('ls6-full')?'\u25e8 Split View':'\u26f6 Full Width';});\r\n\/* Sample\/Clear *\/\r\nvar sp=document.getElementById('pth-ls6-sample');if(sp)sp.addEventListener('click',function(){S.loadSample();});\r\nvar cl=document.getElementById('pth-ls6-clear');if(cl)cl.addEventListener('click',function(){S.clearAll();});\r\n\/* Upload toggle *\/\r\nvar up=document.getElementById('pth-show-up'),ps=document.getElementById('pth-show-ps'),dz=document.getElementById('pth-ls6-dz'),pa=document.getElementById('pth-ls6-paste');\r\nif(up)up.addEventListener('click',function(){if(dz)dz.style.display='block';if(pa)pa.style.display='none';});\r\nif(ps)ps.addEventListener('click',function(){if(dz)dz.style.display='none';if(pa)pa.style.display='block';});\r\n\/* Parse paste *\/\r\nvar pp=document.getElementById('pth-ls6-parsecsv');\r\nif(pp)pp.addEventListener('click',function(){var ta=document.getElementById('pth-ls6-pastea');if(ta&&ta.value.trim())S.parseCSV(ta.value.trim());else S.err('Paste some CSV content first.');});\r\n\/* Drop zone *\/\r\nvar fin=document.getElementById('pth-ls6-fin'),dzel=document.getElementById('pth-ls6-dz');\r\nif(dzel&&fin){\r\ndzel.addEventListener('click',function(){fin.click();});\r\ndzel.addEventListener('keydown',function(e){if(e.key==='Enter'||e.key===' ')fin.click();});\r\ndzel.addEventListener('dragover',function(e){e.preventDefault();dzel.classList.add('over');});\r\ndzel.addEventListener('dragleave',function(){dzel.classList.remove('over');});\r\ndzel.addEventListener('drop',function(e){e.preventDefault();dzel.classList.remove('over');if(e.dataTransfer.files.length)S.handleFile(e.dataTransfer.files[0]);});\r\nfin.addEventListener('change',function(e){if(e.target.files.length)S.handleFile(e.target.files[0]);});\r\n}\r\n\/* Col search *\/\r\nvar cs=document.getElementById('pth-ls6-cs');if(cs)cs.addEventListener('input',function(){S.renderColTags(this.value);});\r\n\/* BG image *\/\r\nvar bgi=document.getElementById('pth-d-bgi'),bgc=document.getElementById('pth-d-bgi-clr');\r\nif(bgi)bgi.addEventListener('change',function(e){\r\nif(!e.target.files.length)return;\r\nvar r=new FileReader();r.onload=function(ev){S.bgData=ev.target.result;if(bgc)bgc.style.display='inline-flex';S.renderPreview();};r.readAsDataURL(e.target.files[0]);\r\n});\r\nif(bgc)bgc.addEventListener('click',function(){S.bgData=null;if(bgi)bgi.value='';bgc.style.display='none';S.renderPreview();});\r\n\/* BG opacity *\/\r\nvar bgo=document.getElementById('pth-d-bgop');\r\nif(bgo)bgo.addEventListener('input',function(){var v=document.getElementById('pth-d-bgop-v');if(v)v.textContent=this.value+'%';S.renderPreview();});\r\n\/* Design controls *\/\r\n['pth-d-w','pth-d-h','pth-d-pad','pth-d-bg','pth-d-fg','pth-d-ac','pth-d-sc','pth-d-font','pth-d-align','pth-d-border','pth-d-radius','pth-d-shadow','pth-d-stripe','pth-d-bgfit'].forEach(function(id){\r\nvar el=document.getElementById(id);\r\nif(el){el.addEventListener('input',function(){S.syncQ(id);S.renderPreview();});el.addEventListener('change',function(){S.syncQ(id);S.renderPreview();});}\r\n});\r\n\/* Quick adjust *\/\r\n['pth-q-w','pth-q-h','pth-q-bg','pth-q-fg'].forEach(function(id){\r\nvar el=document.getElementById(id);if(el)el.addEventListener('input',function(){S.syncQ(id);S.renderPreview();});\r\n});\r\n\/* Templates *\/\r\ndocument.querySelectorAll('#pth-ls6-tg .ls6-tpl').forEach(function(c){\r\nc.addEventListener('click',function(){S.applyTpl(c.dataset.tpl);});\r\nc.addEventListener('keydown',function(e){if(e.key==='Enter')S.applyTpl(c.dataset.tpl);});\r\n});\r\n\/* Add field buttons *\/\r\n\/* Language picker *\/\r\nvar langSel=document.getElementById('pth-ls6-lang');\r\nif(langSel) langSel.addEventListener('change',function(){S.applyLang(this.value);});\r\n\r\nvar am={'pth-add-csv':'csv','pth-add-txt':'text','pth-add-qr':'qr','pth-add-bc':'barcode','pth-add-div':'div','pth-add-img':'img'};\r\nObject.keys(am).forEach(function(id){\r\nvar b=document.getElementById(id);\r\nif(b) b.addEventListener('click',function(){\r\nS.addField(am[id]);\r\nS.renderFields();\r\nS.renderPreview();\r\n\/* Show warning toast on first add *\/\r\nif(am[id]==='barcode'){\r\nvar bw=document.getElementById('pth-ls6-bc-warn');\r\nif(bw) bw.style.display='block';\r\nS.toast(S.t('warnBcTitle')+'\\n'+S.t('warnBcBody'),'error');\r\n}\r\nif(am[id]==='qr'){\r\nS.toast(S.t('warnQrTitle')+' \u2014 '+S.t('warnQrBody'),'info');\r\n}\r\n});\r\n});\r\n\/* Preview BG *\/\r\nvar bgd=document.getElementById('pth-ls6-bgd');\r\nif(bgd)bgd.addEventListener('click',function(){S.bgDark=!S.bgDark;var g=document.getElementById('pth-ls6-pg');if(g)g.style.background=S.bgDark?'#1e293b':'#cbd5e1';bgd.textContent=S.bgDark?'\ud83c\udf19 BG':'\u2600\ufe0f BG';});\r\n\/* Export *\/\r\nvar em={'pth-ex-print':'print','pth-ex-pdf':'pdf','pth-ex-html':'html','pth-ex-prev':'preview'};\r\nObject.keys(em).forEach(function(id){var el=document.getElementById(id);if(el){el.addEventListener('click',function(){S.doExport(em[id]);});el.addEventListener('keydown',function(e){if(e.key==='Enter')S.doExport(em[id]);});}});\r\n},\r\nsyncQ:function(id){\r\nvar map={'pth-q-w':'pth-d-w','pth-q-h':'pth-d-h','pth-q-bg':'pth-d-bg','pth-q-fg':'pth-d-fg','pth-d-w':'pth-q-w','pth-d-h':'pth-q-h','pth-d-bg':'pth-q-bg','pth-d-fg':'pth-q-fg'};\r\nvar dst=map[id];if(!dst)return;\r\nvar s=document.getElementById(id),d=document.getElementById(dst);if(s&&d)d.value=s.value;\r\n},\r\napplyLang:function(code){\r\nvar S=this;\r\nthis.curLang=code;\r\nvar isRTL=(code==='ar');\r\n\/* RTL auto-adjust *\/\r\nvar wrap=document.getElementById('pth-ls6-wrap');\r\nif(wrap) wrap.setAttribute('dir',isRTL?'rtl':'ltr');\r\nif(isRTL){\r\nvar alignSel=document.getElementById('pth-d-align');\r\nif(alignSel) alignSel.value='right';\r\nvar fontSel=document.getElementById('pth-d-font');\r\nif(fontSel) fontSel.value=\"'Noto Sans Arabic',sans-serif\";\r\nsetTimeout(function(){S.renderPreview();},50);\r\nS.toast(S.t('warnRtlTitle')+' \u2014 '+S.t('warnRtlBody'),'info');\r\n}\r\n\/* Update dynamic UI strings *\/\r\nvar pvTitle=document.getElementById('pth-ls6-pg');\r\nvar previewHead=document.querySelector('#pth-ls6-wrap .ls6-pv-title');\r\nif(previewHead) previewHead.textContent=S.t('livePreview');\r\nvar qaTitle=document.querySelector('#pth-ls6-wrap .ls6-qa-title');\r\nif(qaTitle) qaTitle.textContent=S.t('quickAdjust');\r\nvar tipsHead=document.querySelector('#pth-ls6-wrap .ls6-sc-head');\r\nif(tipsHead) tipsHead.textContent=S.t('tipsTitle');\r\n\/* Update button labels *\/\r\nvar btnMap={'pth-add-csv':'+ '+S.t('addCsv'),'pth-add-txt':'+ '+S.t('addText'),'pth-add-qr':'+ '+S.t('addQR'),'pth-add-bc':'\u258a\u258c '+S.t('addBarcode'),'pth-add-div':'+ '+S.t('addDivider'),'pth-add-img':'+ '+S.t('addImage'),'pth-ls6-sample':'\ud83d\udca1 '+S.t('loadSample'),'pth-ls6-clear':'\ud83d\uddd1\ufe0f '+S.t('clear')};\r\nObject.keys(btnMap).forEach(function(id){var el=document.getElementById(id);if(el)el.textContent=btnMap[id];});\r\n\/* Update barcode warn box *\/\r\nvar bwt=document.getElementById('pth-ls6-bc-warn-title');var bwb=document.getElementById('pth-ls6-bc-warn-body');\r\nif(bwt) bwt.textContent=S.t('warnBcTitle');if(bwb) bwb.textContent=S.t('warnBcBody');\r\n\/* Refresh fields UI (labels) *\/\r\nS.renderFields();\r\n},\r\napplyTpl:function(name){\r\nvar t=this.tpl[name];if(!t)return;\r\nvar sv=function(id,v){var el=document.getElementById(id);if(el)el.value=v;};\r\nsv('pth-d-w',t.w);sv('pth-d-h',t.h);sv('pth-d-bg',t.bg);sv('pth-d-fg',t.fg);\r\nsv('pth-d-ac',t.ac);sv('pth-d-sc',t.sc);sv('pth-d-font',t.font);\r\nsv('pth-d-border',t.border);sv('pth-d-radius',t.radius);sv('pth-d-pad',t.pad);\r\nsv('pth-d-align',t.align);sv('pth-d-stripe',t.stripe);sv('pth-d-shadow',t.shadow);\r\nsv('pth-q-w',t.w);sv('pth-q-h',t.h);sv('pth-q-bg',t.bg);sv('pth-q-fg',t.fg);\r\ndocument.querySelectorAll('#pth-ls6-tg .ls6-tpl').forEach(function(c){c.classList.toggle('on',c.dataset.tpl===name);});\r\nthis.renderPreview();this.toast('\ud83d\uddbc\ufe0f Template: '+name.replace(\/-\/g,' '),'success');\r\n},\r\nhandleFile:function(f){\r\nif(!f.name.toLowerCase().endsWith('.csv')){this.err('Please upload a .csv file.');return;}\r\nvar S=this;var r=new FileReader();r.onload=function(e){S.parseCSV(e.target.result);};r.onerror=function(){S.err('Read error. Try again.');};r.readAsText(f);\r\n},\r\nparseCSV:function(str){\r\nvar arr=[],quote=false,row=[],col='';\r\nfor(var c=0;c<str.length;c++){\r\nvar cc=str[c],nc=str[c+1];\r\nif(cc==='\"'&&quote&&nc==='\"'){col+=cc;++c;continue;}\r\nif(cc==='\"'){quote=!quote;continue;}\r\nif(cc===','&&!quote){row.push(col.trim());col='';continue;}\r\nif(cc==='\\r'&&nc==='\\n'&&!quote){row.push(col.trim());arr.push(row);row=[];col='';++c;continue;}\r\nif((cc==='\\n'||cc==='\\r')&&!quote){row.push(col.trim());arr.push(row);row=[];col='';continue;}\r\ncol+=cc;\r\n}\r\nrow.push(col.trim());arr.push(row);\r\narr=arr.filter(function(r2){return r2.join('').trim()!=='';});\r\nif(arr.length<2){this.err('CSV must have headers and at least one data row.');return;}\r\nthis.headers=arr[0];this.data=arr.slice(1);\r\nvar la=document.getElementById('pth-ls6-la');if(la)la.style.display='block';\r\nvar dz=document.getElementById('pth-ls6-dz');if(dz)dz.style.display='none';\r\nthis.renderColTags('');this.renderFields();this.renderPreview();\r\nthis.toast('\u2705 '+this.data.length+' records, '+this.headers.length+' columns','success');\r\n},\r\nrenderColTags:function(filter){\r\nvar ct=document.getElementById('pth-ls6-ct'),rc=document.getElementById('pth-ls6-rc');\r\nif(rc)rc.textContent=this.data.length+' records';\r\nif(!ct)return;ct.innerHTML='';\r\nvar q=(filter||'').toLowerCase();\r\nfor(var i=0;i<this.headers.length;i++){\r\nif(q&&this.headers[i].toLowerCase().indexOf(q)===-1)continue;\r\nvar sp=document.createElement('span');sp.className='ls6-tag';sp.textContent=this.headers[i];ct.appendChild(sp);\r\n}\r\nif(!ct.children.length)ct.innerHTML='<span style=\"font-size:11px;color:#64748b;\">No match<\/span>';\r\n},\r\ngetD:function(){\r\nvar g=function(id){var el=document.getElementById(id);return el?el.value:'';};\r\nreturn{\r\nw:parseInt(g('pth-d-w'))||280,h:parseInt(g('pth-d-h'))||140,pad:parseInt(g('pth-d-pad'))||12,\r\nbg:g('pth-d-bg')||'#ffffff',fg:g('pth-d-fg')||'#0f172a',ac:g('pth-d-ac')||'#2563eb',sc:g('pth-d-sc')||'#2563eb',\r\nfont:g('pth-d-font')||\"'Inter',system-ui,sans-serif\",border:g('pth-d-border')||'1px solid #cbd5e1',\r\nradius:parseInt(g('pth-d-radius'))||0,align:g('pth-d-align')||'left',\r\nbgop:(parseInt(g('pth-d-bgop'))||15)\/100,bgfit:g('pth-d-bgfit')||'cover',\r\nshadow:g('pth-d-shadow')||'none',stripe:parseInt(g('pth-d-stripe'))||0\r\n};\r\n},\r\naddField:function(type){\r\nthis.fields.push({\r\nid:'f'+(this.nextFid++),type:type,colIndex:'',text:'',\r\nsize:type==='qr'?60:(type==='img'?50:(type==='barcode'?40:(type==='div'?1:14))),\r\nweight:'600',color:'',align:'',imgData:null,imgFit:'contain',imgShape:'square',\r\nbcColor:'#000000',bcShowText:true\r\n});\r\n},\r\nremoveField:function(id){\r\nthis.fields=this.fields.filter(function(f){return f.id!==id;});\r\nthis.renderFields();this.renderPreview();\r\n},\r\nrenderFields:function(){\r\nvar con=document.getElementById('pth-ls6-fields');if(!con)return;\r\nvar S=this;con.innerHTML='';\r\nthis.fields.forEach(function(f){\r\nvar wrap=document.createElement('div');wrap.className='ls6-frow';\r\nvar badgeMap={csv:'tb-csv \ud83d\udccb '+S.t('addCsv'),text:'tb-txt \u270f\ufe0f '+S.t('addText'),qr:'tb-qr \ud83d\udcf1 '+S.t('addQR'),barcode:'tb-bc \u258a\u258c '+S.t('addBarcode'),div:'tb-div \u2796 '+S.t('addDivider'),img:'tb-img \ud83d\uddbc\ufe0f '+S.t('addImage')};\r\nvar bparts=(badgeMap[f.type]||'tb-csv CSV').split(' ');\r\n\/* Top row *\/\r\nvar top=document.createElement('div');top.className='ls6-frow-top';\r\ntop.style.gridTemplateColumns=f.type==='div'?'1fr 30px':(f.type==='img'?'1fr 55px 30px':'1fr 55px 30px 30px');\r\n\/* Source *\/\r\nvar src=document.createElement('div');\r\nvar badge=document.createElement('span');badge.className='ls6-tbadge '+bparts[0];badge.textContent=bparts.slice(1).join(' ');\r\nsrc.appendChild(badge);\r\nif(f.type==='csv'||f.type==='qr'){\r\nvar sel=document.createElement('select');sel.style.cssText='font-size:11px;padding:5px 6px;';sel.setAttribute('aria-label','Select column');\r\nsel.innerHTML='<option value=\"\">-- Column --<\/option>';\r\nfor(var i=0;i<S.headers.length;i++){var o=document.createElement('option');o.value=String(i);o.textContent=S.headers[i];if(f.colIndex===String(i))o.selected=true;sel.appendChild(o);}\r\n(function(fld){sel.addEventListener('change',function(){fld.colIndex=this.value;S.renderPreview();});})(f);\r\nsrc.appendChild(sel);\r\n}else if(f.type==='barcode'){\r\nvar bsel=document.createElement('select');bsel.style.cssText='font-size:11px;padding:5px 5px;';bsel.setAttribute('aria-label',S.t('selectCol'));\r\nbsel.innerHTML='<option value=\"\">'+S.t('selectCol')+'<\/option>';\r\nfor(var bci=0;bci<S.headers.length;bci++){var bo=document.createElement('option');bo.value=String(bci);bo.textContent=S.headers[bci];if(f.colIndex===String(bci))bo.selected=true;bsel.appendChild(bo);}\r\n(function(fld){bsel.addEventListener('change',function(){fld.colIndex=this.value;S.renderPreview();});})(f);\r\nsrc.appendChild(bsel);\r\n\/* Inline warning for barcode *\/\r\nvar bcWarnBox=document.createElement('div');bcWarnBox.className='ls6-warn-box ls6-warn-yellow';\r\nbcWarnBox.innerHTML='<strong>'+S.t('warnBcTitle')+'<\/strong> '+S.t('warnBcBody');\r\nsrc.appendChild(bcWarnBox);\r\n}else if(f.type==='text'){\r\nvar inp=document.createElement('input');inp.type='text';inp.value=f.text;inp.placeholder='Static text for all labels...';inp.style.cssText='font-size:11px;padding:5px 6px;';inp.setAttribute('aria-label','Custom text');\r\n(function(fld){inp.addEventListener('input',function(){fld.text=this.value;S.renderPreview();});})(f);\r\nsrc.appendChild(inp);\r\n}else if(f.type==='div'){\r\nvar dn=document.createElement('span');dn.style.cssText='font-size:11px;color:#6d28d9;font-weight:600;display:block;';dn.textContent='Horizontal accent line (uses accent color)';src.appendChild(dn);\r\n}else if(f.type==='img'){\r\nvar imgWrap=document.createElement('div');imgWrap.style.cssText='display:flex;flex-direction:column;gap:4px;';\r\n\/* CSV URL col *\/\r\nvar imgSel=document.createElement('select');imgSel.style.cssText='font-size:11px;padding:4px 5px;';imgSel.setAttribute('aria-label','Image URL column');\r\nimgSel.innerHTML='<option value=\"\">-- CSV image URL col (opt) --<\/option>';\r\nfor(var ici=0;ici<S.headers.length;ici++){var io=document.createElement('option');io.value=String(ici);io.textContent=S.headers[ici];if(f.colIndex===String(ici))io.selected=true;imgSel.appendChild(io);}\r\n(function(fld){imgSel.addEventListener('change',function(){fld.colIndex=this.value;S.renderPreview();});})(f);\r\nimgWrap.appendChild(imgSel);\r\n\/* Upload *\/\r\nvar imgNote=document.createElement('span');imgNote.style.cssText='font-size:10px;color:#92400e;font-weight:600;';imgNote.textContent='\u2014 or upload shared image \u2014';imgWrap.appendChild(imgNote);\r\nvar imgUp=document.createElement('input');imgUp.type='file';imgUp.accept='image\/*';imgUp.style.cssText='font-size:10px;';imgUp.setAttribute('aria-label','Upload image');\r\n(function(fld){imgUp.addEventListener('change',function(e){if(!e.target.files.length)return;var r=new FileReader();r.onload=function(ev){fld.imgData=ev.target.result;S.renderPreview();};r.readAsDataURL(e.target.files[0]);});})(f);\r\nimgWrap.appendChild(imgUp);src.appendChild(imgWrap);\r\n}\r\ntop.appendChild(src);\r\n\/* Size *\/\r\nif(f.type!=='div'){\r\nvar si=document.createElement('input');si.type='number';si.value=f.size;si.style.cssText='font-size:11px;padding:5px 5px;';si.min=10;si.max=300;si.title='Size (px)';si.setAttribute('aria-label','Size');\r\n(function(fld){si.addEventListener('input',function(){fld.size=parseFloat(this.value)||fld.size;S.renderPreview();});})(f);\r\ntop.appendChild(si);\r\n}\r\n\/* Color (csv\/text only) *\/\r\nif(f.type==='csv'||f.type==='text'){\r\nvar ci=document.createElement('input');ci.type='color';ci.value=f.color||'#0f172a';ci.style.cssText='height:28px;width:28px;padding:1px;cursor:pointer;border:2px solid #e2e8f0;border-radius:5px;';ci.setAttribute('aria-label','Field color');\r\n(function(fld){ci.addEventListener('input',function(){fld.color=this.value;S.renderPreview();});})(f);\r\ntop.appendChild(ci);\r\n}else if(f.type==='img'||f.type==='qr'){top.appendChild(document.createElement('div'));}\r\n\/* Delete *\/\r\nvar del=document.createElement('button');del.className='ls6-delbtn';del.innerHTML='\ud83d\uddd1';del.setAttribute('aria-label','Remove');\r\n(function(fid){del.addEventListener('click',function(){S.removeField(fid);});})(f.id);\r\ntop.appendChild(del);wrap.appendChild(top);\r\n\/* Bottom: weight+align for csv\/text *\/\r\nif(f.type==='csv'||f.type==='text'){\r\nvar bot=document.createElement('div');bot.className='ls6-frow-bot';\r\nvar ws=document.createElement('select');ws.style.cssText='font-size:11px;padding:4px 5px;';ws.setAttribute('aria-label','Weight');\r\n[['400','Regular'],['500','Medium'],['600','SemiBold'],['700','Bold'],['800','ExtraBold']].forEach(function(p){var o=document.createElement('option');o.value=p[0];o.textContent=p[1];if(f.weight===p[0])o.selected=true;ws.appendChild(o);});\r\n(function(fld){ws.addEventListener('change',function(){fld.weight=this.value;S.renderPreview();});})(f);\r\nvar as=document.createElement('select');as.style.cssText='font-size:11px;padding:4px 5px;';as.setAttribute('aria-label','Field align');\r\n[['',S.t('inherit')],['left',S.t('wLeft')],['center',S.t('wCenter')],['right',S.t('wRight')]].forEach(function(p){var o=document.createElement('option');o.value=p[0];o.textContent=p[1];if(f.align===p[0])o.selected=true;as.appendChild(o);});\r\n(function(fld){as.addEventListener('change',function(){fld.align=this.value;S.renderPreview();});})(f);\r\nbot.appendChild(ws);bot.appendChild(as);wrap.appendChild(bot);\r\n}\r\n\/* Image shape+fit *\/\r\nif(f.type==='img'){\r\nvar iopt=document.createElement('div');iopt.style.cssText='display:flex;gap:6px;margin-top:5px;';\r\nvar shSel=document.createElement('select');shSel.style.cssText='font-size:11px;padding:4px 5px;flex:1;';shSel.setAttribute('aria-label','Shape');\r\n[[('square'),S.t('imgShapeSquare')],[('circle'),S.t('imgShapeCircle')],[('rounded'),S.t('imgShapeRounded')]].forEach(function(p){var o=document.createElement('option');o.value=p[0];o.textContent=p[1];if(f.imgShape===p[0])o.selected=true;shSel.appendChild(o);});\r\n(function(fld){shSel.addEventListener('change',function(){fld.imgShape=this.value;S.renderPreview();});})(f);\r\nvar ftSel=document.createElement('select');ftSel.style.cssText='font-size:11px;padding:4px 5px;flex:1;';ftSel.setAttribute('aria-label','Image fit');\r\n[['contain','Contain'],['cover','Cover'],['fill','Fill']].forEach(function(p){var o=document.createElement('option');o.value=p[0];o.textContent=p[1];if(f.imgFit===p[0])o.selected=true;ftSel.appendChild(o);});\r\n(function(fld){ftSel.addEventListener('change',function(){fld.imgFit=this.value;S.renderPreview();});})(f);\r\niopt.appendChild(shSel);iopt.appendChild(ftSel);wrap.appendChild(iopt);\r\n}\r\n\/* Barcode extra options: show-text checkbox + color *\/\r\nif(f.type==='barcode'){\r\nvar bcOpts=document.createElement('div');bcOpts.style.cssText='display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;align-items:center;';\r\n\/* Show text checkbox *\/\r\nvar bcLbl=document.createElement('label');bcLbl.style.cssText='display:flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#334155;cursor:pointer;text-transform:none;letter-spacing:0;';\r\nvar bcCb=document.createElement('input');bcCb.type='checkbox';bcCb.checked=f.bcShowText!==false;bcCb.setAttribute('aria-label',S.t('showBcText'));\r\n(function(fld){bcCb.addEventListener('change',function(){fld.bcShowText=this.checked;S.renderPreview();});})(f);\r\nvar bcCbSpan=document.createElement('span');bcCbSpan.textContent=S.t('showBcText');\r\nbcLbl.appendChild(bcCb);bcLbl.appendChild(bcCbSpan);bcOpts.appendChild(bcLbl);\r\n\/* Bar color *\/\r\nvar bcColWrap=document.createElement('div');bcColWrap.style.cssText='display:flex;align-items:center;gap:5px;';\r\nvar bcColLbl=document.createElement('span');bcColLbl.style.cssText='font-size:11px;font-weight:600;color:#334155;';bcColLbl.textContent=S.t('bcColor')+':';\r\nvar bcColInp=document.createElement('input');bcColInp.type='color';bcColInp.value=f.bcColor||'#000000';bcColInp.style.cssText='height:26px;width:30px;padding:1px;border:2px solid #e2e8f0;border-radius:5px;cursor:pointer;';bcColInp.setAttribute('aria-label',S.t('bcColor'));\r\n(function(fld){bcColInp.addEventListener('input',function(){fld.bcColor=this.value;S.renderPreview();});})(f);\r\nbcColWrap.appendChild(bcColLbl);bcColWrap.appendChild(bcColInp);bcOpts.appendChild(bcColWrap);\r\nwrap.appendChild(bcOpts);\r\n}\r\ncon.appendChild(wrap);\r\n});\r\n},\r\nbuildQR:function(text,size){\r\nvar canvas=document.createElement('canvas');var modules=21;canvas.width=size;canvas.height=size;\r\nvar ctx=canvas.getContext('2d');var cell=size\/modules;\r\nctx.fillStyle='#ffffff';ctx.fillRect(0,0,size,size);\r\nvar bytes=[];for(var ci=0;ci<text.length;ci++)bytes.push(text.charCodeAt(ci));\r\nvar drawF=function(x,y){ctx.fillStyle='#000';ctx.fillRect(x*cell,y*cell,7*cell,7*cell);ctx.fillStyle='#fff';ctx.fillRect((x+1)*cell,(y+1)*cell,5*cell,5*cell);ctx.fillStyle='#000';ctx.fillRect((x+2)*cell,(y+2)*cell,3*cell,3*cell);};\r\ndrawF(0,0);drawF(14,0);drawF(0,14);\r\nfor(var tp=8;tp<13;tp++){if(tp%2===0){ctx.fillStyle='#000';ctx.fillRect(tp*cell,6*cell,cell,cell);ctx.fillRect(6*cell,tp*cell,cell,cell);}}\r\nvar seed=0;for(var bi=0;bi<bytes.length;bi++)seed=((seed*31)+bytes[bi])&0xFFFF;\r\nfor(var row=0;row<modules;row++){\r\nfor(var col=0;col<modules;col++){\r\nif((row<9&&col<9)||(row<9&&col>11)||(row>11&&col<9))continue;\r\nif(row===6||col===6)continue;\r\nvar bs=(seed^(row*113+col*97+row*col))&0xFFFF;\r\nvar cs=bytes[(row*modules+col)%(bytes.length||1)]||0;\r\nif(((bs>>(col%8))^(cs>>(row%7)))&1){ctx.fillStyle='#000';ctx.fillRect(col*cell,row*cell,cell,cell);}\r\n}}\r\nreturn canvas.toDataURL('image\/png');\r\n},\r\nbuildLabel:function(row,d){\r\nvar S=this;\r\nvar stripe=d.stripe>0?'border-top:'+d.stripe+'px solid '+d.sc+';':'';\r\nvar html='<div style=\"position:relative;box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;justify-content:center;';\r\nhtml+='width:'+d.w+'px;height:'+d.h+'px;background-color:'+d.bg+';color:'+d.fg+';border:'+d.border+';border-radius:'+d.radius+'px;';\r\nhtml+='font-family:'+d.font+';text-align:'+d.align+';box-shadow:'+d.shadow+';'+stripe+'page-break-inside:avoid;\">';\r\nif(S.bgData){\r\nhtml+='<img decoding=\"async\" src=\"'+S.bgData+'\" data-no-lazy=\"1\" width=\"'+d.w+'\" height=\"'+d.h+'\" alt=\"\" style=\"position:absolute;top:0;left:0;width:100%;height:100%;object-fit:'+d.bgfit+';opacity:'+d.bgop+';z-index:0;pointer-events:none;\">';\r\n}\r\nhtml+='<div style=\"position:relative;z-index:1;padding:'+d.pad+'px;display:flex;flex-direction:column;gap:3px;height:100%;justify-content:center;\">';\r\nfor(var fi=0;fi<S.fields.length;fi++){\r\nvar f=S.fields[fi];\r\nvar fc=f.color||d.fg;\r\nvar fa=f.align||d.align;\r\nif(f.type==='div'){\r\nhtml+='<div style=\"width:100%;height:1px;background:'+d.ac+';margin:3px 0;flex-shrink:0;\"><\/div>';\r\n}else if(f.type==='csv'){\r\nif(f.colIndex==='')continue;\r\nvar cv=row?S.esc(row[parseInt(f.colIndex)]||''):'\u2014';if(!cv)continue;\r\nhtml+='<div style=\"font-size:'+f.size+'px;font-weight:'+f.weight+';color:'+fc+';text-align:'+fa+';line-height:1.3;word-break:break-word;\">'+cv+'<\/div>';\r\n}else if(f.type==='text'){\r\nif(!f.text)continue;\r\nhtml+='<div style=\"font-size:'+f.size+'px;font-weight:'+f.weight+';color:'+fc+';text-align:'+fa+';line-height:1.3;\">'+S.esc(f.text)+'<\/div>';\r\n}else if(f.type==='qr'){\r\nvar qv=(row&&f.colIndex!=='')?(row[parseInt(f.colIndex)]||''):'';if(!qv)continue;\r\nvar qi=S.buildQR(qv,f.size);\r\nvar qa=fa==='right'?'flex-end':(fa==='center'?'center':'flex-start');\r\nhtml+='<img decoding=\"async\" src=\"'+qi+'\" data-no-lazy=\"1\" width=\"'+f.size+'\" height=\"'+f.size+'\" alt=\"QR\" style=\"width:'+f.size+'px;height:'+f.size+'px;image-rendering:pixelated;align-self:'+qa+';flex-shrink:0;\">';\r\n}else if(f.type==='barcode'){\r\nvar bv=(row&&f.colIndex!=='')?(row[parseInt(f.colIndex)]||''):'';if(!bv)continue;\r\nvar bsvg=buildBarcodeSVG(bv,f.size,f.bcColor||'#000000',f.bcShowText!==false);\r\nif(!bsvg)continue;\r\nvar bas=fa==='right'?'flex-end':(fa==='center'?'center':'flex-start');\r\nhtml+='<div style=\"align-self:'+bas+';flex-shrink:0;line-height:0;max-width:100%;overflow:hidden;\">'+bsvg+'<\/div>';\r\n}else if(f.type==='img'){\r\nvar isrc='';\r\nif(f.colIndex!==''&&row){isrc=row[parseInt(f.colIndex)]||'';}\r\nif(!isrc&&f.imgData){isrc=f.imgData;}\r\nif(!isrc)continue;\r\nvar ibr=f.imgShape==='circle'?'50%':(f.imgShape==='rounded'?'10px':'4px');\r\nvar ias=fa==='right'?'flex-end':(fa==='center'?'center':'flex-start');\r\nhtml+='<img decoding=\"async\" src=\"'+isrc+'\" data-no-lazy=\"1\" width=\"'+f.size+'\" height=\"'+f.size+'\" alt=\"img\" style=\"width:auto;height:'+f.size+'px;object-fit:'+f.imgFit+';border-radius:'+ibr+';align-self:'+ias+';flex-shrink:0;\">';\r\n}\r\n}\r\nhtml+='<\/div><\/div>';\r\nreturn html;\r\n},\r\nrenderPreview:function(){\r\nvar grid=document.getElementById('pth-ls6-pg');if(!grid)return;\r\nvar pc=document.getElementById('pth-ls6-pc');\r\nif(this.data.length===0){\r\ngrid.innerHTML='<div class=\"ls6-pv-empty\"><span style=\"font-size:28px;\">\ud83c\udff7\ufe0f<\/span><span>Preview updates live as you design<\/span><\/div>';\r\nif(pc)pc.textContent='0\/0';return;\r\n}\r\nvar d=this.getD();var max=Math.min(this.data.length,9);var html='';\r\nfor(var i=0;i<max;i++)html+=this.buildLabel(this.data[i],d);\r\nif(this.data.length>9)html+='<div style=\"width:100%;text-align:center;font-size:11px;color:#fff;font-weight:700;background:rgba(0,0,0,0.3);padding:4px;border-radius:5px;margin-top:3px;\">+' + (this.data.length-9)+' more<\/div>';\r\ngrid.innerHTML=html;\r\nif(pc)pc.textContent=max+'\/'+this.data.length;\r\n},\r\nbuildExport:function(){\r\nvar S=this,d=S.getD();\r\nvar cols=parseInt(document.getElementById('pth-ex-cols').value)||3;\r\nvar gap=parseInt(document.getElementById('pth-ex-gap').value)||10;\r\nvar margin=document.getElementById('pth-ex-margin').value||'0.5cm';\r\nvar lbls='';for(var i=0;i<S.data.length;i++)lbls+=S.buildLabel(S.data[i],d);\r\nvar doc='<!DOC'+'TYPE html><ht'+'ml lang=\"en\"><he'+'ad><meta charset=\"UTF-8\"><title>PTH Labels<\/title><style>';\r\ndoc+='body{margin:0;padding:10px;font-family:sans-serif;background:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact;}';\r\ndoc+='.g{display:grid;grid-template-columns:repeat('+cols+',max-content);gap:'+gap+'px;justify-content:start;}';\r\ndoc+='@media print{body{padding:0;}@page{margin:'+margin+';}}';\r\ndoc+='<'+'\/style><'+'\/head><'+'body><div class=\"g\">'+lbls+'<\/div>';\r\nreturn doc;\r\n},\r\ndoExport:function(mode){\r\nif(this.data.length===0){this.err('Load a CSV first.');this.switchTab('data');return;}\r\nvar S=this,doc=S.buildExport();\r\nif(mode==='html'){\r\nvar blob=new Blob([doc+'<'+'\/body><'+'\/html>'],{type:'text\/html'});\r\nvar url=URL.createObjectURL(blob);\r\nvar a=document.createElement('a');a.href=url;a.download='pth-labels.html';\r\ndocument.body.appendChild(a);a.click();document.body.removeChild(a);\r\nURL.revokeObjectURL(url);S.toast('\ud83d\udcbe HTML file saved!','success');return;\r\n}\r\nvar sp='';\r\nif(mode==='print'||mode==='pdf')sp='<scr'+'ipt>setTimeout(function(){window.print();},800);<'+'\/'+'scr'+'ipt>';\r\nvar win=window.open('','_blank');\r\nif(!win){S.err('Popup blocked! Allow popups.');return;}\r\nwin.document.open();win.document.write(doc+sp+'<'+'\/body><'+'\/html>');win.document.close();\r\nif(mode==='pdf')S.toast('\ud83d\udcc4 Select \"Save as PDF\" in dialog!','info');\r\nelse if(mode==='print')S.toast('\ud83d\udda8\ufe0f Print dialog opening...','info');\r\nelse S.toast('\ud83d\udc41\ufe0f Preview opened','success');\r\n},\r\nloadSample:function(){\r\nvar csv='Full Name,Job Title,Company,SKU,URL\\nSarah Johnson,Lead Designer,CreativeCo,SKU-2025-001,https:\/\/schoolict.net\/tools\\nJames Park,Senior Dev,PrimeTech,SKU-2025-002,https:\/\/schoolict.net\/tools\\nMaria Santos,Product Mgr,Innovate LLC,SKU-2025-003,https:\/\/schoolict.net\/tools\\nTom Chen,Data Analyst,Stats Inc,SKU-2025-004,https:\/\/schoolict.net\/tools';\r\nvar dz=document.getElementById('pth-ls6-dz');if(dz)dz.style.display='none';\r\nvar la=document.getElementById('pth-ls6-la');if(la)la.style.display='block';\r\nthis.parseCSV(csv);this.applyTpl('name-badge');\r\nthis.fields=[];this.nextFid=1;\r\nthis.addField('csv');this.fields[0].colIndex='0';this.fields[0].size=17;this.fields[0].weight='800';this.fields[0].color='#1e3a8a';\r\nthis.addField('csv');this.fields[1].colIndex='1';this.fields[1].size=12;this.fields[1].weight='500';this.fields[1].color='#2563eb';\r\nthis.addField('div');\r\nthis.addField('csv');this.fields[3].colIndex='2';this.fields[3].size=12;this.fields[3].weight='600';this.fields[3].color='#334155';\r\nthis.addField('barcode');this.fields[4].colIndex='3';this.fields[4].size=36;this.fields[4].bcShowText=true;this.fields[4].bcColor='#0f172a';\r\nthis.renderFields();this.renderPreview();this.toast(this.t('loadSample')+' \u2705','success');\r\n},\r\nclearAll:function(){\r\nthis.headers=[];this.data=[];this.bgData=null;this.fields=[];this.nextFid=1;\r\n['pth-ls6-fin','pth-d-bgi'].forEach(function(id){var el=document.getElementById(id);if(el)el.value='';});\r\nvar bc=document.getElementById('pth-d-bgi-clr');if(bc)bc.style.display='none';\r\nvar ta=document.getElementById('pth-ls6-pastea');if(ta)ta.value='';\r\nvar dz=document.getElementById('pth-ls6-dz');if(dz)dz.style.display='block';\r\nvar la=document.getElementById('pth-ls6-la');if(la)la.style.display='none';\r\nvar ps=document.getElementById('pth-ls6-paste');if(ps)ps.style.display='none';\r\nthis.addField('csv');this.addField('csv');\r\nthis.renderFields();this.renderPreview();this.toast('\ud83d\uddd1\ufe0f Cleared','info');\r\n}\r\n};\r\nfunction runInit(){if(!window.pthLs6App.initialized&&document.getElementById('pth-ls6-wrap')){window.pthLs6App.initialized=true;window.pthLs6App.init();}}\r\nrunInit();\r\nif(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',runInit);}\r\nwindow.addEventListener('load',function(){setTimeout(runInit,50);});\r\nif(!window.pthLs6App.initialized&&typeof MutationObserver!=='undefined'){\r\nvar pthLs6Obs=new MutationObserver(function(){if(document.getElementById('pth-ls6-wrap')){pthLs6Obs.disconnect();runInit();}});\r\npthLs6Obs.observe(document.body||document.documentElement,{childList:true,subtree:true});\r\nsetTimeout(function(){pthLs6Obs.disconnect();},10000);\r\n}\r\n})();\r\n<\/script>\r\n\n\n\n\n<style>\n.pth-feature-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:32px}\n.pth-feat-box{border:1px solid #e2e8f0;background:#fff;padding:24px;border-radius:12px;box-shadow:0 4px 6px -1px rgba(0,0,0,0.03);transition:all .25s ease}\n.pth-feat-box:hover{border-color:#bfdbfe;transform:translateY(-3px);box-shadow:0 10px 20px -5px rgba(37,99,235,0.08)}\n.pth-feat-title{font-size:1.05rem;font-weight:800;color:#0f172a;margin-bottom:10px;display:flex;align-items:center;gap:10px}\n.pth-feat-text{font-size:.9rem;color:#1e293b;line-height:1.65;margin:0;font-weight:500}\n.pth-steps-wrap{border:1px solid #e2e8f0;background:#fff;padding:40px 30px;border-radius:16px;text-align:center;box-shadow:0 4px 6px -1px rgba(0,0,0,0.03);margin-bottom:40px}\n.pth-steps-title{font-size:1.15rem;font-weight:800;color:#0f172a;text-transform:uppercase;margin-bottom:36px;letter-spacing:1px}\n.pth-steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px}\n.pth-step-item{display:flex;flex-direction:column;align-items:center}\n.pth-step-num{width:46px;height:46px;background:#2563eb;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.2rem;margin-bottom:14px;box-shadow:0 4px 12px rgba(37,99,235,.3)}\n.pth-step-name{font-weight:800;color:#0f172a;margin-bottom:8px;font-size:1rem}\n.pth-step-desc{font-size:.88rem;color:#1e293b;line-height:1.55;margin:0;font-weight:500}\n@media(max-width:600px){.pth-steps-wrap{padding:24px 16px}}\n<\/style>\n\n<div class=\"pth-feature-wrap\">\n  <div class=\"pth-feat-box\">\n    <div class=\"pth-feat-title\">\ud83d\udfe2 4-Tab All-in-One Studio<\/div>\n    <p class=\"pth-feat-text\">Data, Design, Fields and Export tabs work together in a single tool. Upload CSV or paste data, choose from 8 label templates, map any column to a content row, then print or export \u2014 all without leaving the page.<\/p>\n  <\/div>\n  <div class=\"pth-feat-box\">\n    <div class=\"pth-feat-title\">\ud83d\udd35 Offline QR Code Generator<\/div>\n    <p class=\"pth-feat-text\">Add a QR Code field row and map it to any CSV column \u2014 URL, product ID, phone number, email. QR codes are drawn using the Canvas API entirely in your browser. No server, no API key, no upload. Works in print and PDF exports.<\/p>\n  <\/div>\n  <div class=\"pth-feat-box\">\n    <div class=\"pth-feat-title\">\ud83d\udfe3 8 Label Templates + Batch Export<\/div>\n    <p class=\"pth-feat-text\">One-click templates for Name Badge, Address, Shipping, Product Tag, QR Card, Inventory, Event Pass and Square labels. Export all records at once as Print, PDF, or a standalone downloadable HTML file that opens in any browser offline.<\/p>\n  <\/div>\n<\/div>\n\n<div class=\"pth-steps-wrap\">\n  <div class=\"pth-steps-title\">How to Make Labels from a CSV File<\/div>\n  <div class=\"pth-steps-grid\">\n    <div class=\"pth-step-item\">\n      <div class=\"pth-step-num\">1<\/div>\n      <div class=\"pth-step-name\">Load Your Data<\/div>\n      <p class=\"pth-step-desc\">Drag and drop a CSV file onto the \ud83d\udccb Data tab, or click Paste CSV to paste spreadsheet content directly. The tool detects your column headers automatically.<\/p>\n    <\/div>\n    <div class=\"pth-step-item\">\n      <div class=\"pth-step-num\">2<\/div>\n      <div class=\"pth-step-name\">Pick a Template<\/div>\n      <p class=\"pth-step-desc\">Switch to the \ud83c\udfa8 Design tab and click any template card \u2014 Name Badge, Shipping, Product Tag and more. Each preset sets colors, fonts, dimensions and border style in one click.<\/p>\n    <\/div>\n    <div class=\"pth-step-item\">\n      <div class=\"pth-step-num\">3<\/div>\n      <div class=\"pth-step-name\">Map Your Fields<\/div>\n      <p class=\"pth-step-desc\">In the \ud83d\udcd0 Fields tab, add CSV Column rows and map each one to a column header. Add QR Code, Custom Text or Divider rows to complete your label layout. Set font size, weight and per-field color.<\/p>\n    <\/div>\n    <div class=\"pth-step-item\">\n      <div class=\"pth-step-num\">4<\/div>\n      <div class=\"pth-step-name\">Export All Labels<\/div>\n      <p class=\"pth-step-desc\">Go to the \ud83d\udda8\ufe0f Export tab, set labels-per-row and page margin, then click Print, Save as PDF, Download HTML or Preview All. Every record in your CSV becomes a label.<\/p>\n    <\/div>\n  <\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Last updated: July 2025<\/p>\n\n\n\n<h2 id=\"\ud83d\udd34-what-a-csv-label-maker-actually-does-and-why-spreadsheet-data-is-the-right-starting-point\" class=\"wp-block-heading\">\ud83d\udd34 <strong>What a CSV Label Maker Actually Does \u2014 and Why Spreadsheet Data Is the Right Starting Point<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Every label printing problem starts with a list. A list of customers for address labels. A list of products for inventory tags. A list of attendees for event passes. That list almost certainly already exists as a spreadsheet \u2014 in Excel, Google Sheets, Notion, or any database export. A CSV label maker bridges the gap between that structured data and a physical or digital label layout, without requiring you to copy-paste each record manually.<\/p>\n\n\n<figure class=\"pth-article-figure pth-img-left\" style=\"float:left; width:600px; max-width:100%; margin:4px 28px 16px 0; clear:left;\"><img decoding=\"async\" src=\"https:\/\/schoolict.net\/tools\/wp-content\/uploads\/2026\/07\/Label-Templates-800x447.jpeg\" alt=\"Label Templates\" width=\"600\" height=\"338\" loading=\"lazy\" data-no-lazy=\"1\" class=\"pth-article-img\" style=\"width:100%;height:auto;display:block;border-radius:10px;border:1px solid #e2e8f0;\"><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Label Studio Pro works by treating your CSV as a data source and your label design as a template. Every row in your CSV becomes one label. The column headers become selectable fields you can place anywhere on the label, in any font size, any color, any weight. Add a QR code that pulls from the URL column. Add a divider line between the name and the company. Map a product code to tiny monospace text at the bottom. The design stays fixed; only the data changes per label.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The critical advantage over word processor mail merge or online label tools that require account creation is that nothing leaves your browser. Client data, product prices, internal reference codes \u2014 they stay on your device through the entire process, from CSV parse to final print.<\/p>\n\n\n\n<h2 id=\"\ud83d\udfe1-the-8-label-templates-when-to-use-each-one\" class=\"wp-block-heading\">\ud83d\udfe1 <strong>The 8 Label Templates \u2014 When to Use Each One<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Each template in the Design tab is a complete style preset. Clicking one sets the label dimensions, background color, text color, accent color, font family, border style, corner radius, padding and text alignment simultaneously. You can fine-tune any value after applying a template \u2014 templates are starting points, not locked layouts.<\/p>\n\n\n\n<h3 id=\"\ud83d\udfe2-name-badge-280-140-conferences-events-staff-id\" class=\"wp-block-heading\">\ud83d\udfe2 <strong>Name Badge (280\u00d7140) \u2014 Conferences, Events, Staff ID<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Blue on white with a 2px blue border and centered text. Designed for the classic conference badge layout: large name on top, title below, company last. Works at 100% zoom on A4 with three columns per page. The accent color applies to divider lines between fields, creating a subtle visual separator without additional design work.<\/p>\n\n\n\n<h3 id=\"\ud83d\udfe2-shipping-label-384-192-courier-post-dispatch\" class=\"wp-block-heading\">\ud83d\udfe2 <strong>Shipping Label (384\u00d7192) \u2014 Courier, Post, Dispatch<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Wider format with Arial font, dark 2px border and left-aligned text. Sized for standard 4\u00d72 inch shipping labels. Left alignment is deliberate \u2014 address lines read more naturally left-aligned than centered on shipping labels, matching recipient expectations and post office scanning conventions.<\/p>\n\n\n\n<h3 id=\"\ud83d\udfe2-inventory-label-240-90-warehouse-assets-stock\" class=\"wp-block-heading\">\ud83d\udfe2 <strong>Inventory Label (240\u00d790) \u2014 Warehouse, Assets, Stock<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Dark background (#1e293b) with light text and Courier New font. The monospace font makes reference codes, SKUs and serial numbers instantly readable at a glance. The compact 240\u00d790 size fits standard barcode label sheets. Pair a QR Code field with a product URL or asset ID for scannable inventory tracking with zero external scanning software required.<\/p>\n\n\n\n<h3 id=\"\ud83d\udfe2-event-pass-320-160-tickets-wristbands-vip-passes\" class=\"wp-block-heading\">\ud83d\udfe2 <strong>Event Pass (320\u00d7160) \u2014 Tickets, Wristbands, VIP Passes<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Indigo background with white text, centered layout and no border. The bold color makes event passes visually distinct from other label types in a stack. Add a QR Code field mapped to a unique ticket ID or booking reference \u2014 attendees can scan to check in, and because the QR is generated offline from your CSV data, no ticketing platform integration is needed.<\/p>\n\n\n\n<h2 id=\"\ud83d\udd34-offline-qr-code-generation-how-it-works-inside-the-browser\" class=\"wp-block-heading\">\ud83d\udd34 <strong>Offline QR Code Generation \u2014 How It Works Inside the Browser<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Most tools that generate QR codes on a webpage call an external API. They send your data to a server, the server generates a QR image, and that image URL comes back to your page. This means your CSV data \u2014 product URLs, customer identifiers, internal codes \u2014 travels to a third-party server you don&#8217;t control.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Label Studio Pro generates QR codes entirely using the browser&#8217;s Canvas API. When you add a QR Code field row and map it to a CSV column, the tool reads each cell value and draws the QR matrix directly onto an HTML5 Canvas element inside your browser tab. The resulting image is a data URL \u2014 a base64-encoded PNG string \u2014 that exists only in memory. Nothing is transmitted anywhere.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This approach works in every export mode. When you print, the QR image is embedded inline. When you save as PDF, it&#8217;s rasterized with the rest of the label content. When you download HTML, the QR image is encoded as a base64 string directly in the file \u2014 no external image request needed when you open the HTML offline later.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\ud83d\udd35 <strong>Map any column<\/strong> \u2014 URLs, product codes, phone numbers, emails, serial numbers, booking references<\/li>\n\n\n\n<li>\ud83d\udfe0 <strong>Resize freely<\/strong> \u2014 the QR Size field in the Fields tab controls pixel dimensions from 30px to 200px<\/li>\n\n\n\n<li>\ud83d\udfe3 <strong>Position via alignment<\/strong> \u2014 set the QR field&#8217;s alignment to left, center or right to control its horizontal placement on the label<\/li>\n\n\n\n<li>\ud83d\udd35 <strong>Combine with text fields<\/strong> \u2014 place a QR code alongside name and contact fields on the same label for complete information density<\/li>\n<\/ul>\n\n\n\n<h2 id=\"\ud83d\udfe2-the-fields-tab-building-complex-label-layouts-row-by-row\" class=\"wp-block-heading\">\ud83d\udfe2 <strong>The Fields Tab \u2014 Building Complex Label Layouts Row by Row<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Every label is built from a vertical stack of content rows. The Fields tab is where you construct that stack. Four row types cover every use case:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>CSV Column rows<\/strong> pull data from your spreadsheet. Select the column from a dropdown that lists your actual CSV headers. Set font size (8\u201360px), font weight (Regular through ExtraBold), per-field text color, and per-field alignment. The first field typically gets ExtraBold at a larger size for the primary piece of information \u2014 name, company, product title.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Custom Text rows<\/strong> are static across every label. Use them for fixed lines like &#8220;VISITOR&#8221;, &#8220;FRAGILE \u2014 HANDLE WITH CARE&#8221;, a department name, or a website URL that applies to all labels in the batch. The same font controls apply.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Divider rows<\/strong> insert a 1px horizontal line in your chosen accent color. They add visual hierarchy between sections \u2014 separating the name from the address, or the product code from the description \u2014 without adding text clutter. Thin lines at the right position make labels read faster at a glance.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>QR Code rows<\/strong> generate a scannable QR from any CSV column value per label. Size is independent from font size \u2014 a 60px QR sits comfortably on a 280\u00d7140 name badge alongside three text lines. A 120px QR fills a dedicated zone on a larger event pass or inventory label.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can also read our <a href=\"https:\/\/schoolict.net\/tools\/free-web-tools-directory-prime-tool-hub\/?cat=data-converters\">Data Tools collection<\/a> for related CSV processing utilities, or check the guide on <a href=\"https:\/\/schoolict.net\/tools\/csv-file-format-guide\/\">CSV file format best practices<\/a> for structuring your data before label creation.<\/p>\n\n\n\n<style>\n.pth-faq-section{margin-top:50px;margin-bottom:40px}\n.pth-faq-header{font-size:1.8rem;font-weight:800;color:#0f172a;margin-bottom:25px;border-bottom:2px solid #e2e8f0;padding-bottom:10px;display:flex;align-items:center;gap:10px}\n.pth-faq-grid{display:grid;grid-template-columns:100%;gap:18px}\n@media(min-width:768px){.pth-faq-grid{grid-template-columns:repeat(2,1fr)}}\n@media(min-width:1024px){.pth-faq-grid{grid-template-columns:repeat(3,1fr)}}\n.pth-faq-card{background:#f8fafc;padding:22px;border-radius:12px;border:1px solid #e2e8f0;transition:transform .2s ease}\n.pth-faq-card:hover{transform:translateY(-3px);box-shadow:0 4px 12px rgba(0,0,0,.05)}\n.pth-faq-q{color:#0f172a;font-size:1rem;font-weight:700;margin:0 0 10px;line-height:1.4}\n.pth-faq-a{margin:0;font-size:.92rem;color:#1e293b;line-height:1.6;font-weight:500}\n<\/style>\n\n<div class=\"pth-faq-section\">\n  <div class=\"pth-faq-header\">\ud83e\udd14 Frequently Asked Questions<\/div>\n  <div class=\"pth-faq-grid\">\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">How many labels can I create from one CSV file?<\/p>\n      <p class=\"pth-faq-a\">There is no record limit. Every row in your CSV becomes one label. The preview area shows the first 9 to keep the tool fast, but the Print, PDF and HTML exports include every single record. A CSV with 500 rows generates 500 labels in one export action.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">Do my CSV files get uploaded to a server?<\/p>\n      <p class=\"pth-faq-a\">No. The entire tool runs inside your browser using the JavaScript File API and Canvas API. Your CSV data, background images and generated QR codes never leave your device. There is no account, no upload, and no server involved at any stage.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">Can I add a logo to every label?<\/p>\n      <p class=\"pth-faq-a\">Yes. In the Design tab, use the Background Image upload to add a PNG or JPG logo or watermark. Control its opacity with the slider \u2014 lower values create a subtle watermark effect, higher values create a bold background graphic. The image fit mode lets you choose Cover, Contain or Actual Size.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">What CSV format does the tool expect?<\/p>\n      <p class=\"pth-faq-a\">Standard comma-separated format with headers in the first row. Fields containing commas should be wrapped in double quotes. The tool handles Windows (CRLF), Unix (LF) and Mac (CR) line endings automatically. You can also export directly from Google Sheets via File \u2192 Download \u2192 CSV.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">How do I get the labels onto physical label sheets?<\/p>\n      <p class=\"pth-faq-a\">Use the Export tab&#8217;s Print action. Set the labels-per-row to match your physical sheet layout \u2014 typically 3 per row for A4 address sheets, 2 per row for larger shipping labels. Set page margins to match the sheet&#8217;s bleed area. Print at 100% scale (no fit to page) for accurate sizing.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">Can I use the Paste CSV option instead of uploading a file?<\/p>\n      <p class=\"pth-faq-a\">Yes. Click the Paste CSV button on the Data tab to show a textarea. Copy your data from Excel, Google Sheets or any text source and paste it directly. Click Parse and Load and the tool processes it identically to an uploaded file \u2014 same column detection, same field mapping, same exports.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">What does the Download HTML export do?<\/p>\n      <p class=\"pth-faq-a\">It saves a self-contained HTML file to your device. All labels and QR code images are embedded as inline data \u2014 no external files needed. Open the HTML file in any browser, even without an internet connection, and print from there. Useful for archiving a label run or sharing a printable file with someone else.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">Can I mix QR codes and text on the same label?<\/p>\n      <p class=\"pth-faq-a\">Yes. In the Fields tab, add any combination of CSV Column, Custom Text, QR Code and Divider rows in any order. A typical product label might have a product name text field, a price text field, a divider, and a QR code field pointing to the product URL \u2014 all on one 200\u00d7100px label.<\/p>\n    <\/div>\n\n    <div class=\"pth-faq-card\">\n      <p class=\"pth-faq-q\">Does the tool work on mobile devices?<\/p>\n      <p class=\"pth-faq-a\">Yes. The layout switches to a single column on screens below 768px. All tabs, field controls and export actions are accessible on mobile. Printing from mobile depends on your device&#8217;s print support \u2014 for best results with physical printers, use a desktop browser.<\/p>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Offline Custom Labels Generator Free online CSV label maker \u2014 design, customize and print labels from any spreadsheet. QR codes, 8 templates, batch export. 100% offline. \ud83d\udfe2 4-Tab All-in-One Studio Data, Design, Fields and Export tabs work together in a single tool. Upload CSV or paste data, choose from 8 label templates, map any column &#8230; <a title=\"CSV to Label Maker &#8211; Free Offline Custom Labels Generator\" class=\"read-more\" href=\"https:\/\/schoolict.net\/tools\/csv-to-label-maker\/\" aria-label=\"Read more about CSV to Label Maker &#8211; Free Offline Custom Labels Generator\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":6038,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6020","page","type-page","status-publish","has-post-thumbnail"],"_links":{"self":[{"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/pages\/6020","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/comments?post=6020"}],"version-history":[{"count":1,"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/pages\/6020\/revisions"}],"predecessor-version":[{"id":6754,"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/pages\/6020\/revisions\/6754"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/media\/6038"}],"wp:attachment":[{"href":"https:\/\/schoolict.net\/tools\/wp-json\/wp\/v2\/media?parent=6020"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}