/* Brands and languages (module 33). Prefix br-. */
.br-tabs { align-self: flex-start; }
.br-saved { margin: 0; }
.br-ref, .br-ref b, td.br-ref code { white-space: nowrap; }
.br-who { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.br-who > span { display: flex; flex-direction: column; min-width: 0; }
.br-who small { color: var(--muted); font-size: 11.5px; }
.br-mark { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; color: #fff; font-weight: 800; font-size: 15px; flex: 0 0 auto; box-shadow: inset 0 -2px 0 rgba(0,0,0,.12); }
.br-mark.big { width: 56px; height: 56px; font-size: 24px; border-radius: 12px; }
.br-mark.img { background: #fff; border: 1px solid #d8e2ec; overflow: hidden; }
.br-mark.img img { width: 100%; height: 100%; object-fit: contain; }
.br-langs { display: inline-flex; flex-wrap: wrap; gap: 3px; }
.br-lang { display: inline-block; font-size: 10.5px; font-weight: 700; padding: 1px 5px; border-radius: 3px; background: #eef3f8; color: #345; border: 1px solid #d5e0eb; }
.br-lang.def { background: #1a7fe0; border-color: #1a7fe0; color: #fff; }
.br-sparkcell { min-width: 110px; }
.br-sparkcell .px-spark, .br-sparkcell svg { display: block; max-width: 110px; }
.br-sparkcell small, .br-covcell small { color: var(--muted); font-size: 11px; }
.br-minimeter { display: inline-block; width: 64px; height: 6px; border-radius: 4px; background: #e6edf4; vertical-align: middle; margin-right: 6px; overflow: hidden; }
.br-minimeter.wide { width: 110px; }
.br-minimeter i { display: block; height: 100%; background: linear-gradient(90deg, #4fc59a, #12a079); border-radius: 4px; }
.br-minimeter i.warn { background: linear-gradient(90deg, #f1c35a, #d99a06); }
.br-pills { white-space: nowrap; }
.br-approval form { margin-top: 10px; }
.br-decide { max-width: 560px; }
.br-btnrow { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.br-btnrow form { margin: 0; }
.br-mix { margin: 10px 0 2px; }
.br-tplgrid { border-top: 1px solid #e0e7ed; padding-bottom: 8px; }
.br-tplgrid .br-help { padding: 0 12px; }
.br-matrix th.c, .br-matrix td.c, .ct-tbl th.c, .ct-tbl td.c { text-align: center; }
.br-ok { color: #12a079; }
.br-mut { color: #9aa9b8; }
.br-miss { color: #c58a00; }
.br-help { color: var(--muted); font-size: 12.5px; margin: 8px 0 0; }
.br-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.br-two > * { min-width: 0; }
.br-gaps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.br-h4 { font-size: 12.5px; margin: 0 0 8px; color: #334e68; text-transform: uppercase; letter-spacing: .03em; }
.br-h4 .sub { text-transform: none; letter-spacing: 0; color: var(--muted); font-weight: 500; }
.br-sub { border-top: 2px solid #e0e7ed; }
.br-wraptbl td, .br-wraptbl td .sub { white-space: normal; overflow-wrap: anywhere; }
.br-profile { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.br-profile > div { display: flex; flex-direction: column; min-width: 0; }
.br-profile small { color: var(--muted); overflow-wrap: anywhere; }
.br-sig { margin-top: 8px; }
.br-sig small { color: var(--muted); }
.br-sig pre, .br-pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; margin: 4px 0 0; background: #f6f9fc; border: 1px solid #e2e9f0; border-radius: 5px; padding: 8px 10px; }
.br-pre.mut { background: #fff; color: #334e68; }
.br-honest { margin-bottom: 10px; }
.br-details { margin-top: 10px; }
.br-details summary { cursor: pointer; display: inline-flex; list-style: none; }
.br-details summary::-webkit-details-marker { display: none; }
.br-details[open] > summary { margin-bottom: 10px; }
.br-details.right { text-align: left; }
.br-details.right[open] { min-width: min(560px, 80vw); }
.br-note { margin-top: 4px; color: #334e68; overflow-wrap: anywhere; }
.br-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.br-fieldset legend { font-weight: 700; font-size: 12.5px; margin-bottom: 6px; color: #334e68; }
.br-fieldset .hint { display: block; color: var(--muted); font-size: 12px; margin-top: 4px; }
.br-checks { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.br-steps { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: 13px; }
.br-langblock { border: 1px solid #e2e9f0; border-radius: 6px; padding: 10px 12px; display: grid; gap: 10px; }
.br-preview { border: 1px solid #d8e2ec; border-radius: 8px; overflow: hidden; font-size: 12.5px; }
.br-preview .top { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid #e6edf4; }
.br-preview .top .br-mark { width: 24px; height: 24px; font-size: 12px; }
.br-preview .hero { background: var(--c); color: #fff; padding: 16px 14px; }
.br-preview .hero h4 { margin: 0 0 6px; font-size: 16px; }
.br-preview .hero p { margin: 0 0 10px; opacity: .92; }
.br-preview .search { display: block; background: #fff; color: #607386; border-radius: 4px; padding: 6px 8px; }
.br-preview .need { padding: 10px 14px; display: grid; gap: 4px; }
.br-preview .opt { color: #0d6e57; }
.br-meterlink { display: block; color: inherit; text-decoration: none; border-radius: 6px; }
.br-meterlink:hover { background: #f4f8fc; }
.br-key code { font-size: 11.5px; white-space: nowrap; }
.br-wrap, .ct-tbl td.br-wrap { white-space: normal; overflow-wrap: anywhere; min-width: 140px; }
.br-ta { width: 100%; min-width: 180px; min-height: 40px; resize: vertical; font: inherit; }
.br-strings td { vertical-align: top; }
.br-foot { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.br-fields td { vertical-align: top; }
.br-trcell input { width: 100%; min-width: 150px; margin-bottom: 4px; }
.br-trcell.gap { background: #fffaf0; }
.br-bulk { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid #e0e7ed; }
.br-bulk select { max-width: 280px; min-width: 0; }
.br-tick { width: 32px; }
.br-inline { margin-top: 12px; }
.br-gaplist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.br-gaplist li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 11px; border-radius: 6px; background: #fff8e8; border-left: 3px solid #d99a06; }
.br-gaplist li.bad { background: #fdeff1; border-left-color: #d6334b; }
.br-gaplist li i { color: #b07a00; font-size: 16px; margin-top: 1px; }
.br-gaplist li.bad i { color: #c02a40; }
.br-gaplist small { display: block; color: #5b6b7f; margin-top: 2px; }
.br-region.on { box-shadow: inset 0 3px 0 #12a079; }
.br-clock { display: flex; align-items: baseline; gap: 10px; margin: 2px 0 10px; }
.br-clock b { font-size: 30px; line-height: 1; color: var(--c); letter-spacing: -.02em; }
.br-clock span { color: var(--muted); font-size: 12px; }
.br-sun { display: grid; gap: 6px; overflow-x: auto; position: relative; padding-bottom: 4px; }
.br-sunrow { display: grid; grid-template-columns: 120px repeat(24, minmax(14px, 1fr)); gap: 2px; align-items: center; min-width: 520px; }
.br-sunrow .lbl { font-size: 12px; font-weight: 700; color: #334e68; }
.br-sunrow .h { font-size: 10.5px; color: var(--muted); }
.br-sunrow .c { height: 22px; border-radius: 3px; background: #eef2f6; position: relative; }
.br-sunrow .c.on { background: var(--c); opacity: .85; }
.br-sunrow .c.now { outline: 2px solid #0b2a4a; outline-offset: 1px; }
.br-regionform { text-align: left; }
.br-late { color: #b4283c; }
.br-notes { white-space: normal; overflow-wrap: anywhere; line-height: 1.55; }
.br-acknote { margin-top: 10px; padding: 8px 10px; background: #effaf5; border-left: 3px solid #12a079; border-radius: 4px; }
.br-rowform { display: inline-flex; gap: 6px; align-items: center; }
.br-rowform select { max-width: 220px; min-width: 0; }
.br-link { display: inline-flex; gap: 5px; align-items: center; margin-top: 8px; font-size: 12.5px; font-weight: 700; }
.br-mini { list-style: none; margin: 0; padding: 8px 12px; border-top: 1px solid #e0e7ed; display: grid; gap: 4px; font-size: 12.5px; }
.br-covgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 18px; }
.br-covgrid > * { min-width: 0; }

.br-sun.mini { padding: 10px 12px 4px; gap: 3px; }
.br-sun.mini .br-sunrow { grid-template-columns: 78px repeat(24, minmax(6px, 1fr)); min-width: 0; gap: 1px; }
.br-sun.mini .c { height: 12px; border-radius: 2px; }
.br-sun.mini .lbl { font-size: 11px; font-weight: 600; }

@media (max-width: 760px) {
    .br-two, .br-covgrid { grid-template-columns: minmax(0, 1fr); }
    .br-ta, .br-trcell input { min-width: 140px; }
    .br-clock b { font-size: 24px; }
}
