/* Referral page. Components (card, kpi, list, alert, skeleton) live in ../css/components.css */
.appbar .brandmark { white-space: nowrap; }
@media (min-width: 900px) { .topnav { flex-wrap: wrap; min-width: 0; flex: 1 1 auto; row-gap: 4px; } .topnav a { padding-inline: 10px; } }
.ref { display: grid; gap: var(--sp-6); padding-block-end: calc(var(--sp-12, 48px) + 64px); }
@media (min-width: 900px) { .ref { padding-block-end: var(--sp-12, 48px); } }
.ref__h2 { margin: 0 0 12px; font-size: var(--fs-title-3); font-weight: 800; line-height: 1.5; }
.ref__skel { min-height: 280px; }
.ref__skel-sm { min-height: 120px; }
.ref__card { display: grid; gap: 12px; }
.ref__code { margin: 0; font-size: var(--fs-title-2, 1.6rem); font-weight: 800; letter-spacing: .04em; direction: ltr; unicode-bidi: isolate; text-align: start; }
.ref__url { margin: 0; direction: ltr; unicode-bidi: isolate; text-align: start; overflow-wrap: anywhere; color: var(--text-2); font-size: var(--fs-footnote); }
.ref__share { margin: 0; line-height: 1.8; }
.ref__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ref__kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 0; }
@media (min-width: 800px) { .ref__kpis { grid-template-columns: repeat(3, 1fr); } }
.ref__kpis dd { margin: 0; font-size: var(--fs-headline); }
.ref__rules { display: grid; gap: 8px; margin: 0; }
.ref__rules div { display: flex; justify-content: space-between; gap: 12px; min-height: 28px; }
.ref__rules dt { color: var(--text-2); }
.ref__rules dd { margin: 0; font-weight: 700; text-align: end; }
.ref__list { margin: 0; padding: 0; list-style: none; min-height: 144px; }
.ref__list .list__text { display: grid; gap: 2px; }
.ref__more { display: grid; justify-items: center; margin-block-start: 12px; }
#refList, #promoList { min-height: 120px; }
.ref__promos { display: grid; gap: 12px; }
.promo { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; }
.promo__code { font-weight: 800; letter-spacing: .04em; direction: ltr; unicode-bidi: isolate; }
