/* Match only the existing hand-written magnifier banner, without changing post HTML.
   Its distinctive SVG geometry keeps these exceptions out of normal article text. */
div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  padding: 26px 28px !important;
  margin: 28px 0 !important;
  background-color: #080b10 !important;
  background-image: radial-gradient(ellipse at 8% 30%, #1d3556 0, transparent 58%), linear-gradient(135deg, #101722, #050608 85%) !important;
  border: 1px solid #879ab4 !important;
  border-top-color: #c0cddd !important;
  border-radius: 18px !important;
  box-shadow: inset 0 1px 0 #ffffff18, inset 0 -2px 0 #0008, 0 14px 30px #0006 !important;
  color: #f7f9fc !important;
}
div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) > div:has(> svg) {
  box-sizing: border-box;
  display: grid;
  place-items: center;
  flex: 0 0 82px !important;
  width: 82px !important;
  height: 82px !important;
  padding: 17px;
  border: 1px solid #8a9bb3;
  border-top-color: #dae6f7;
  border-radius: 24px;
  background: linear-gradient(145deg, #324765, #0b1422 70%) !important;
  box-shadow: inset 0 1px 1px #ffffff30, 0 8px 16px #0008;
  color: #f4cf91 !important;
  filter: none !important;
}
div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) > div:not(:has(> svg)) {
  flex: 1 1 0 !important;
  min-width: 0;
  font-size: 22px !important;
  line-height: 1.55 !important;
  font-weight: 800 !important;
  color: #f7f9fc !important;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) > div > span {
  display: inline-block;
  margin-top: 4px;
  font-size: 18px;
  font-weight: 700;
  color: #c5dcff !important;
}
@media (max-width: 600px) {
  div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) { gap: 16px !important; padding: 20px 16px !important; }
  div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) > div:has(> svg) { flex-basis: 58px !important; width: 58px !important; height: 58px !important; padding: 11px; border-radius: 18px; }
  div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) > div:not(:has(> svg)) { font-size: 19px !important; }
  div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) > div > span { font-size: 16px; }
}
@media (max-width: 380px) {
  div:has(> div > svg[viewBox="0 0 24 24"] > circle[cx="10.5"][r="6.7"]) { flex-direction: column; align-items: flex-start !important; }
}
