/* Brooks' Bike Shop — Shop Cats corner widget (bottom-left; Patty B chat is bottom-right) */
#bbsCatsBtn {
  position: fixed; left: 18px; bottom: 18px; z-index: 9997;
  display: flex; align-items: center; gap: 9px;
  background: #fffdf7; border: 2px solid #eda11c; border-radius: 999px;
  padding: 5px 14px 5px 5px; cursor: pointer;
  box-shadow: 0 6px 22px rgba(30, 40, 30, .25);
  font-family: "Barlow", system-ui, sans-serif;
}
#bbsCatsBtn img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; display: block; }
#bbsCatsBtn .lbl { font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 600; font-size: 19px; letter-spacing: .4px; color: #22331f; line-height: 1; text-align: left; }
#bbsCatsBtn .sub { display: block; font-family: "Barlow", sans-serif; font-weight: 600; font-size: 11px; color: #b3261e; letter-spacing: .2px; margin-top: 2px; }
#bbsCatsBtn:hover { transform: translateY(-1px); }

#bbsCatsPanel {
  position: fixed; left: 18px; bottom: 84px; z-index: 9997;
  width: min(356px, calc(100vw - 36px)); max-height: 78vh; overflow-y: auto;
  background: #fffdf7; border: 1px solid #c3d6c6; border-radius: 18px;
  box-shadow: 0 18px 50px rgba(30, 40, 30, .35);
  font-family: "Barlow", system-ui, sans-serif; color: #22331f;
  padding: 14px 14px 12px;
}
#bbsCatsPanel[hidden] { display: none; }
#bbsCatsPanel h3 {
  font-family: "Barlow Condensed", sans-serif; font-size: 26px; margin: 0;
  letter-spacing: .5px; line-height: 1.05;
}
#bbsCatsPanel .shop { font-size: 12.5px; color: #5a6e58; margin: 2px 0 0; font-weight: 600; }
#bbsCatsClose {
  position: absolute; top: 8px; right: 10px; border: 0; background: none;
  font-size: 22px; line-height: 1; cursor: pointer; color: #5a6e58; padding: 4px;
}
.bbs-cats-votehead { font-family: "Barlow Condensed", sans-serif; font-size: 20px; margin: 14px 0 2px; letter-spacing: .4px; }
.bbs-cats-votenote { font-size: 12.5px; color: #5a6e58; margin: 0 0 8px; }
.bbs-tally-row { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.bbs-tally-row img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; flex: none; }
.bbs-tally-row .nm { width: 74px; flex: none; font-weight: 700; font-size: 13.5px; }
.bbs-tally-track { flex: 1; height: 10px; background: #eaf4ec; border-radius: 99px; overflow: hidden; }
.bbs-tally-fill { height: 100%; background: #eda11c; border-radius: 99px; transition: width .5s ease; }
.bbs-tally-row .ct { width: 26px; text-align: right; font-weight: 700; font-size: 13.5px; flex: none; }
.bbs-cats-fine { font-size: 11px; color: #7b8a78; margin: 6px 0 0; line-height: 1.45; }

.bbs-cat-card { border: 1px solid #cfe0d2; border-radius: 14px; overflow: hidden; margin-top: 12px; background: #fff; }
.bbs-cat-card .ph { width: 100%; height: 128px; object-fit: cover; display: block; }
.bbs-cat-card .bd { padding: 9px 11px 11px; }
.bbs-cat-card .nm { font-family: "Barlow Condensed", sans-serif; font-size: 21px; line-height: 1; }
.bbs-cat-card .ti { font-weight: 700; font-size: 12px; color: #b3261e; text-transform: uppercase; letter-spacing: .6px; margin-top: 2px; }
.bbs-cat-card .pe { font-size: 13px; line-height: 1.45; margin: 6px 0 9px; color: #33422f; }
.bbs-cat-card .row { display: flex; gap: 7px; }
.bbs-btn {
  border-radius: 999px; border: 1.5px solid #22331f; background: #fffdf7; color: #22331f;
  font-family: "Barlow", sans-serif; font-weight: 700; font-size: 13px; padding: 6px 13px; cursor: pointer;
}
.bbs-btn.vote { background: #eda11c; border-color: #eda11c; }
.bbs-btn.vote.mine { background: #22331f; color: #fffdf7; border-color: #22331f; }
.bbs-btn:active { transform: scale(.97); }

.bbs-cats-say {
  margin-top: 14px; background: #eaf4ec; border: 1px solid #cfe0d2; border-radius: 14px; padding: 10px 11px;
}
.bbs-cats-say .who { display: flex; align-items: center; gap: 7px; font-weight: 700; font-size: 13px; }
.bbs-cats-say .who img { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; }
.bbs-cats-say .txt { font-size: 13.5px; line-height: 1.5; margin-top: 5px; }
.bbs-cats-say .txt a { color: #b3261e; font-weight: 700; }
.bbs-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.bbs-chip {
  border: 1.5px solid #c3d6c6; background: #fffdf7; border-radius: 999px; cursor: pointer;
  font-family: "Barlow", sans-serif; font-size: 12.5px; font-weight: 600; padding: 5px 10px; color: #22331f;
}
.bbs-chip:hover { border-color: #eda11c; }
@media (max-width: 480px) {
  #bbsCatsPanel { bottom: 80px; }
}