.barcode-tool{display:grid;gap:16px}.barcode-surface{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(0,1.1fr);gap:16px;align-items:start}.barcode-preview-card,.barcode-controls,.barcode-output{border:1px solid rgba(0,109,119,.14);border-radius:8px;background:#fbfefe;padding:14px}.barcode-preview-card{display:grid;gap:12px;justify-items:center}.barcode-canvas-wrap{display:grid;width:100%;min-height:220px;align-items:center;justify-items:center;border-radius:8px;background:var(--mist);padding:14px;overflow:auto}.barcode-canvas-wrap canvas{display:block;max-width:100%;height:auto;border-radius:4px;background:#fff}.barcode-controls,.barcode-output{display:grid;gap:14px}.barcode-field{display:grid;gap:8px;color:var(--ink);font-weight:800}.barcode-input,.barcode-select{width:100%;min-height:44px;border:1px solid rgba(0,109,119,.18);border-radius:8px;background:#fbfefe;color:var(--ink);padding:10px 12px;font:.95rem/1.45 ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace}.barcode-input:focus,.barcode-select:focus{outline:none;box-shadow:var(--tool-focus)}.barcode-actions{display:flex;flex-wrap:wrap;gap:10px}.barcode-actions .button{min-height:44px}.barcode-meta{margin:0;border-radius:8px;padding:12px;background:#edf6f9db;color:var(--muted);font-weight:800}.barcode-meta.is-valid{background:#83c5be38;color:var(--deep-teal)}.barcode-meta.is-invalid{background:var(--peach);color:#613224}.barcode-output h3{margin:0;color:var(--ink);font-size:1rem}.barcode-value{width:100%;min-height:96px;resize:vertical;border:1px solid rgba(0,109,119,.14);border-radius:8px;background:var(--mist);color:var(--ink);padding:14px;font:.92rem/1.55 ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace;white-space:pre-wrap}@media (max-width: 900px){.barcode-surface{grid-template-columns:1fr}}@media (max-width: 720px){.barcode-preview-card,.barcode-controls,.barcode-output{padding:12px}.barcode-actions{display:grid;grid-template-columns:1fr}.barcode-canvas-wrap{min-height:180px}}