/* The download page's cards, on top of the account console's stylesheet
   (/account/styles.css: tokens, type, buttons, tags, alerts, footer). One card per
   platform, side by side, the button under each (owner 2026-10-20). */

.pf-sec { margin-top: 36px; scroll-margin-top: calc(var(--nav-h) + 16px); }
.pf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(172px, 1fr)); gap: 12px; }
.pf {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 22px 18px 20px; border: 1px solid var(--hair); border-radius: var(--radius);
  background: var(--lift);
  scroll-margin-top: calc(var(--nav-h) + 16px);
}
.pf-ic { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center;
  border-radius: 11px; background: var(--lift-2); color: var(--cream); }
.pf-svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; }
.pf-kind { margin-top: 18px; color: var(--c60); }
.pf-name { margin-top: 6px; font-family: var(--disp); font-weight: 600; font-size: 20px; letter-spacing: -0.02em;
  line-height: 1.2; color: var(--cream); }
.pf-meta { margin-top: 6px; font-family: var(--mono); font-size: 12px; color: var(--c60); overflow-wrap: anywhere; }
.pf-tag { margin-top: 10px; }
.pf-act { display: flex; flex-direction: column; align-items: stretch; gap: 10px; width: 100%; margin-top: auto; padding-top: 22px; min-height: 88px; }
.pf-btn { width: 100%; justify-content: center; text-align: center; }
.pf-sha { align-self: center; font-family: var(--mono); font-size: var(--fs-label); letter-spacing: var(--track); }
.pf-off .pf-name, .pf-off .pf-ic { color: var(--c60); }
.pf-off .pf-btn { pointer-events: none; opacity: 0.6; }
.pf-grid > .loading { padding: 48px 0; justify-content: flex-start; }
.pf-alert { grid-column: 1 / -1; }
.pf-foot { margin-top: 28px; }

@media (max-width: 760px) {
  .pf-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
  .pf { padding: 18px 16px 16px; }
  .pf-sec, .pf { scroll-margin-top: 120px; }
}