#bfr-app { min-width: 0; }
#bfr-app p { overflow-wrap: anywhere; }
#bfr-app .input, #bfr-app .btn { min-height: 44px; }
#bfr-app .bfr-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
#bfr-app fieldset { min-width: 0; margin: 20px 0 14px; padding: 16px; border: 1px solid var(--border); border-radius: 16px; }
#bfr-app legend { font-weight: 700; padding: 0 6px; }
#bfr-app .bfr-number { display: flex; flex-wrap: wrap; align-items: end; gap: 12px 24px; margin-top: 16px; }
#bfr-app .bfr-number .field { flex: 1 1 160px; max-width: 260px; }
#bfr-app .bfr-check { display: flex; align-items: center; gap: 9px; min-height: 44px; cursor: pointer; }
#bfr-app input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--accent); }
#bfr-app .toolbar { margin: 14px 0; }
#bfr-app .bfr-preview { max-height: 560px; overflow: auto; }
#bfr-app .bfr-file { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--border); }
#bfr-app .bfr-file p { margin: 0; white-space: pre-wrap; }
#bfr-app .bfr-file span { display: block; font-size: .8rem; color: var(--muted); margin-bottom: 4px; }
.tool-layout:has(#bfr-app) .proc-tip-bubble { left: auto; right: -9px; }
.tool-layout:has(#bfr-app) .proc-tip-bubble::after { left: auto; right: 11px; }
@media (min-width: 560px) { #bfr-app .bfr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } #bfr-app .bfr-file { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; } }
@media (min-width: 1000px) { #bfr-app .bfr-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }