:root{
      --bg:#eef6fc; --surface:#ffffff; --card:rgba(255,255,255,.88); --text:#102033; --muted:#5b6f83;
      --line:#cbd9e6; --accent:#f1913e; --blue:#2f8edf; --good:#2baa72; --bad:#c2413a;
      --shadow:0 22px 60px -42px rgba(28,53,75,.55); --radius:22px;
      --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
    }
    html[data-theme="dark"]{
      --bg:#0b1120; --surface:#111827; --card:rgba(15,23,42,.88); --text:#e5eefb; --muted:#9aa9bd;
      --line:#26364d; --accent:#f1913e; --blue:#60a5fa; --shadow:0 22px 60px -40px rgba(0,0,0,.9);
    }
    *{box-sizing:border-box}
    body{
      margin:0;font-family:var(--font);color:var(--text);
      background:radial-gradient(circle at 0% 0%,rgba(241,145,62,.13),transparent 28rem),
                 radial-gradient(circle at 100% 0%,rgba(78,163,241,.15),transparent 30rem),
                 linear-gradient(135deg,#f7fbff,var(--bg));
      min-height:100vh;
    }
    html[data-theme="dark"] body{background:radial-gradient(circle at 0% 0%,rgba(241,145,62,.12),transparent 28rem),radial-gradient(circle at 100% 0%,rgba(78,163,241,.12),transparent 30rem),var(--bg)}
    .app-shell{min-height:100vh;display:grid;grid-template-rows:auto 1fr}
    .topbar{position:sticky;top:0;z-index:40;backdrop-filter:blur(18px);background:color-mix(in srgb,var(--surface) 84%,transparent);border-bottom:1px solid var(--line)}
    .topbar-inner{width:100%;max-width:none;margin:0 auto;padding:10px clamp(16px,2.2vw,44px);display:flex;align-items:center;justify-content:space-between;gap:16px}
    .brand{display:flex;align-items:center;gap:12px;min-width:0}
    .brand-copy{min-width:0}
    .tool-logo{width:54px;height:54px;border-radius:16px;object-fit:contain;flex:0 0 auto;border:1px solid rgba(241,145,62,.38);box-shadow:0 0 0 4px rgba(241,145,62,.08),0 18px 36px -26px rgba(15,23,42,.55);background:var(--surface)}
    .brand h1{margin:0;font-size:clamp(1.15rem,2vw,1.55rem);letter-spacing:-.04em;white-space:nowrap}
    .brand p{margin:4px 0 0;color:var(--muted);font-size:clamp(.76rem,1.2vw,.9rem);line-height:1.35}
    .top-actions{display:flex;align-items:center;gap:9px;justify-content:flex-end}
    .btn{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:14px;padding:10px 14px;min-height:42px;font-weight:850;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 12px 28px -25px rgba(15,23,42,.75);transition:.18s ease;text-decoration:none}
    .btn:hover,.btn:focus-visible{transform:translateY(-1px);border-color:rgba(241,145,62,.7);box-shadow:0 0 0 4px rgba(241,145,62,.12),0 16px 32px -24px rgba(15,23,42,.75);outline:none}
    .btn-blue{background:linear-gradient(135deg,var(--blue),#1668b2);color:white;border-color:transparent}
    .btn-good{background:linear-gradient(135deg,var(--good),#16814f);color:white;border-color:transparent}
    @media (max-width:520px){
      .topbar-inner{padding:9px 12px;gap:9px}
      .brand{gap:9px}
      .tool-logo{width:44px;height:44px;border-radius:13px}
      .brand h1{font-size:clamp(.98rem,4.5vw,1.15rem);white-space:normal;line-height:1.05}
      .brand p{font-size:.7rem;line-height:1.25}
    }
    .main{max-width:none;margin:0 auto;width:100%;padding:clamp(14px,2vw,30px) clamp(16px,2.2vw,44px);display:grid;grid-template-columns:minmax(380px,500px) minmax(540px,1fr) minmax(390px,520px);gap:20px;align-items:start}
    .panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
    .panel-head{padding:18px 18px 14px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,rgba(78,163,241,.12),transparent)}
    .panel-body{padding:18px;min-width:0}
    .eyebrow{color:var(--accent);font-size:.78rem;font-weight:950;letter-spacing:.11em;text-transform:uppercase;margin:0 0 8px}
    h2,h3{margin:0;line-height:1.15}.panel h2{font-size:1.18rem;letter-spacing:-.02em}.panel h3{font-size:1rem}
    .grid{display:grid;gap:12px}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
    label{font-size:.78rem;font-weight:850;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
    input,textarea,select{width:100%;border:1px solid var(--line);border-radius:14px;padding:11px 12px;background:var(--surface);color:var(--text);font:inherit;font-size:.92rem;outline:none;transition:.18s ease}
    textarea{min-height:160px;resize:vertical;font-family:var(--mono);font-size:.86rem;line-height:1.45}
    input:focus,textarea:focus,select:focus{border-color:rgba(47,142,223,.55)!important;box-shadow:0 0 0 4px rgba(47,142,223,.10)!important}
    .field{display:grid;gap:6px}.field-note{color:var(--muted);font-size:.78rem;margin:0;line-height:1.35}
    .type-grid,.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .type-btn,.mode-btn{padding:12px 10px;min-height:66px;display:grid;place-items:center;gap:4px;text-align:center;font-size:.8rem}
    .mode-btn span:first-child{font-size:1rem;line-height:1;color:var(--muted)}
    .mode-btn.active span:first-child{color:var(--text)}
    .content-picker-note,.form-help{margin-top:14px;color:var(--muted);font-size:.86rem;line-height:1.45;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--blue) 9%,transparent);border:1px solid color-mix(in srgb,var(--blue) 20%,var(--line))}
    .form-help{margin:0;background:rgba(241,145,62,.08);border-color:rgba(241,145,62,.22)}
    .form-example{color:var(--muted);line-height:1.45;font-size:.86rem;padding:10px 12px;border-left:4px solid var(--accent);background:color-mix(in srgb,var(--surface) 80%,transparent);border-radius:12px;margin:0}
    .final-code-box{display:none;border:1px solid rgba(47,142,223,.25);background:rgba(47,142,223,.08);border-radius:16px;padding:12px 14px;color:var(--muted);font-size:.86rem;line-height:1.45}
    .final-code-box.active{display:block}
    .final-code-box code{font-family:var(--mono);font-weight:850;color:var(--text);background:color-mix(in srgb,var(--surface) 78%,transparent);border:1px solid var(--line);border-radius:8px;padding:1px 6px}
    .final-code-box strong{color:var(--text)}
    .center-stage{display:grid;gap:18px}
    .input-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
    .input-block{display:none}.input-block.active{display:grid;gap:12px}
    .settings-grid{display:grid;gap:14px}.settings-card{padding:14px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface) 78%,transparent)}.settings-card h3{margin:0 0 10px}
    .advanced-box{border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface) 82%,transparent);overflow:hidden}
    .advanced-box summary{cursor:pointer;list-style:none;padding:14px;font-weight:950;display:flex;align-items:center;justify-content:space-between;gap:10px}
    .advanced-box summary::-webkit-details-marker{display:none}
    .advanced-box summary::after{content:'▾';color:var(--accent);transition:.18s ease}
    .advanced-box[open] summary::after{transform:rotate(180deg)}
    .advanced-content{border-top:1px solid var(--line);padding:14px;display:grid;gap:12px}
    .select-hint{font-size:.82rem;color:var(--muted);line-height:1.4;margin:8px 0 0}
    .warning-soft{border:1px solid rgba(194,65,58,.25);background:rgba(194,65,58,.07);border-radius:16px;padding:11px 13px;color:var(--muted);font-size:.86rem;line-height:1.45}
    .csv-safe-note{border:1px solid rgba(43,170,114,.24);background:rgba(43,170,114,.08);border-radius:16px;padding:11px 13px;color:var(--muted);font-size:.86rem;line-height:1.45}
    .validation-box{border:1px solid rgba(43,170,114,.28);background:rgba(43,170,114,.08);border-radius:16px;padding:12px 14px;color:var(--muted);font-size:.88rem;line-height:1.45}
    .validation-box.bad{border-color:rgba(194,65,58,.32);background:rgba(194,65,58,.08)}
    .validation-box.pending{border-color:rgba(241,145,62,.34);background:rgba(241,145,62,.09)}
    .validation-box strong{color:var(--text)}
    .validation-box ul{margin:8px 0 0;padding-left:1.2rem}
    .field.invalid input,.field.invalid textarea,.field.invalid select{border-color:rgba(194,65,58,.75)!important;box-shadow:0 0 0 4px rgba(194,65,58,.10)!important}
    .field.locked input,.field.locked textarea,.field.locked select{background:rgba(203,217,230,.22);color:var(--muted);cursor:not-allowed}
    .field.locked label::after{content:' fest';font-size:.72em;color:var(--muted);font-weight:700;margin-left:.35rem;text-transform:none;letter-spacing:0}
    .field.valid input,.field.valid textarea,.field.valid select{border-color:rgba(43,170,114,.65)!important;box-shadow:0 0 0 4px rgba(43,170,114,.08)!important}
    .field.pending input,.field.pending textarea,.field.pending select{border-color:rgba(241,145,62,.72)!important;box-shadow:0 0 0 4px rgba(241,145,62,.10)!important}
    .field.valid input:focus,.field.valid textarea:focus,.field.valid select:focus{border-color:rgba(43,170,114,.72)!important;box-shadow:0 0 0 4px rgba(43,170,114,.11)!important}
    .field.pending input:focus,.field.pending textarea:focus,.field.pending select:focus{border-color:rgba(241,145,62,.82)!important;box-shadow:0 0 0 4px rgba(241,145,62,.12)!important}
    :root{--print-gap:8mm;--print-padding:12mm}
    .sheet-preview{padding:var(--print-padding)}
    .label-grid{gap:var(--print-gap)}
    .sheet-layout-status{margin:7px 0 0;color:var(--muted);font-size:.78rem;line-height:1.4}
    .project-meta{display:grid;gap:10px}
    .project-status{font-size:.82rem;color:var(--muted);line-height:1.4;padding:10px 12px;border-radius:14px;background:rgba(47,142,223,.08);border:1px solid rgba(47,142,223,.2)}
    .autosave-status{font-size:.78rem;color:var(--muted);line-height:1.4;padding:8px 10px;border-radius:12px;background:rgba(43,170,114,.08);border:1px solid rgba(43,170,114,.22)}
    .version-list{border:1px solid var(--line);border-radius:16px;overflow:auto;max-height:230px;background:color-mix(in srgb,var(--surface) 78%,transparent)}
    .version-row{display:grid;grid-template-columns:70px 1fr auto;gap:10px;align-items:center;padding:10px;border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);font-size:.84rem}
    .version-row:last-child{border-bottom:0}
    .version-row strong{color:var(--text)}
    .version-row span{color:var(--muted);display:block;font-size:.78rem;line-height:1.3}
    .version-row button{flex:0 0 auto}
    .version-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
    .version-actions{min-width:210px}
    .version-empty{padding:12px;color:var(--muted);font-size:.84rem}
    .hidden-file{display:none!important}
    .color-row{display:grid;grid-template-columns:1fr 54px;gap:10px;align-items:end}input[type=color]{padding:0;min-height:43px;cursor:pointer}
    .tool-trust-strip-compact{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
    .preview-card{text-align:center;padding:clamp(18px,2vw,28px);position:sticky;top:86px}
    .barcode-frame{display:inline-grid;place-items:center;padding:18px;background:#fff;border:1px solid #e2e8f0;border-radius:26px;box-shadow:0 24px 70px -44px rgba(15,23,42,.9);margin:12px auto 16px;max-width:100%;overflow:auto}
    #barcodeSvg{max-width:100%;height:auto}
    .pill-row{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:0 0 14px}
    .preview-buttons{display:grid;gap:10px;max-width:320px;margin:0 auto}.payload-box{font-family:var(--mono);font-size:.78rem;color:var(--muted);background:color-mix(in srgb,var(--surface) 80%,transparent);border:1px solid var(--line);border-radius:16px;padding:12px;max-height:170px;overflow:auto;white-space:pre-wrap;word-break:break-word;text-align:left}
    .list-panel{margin-top:18px;text-align:left}.list-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
    .code-list{border:1px solid var(--line);border-radius:16px;overflow:auto;max-height:240px;background:color-mix(in srgb,var(--surface) 78%,transparent)}
    .code-row{display:grid;grid-template-columns:52px 1fr 60px;gap:8px;padding:8px 10px;border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);align-items:center;font-size:.82rem}
    .code-row:last-child{border-bottom:0}.code-row code{font-family:var(--mono);color:var(--text);word-break:break-all}.code-row span{color:var(--muted)}
    .sheet-panel{margin-top:18px;text-align:left}.sheet-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px}
    .sheet-scale-note{margin:0 0 8px;color:var(--muted);font-size:.76rem;text-align:center}
    .sheet-preview{width:min(100%,calc(70vh * 210 / 297));margin-inline:auto;aspect-ratio:210 / 297;position:relative;box-sizing:border-box}
    .sheet-pages{width:100%;height:100%}
    .sheet-page{background:#fff;border:1px solid var(--line);border-radius:6px;width:100%;height:100%;aspect-ratio:210 / 297;position:relative;box-sizing:border-box;overflow:hidden;box-shadow:0 18px 46px -30px rgba(15,23,42,.7)}
    .sheet-page[hidden]{display:none}
    .sheet-page-grid{position:absolute;display:grid;align-items:start;justify-content:start;box-sizing:border-box}
    .label-grid{display:grid;gap:var(--print-gap);align-items:start;justify-content:start}
    .label-grid>.label-cell{width:var(--label-print-width);min-width:0;min-height:var(--label-print-height);box-sizing:border-box}
    .sheet-page-grid>.label-cell{border-width:clamp(1px,.12vw,2px);border-radius:clamp(2px,.7vw,16px)}
    .sheet-page-grid>.label-cell .label-inner{min-width:0;width:100%;overflow:hidden}
    .sheet-page-grid>.label-cell svg{max-height:100%;max-width:100%}
    .sheet-empty{display:grid;place-items:center;width:100%;height:100%;padding:24px;text-align:center;color:var(--muted);background:var(--surface);border:1px dashed var(--line);border-radius:16px;box-sizing:border-box}
    .sheet-empty[hidden],.custom-size-fields[hidden]{display:none!important}
    .sheet-navigation{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;font-size:.85rem;font-weight:850}
    .sheet-nav-button{min-width:42px;padding:8px 12px}.sheet-nav-button:disabled{opacity:.4;cursor:not-allowed}
    .sheet-nav-button[hidden]{display:none!important}
    .sheet-page-items{text-align:center;color:var(--muted);font-size:.76rem;margin:7px 0 0;min-height:1.2em}
    .sheet-finish{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
    .sheet-finish span{color:var(--muted);font-size:.76rem}.sheet-finish .btn{min-width:190px}
    .custom-size-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
    .unit-input{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.unit-input span{color:var(--muted);font-weight:800}
    .custom-size-error{margin:8px 0 0;color:#c2413a;font-size:.8rem;font-weight:800}
    #wsPrintRoot{display:none}
    .label-cell{
      position:relative;isolation:isolate;overflow:hidden;border:1px solid #9fb2c5;border-radius:16px;padding:10px;
      text-align:center;min-height:104px;display:grid;align-content:center;justify-items:center;gap:4px;background:#fff;color:#102033;
      page-break-inside:avoid;break-inside:avoid;box-shadow:0 10px 24px -22px rgba(15,23,42,.7);
      --label-accent:#102033;--frame-a:#102033;--frame-b:#30445a;
      -webkit-print-color-adjust:exact;print-color-adjust:exact;background-clip:border-box;
    }
    .label-cell svg{max-width:100%;height:auto;position:relative;z-index:2;background:#fff;border-radius:7px;padding:2px}.label-text{position:relative;z-index:2;font:800 10px var(--mono);margin-top:2px;word-break:break-all;color:#102033}
    .label-design-card{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface) 82%,transparent);display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:18px;align-items:start;min-width:0}
    .label-design-settings{display:grid;gap:12px;min-width:0}
    .label-design-card h3{margin:0}.label-title-text{position:relative;z-index:3;font-weight:950;margin-bottom:4px;letter-spacing:.04em;line-height:1.1;word-break:break-word;color:var(--label-accent)}
    .label-title-bottom{margin-top:5px;margin-bottom:0}.template-hint{color:var(--muted);font-size:.78rem;line-height:1.35;margin:0}
    .label-design-preview{display:grid;gap:12px;padding:16px;border:1px solid color-mix(in srgb,var(--blue) 24%,var(--line));border-radius:16px;background:color-mix(in srgb,var(--blue) 7%,transparent);position:sticky;top:16px;min-width:0;box-shadow:0 18px 38px -32px rgba(15,23,42,.55)}
    .label-design-preview-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.label-design-preview-head strong{font-size:.9rem}.label-design-preview-head span{font-size:.76rem;color:var(--muted)}
    .label-preview-stage{display:grid;place-items:center;padding:12px;border-radius:14px;background:rgba(255,255,255,.58);border:1px dashed rgba(159,178,197,.65);min-width:0}
    .label-preview-stage .label-cell{width:min(100%,380px);min-height:190px;padding:18px}.label-preview-stage .label-cell svg{max-width:var(--barcode-area-use,84%)}.label-preview-stage .label-text{font-size:11px}
    .label-preview-note{margin:0;color:var(--muted);font-size:.76rem;line-height:1.45}
    .label-cell.frame-none{border:1px dashed #9fb2c5;background:#fff;box-shadow:0 10px 24px -22px rgba(15,23,42,.7)}
    .label-cell.frame-bold{border:1px solid transparent;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 3px #102033,inset 0 0 0 7px rgba(16,32,51,.06),0 14px 28px -24px rgba(16,32,51,.9)}
    .label-cell.frame-corner{border:1px solid transparent;border-radius:14px;background:#fff}.label-cell.frame-corner::before{content:"";position:absolute;inset:7px;border:2px solid var(--label-accent);border-radius:10px;clip-path:polygon(0 0,28% 0,28% 10%,10% 10%,10% 28%,0 28%,0 0,72% 0,100% 0,100% 28%,90% 28%,90% 10%,72% 10%,72% 0,100% 72%,100% 100%,72% 100%,72% 90%,90% 90%,90% 72%,100% 72%,28% 100%,0 100%,0 72%,10% 72%,10% 90%,28% 90%,28% 100%);pointer-events:none;z-index:1}
    .label-cell.frame-badge{border:2px solid #d7e4f0;border-radius:18px;background:linear-gradient(180deg,#fff,#f7fbff)}.label-cell.frame-badge .label-title-text{display:inline-block;padding:4px 10px;border-radius:999px;background:var(--label-accent);color:#fff!important;box-shadow:0 8px 18px -14px var(--label-accent)}
    .label-cell.frame-blue,.label-cell.frame-orange,.label-cell.frame-green,.label-cell.frame-bar-top,.label-cell.frame-bar-bottom,.label-cell.frame-bar-double{
      border:1px solid transparent;border-radius:16px;box-shadow:inset 0 0 0 2px var(--frame-a),0 14px 28px -24px rgba(15,23,42,.7)
    }
    .label-cell.frame-blue{--frame-a:#2f8edf;--frame-b:#1668b2;background:linear-gradient(180deg,#2f8edf 0 18px,#ffffff 18px,#eef6ff 100%)}
    .label-cell.frame-orange{--frame-a:#f1913e;--frame-b:#cc6f1e;background:linear-gradient(180deg,#f1913e 0 18px,#fffaf4 18px,#fff1df 100%)}
    .label-cell.frame-green{--frame-a:#2baa72;--frame-b:#16814f;background:linear-gradient(180deg,#2baa72 0 18px,#f8fff9 18px,#eaf8f0 100%)}
    .label-cell.frame-bar-top{--frame-a:#2f8edf;--frame-b:#1668b2;background:linear-gradient(180deg,var(--frame-a) 0 20px,#ffffff 20px,#f6fbff 100%)}
    .label-cell.frame-bar-bottom{--frame-a:#f1913e;--frame-b:#cc6f1e;background:linear-gradient(180deg,#ffffff 0 calc(100% - 20px),var(--frame-a) calc(100% - 20px) 100%)}
    .label-cell.frame-bar-double{--frame-a:#102033;--frame-b:#f1913e;background:linear-gradient(180deg,#102033 0 16px,#ffffff 16px calc(100% - 16px),#f1913e calc(100% - 16px) 100%)}
    .label-cell.frame-bar-top .label-title-text,.label-cell.frame-bar-bottom .label-title-text,.label-cell.frame-bar-double .label-title-text,
    .label-cell.frame-blue .label-title-text,.label-cell.frame-orange .label-title-text,.label-cell.frame-green .label-title-text{
      display:inline-block;border-radius:999px;padding:3px 10px;background:color-mix(in srgb,var(--frame-a) 88%,white);color:#fff!important;box-shadow:0 8px 18px -14px var(--frame-a)
    }
    .label-cell.frame-bar-bottom .label-title-bottom,.label-cell.frame-bar-double .label-title-bottom{background:#102033;color:#fff!important}
    .label-cell.frame-sale{--frame-a:#c2413a;--frame-b:#8f1f1a;border:1px solid transparent;border-radius:18px;background:radial-gradient(circle at 0 0,rgba(194,65,58,.14),transparent 40%),linear-gradient(180deg,#fff,#fff7f7);box-shadow:inset 0 0 0 2px #c2413a,0 14px 28px -24px rgba(15,23,42,.7)}
    .label-cell.frame-sale .label-title-text{display:inline-block;background:#c2413a;color:#fff!important;border-radius:8px;padding:3px 10px}
    .label-cell.frame-dark{--frame-a:#102033;--frame-b:#30445a;border:1px solid transparent;border-radius:18px;background:linear-gradient(180deg,#102033 0 22px,#ffffff 22px,#f3f7fb 100%);box-shadow:inset 0 0 0 2px #102033,0 14px 28px -24px rgba(15,23,42,.7)}
    .label-cell.frame-dark .label-title-text{display:inline-block;background:#102033;color:#fff!important;border-radius:6px;padding:3px 10px}




    .label-cell{
      --label-bg:#ffffff;
      --label-radius:16px;
      --frame-color:#102033;
      --frame-width:2px;
      --bar-top-color:#2f8edf;
      --bar-bottom-color:#f1913e;
      --bar-left-color:#102033;
      --bar-right-color:#102033;
      --bar-top-h:0px;
      --bar-bottom-h:0px;
      --bar-side-w:0px;
      border:var(--frame-width) solid var(--frame-color)!important;
      border-radius:var(--label-radius)!important;
      background:var(--label-bg)!important;
      box-shadow:none!important;
      padding:0!important;
      overflow:hidden!important;
      position:relative!important;
      min-height:108px;
    }
    .label-inner{
      position:relative;z-index:3;width:100%;height:100%;display:grid;align-content:center;justify-items:center;gap:4px;
      padding:calc(var(--bar-top-h) + 8px) calc(var(--bar-side-w) + 9px) calc(var(--bar-bottom-h) + 8px) calc(var(--bar-side-w) + 9px);
      min-height:inherit;
    }
    .label-bar{position:absolute;z-index:1;pointer-events:none;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:flex;align-items:center;justify-content:center;overflow:hidden}
    .label-bar-top{left:0;top:0;right:0;height:var(--bar-top-h);background:var(--bar-top-color)}
    .label-bar-bottom{left:0;bottom:0;right:0;height:var(--bar-bottom-h);background:var(--bar-bottom-color)}
    .label-bar-left{left:0;top:0;bottom:0;width:var(--bar-side-w);background:var(--bar-left-color)}
    .label-bar-right{right:0;top:0;bottom:0;width:var(--bar-side-w);background:var(--bar-right-color)}
    .label-barcode-area{position:relative;z-index:3;width:100%;min-width:0;display:grid;place-items:center;padding-inline:4px;box-sizing:border-box;overflow:visible}
    .label-barcode-area svg{display:block;box-sizing:border-box;background:#fff;border-radius:7px;padding:2px;width:auto;max-width:var(--barcode-area-use,84%);height:auto;justify-self:center}
    .label-cell.label-barcode-compact{--barcode-area-use:72%}
    .label-cell.label-barcode-balanced{--barcode-area-use:84%}
    .label-cell.label-barcode-large{--barcode-area-use:94%}
    .label-cell.label-barcode-max{--barcode-area-use:100%}
    .label-cell .label-text{position:relative;z-index:3;font:800 10px var(--mono);margin-top:2px;word-break:break-all;color:#102033}
    .label-title-text{position:relative;z-index:4;display:inline-block;max-width:100%;font-weight:950;letter-spacing:.04em;line-height:1.1;word-break:break-word;color:var(--label-accent);padding:0 6px;border-radius:8px;text-align:var(--title-align,center)}
    .label-title-pill{background:var(--label-accent);color:#fff!important;padding:3px 11px;border-radius:999px}
    .label-title-bar{color:var(--label-accent)!important;background:transparent;padding:0 8px;margin:0!important;line-height:1;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:none}
    .label-preview-stage .label-cell{width:min(100%,300px);min-height:170px}.label-preview-stage .label-cell svg{max-width:var(--barcode-area-use,84%)}.label-preview-stage .label-text{font-size:11px}
    .designer-grid{display:grid;gap:10px}.designer-subhead{margin:4px 0 0;color:var(--accent);font-size:.72rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}.small-select{min-height:40px;padding:8px 10px}.template-hint.warn{border:1px solid rgba(241,145,62,.24);background:rgba(241,145,62,.07);border-radius:14px;padding:10px 12px}

    .label-cell.label-format-compact{min-height:92px}
    .label-cell.label-format-normal{min-height:112px}
    .label-cell.label-format-wide{min-height:104px}
    .label-cell.label-format-tall{min-height:150px}
    .label-cell.label-format-sign{min-height:190px}
    .label-cell.label-density-comfortable{padding:13px}
    .label-cell.label-density-balanced{padding:10px}
    .label-cell.label-density-many{padding:7px}
    .label-cell.label-density-scan{padding:12px}
    .label-cell.label-format-wide .label-inner{padding-left:calc(var(--bar-side-w) + 12px);padding-right:calc(var(--bar-side-w) + 12px)}
    .label-cell.label-format-tall .label-inner,.label-cell.label-format-sign .label-inner{gap:8px}
    .label-cell.label-density-many .label-title-text{font-size:.88em}
    .label-preview-stage .label-cell.label-format-compact{min-height:132px}
    .label-preview-stage .label-cell.label-format-normal{min-height:170px}
    .label-preview-stage .label-cell.label-format-wide{width:min(100%,330px);min-height:150px}
    .label-preview-stage .label-cell.label-format-tall{width:min(100%,240px);min-height:220px}
    .label-preview-stage .label-cell.label-format-sign{width:min(100%,350px);min-height:230px}
    .label-grid.label-sheet-compact,.label-grid.label-sheet-comfortable,.label-grid.label-sheet-scan{gap:var(--print-gap)}
    .label-grid>.label-cell{width:var(--label-print-width);min-height:var(--label-print-height)}

    /* Die A4-Bildschirmseite wird proportional verkleinert. Innerhalb ihres
       Grids bestimmen deshalb ausschließlich die berechneten Tracks die
       Außenmaße – nicht die px-Mindesthöhen der Designerformate. */
    @media screen{
      .sheet-page-grid>.label-cell{
        width:100%;
        height:100%;
        min-width:0;
        min-height:0;
        max-width:100%;
        max-height:100%;
      }
    }

    .label-cell.label-shape-square{border-radius:0!important;clip-path:none!important}
    .label-cell.label-shape-rounded{border-radius:var(--label-radius)!important;clip-path:none!important}
    .label-cell.label-shape-pill{border-radius:999px!important;clip-path:none!important}
    .label-cell.label-shape-cut{border-radius:8px!important;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}
    .label-cell.label-shape-file{border-radius:10px!important;clip-path:polygon(0 0,78% 0,88% 13px,100% 13px,100% 100%,0 100%)}
    .label-cell:not(.label-shape-ticket)::before,.label-cell:not(.label-shape-ticket)::after{content:none!important;display:none!important}
    .label-cell.label-shape-ticket::before,.label-cell.label-shape-ticket::after{content:"";position:absolute;z-index:4;width:18px;height:18px;border-radius:50%;background:#fff;top:50%;transform:translateY(-50%);pointer-events:none}
    .label-cell.label-shape-ticket::before{left:-10px}.label-cell.label-shape-ticket::after{right:-10px}
    .label-cell.label-shape-square .label-bar{border-radius:0!important}
    .label-cell.label-style-soft-shadow{box-shadow:0 16px 34px -28px rgba(15,23,42,.65)!important}
    .label-cell.label-style-no-shadow{box-shadow:none!important}
    @media print{
      .label-grid.label-sheet-compact,.label-grid.label-sheet-comfortable,.label-grid.label-sheet-scan{gap:var(--print-gap)}
      .label-cell.label-shape-square{border-radius:0!important;clip-path:none!important}
      .label-cell.label-shape-square .label-bar{border-radius:0!important}
      .label-cell:not(.label-shape-ticket)::before,.label-cell:not(.label-shape-ticket)::after{content:none!important;display:none!important}
    }

    dialog{border:0;border-radius:24px;padding:0;max-width:min(900px,calc(100vw - 28px));background:var(--surface);color:var(--text);box-shadow:0 28px 90px -46px rgba(0,0,0,.9)}dialog::backdrop{background:rgba(15,23,42,.58);backdrop-filter:blur(5px)}.modal-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:14px;align-items:center}.modal-body{padding:20px;color:var(--muted);line-height:1.58}.close-x{width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;font-size:1.1rem}
    .toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);opacity:0;pointer-events:none;background:#0f172a;color:#fff;border-radius:999px;padding:11px 16px;font-weight:850;box-shadow:0 20px 60px -35px #000;transition:.22s ease;z-index:80}.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
    @media(max-width:1480px){.main{grid-template-columns:minmax(360px,440px) minmax(480px,1fr) minmax(340px,430px);padding-inline:18px}}
    @media(max-width:1180px){.main{grid-template-columns:1fr 1fr}.preview-card{position:static}.center-stage{grid-column:1/-1;order:3}}
    @media(max-width:760px){.topbar-inner{align-items:center}.top-actions{justify-content:flex-end;flex:0 0 auto}.main{grid-template-columns:1fr;padding:12px}.row,.row3{grid-template-columns:1fr}.panel-body{padding:14px}.brand h1{white-space:normal}.type-grid,.mode-grid{grid-template-columns:1fr 1fr}.sheet-preview{width:100%}}
    @media print{
      @page{size:A4 portrait;margin:0}
      html,body{width:210mm;margin:0!important;padding:0!important;background:#fff!important}
      body>*:not(#wsPrintRoot){display:none!important}
      #wsPrintRoot{display:block!important;width:210mm;margin:0!important;padding:0!important;border:0!important}
      #wsPrintRoot>.sheet-page{display:block!important;position:relative;width:210mm!important;height:297mm!important;margin:0!important;padding:0!important;aspect-ratio:auto;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:hidden;break-after:page;page-break-after:always;box-sizing:border-box}
      #wsPrintRoot>.sheet-page:last-child{break-after:auto;page-break-after:auto}
      #wsPrintRoot .sheet-page-grid{display:grid;position:absolute;left:var(--sheet-margin)!important;top:var(--sheet-margin)!important;width:auto!important;height:auto!important;grid-template-columns:repeat(var(--sheet-columns),var(--label-print-width))!important;grid-template-rows:repeat(var(--sheet-rows),var(--label-print-height))!important;gap:var(--print-gap)!important}
      #wsPrintRoot .sheet-page-grid>.label-cell{width:var(--label-print-width)!important;height:var(--label-print-height)!important;min-width:var(--label-print-width)!important;min-height:var(--label-print-height)!important;padding:10px;border:1px dashed #999;box-sizing:border-box}
    }

    .mini-help{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:999px;border:1px solid rgba(47,142,223,.35);background:rgba(47,142,223,.10);color:var(--text);font-weight:900;font-size:.78rem;cursor:pointer;margin-left:6px;vertical-align:middle}
    .mini-help:hover{box-shadow:0 0 0 4px rgba(47,142,223,.10)}
    .help-pop{position:fixed;z-index:9999;max-width:320px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:var(--surface);box-shadow:0 20px 60px rgba(15,32,51,.18);color:var(--muted);font-size:.86rem;line-height:1.45;display:none}
    .help-pop strong{color:var(--text)}


    .help-dialog{
      width:min(94vw,1500px);
      max-width:min(94vw,1500px);
      height:min(90vh,950px);
      max-height:min(90vh,950px);
      overflow:hidden;
    }
    .help-dialog .modal-head{
      align-items:center;
    }
    .help-dialog .modal-body{
      padding:0;
      color:var(--text);
      height:calc(100% - 83px);
      overflow:hidden;
    }
    .help-dialog iframe{display:block;width:100%;height:100%;border:0;background:#fff}
    .help-dialog-actions{display:flex;align-items:center;gap:10px}
    .help-window-link,.context-help-link{border:0;background:transparent;color:var(--blue);font:inherit;font-weight:800;cursor:pointer;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--blue) 35%,transparent);text-underline-offset:3px}
    .help-window-link{min-height:40px;padding:8px 10px}
    .type-guidance{display:flex;align-items:center;justify-content:space-between;gap:12px}
    .context-help-link{flex:0 0 auto;min-height:38px;padding:6px}
    .help-layout{
      display:grid;
      grid-template-columns:270px 1fr;
      min-height:590px;
      max-height:calc(100vh - 150px);
    }
    .help-nav{
      border-right:1px solid var(--line);
      background:color-mix(in srgb,var(--surface) 78%,transparent);
      padding:16px;
      overflow:auto;
    }
    .help-nav button{
      width:100%;
      border:1px solid transparent;
      background:transparent;
      color:var(--text);
      text-align:left;
      border-radius:14px;
      padding:10px 11px;
      cursor:pointer;
      font:inherit;
      font-weight:850;
      display:grid;
      gap:2px;
      transition:.16s ease;
    }
    .help-nav button span{
      font-weight:650;
      color:var(--muted);
      font-size:.78rem;
      line-height:1.25;
    }
    .help-nav button:hover,
    .help-nav button.active{
      border-color:rgba(241,145,62,.45);
      background:rgba(241,145,62,.08);
      box-shadow:0 0 0 3px rgba(241,145,62,.08);
    }
    .help-content{
      overflow:auto;
      padding:clamp(18px,3vw,30px);
    }
    .help-page{display:none}
    .help-page.active{display:block}
    .help-page h3{
      font-size:clamp(1.45rem,2vw,2rem);
      letter-spacing:-.045em;
      margin:0 0 12px;
    }
    .help-page h4{
      margin:24px 0 8px;
      font-size:1.05rem;
    }
    .help-page p,
    .help-page li{
      color:var(--muted);
      line-height:1.58;
    }
    .help-page ul,
    .help-page ol{
      padding-left:1.2rem;
    }
    .help-card-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:12px;
      margin:16px 0;
    }
    .help-card{
      border:1px solid var(--line);
      border-radius:18px;
      padding:14px;
      background:color-mix(in srgb,var(--surface) 84%,transparent);
      box-shadow:0 14px 34px -30px rgba(15,23,42,.45);
    }
    .help-card strong{
      display:block;
      margin-bottom:5px;
      color:var(--text);
    }
    .help-mini{
      font-size:.88rem;
      color:var(--muted);
      line-height:1.45;
      display:block;
    }
    .help-example{
      border-left:4px solid var(--accent);
      background:rgba(241,145,62,.08);
      padding:12px 14px;
      border-radius:14px;
      color:var(--muted);
      margin:12px 0;
      line-height:1.5;
    }
    .help-warning{
      border:1px solid rgba(194,65,58,.28);
      background:rgba(194,65,58,.08);
      padding:13px 14px;
      border-radius:16px;
      color:var(--muted);
      margin:14px 0;
      line-height:1.5;
    }
    .help-good{
      border:1px solid rgba(43,170,114,.28);
      background:rgba(43,170,114,.08);
      padding:13px 14px;
      border-radius:16px;
      color:var(--muted);
      margin:14px 0;
      line-height:1.5;
    }
    .help-table{
      width:100%;
      border-collapse:separate;
      border-spacing:0;
      overflow:hidden;
      border:1px solid var(--line);
      border-radius:16px;
      margin:14px 0;
      font-size:.9rem;
    }
    .help-table th,
    .help-table td{
      padding:10px 12px;
      border-bottom:1px solid var(--line);
      vertical-align:top;
      text-align:left;
    }
    .help-table th{
      color:var(--text);
      background:rgba(47,142,223,.08);
    }
    .help-table tr:last-child td{border-bottom:0}
    .help-table td{color:var(--muted);line-height:1.45}
    @media(max-width:760px){
      .help-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0}
      .help-dialog .modal-head{padding:11px 13px}
      .help-dialog .modal-head h2{font-size:1rem}
      .help-dialog .modal-head .eyebrow{font-size:.66rem}
      .help-dialog .modal-body{height:calc(100% - 65px)}
      .help-window-link{display:none}
      .type-guidance{align-items:flex-start;flex-direction:column}
      .help-layout{
        grid-template-columns:1fr;
      }
      .help-nav{
        border-right:0;
        border-bottom:1px solid var(--line);
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
        max-height:240px;
      }
      .help-card-grid{
        grid-template-columns:1fr;
      }
    }

    /* Barcode-Werkstatt Plus 2.0: kompakter Hauptworkflow */
    html.dialog-open,html.dialog-open body{overflow:hidden}
    .topbar{position:sticky;top:0;z-index:100;align-self:start;box-shadow:0 8px 24px -22px rgba(15,23,42,.75)}
    .topbar-inner{max-width:1320px;padding:12px 20px 6px}
    .brand-copy p{margin:3px 0 0;color:var(--muted);font-size:.82rem}
    .tool-chips{max-width:1320px;margin:0 auto;padding:0 20px 10px;display:flex;gap:6px;flex-wrap:wrap}
    .tool-chips span{padding:4px 8px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font-size:.7rem;font-weight:800}
    .main{display:block;max-width:1320px;padding:18px 20px 34px}
    .primary-workspace{display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:18px;align-items:start}
    .creator-column{display:grid;gap:14px;min-width:0}
    .editor-panel .panel-head h2{font-size:1.05rem}
    .editor-panel .panel-body{gap:10px}
    .type-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
    .mode-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
    .type-btn,.mode-btn{min-height:42px;padding:8px 5px;display:flex;font-size:.74rem}
    .type-btn span:first-child,.mode-btn span:first-child{font-size:inherit}
    .content-picker-note{margin-top:0;padding:8px 10px;font-size:.78rem}
    .input-panel .panel-head{padding-block:14px 10px}
    .input-panel .panel-body{padding:14px;gap:10px}
    .input-panel textarea{min-height:105px}
    .preview-card{position:sticky;top:14px;padding:18px;min-width:0}
    .barcode-frame{margin:10px auto 12px;max-width:100%;overflow:hidden;padding:14px}
    .barcode-frame svg{max-width:100%!important}
    .preview-buttons{max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
    .preview-buttons .btn{padding:9px 10px;font-size:.78rem}
    .action-with-help{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px}
    .action-with-help .btn{height:100%}.action-with-help .mini-help{margin:0}
    .advanced-sections{display:grid;gap:10px;margin-top:16px}
    .workspace-accordion{background:var(--card);box-shadow:var(--shadow);border-radius:18px}
    .workspace-accordion>summary{font-size:1rem;padding:16px 18px}
    .workspace-accordion>.advanced-content{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px}
    .label-accordion>.advanced-content,.project-accordion>.advanced-content{grid-template-columns:1fr}
    .label-accordion{overflow:visible}
    .label-accordion>summary{border-radius:18px}
    .label-accordion[open]>summary{border-radius:18px 18px 0 0}
    .label-accordion>.advanced-content{border-radius:0 0 18px 18px;overflow:visible;min-width:0}
    .label-design-card{margin:0}
    .contrast-note{grid-column:1/-1;display:grid;gap:6px;padding:12px 14px;border:1px solid rgba(241,145,62,.34);border-radius:14px;background:rgba(241,145,62,.08);color:var(--muted);font-size:.84rem;line-height:1.45}
    .contrast-note strong{color:var(--text)}
    .contrast-warning{color:#8a4a12;font-weight:850}.contrast-ok{color:#16814f;font-weight:850}
    .print-accordion .sheet-panel{margin:0}
    @media(max-width:960px){
      .primary-workspace{grid-template-columns:1fr}.preview-card{position:static}
      .workspace-accordion>.advanced-content{grid-template-columns:1fr}
      .label-design-card{grid-template-columns:minmax(0,1fr)}
      .label-design-preview{grid-row:1;position:static}
      .label-design-settings{grid-row:2}
      .contrast-note{grid-column:auto}
    }
    @media(max-width:600px){
      .topbar-inner{align-items:center;flex-direction:row;padding:8px 10px;gap:8px}.top-actions{width:auto;flex:0 0 auto;flex-wrap:nowrap;justify-content:flex-end}
      .brand{flex:1 1 auto;min-width:0}.brand-copy p{display:none}.brand h1{font-size:clamp(.9rem,4.5vw,1.05rem);line-height:1.1;white-space:nowrap}.tool-logo{width:42px;height:42px}.tool-chips{display:none}
      .main{padding:10px}.type-grid,.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .preview-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}
      .preview-buttons .ws-tool-action{width:calc(100% - 8px);margin-inline:4px}
      .row,.row3{grid-template-columns:1fr}.panel-body{padding:13px}
      .barcode-frame{width:100%;overflow:auto}.workspace-accordion>summary{min-height:52px}
    }
    @media print{
      .creator-column,.topbar,.primary-workspace,.advanced-sections>details:not(.print-accordion),.print-accordion>summary,.print-accordion .settings-card{display:none!important}
      .advanced-sections,.print-accordion,.print-accordion>.advanced-content,.sheet-panel{display:block!important;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important}
    }

    /* Bedienfeinschliff: lokal lesbare, klar gegliederte Designbereiche */
    .label-design-card .field label,
    .optics-accordion .field label{font-size:.86rem;font-weight:800;line-height:1.35;color:var(--text)}
    .label-design-card input,.label-design-card select,
    .optics-accordion input,.optics-accordion select{font-size:.95rem}
    .label-design-card .field-note,.label-design-card .help-mini,
    .optics-accordion .field-note{font-size:.8rem;color:var(--muted);line-height:1.45}
    .label-design-settings>h3{font-size:1rem}
    .field-label-row{display:flex;align-items:center;gap:6px;width:max-content;max-width:100%}
    .field-label-row .mini-help{margin-left:0;flex:0 0 auto}
    .designer-group{border:0;border-top:1px solid color-mix(in srgb,var(--accent) 48%,var(--line));margin-top:8px;padding-top:2px;min-width:0}
    .designer-group>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;padding:11px 2px 9px;color:var(--text);font-size:.93rem;font-weight:900;letter-spacing:.065em;text-transform:uppercase}
    .designer-group>summary::-webkit-details-marker{display:none}
    .designer-group>summary::before{content:'▾';color:var(--accent);font-size:.82rem;transition:transform .18s ease}
    .designer-group:not([open])>summary::before{transform:rotate(-90deg)}
    .designer-group>summary:hover{color:var(--accent)}
    .designer-group>summary:focus-visible{color:var(--accent);outline:2px solid color-mix(in srgb,var(--accent) 75%,transparent);outline-offset:3px;border-radius:8px}
    .designer-group-content{display:grid;gap:10px;padding:2px 0 4px}
    .designer-group-content>.row{gap:10px}
    .label-title-pill{padding:2px 9px;max-width:min(100%,240px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .label-preview-stage .label-inner{padding-left:calc(var(--bar-side-w) + 12px);padding-right:calc(var(--bar-side-w) + 12px)}
    .label-preview-stage .label-cell .label-text{font-size:12px}

    .optics-accordion>.advanced-content{grid-template-columns:1fr}
    .barcode-optics-layout{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(380px,1.1fr);gap:18px;align-items:start;min-width:0}
    .barcode-optics-controls{display:grid;gap:10px;min-width:0}
    .barcode-optics-controls .settings-card{padding:12px 14px}
    .barcode-optics-controls .settings-card h3{font-size:.94rem;margin-bottom:10px}
    .barcode-optics-preview{display:grid;gap:10px;padding:14px;border:1px solid color-mix(in srgb,var(--blue) 28%,var(--line));border-radius:16px;background:color-mix(in srgb,var(--blue) 7%,transparent);min-width:0}
    .barcode-optics-preview-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
    .barcode-optics-preview-head strong{font-size:.94rem}.barcode-optics-preview-head span{font-size:.8rem;color:var(--muted)}
    .barcode-optics-stage{min-height:190px;padding:14px;display:grid;place-items:center;overflow:auto;border:1px dashed rgba(159,178,197,.7);border-radius:14px;background:#fff}
    #barcodeOpticsPreview{display:block;max-width:100%;height:auto}
    .contrast-note{display:flex;align-items:center;justify-content:flex-start;gap:8px;padding:8px 12px;font-size:.82rem}
    .contrast-note .mini-help{flex:0 0 auto;margin:0}
    .contrast-warning{padding:5px 8px;border-radius:8px;background:rgba(194,65,58,.1);color:#9b2c27}

    @media(max-width:960px){
      .barcode-optics-layout{grid-template-columns:1fr}
      .barcode-optics-preview{grid-row:1}
      .barcode-optics-controls{grid-row:2}
    }
    @media(max-width:600px){
      .barcode-optics-layout{min-width:0}.barcode-optics-stage{min-height:170px;padding:10px}
      .barcode-optics-preview-head{align-items:flex-start;flex-direction:column;gap:3px}
    }