/* Owner 12.11. («mit click muss auch aussen der request gemacht werden koennen»; «nur das hauptprofilbild»): the guest creator
   card on /creators/ — her one picture (her best feet-checked photo in real sizes) and under it «Send request» (the
   request-first composer addressed to her). Tokens only; the picture keeps its 4:5 portrait. */
.pn-sellercard:has(.fpg-req) { aspect-ratio: auto; display: flex; flex-direction: column; background: var(--surface); }
.pn-sellercard:has(.fpg-req) .pn-card-link { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--ph-media, var(--sunken)); }
.pn-sellercard:has(.fpg-req) .pc-scard__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
html body.pc-root .pn-sellercard .pc-btn.fpg-req { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; width: calc(100% - 16px);
  min-width: 0; height: 40px; min-height: 40px; margin: auto 8px 8px; padding: 0 10px; border-radius: 999px; font: 600 14px/1 var(--font-sans, inherit); white-space: nowrap; }
.pn-sellercard .fpg-req span { overflow: hidden; text-overflow: ellipsis; }
.pn-sellercard .fpg-req svg { flex: none; width: 18px; height: 18px; }
/* owner 12.11. («das soll ein Modal sein»): the request sheet over /creators/ (assets/js/fp_reqmodal.js) — the shared dialog look
   (fp-system.css §12: white, soft shadow, no edges, ink scrim); a centred 560 px dialog on desktop, a bottom sheet on phones */
body.pc-root dialog.fp-rqm { width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); margin: auto; padding: 0; overflow-y: auto; overscroll-behavior: contain; }
body.pc-rqm-lock, body.fp-rqm-open { overflow: hidden; }
.fp-rqm__x { position: sticky; top: 12px; float: right; z-index: 3; width: 44px; height: 44px; margin: 12px 12px -56px 0; border: 0; border-radius: 50%;
  display: grid; place-items: center; background: var(--sunken, var(--surface-2)); color: var(--ink); cursor: pointer; }
.fp-rqm__x:focus-visible { outline: 2px solid var(--focus-ring, var(--accent)); outline-offset: 2px; }
.fp-rqm__body { padding: 20px 20px 0; }
.fp-rqm__wait { display: flex; justify-content: center; gap: 6px; margin: 64px 0; }
.fp-rqm__wait span { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: fp-rqm-dot 1s ease-in-out infinite; }
.fp-rqm__wait span:nth-child(2) { animation-delay: .15s; } .fp-rqm__wait span:nth-child(3) { animation-delay: .3s; }
@keyframes fp-rqm-dot { 0%, 100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-4px); } }
@media (max-width: 699.98px) {
  body.pc-root dialog.fp-rqm { width: 100vw; max-width: 100vw; max-height: 92dvh; margin: auto 0 0; border-radius: 20px 20px 0 0; }
  .fp-rqm__body { padding: 16px 16px 0; }
}
@media (prefers-reduced-motion: reduce) { .fp-rqm__wait span { animation: none; opacity: .6; } }
