/* ============================================================
   affiliates.css — the Affiliates page (#/affiliates): KPI row, the link card,
   weekly chart, network card, ledger. Builds on adm-* cards + charts.css.
   ============================================================ */
.affiliates { display: flex; flex-direction: column; gap: 22px; }
.rf-stats .stat { min-width: 0; }
.rf-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 960px) { .rf-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .affiliates .adm-stats { grid-template-columns: 1fr; } }

/* link card */
.rf-link { display: flex; flex-direction: column; gap: 14px; }
.rf-link__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.rf-link__head .adm-section__h { margin-bottom: 0; }
.rf-code { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.rf-code__l { font-family: var(--font-mono); font-size: 0.58rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-3); }
.rf-code__v { font-family: var(--font-mono); font-size: 1.55rem; letter-spacing: 0.12em; color: var(--text); padding: 6px 12px; border: 1px dashed var(--hairline-strong); border-radius: var(--r-lg); background: var(--fill-subtle); }
.rf-url { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border: 1px solid var(--hairline); border-radius: var(--r-lg); background: var(--fill-subtle); }
.rf-url__v { flex: 1 1 220px; min-width: 0; font-family: var(--font-mono); font-size: 0.76rem; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rf-label { box-shadow: none; }
.rf-how { margin: 4px 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; font-size: 0.82rem; color: var(--text-2); line-height: 1.45; }
.rf-how li::marker { font-family: var(--font-mono); font-size: 0.7rem; color: var(--text-4); }
.rf-how b { color: var(--text); font-weight: 600; }
.rf-seed { font-size: 0.74rem; }

/* network card */
.rf-net__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.rf-net__head .adm-section__h { margin-bottom: 4px; }
.rf-net__sub { font-size: 0.78rem; color: var(--text-3); }
.rf-depth { display: inline-flex; padding: 3px; border-radius: var(--r-pill); background: var(--fill-subtle); border: 1px solid var(--hairline); }
.rf-depth__b { border: 0; background: transparent; color: var(--text-2); font-size: 0.74rem; padding: 6px 12px; border-radius: var(--r-pill); cursor: pointer; transition: background .15s var(--ease), color .15s var(--ease); }
.rf-depth__b:hover { color: var(--text); }
.rf-depth__b.is-on { background: var(--text); color: var(--bg); font-weight: 600; }
.rf-net__stage { margin-top: 14px; border: 1px solid var(--hairline); border-radius: var(--r-xl); background: radial-gradient(60% 70% at 50% 50%, color-mix(in oklab, var(--accent) 7%, transparent), transparent 70%), var(--card-2); padding: 8px; min-height: 120px; }
.rf-empty { padding: 40px 16px; text-align: center; }

/* ledger */
.rf-row { grid-template-columns: minmax(170px, 1.8fr) 130px minmax(90px, 0.8fr) 110px 56px 56px 110px; }
.rf-row.is-hi { background: color-mix(in oklab, var(--accent) 10%, transparent); }
.rf-status { display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-2); white-space: nowrap; }
.rf-status i { width: 10px; height: 10px; border-radius: 50%; box-sizing: border-box; display: inline-block; }
.rf-status--pending i { border: 2px solid var(--text-3); }
.rf-status--active i { background: var(--accent); }
.rf-status--converted i { background: var(--gold); box-shadow: 0 0 0 2px var(--card-solid), 0 0 0 3.5px color-mix(in oklab, var(--gold) 70%, transparent); }
@media (max-width: 960px) { .rf-row { grid-template-columns: minmax(150px, 1.6fr) 120px minmax(80px, 1fr); } .rf-row > :nth-child(n+4) { display: none; } }
@media (max-width: 560px) { .rf-row { grid-template-columns: 1fr auto; } .rf-row > :nth-child(n+3) { display: none; } }

/* ---- the member's own card (everyone) + team board (manager+) ---- */
.rf-me { display: flex; flex-direction: column; gap: 14px; }
.rf-me__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.rf-me__head .adm-section__h { margin-bottom: 4px; }
.rf-me__sub { font-size: 0.78rem; color: var(--text-3); max-width: 46ch; }
.rf-me__stats { display: inline-flex; gap: 14px; }
.rf-me__stat { font-size: 0.78rem; color: var(--text-3); white-space: nowrap; }
.rf-me__stat b { font-family: var(--font-display); font-weight: 600; font-size: 1.15rem; color: var(--text); margin-right: 4px; }
.rf-me__stat--on b { color: var(--accent); }
.rf-me__list { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; }
.rf-me__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid var(--hairline); font-size: 0.84rem; }
.rf-me__who { display: flex; flex-direction: column; min-width: 0; }
.rf-me__who b { color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rf-me__who small { font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.06em; color: var(--text-3); }
.rf-me__when { color: var(--text-3); font-size: 0.76rem; white-space: nowrap; }
.rf-me__empty { padding: 10px 0 2px; color: var(--text-3); font-size: 0.82rem; }
.rf-note { font-size: 0.78rem; color: var(--text-4); }
.rf-h2 { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--text-3); margin: 6px 0 -8px 2px; }
.rf-grid--wide { grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.8fr); }
@media (max-width: 960px) { .rf-grid--wide { grid-template-columns: 1fr; } }
.rf-board { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.rf-board__row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--hairline); font-size: 0.84rem; }
.rf-board__row:first-child { border-top: 0; }
.rf-board__rank { font-family: var(--font-mono); font-size: 0.66rem; color: var(--text-4); }
.rf-board__name { color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rf-board__n { font-size: 0.74rem; color: var(--text-3); white-space: nowrap; }
.rf-board__n b { font-family: var(--font-display); font-weight: 600; color: var(--text); margin-right: 3px; }
.rf-board__n--on b { color: var(--accent); }
.rf-via { font-size: 0.78rem; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
