.qpn{display:flex;justify-content:flex-end;align-items:center;gap:var(--gap,4px);position:relative}
.qpn>a,.qpn>[aria-disabled]{display:grid;place-items:center;width:24px;height:28px;color:var(--ink,#191919);text-decoration:none}
.qpn>[aria-disabled]{opacity:.35;cursor:default}
.qpn svg{width:var(--icon_size,14px);height:var(--icon_size,14px);fill:none;stroke:currentColor;stroke-width:1.6}
.qpn>a:hover svg{opacity:.6}
.qpn-panel,.qpn-tip{position:absolute;z-index:10;visibility:hidden;opacity:0;transition:opacity .18s ease}
.qpn-panel{top:100%;right:0;padding-top:12px;width:min(var(--card_width,240px),90vw)}
.qpn-card{display:flex;align-items:center;background:var(--surface,#fff);color:var(--title,#333);border-radius:var(--radius,12px);box-shadow:0 0 4px #0003;overflow:hidden}
.qpn .qpn-card img{width:37.5%;height:auto;flex:none;display:block}
.qpn-card strong{padding:12px 15px;font-size:14px;line-height:1.45}
.qpn-tip{bottom:calc(100% + 4px);background:#191919;color:white;border-radius:7px;padding:8px 14px;font-size:12px;white-space:nowrap}
.qpn-tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:#191919}
.qpn>a:is(:hover,:focus-visible) :is(.qpn-panel,.qpn-tip){visibility:visible;opacity:1}