/* Brand logo tiles (Sean, variant A): every brand gets the same square.
   Default 44×44, radius 10, white, hairline #e5e5ea. Set --bt to scale. */
.btile{
  --bt:44px;
  flex:none;
  width:var(--bt);height:var(--bt);
  border-radius:calc(var(--bt) * 10 / 44);
  background:#fff;
  box-shadow:inset 0 0 0 1px #e5e5ea;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  color:#8e8e93;
  font-weight:600;
  font-size:calc(var(--bt) * 16 / 44);
  line-height:1;
}
.btile img{max-width:78%;max-height:78%;width:auto;height:auto;object-fit:contain;display:block}
/* 44px list tiles: 10px to the row hairline. Scaled tiles set --bt and skip this.
   Known list rows drop their own block padding so 10+10 does not stack. Name gap stays ~12px. */
.btile:not([style*="--bt"]){margin-block:10px}
.bxr:has(.btile:not([style*="--bt"])),
.row:has(> .btile:not([style*="--bt"])){padding-block:0}
/* Tables and named-row cells: tile + name are inline flex (gap 12px). Cell/row
   padding (~10–12px) is enough for a ~64px row; no extra tile margin-block. */
td .btile:not([style*="--bt"]),
.bn .btile:not([style*="--bt"]),
.bk-brand .btile:not([style*="--bt"]),
.bk-row .btile:not([style*="--bt"]),
.sb-row .btile:not([style*="--bt"]){margin-block:0}
.bn,.bk-brand{display:flex;align-items:center;gap:12px;min-width:0}
/* Tile next to a name in list rows: always 12px, and the first track matches a 56px tile. */
.hbh:has(> .btile),.ih:has(> .btile),.dc-brand:has(> .btile),.bxn:has(> .btile){gap:12px}
.hbh:has(> .btile[style*="--bt:56"]),.st-row .hbh:has(> .btile){grid-template-columns:56px minmax(0,1fr) auto}

/* Brand card (2026-10-31): desktop hover popover + phone bottom sheet, opened from any [data-bn]. */
[data-bn]{cursor:pointer}
.bcard{--c-bg:var(--sheet,var(--card,#fff));--c-ln:var(--line-2,var(--line,#e5e5ea));background:var(--c-bg);color:var(--ink,#111113);display:grid;gap:12px;font-size:14px;line-height:20px}
.bc-pop{position:fixed;z-index:80;width:min(300px,calc(100vw - 16px));padding:14px;border-radius:16px;box-shadow:0 0 0 1px var(--c-ln),0 1px 2px rgb(0 0 0/6%),0 10px 30px rgb(0 0 0/14%)}
.bc-pop[hidden]{display:none}
.bc-hd{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:center;min-width:0}
.bc-hd .btile{margin:0;cursor:default}
.bc-m{min-width:0;display:grid;gap:1px}
.bc-m b{font-size:16px;line-height:21px;font-weight:600;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-m span{font-size:13px;line-height:18px;color:var(--muted,#6e6e73);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-f{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.bc-f span{min-width:0;border-radius:12px;box-shadow:inset 0 0 0 1px var(--c-ln);padding:8px 10px;display:grid;gap:1px}
.bc-f small{font-size:11.5px;line-height:15px;color:var(--muted,#6e6e73);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-f b{font-size:14px;line-height:19px;font-weight:600;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-l{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--c-ln);color:inherit;text-decoration:none;font-weight:500;min-width:0}
.bc-l span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bc-l svg{width:14px;height:14px;flex:none;color:var(--faint,#aeaeb2)}
.bc-l:hover{background:var(--hover,#f7f7fa)}
.bc-n{margin:0;font-size:12px;line-height:16px;color:var(--muted,#6e6e73)}
.bc-wrap{position:fixed;inset:0;z-index:90}
.bc-wrap[hidden]{display:none}
.bc-scrim{position:absolute;inset:0;background:rgb(0 0 0/38%);opacity:0;transition:opacity .2s}
.bc-sheet{position:absolute;left:0;right:0;bottom:0;max-width:520px;margin:0 auto;border-radius:22px 22px 0 0;padding:8px 16px calc(18px + env(safe-area-inset-bottom,0px));box-shadow:0 -8px 30px rgb(0 0 0/18%);transform:translateY(102%);transition:transform .22s ease}
.bc-wrap.on .bc-scrim{opacity:1}.bc-wrap.on .bc-sheet{transform:none}
.bc-grab{justify-self:center;width:36px;height:5px;border-radius:3px;background:var(--c-ln)}
.bc-x{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;border:0;background:var(--soft,var(--fill,#f2f2f7));color:var(--muted,#6e6e73);display:grid;place-items:center;cursor:pointer;font-size:13px}
.bc-sheet .bc-b{display:grid;gap:12px}
.bc-sheet .bc-hd{padding-right:40px}
@media (prefers-reduced-motion:reduce){.bc-scrim,.bc-sheet{transition:none}}