/* SSFD card BACK: same landscape size/rotation as .ssfd-front. The lockup alone, centred. */
.ssfd-back{--w:min(760px,calc(100vw - 32px),calc((100svh - 32px) * 1.72));
  position:relative;box-sizing:border-box;width:var(--w);aspect-ratio:1.72;container-type:inline-size;overflow:hidden;
  display:grid;place-items:center;border-radius:clamp(18px,3.4cqw,30px);border:1px solid rgba(255,255,255,.14);
  background:radial-gradient(90% 80% at 50% 50%,#04112b,#010818 70%);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 18px 40px -18px rgba(0,0,0,.55)}
.ssfd-back::before{content:"";position:absolute;inset:0 0 auto;height:max(.7cqw,4px);background:#0067fc}
.ssfd-back-logo{display:block;width:72cqw;height:auto;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 90%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 90%,transparent);
  mask-composite:intersect}
.ssfd-back-host{position:fixed;inset:0;display:grid;place-items:center;overflow:hidden}
@media (orientation:portrait) and (max-width:760px){
  .ssfd-back-host .ssfd-back{--w:min(760px,calc(100svh - 36px),calc((100vw - 24px) * 1.72));position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(90deg)}
}