/* fh-official.css — Official accounts (owner-approved mockups "Official Accounts" and "Official Account Settings", Look A · Seal).
   A square photo with a metal ring and a seal on its corner, a seal after the name, and a metal "Official · …" label.
   Silver: News Media · Gold: Public Figure · Turquoise: Government. Used on every dashboard and the public profile.
   Built by tools: the seals are the mockup's 12-point seal in each metal. */
.fh-off{border-radius:22%!important}
/* the ring and seal sit on the photo itself: a photo with no position of its own gets one (zero weight, so a photo
   placed with position:absolute keeps it) */
:where(.fh-off){position:relative}
.fh-off img{border-radius:19%!important}
/* the metal ring: drawn over the photo's edge, so nothing around it moves and nothing clips it */
.fh-off::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:var(--fho-ring,3px);pointer-events:none;z-index:1;
  background:linear-gradient(135deg,var(--fho1),var(--fho3) 45%,var(--fho4) 60%,var(--fho5));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
/* the seal on the photo's corner (photos 48 px and bigger) */
.fh-off.fh-off-seal::after{content:"";position:absolute;right:-7%;bottom:-7%;width:31%;height:31%;min-width:18px;min-height:18px;max-width:46px;max-height:46px;
  background:var(--fho-seal) center/contain no-repeat;filter:drop-shadow(0 1px 1.5px rgba(11,18,32,.3));pointer-events:none;z-index:2}
/* while the photo is official, its own blue check doesn't show (the seal says more) */
.fh-off .hd-ck,.fh-off .vck,.fh-off .fh-vbadge{display:none!important}
/* the seal after a name: a button that says what it means */
.fh-oseal{display:inline-flex;align-items:center;justify-content:center;flex:none;width:1.05em;height:1.05em;min-width:15px;min-height:15px;margin-left:.28em;padding:0;border:0;background:var(--fho-seal) center/contain no-repeat;
  vertical-align:-.14em;cursor:pointer;filter:drop-shadow(0 1px 1px rgba(11,18,32,.25));font-size:inherit}
.fh-oseal:focus-visible{outline:3px solid rgba(47,107,240,.45);outline-offset:2px;border-radius:50%}
/* "Official · News Media" */
.fh-ochip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px 0 8px;border-radius:999px;font:800 12px/1 Inter,system-ui,sans-serif;letter-spacing:.02em;white-space:nowrap;
  color:var(--fho8);background:linear-gradient(180deg,var(--fho1),var(--fho2) 55%,var(--fho4));border:1px solid var(--fho7);vertical-align:middle}
.fh-ochip svg{width:13px;height:13px;flex:none}
/* what a seal or blue check means, under it */
.fh-opop{position:absolute;z-index:2147482500;width:280px;max-width:calc(100vw - 32px);background:#0B1220;color:#fff;border-radius:14px;padding:14px 16px;box-shadow:0 18px 40px rgba(11,18,32,.35);
  font:500 13.5px/1.5 Inter,system-ui,sans-serif;text-align:left}
.fh-opop b{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:800;margin-bottom:4px}
.fh-opop b i{width:18px;height:18px;flex:none;background:var(--fho-seal) center/contain no-repeat}
.fh-opop small{display:block;color:#AEB7C7;margin-top:6px;font-size:12.5px}
.fh-vbadge{cursor:pointer}

.fh-off-news{--fho1:#FFFFFF;--fho2:#DCE1E8;--fho3:#9AA3AF;--fho4:#EEF1F4;--fho5:#B4BCC7;--fho7:#6F7987;--fho8:#2B3442;--fho-seal:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23FFFFFF%22/%3E%3Cstop%20offset%3D%22.35%22%20stop-color%3D%22%23DCE1E8%22/%3E%3Cstop%20offset%3D%22.55%22%20stop-color%3D%22%239AA3AF%22/%3E%3Cstop%20offset%3D%22.72%22%20stop-color%3D%22%23EEF1F4%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23B4BCC7%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon%20points%3D%2212.00%2C0.60%2014.48%2C2.73%2017.70%2C2.13%2018.79%2C5.21%2021.87%2C6.30%2021.27%2C9.52%2023.40%2C12.00%2021.27%2C14.48%2021.87%2C17.70%2018.79%2C18.79%2017.70%2C21.87%2014.48%2C21.27%2012.00%2C23.40%209.52%2C21.27%206.30%2C21.87%205.21%2C18.79%202.13%2C17.70%202.73%2C14.48%200.60%2C12.00%202.73%2C9.52%202.13%2C6.30%205.21%2C5.21%206.30%2C2.13%209.52%2C2.73%22%20fill%3D%22url%28%23g%29%22%20stroke%3D%22%236F7987%22%20stroke-width%3D%221%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M7.6%2012.4l3%203%205.9-6.3%22%20fill%3D%22none%22%20stroke%3D%22%231F2937%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E")}
.fh-off-pub{--fho1:#FFF7DB;--fho2:#F1D27E;--fho3:#B8892B;--fho4:#FBEAB3;--fho5:#CFA243;--fho7:#A47A22;--fho8:#4A3407;--fho-seal:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23FFF7DB%22/%3E%3Cstop%20offset%3D%22.35%22%20stop-color%3D%22%23F1D27E%22/%3E%3Cstop%20offset%3D%22.55%22%20stop-color%3D%22%23B8892B%22/%3E%3Cstop%20offset%3D%22.72%22%20stop-color%3D%22%23FBEAB3%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23CFA243%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon%20points%3D%2212.00%2C0.60%2014.48%2C2.73%2017.70%2C2.13%2018.79%2C5.21%2021.87%2C6.30%2021.27%2C9.52%2023.40%2C12.00%2021.27%2C14.48%2021.87%2C17.70%2018.79%2C18.79%2017.70%2C21.87%2014.48%2C21.27%2012.00%2C23.40%209.52%2C21.27%206.30%2C21.87%205.21%2C18.79%202.13%2C17.70%202.73%2C14.48%200.60%2C12.00%202.73%2C9.52%202.13%2C6.30%205.21%2C5.21%206.30%2C2.13%209.52%2C2.73%22%20fill%3D%22url%28%23g%29%22%20stroke%3D%22%23A47A22%22%20stroke-width%3D%221%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M7.6%2012.4l3%203%205.9-6.3%22%20fill%3D%22none%22%20stroke%3D%22%233B2A05%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E")}
.fh-off-gov{--fho1:#E6FFFB;--fho2:#99F0E2;--fho3:#14A79A;--fho4:#C8F7EF;--fho5:#3CC4B5;--fho7:#0E7F75;--fho8:#064E47;--fho-seal:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23E6FFFB%22/%3E%3Cstop%20offset%3D%22.35%22%20stop-color%3D%22%2399F0E2%22/%3E%3Cstop%20offset%3D%22.55%22%20stop-color%3D%22%2314A79A%22/%3E%3Cstop%20offset%3D%22.72%22%20stop-color%3D%22%23C8F7EF%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%233CC4B5%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon%20points%3D%2212.00%2C0.60%2014.48%2C2.73%2017.70%2C2.13%2018.79%2C5.21%2021.87%2C6.30%2021.27%2C9.52%2023.40%2C12.00%2021.27%2C14.48%2021.87%2C17.70%2018.79%2C18.79%2017.70%2C21.87%2014.48%2C21.27%2012.00%2C23.40%209.52%2C21.27%206.30%2C21.87%205.21%2C18.79%202.13%2C17.70%202.73%2C14.48%200.60%2C12.00%202.73%2C9.52%202.13%2C6.30%205.21%2C5.21%206.30%2C2.13%209.52%2C2.73%22%20fill%3D%22url%28%23g%29%22%20stroke%3D%22%230E7F75%22%20stroke-width%3D%221%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M7.6%2012.4l3%203%205.9-6.3%22%20fill%3D%22none%22%20stroke%3D%22%23053B36%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E")}
