/* The affiliate page, part "finale": the board of levels on the night. The section, its head, its calls, the card's
   panel and the motto are the kit's (.k-finale, .k-finale-h, .k-finale-sub, .k-btns, .k-btn-light, .k-btn-glass,
   .k-finale-art, .k-navy-card, .k-motto); this file holds the line under the calls, the external glyph in the first
   call and the board: a caption, then one row per level (its number, its name, its share and its Apply), the last row
   in the board's amber. The night is the same in both themes, so the colours are the kit's fixed navy tokens. On a
   phone the share goes under the name. Nothing moves. */

.pg-affiliate .af-fin .k-btn{gap:9px}
.pg-affiliate .af-fin-fine{max-width:56ch;margin:20px auto 0;font:400 14.5px/1.55 var(--sans);color:var(--k-navy-mute);text-wrap:pretty}
.pg-affiliate .af-fin-card{max-width:620px;margin:0 auto 60px;padding:8px 24px 6px}
.pg-affiliate .af-fin-cap{display:grid;grid-template-columns:44px minmax(0,1fr) 180px 96px;gap:16px;margin:0;padding:12px 0;border-bottom:1px solid var(--k-navy-line);font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--k-navy-mute)}
.pg-affiliate .af-fin-cap span:first-child{grid-column:1/3}
.pg-affiliate .af-fin-rows li{display:grid;grid-template-columns:44px minmax(0,1fr) 180px 96px;align-items:center;gap:16px;min-height:64px;padding:10px 0;border-bottom:1px solid #1D2147}
.pg-affiliate .af-fin-rows li:last-child{border-bottom:0}
.pg-affiliate .af-fin-n{font:500 13px/1 var(--mono);letter-spacing:.12em;color:var(--k-navy-eye)}
.pg-affiliate .af-fin-l{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;min-width:0;font:600 18px/1.25 var(--sans);color:#FFFFFF}
.pg-affiliate .af-fin-l small{font:500 11.5px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--k-amber)}
.pg-affiliate .af-fin-v{font:500 15px/1.3 var(--mono);color:var(--k-on-navy);white-space:nowrap}
.pg-affiliate .af-fin-go .af-fin-v{color:var(--k-amber)}
.pg-affiliate .af-fin-a{display:inline-flex;align-items:center;justify-content:flex-end;gap:7px;justify-self:end;font:600 15px/1 var(--sans);color:#FFFFFF;text-decoration:none}
.pg-affiliate .af-fin-a svg{display:block;flex:none;width:16px;height:16px;color:var(--k-navy-eye)}
.pg-affiliate .af-fin-a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.pg-affiliate .af-fin-a:focus-visible{outline-color:#FFFFFF}

@media (max-width:760px){
  .pg-affiliate .af-fin-fine{font-size:14px}
  .pg-affiliate .af-fin-card{margin-bottom:44px;padding:6px 16px 4px}
  .pg-affiliate .af-fin-cap{grid-template-columns:28px minmax(0,1fr) auto;gap:12px}
  .pg-affiliate .af-fin-cap span:last-child{display:none}
  .pg-affiliate .af-fin-rows li{grid-template-columns:28px minmax(0,1fr) auto;grid-template-rows:auto auto;row-gap:4px;column-gap:12px;min-height:72px}
  .pg-affiliate .af-fin-n{grid-row:1/span 2}
  .pg-affiliate .af-fin-l{grid-column:2;grid-row:1;font-size:16.5px}
  .pg-affiliate .af-fin-v{grid-column:2;grid-row:2;font-size:13.5px;white-space:normal}
  .pg-affiliate .af-fin-a{grid-column:3;grid-row:1/span 2}
}