.page{min-height:100vh;display:grid;gap:1.5rem;max-width:1180px;margin:0 auto;padding:2.5rem 1.25rem 4rem}.panel{background:color-mix(in oklab,var(--panel) 88%,white 12%);border:1px solid color-mix(in oklab,var(--accent-200) 80%,white 20%);border-radius:var(--radius-xl);box-shadow:var(--shadow-soft)}.hero{display:grid;gap:.85rem;padding:2.2rem;overflow:hidden;position:relative}.hero:before{content:"";position:absolute;inset:auto -40px -60px auto;width:230px;aspect-ratio:1;border-radius:999px;background:radial-gradient(circle,#fb923c4d,#fb923c00);pointer-events:none}.eyebrow{text-transform:uppercase;letter-spacing:.28rem;font-size:.75rem;font-weight:700;color:var(--accent-700);margin:0}h1{margin:0;max-width:18ch;line-height:1.1;font-size:clamp(2rem,5vw,3.8rem)}.lead{margin:0;font-size:1.05rem;color:var(--ink-600);max-width:60ch}.cards{display:grid;gap:1.2rem}.tabs{display:inline-flex;gap:.45rem;padding:.45rem;width:-moz-fit-content;width:fit-content}.tabs button{border:1px solid color-mix(in oklab,var(--accent-200) 72%,#ba8744 28%);background:#fff8ee;color:var(--ink-900);border-radius:.75rem;padding:.55rem .95rem;font-size:.9rem;font-weight:620;cursor:pointer;transition:all .16s ease}.tabs button:hover{background:#fff3df}.tabs button.active{background:linear-gradient(180deg,#ffdfb3,#ffd4a2);border-color:color-mix(in oklab,var(--accent-500) 75%,#c0710f 25%);box-shadow:0 8px 18px -15px #c26e0ae6}.settings{padding:1.15rem;display:grid;gap:.9rem}.settings-card{border-color:color-mix(in oklab,#89a7c8 46%,white 54%);background:linear-gradient(180deg,#f2f7ff,#eef4fb)}.settings-card .field span{color:#204a79}.settings-card input,.settings-card select{border-color:color-mix(in oklab,#5f8fbe 58%,#99bddf 42%);background:linear-gradient(180deg,#fff,#f1f7ff);box-shadow:0 6px 20px -14px #2359918c}.settings-head h2{margin:0;font-size:1.05rem}.settings-head p{margin:.2rem 0 0;color:var(--ink-600);font-size:.9rem}.settings-tools{margin-top:.85rem;display:flex;justify-content:flex-end}.import-btn{border:1px solid color-mix(in oklab,var(--accent-500) 72%,#a75f00 28%);border-radius:.75rem;padding:.52rem .9rem;font-size:.84rem;font-weight:650;color:#7a3500;background:linear-gradient(180deg,#ffe8c6,#ffdbad);cursor:pointer}.import-btn.ghost{border-color:#d0a46b;background:#fff8ee}.import-overlay{position:fixed;inset:0;z-index:1000;background:#0f172a94;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;place-items:center;padding:1rem}.import-modal{width:min(740px,100%);padding:1rem;display:grid;gap:.8rem;background:#fffaf2;border:1px solid #e8d7be;box-shadow:0 26px 50px -28px #0f172ab8}.import-head h3{margin:0;font-size:1.1rem}.import-head p{margin:.2rem 0 0;color:var(--ink-600);font-size:.88rem}.import-textarea{min-height:180px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace}.file-picker{display:flex;align-items:center;gap:.65rem;border:1px solid color-mix(in oklab,var(--accent-500) 45%,#b37a36 55%);border-radius:.8rem;padding:.55rem .65rem;background:linear-gradient(180deg,#fffdf7,#fff7ea 92%)}.file-picker-input{display:none}.file-picker-btn{border:1px solid color-mix(in oklab,var(--accent-500) 68%,#a9681c 32%);border-radius:.6rem;padding:.45rem .7rem;font-size:.82rem;font-weight:650;color:#7a3500;background:linear-gradient(180deg,#ffe8c6,#ffdbad);cursor:pointer;white-space:nowrap}.file-picker-name{font-size:.84rem;font-weight:600;color:#4b5563;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-actions{display:flex;justify-content:flex-end;gap:.5rem}.import-error{margin:0;color:#991b1b;font-size:.88rem;font-weight:600}.settings-grid{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.dl-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.section-list{display:grid;gap:1rem}.settings-section{border:1px solid color-mix(in oklab,var(--accent-200) 68%,white 32%);border-radius:.9rem;padding:.9rem;background:#ffffffb3}.settings-subhead{margin:0 0 .6rem}.settings-subhead h3{margin:0;font-size:.98rem;color:#1f2b3a}.settings-subhead p{margin:.2rem 0 0;font-size:.84rem;color:var(--ink-600)}.card{background:color-mix(in oklab,white 90%,var(--panel) 10%);border:1px solid color-mix(in oklab,var(--accent-200) 65%,white 35%);border-radius:calc(var(--radius-xl) + .25rem);box-shadow:0 14px 35px -26px #1c100659;padding:1.5rem;display:grid;gap:1.15rem;animation:float-in .42s ease both}.cards .card:nth-child(2){animation-delay:90ms}.card-head{display:grid;grid-template-columns:1.3fr minmax(250px,360px);gap:1rem 1.5rem;align-items:end}.copy{display:grid;gap:.35rem}.format-tag{margin:0;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:color-mix(in oklab,var(--accent-700) 72%,black 28%);font-weight:650}h2{margin:0;font-size:1.5rem;line-height:1.15}.copy p{margin:0;color:var(--ink-600)}.field{display:grid;gap:.4rem;font-size:.82rem;font-weight:650;letter-spacing:.02em;color:color-mix(in oklab,var(--ink-500) 72%,#111827 28%)}.field small{font-size:.76rem;color:var(--ink-600)}.height-split{display:grid;grid-template-columns:110px 110px;gap:.35rem;justify-content:start}.height-part{display:flex;align-items:center;gap:.35rem}.height-split input{text-align:center;padding:.55rem .45rem;font-size:.92rem;font-weight:650;min-width:0;width:100%}.height-unit{font-size:.8rem;font-weight:700;color:#6b7280;min-width:14px;text-align:center}.field-live span{color:#0f4b8d}.field-live input,.field-live select{border-color:color-mix(in oklab,#0f4b8d 48%,#7db4e7 52%);background:linear-gradient(180deg,#f5fbff,#eef7ff 94%);box-shadow:0 6px 20px -14px #0f4b8da6}.field-code128 span{color:#8a3b00}.field-code128 input,.field-code128 select{border-color:color-mix(in oklab,#d97706 58%,#f3bf77 42%);background:linear-gradient(180deg,#fff9ef,#fff3de 94%);box-shadow:0 6px 20px -14px #ae5b078c}input{border:2px solid color-mix(in oklab,var(--accent-500) 65%,#c98216 35%);border-radius:.85rem;padding:.88rem 1rem;font-size:1rem;font-weight:560;background:linear-gradient(180deg,#fff,#fff5e6 92%);color:var(--ink-900);box-shadow:0 6px 20px -14px #be730b99;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease}select{border:2px solid color-mix(in oklab,var(--accent-500) 65%,#c98216 35%);border-radius:.85rem;padding:.88rem 1rem;font-size:.95rem;font-weight:560;background:linear-gradient(180deg,#fff,#fff5e6 92%);color:var(--ink-900);box-shadow:0 6px 20px -14px #be730b99;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease}input[type=number]{font-variant-numeric:tabular-nums}textarea{border:2px solid color-mix(in oklab,var(--accent-500) 45%,#a4671d 55%);border-radius:.85rem;padding:.8rem .95rem;font-size:.86rem;line-height:1.35;min-height:110px;resize:vertical;background:linear-gradient(180deg,#fffefb,#fff8ec 92%);color:var(--ink-900)}.payload-preview{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;min-height:120px}.payload-inline{min-height:0;height:20px;resize:none;overflow:hidden;white-space:nowrap}input::-moz-placeholder{color:color-mix(in oklab,var(--ink-500) 58%,white 42%)}input::placeholder{color:color-mix(in oklab,var(--ink-500) 58%,white 42%)}input:focus{outline:none;border-color:#ea8f16;background:#fff9f0;box-shadow:0 0 0 4px color-mix(in oklab,var(--accent-300) 56%,transparent 44%),0 12px 24px -18px #be730bd9;transform:translateY(-2px)}.card .field input:disabled{background:linear-gradient(180deg,#f1f5f9,#e9eef4);border-color:#b7c2d0;color:#5b6776;box-shadow:none;cursor:not-allowed}select:focus{outline:none;border-color:#ea8f16;background:#fff9f0;box-shadow:0 0 0 4px color-mix(in oklab,var(--accent-300) 56%,transparent 44%),0 12px 24px -18px #be730bd9;transform:translateY(-2px)}.section-list input:disabled,.section-list select:disabled{background:linear-gradient(180deg,#eef2f7,#e5ebf3);border-color:#b8c4d3;color:#5b6776;box-shadow:none;cursor:not-allowed;opacity:.95}.section-list .field-disabled span{color:#6a7482}.barcode-frame{background:linear-gradient(145deg,#fbbf7a29,#fff0 45%),#fff;border-radius:var(--radius-lg);padding:1.25rem;border:1px dashed color-mix(in oklab,var(--accent-300) 70%,#d2a364 30%);display:grid;place-items:center;overflow-x:auto}.barcode-2d{padding:1.8rem 1.2rem}.card-actions{display:flex;justify-content:flex-end;gap:.55rem;align-items:center}.download-format{border:1px solid color-mix(in oklab,var(--accent-500) 56%,#bd7b27 44%);border-radius:.7rem;padding:.5rem .65rem;font-size:.84rem;font-weight:620;color:#7a3500;background:#fff6e8}.download-btn{border:1px solid color-mix(in oklab,var(--accent-500) 72%,#a75f00 28%);border-radius:.75rem;padding:.58rem .95rem;font-size:.86rem;font-weight:650;color:#7a3500;background:linear-gradient(180deg,#ffe8c6,#ffdbad);cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}.download-btn:hover{transform:translateY(-1px);box-shadow:0 10px 18px -14px #ae5b07cc;filter:brightness(1.02)}.download-btn:active{transform:translateY(0)}canvas{max-width:100%}.error{color:#991b1b;font-weight:650;padding:.95rem 1rem;font-size:.95rem}@keyframes float-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:900px){.page{padding-inline:1rem}.hero{padding:1.6rem}.card-head{grid-template-columns:1fr;align-items:start}}@media(max-width:620px){h1{font-size:clamp(1.8rem,9vw,2.6rem)}.card{padding:1.15rem}.barcode-frame{padding:1rem .7rem}}
