#tool [hidden] { display: none !important; }
.bc-opts { border-top: 0; border-bottom: 1px solid var(--border); }
.bc-value { flex: 1 1 320px; }
.bc-input { height: 40px; padding: 0 12px; font: 15px var(--mono); color: var(--ink); background: var(--code-bg); border: 1px solid var(--border); border-radius: 10px; flex: 1; min-width: 0; width: 100%; }
.bc-input:focus { outline: none; border-color: var(--blue); box-shadow: var(--focus); }
.options input[aria-invalid="true"], .bc-input[aria-invalid="true"] { border-color: var(--danger); box-shadow: 0 0 0 3px var(--danger-tint); }
.bc-more { width: 100%; }
.bc-more > summary { display: none; }
.options .bc-more input[type="number"] { width: 72px; }
.bc-out { padding: 20px 16px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.bc-preview { max-width: 100%; min-height: 120px; display: grid; place-items: center; overflow: hidden; background: #fff; border: 1px solid var(--border); border-radius: var(--r-ctl); padding: 8px; }
.bc-preview svg { display: block; max-width: 100%; height: auto; }
.bc-preview.stale svg { opacity: .25; }
.bc-empty { margin: 0; padding: 24px; color: #5b6475; font-size: 14px; text-align: center; }
.bc-caption { margin: 0; min-height: 1.4em; text-align: center; }
.bc-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.bc-notes { padding: 0 16px 12px; }
.bc-notes p { margin: 0 0 4px; }
#tool > .notice { margin-top: 0; }
@media (max-width: 768px) {
  .bc-opts .field:first-child { width: 100%; }
  .bc-opts .field:first-child select { flex: 1; height: 44px; }
  .bc-value { width: 100%; flex-wrap: wrap; }
  .bc-input { height: 44px; font-size: 16px; }
  .bc-more > summary { display: block; font-weight: 600; cursor: pointer; padding: 6px 0; }
  .options .bc-more input[type="number"], .options .bc-more select { height: 44px; }
  .bc-out { padding: 14px 12px; }
  .bc-actions .btn { flex: 1 1 140px; justify-content: center; min-height: 44px; }
  .bc-notes { padding: 0 12px 12px; }
}
.options input.bc-input { width: 100%; height: 40px; font: 15px var(--mono); background: var(--code-bg); }
@media (max-width: 768px) { .options input.bc-input { height: 44px; font-size: 16px; } }
