/* Banners — everything unique to this one page.
   Shared behaviour lives up the chain: base -> site -> family.
   Order: DESKTOP, then MOBILE, then MOBILE-LANDSCAPE. */
.wrap { max-width: 860px; margin: 0 auto; padding: 0 16px 60px; }
.aka { color: var(--mut); margin: 0 0 6px; font-style: italic; }
.sub { color: var(--mut); max-width: 62ch; }
.empty { color: var(--mut); padding: 22px; text-align: center; }
h2 { margin: 26px 0 12px; }
.banners { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.banner { position: relative; padding: 16px 16px 14px; border-radius: 12px; background: var(--card);
          border: 1px solid var(--line); border-top: 3px solid var(--gold); }

/* The whole head is the control that opens the detail — a card-sized target, not a link to hunt for. */
.banner-face { display: flex; gap: 12px; align-items: flex-start; width: 100%; text-align: left;
               background: none; border: 0; padding: 0; cursor: pointer; color: inherit; font: inherit; }
.banner .icon { flex: 0 0 auto; width: 34px; height: 34px; color: var(--gold); }
.banner .icon svg { width: 100%; height: 100%; display: block; }
.banner .words { display: block; min-width: 0; }
.banner .fam { display: block; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); }
.banner .label { display: block; font-family: 'Pirata One', Georgia, serif; font-size: 22px; color: var(--ink);
                 margin: 2px 0 6px; line-height: 1.15; }
.banner .stat { display: block; font-size: 15px; color: var(--gold); font-weight: 600; }

/* What it means, and the day it was flown. Closed until asked for. */
.banner .detail { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.banner .desc { margin: 0 0 8px; color: var(--mut); font-size: 14px; line-height: 1.5; }
.banner .won { margin: 0; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--mut); }
.banner .pcl-open { margin-top: 12px; }
.wall .banner { border-top-color: var(--line); opacity: .92; }
.wall .banner.open { opacity: 1; }
