/* ═══════════════════════════════════════════════════════════════════
   Zilla Engine · B+ broadcast · Phase 7B
   Registration (#13 · boards 69–72): landing, form, my applications
   Tokens only (tokens.css); every class bp- prefixed. Loaded after bp-media.css.
   ═══════════════════════════════════════════════════════════════════ */

.bp-regpage .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bp-rlate { color: var(--champion); }

/* ═══════════════ Landing hero (accent) ═══════════════ */
.bp-rhero { position: relative; overflow: hidden; background: var(--league-accent); color: var(--ink);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 38px), 0 100%); padding-bottom: 38px; }
.bp-rhero__ghost { position: absolute; right: -20px; top: -10px; font-size: 360px; line-height: 1; color: rgba(0,0,0,.09); white-space: nowrap; pointer-events: none; }
.bp-rhero__in { position: relative; display: flex; justify-content: space-between; gap: 30px; padding: 60px var(--gutter) 40px; }
.bp-rhero__main { min-width: 0; max-width: 820px; }
.bp-rhero__kicker { font-size: 15px; margin: 0 0 6px; opacity: .8; }
.bp-rhero__title { color: var(--ink); font-size: 112px; line-height: .88; margin: 0; text-wrap: balance; overflow-wrap: anywhere; }
.bp-rhero__comp { font-size: 16px; margin: 12px 0 0; opacity: .8; }
.bp-rhero__pitch { font-size: 18px; line-height: 1.5; margin: 14px 0 0; max-width: 600px; }
.bp-rhero__cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }
.bp-rhero .bp-btn.is-disabled { opacity: .6; cursor: default; }
.bp-rhero__stats { display: flex; gap: 8px; align-self: center; flex: none; }
.bp-rstat { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 150px; height: 114px; background: var(--black); color: var(--white); }
.bp-rstat__n { font-size: 60px; line-height: .9; }
.bp-rstat__l { font-size: 11px; color: var(--muted); }

/* Other open competitions */
.bp-rothers { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px; }
.bp-rother { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; background: var(--surface); border-left: 4px solid var(--league-accent); }
.bp-rother:hover { background: var(--surface-2); }
.bp-rother__name { font-size: 22px; line-height: 1; }
.bp-rother__meta { font-size: 12px; color: var(--muted); }

/* How it works */
.bp-rsteps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.bp-rstep { display: flex; flex-direction: column; gap: 8px; padding: 20px 20px 22px; background: var(--surface); border-top: 4px solid var(--line-2); }
.bp-rstep.is-first { border-top-color: var(--league-accent); }
.bp-rstep__n { font-size: 48px; line-height: .9; color: var(--muted); }
.bp-rstep.is-first .bp-rstep__n { color: var(--league-accent); }
.bp-rstep__t { font-size: 26px; line-height: 1; }
.bp-rstep__d { font-size: 14px; line-height: 1.5; color: var(--sub); }

/* FAQ + registered */
.bp-rbottom { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
.bp-rbottom--solo { grid-template-columns: minmax(0, 1fr); }
.bp-faq__item { border-bottom: 1px solid var(--line); }
.bp-faq__q { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0; font-size: 24px; line-height: 1.05; cursor: pointer; list-style: none; }
.bp-faq__q::-webkit-details-marker { display: none; }
.bp-faq__q svg { color: var(--league-accent); flex: none; transition: transform .2s; }
.bp-faq__item[open] .bp-faq__q svg { transform: rotate(180deg); }
.bp-faq__a { font-size: 15px; padding: 0 0 16px; }
.bp-faq__a > :last-child { margin-bottom: 0; }
.bp-rfree { font-size: 13px; color: var(--muted); margin: 10px 0 0; }
.bp-rmine { margin: 26px 0 0; font-size: 14px; }
.bp-rmine a { color: var(--league-accent); }

/* ═══════════════ Form ═══════════════ */
.bp-rnote { margin: 16px 0 0; padding: 12px 16px; background: var(--surface); border-left: 4px solid var(--league-accent); }
.bp-rnote .bp-l { font-size: 12px; color: var(--league-accent); }
.bp-rnote p { margin: 4px 0 0; color: var(--sub); font-size: 15px; }
.bp-rnote--fail { border-left-color: var(--loss); }
.bp-rnote--fail .bp-l { color: var(--loss); }
.bp-rnote--ok { border-left-color: var(--win); }
.bp-rnote--ok .bp-l { color: var(--text); }
.bp-rmsgs { display: flex; flex-direction: column; gap: 6px; }

.bp-rprog { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; }
.bp-rprog__btn { width: 100%; display: flex; align-items: center; gap: 10px; height: 62px; padding: 0 20px; background: var(--surface);
  border: 0; border-top: 4px solid var(--line-2); color: var(--muted); cursor: pointer; text-align: left; }
.bp-rprog__btn:disabled { cursor: default; }
.bp-rprog__step.is-done .bp-rprog__btn { border-top-color: var(--league-accent); color: var(--text); }
.bp-rprog__step.is-done .bp-rprog__n { color: var(--league-accent); }
.bp-rprog__step.is-current .bp-rprog__btn { border-top-color: var(--league-accent); background: color-mix(in srgb, var(--league-accent) 22%, var(--surface)); color: var(--text); }
.bp-rprog__step.is-current .bp-rprog__n { color: var(--league-accent); }
.bp-rprog__n { font-size: 26px; display: inline-flex; }
.bp-rprog__t { font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.bp-rform-grid { display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: 28px; margin-top: 22px; align-items: start; }
.bp-rform { padding: 26px 26px 24px; min-width: 0; }
.bp-rform__title { font-size: 40px; margin: 0 0 18px; }
.bp-rform__lead { font-size: 15px; line-height: 1.55; color: var(--sub); margin: 0 0 16px; }
.bp-rform__lead strong { color: var(--text); }
.bp-rstep-panel { display: flex; flex-direction: column; gap: 16px; }
.bp-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; }
.bp-ffield { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.bp-ffield > label, .bp-ffield__label { font-size: 12px; color: var(--muted); }
.bp-ffield input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]), .bp-ffield select {
  width: 100%; height: 50px; padding: 0 14px; background: var(--bg); color: var(--text); border: 1px solid var(--line-2);
  font: 400 16px/1 var(--font-body); }
.bp-ffield input:focus, .bp-ffield select:focus { outline: 0; border-color: var(--league-accent); }
.bp-ffield.has-error input, .bp-ffield.has-error select { border-color: var(--loss); }
.bp-ffield__err { font-size: 11px; color: var(--loss); margin: 0; }
.bp-swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.bp-swatch { position: relative; width: 44px; height: 44px; background: var(--sw); border: 0; cursor: pointer; padding: 0; }
.bp-swatch.is-on { outline: 3px solid var(--white); outline-offset: 2px; }
.bp-swatch--custom { display: inline-flex; align-items: center; justify-content: center; background: var(--surface-2); color: var(--text); font-size: 22px;
  border: 2px dashed var(--line-2); }
.bp-swatch--custom input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.bp-drop { position: relative; display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 100px; padding: 16px; text-align: center;
  border: 2px dashed var(--line-2); color: var(--sub); font-size: 13px; cursor: pointer; }
.bp-drop:hover, .bp-drop.has-file { border-color: var(--league-accent); color: var(--text); }
.bp-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.bp-drop svg { color: var(--league-accent); flex: none; }

.bp-roster { display: flex; flex-direction: column; gap: 6px; }
.bp-roster__head, .bp-roster__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 58px minmax(0, 1.2fr) 56px 36px; gap: 6px; align-items: center; }
.bp-roster__head { font-size: 11px; color: var(--muted); padding: 0 2px; }
.bp-roster__row input:not([type=radio]) { width: 100%; height: 44px; padding: 0 10px; background: var(--bg); color: var(--text); border: 1px solid var(--line-2); font: 400 15px/1 var(--font-body); min-width: 0; }
.bp-roster__row input:focus { outline: 0; border-color: var(--league-accent); }
.bp-roster__cap { display: flex; justify-content: center; }
.bp-roster__cap input { width: 18px; height: 18px; accent-color: var(--league-accent); }
.bp-roster__del { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: var(--surface-2); color: var(--muted); border: 0; cursor: pointer; }
.bp-roster__del:hover:not(:disabled) { background: var(--loss); color: var(--white); }
.bp-roster__del:disabled { opacity: .35; cursor: default; }
.bp-roster__count { font-size: 12px; color: var(--muted); margin: 0; }
.bp-rstep-panel > .bp-btn { align-self: flex-start; }

.bp-rfee { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; background: var(--bg-2); border-left: 4px solid var(--league-accent); }
.bp-rfee__n { font-size: 52px; line-height: .95; }
.bp-rfee__l { font-size: 12px; color: var(--muted); }
.bp-rpay { padding: 0 2px; }
.bp-check { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; color: var(--text); cursor: pointer; }
.bp-check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--league-accent); flex: none; }
.bp-rreview > div { gap: 12px; }
.bp-rreview dd { font-size: 18px; }
.bp-rform__nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 26px; flex-wrap: wrap; }
.bp-rform__nav .bp-btn--primary { margin-left: auto; }
.bp-rform__nav .bp-btn:disabled { opacity: .6; cursor: progress; }
.bp-rform > .bp-ffield__err { margin-top: 10px; }

/* Preview */
.bp-rprev { padding: 20px; min-width: 0; position: sticky; top: 90px; }
.bp-rprev__label { font-size: 12px; color: var(--muted); margin: 0 0 12px; }
.bp-rprev__card { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 22px 16px 20px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--tc) 60%, var(--surface)), var(--surface) 80%);
  clip-path: polygon(30px 0, 100% 0, calc(100% - 30px) 100%, 0 100%); }
.bp-rprev__card > :not(.bp-scan) { position: relative; z-index: 1; }
.bp-rprev__crest { display: inline-flex; align-items: center; justify-content: center; width: 78px; height: 78px; border-radius: 50%;
  background: var(--tc); background-size: cover; background-position: center; box-shadow: 0 0 0 3px rgba(0,0,0,.35);
  color: var(--white); font: 800 italic 28px/1 var(--font-display); }
.bp-rprev__name { font-size: 34px; line-height: 1; text-align: center; overflow-wrap: anywhere; }
.bp-rprev__sub { font-size: 11px; color: var(--sub); }
.bp-rprev__row { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 12px 14px; background: var(--surface); border-left: 4px solid var(--tc); }
.bp-rprev__row .bp-d { font-size: 20px; overflow-wrap: anywhere; min-width: 0; }
.bp-rprev__dot { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 28px; height: 28px; border-radius: 50%;
  background: var(--tc); background-size: cover; background-position: center; color: var(--white); font: 800 italic 12px/1 var(--font-display); }
.bp-rprev__note { font-size: 11px; color: var(--muted); margin: 12px 0 0; }

/* ═══════════════ My applications ═══════════════ */
.bp-rcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 22px; }
.bp-appcard { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px 22px; background: var(--surface); border-top: 4px solid var(--line-2); min-width: 0; --st: var(--muted); }
.bp-appcard--pending { --st: #EAB308; border-top-color: var(--st); }
.bp-appcard--approved { --st: var(--win); border-top-color: var(--st); }
.bp-appcard--rejected { --st: var(--loss); border-top-color: var(--st); }
.bp-appcard.is-new { box-shadow: 0 0 0 2px var(--league-accent); }
.bp-appcard__top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bp-appcard__status { display: inline-flex; padding: 3px 12px; background: var(--st); color: var(--black); transform: skewX(-12deg); }
.bp-appcard__status > span { transform: skewX(12deg); font-size: 13px; }
.bp-appcard__num { font-size: 12px; color: var(--muted); }
.bp-appcard__title { font-size: 32px; line-height: 1; margin: 0; overflow-wrap: anywhere; }
.bp-appcard__sub { font-size: 14px; color: var(--sub); margin: 0; line-height: 1.45; }
.bp-rchecks { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.bp-rcheck { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--muted); }
.bp-rcheck--done { color: var(--win); }
.bp-rcheck--fail { color: var(--loss); }
.bp-rcheck__dot { width: 8px; height: 8px; border: 1.5px solid currentColor; border-radius: 50%; margin: 0 2px; }
.bp-appcard__fee { font-size: 12px; color: var(--text); margin: 0; }
.bp-appcard__actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; padding-top: 6px; }

/* ═══════════════ Responsive ═══════════════ */
@media (max-width: 1100px) {
  .bp-rhero__in { flex-direction: column; }
  .bp-rhero__stats { align-self: flex-start; }
  .bp-rhero__title { font-size: 84px; }
  .bp-rsteps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bp-rform-grid { grid-template-columns: minmax(0, 1fr); }
  .bp-rprev { position: static; order: -1; }
  .bp-rcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .bp-rhero { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 0 100%); padding-bottom: 20px; }
  .bp-rhero__in { padding: 36px 12px 22px; gap: 20px; }
  .bp-rhero__ghost { font-size: 200px; }
  .bp-rhero__title { font-size: 54px; }
  .bp-rhero__pitch { font-size: 15px; }
  .bp-rhero__cta .bp-btn { width: 100%; justify-content: center; }
  .bp-rhero__stats { width: 100%; }
  .bp-rstat { flex: 1 1 0; width: auto; height: 84px; }
  .bp-rstat__n { font-size: 40px; }
  .bp-rstat__l { font-size: 10px; text-align: center; }
  .bp-rsteps { grid-template-columns: minmax(0, 1fr); }
  .bp-rstep { padding: 14px 16px; }
  .bp-rstep__n { font-size: 34px; }
  .bp-rbottom { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .bp-faq__q { font-size: 20px; }

  .bp-rprog__btn { height: 46px; padding: 0; justify-content: center; }
  .bp-rprog__t { display: none; }
  .bp-rprog__step.is-current .bp-rprog__t { display: none; }
  .bp-rform { padding: 18px 14px 18px; }
  .bp-rform__title { font-size: 30px; }
  .bp-fgrid { grid-template-columns: minmax(0, 1fr); }
  .bp-roster__head { display: none; }
  .bp-roster__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 54px; grid-template-areas: none; padding: 8px; background: var(--bg-2); }
  .bp-roster__row input[name=p_email] { grid-column: 1 / 3; }
  .bp-roster__cap { justify-content: flex-start; }
  .bp-roster__del { justify-self: end; }
  .bp-rprev { padding: 14px; }
  .bp-rprev__card { padding: 16px 12px; }
  .bp-rprev__crest { width: 56px; height: 56px; font-size: 20px; }
  .bp-rprev__name { font-size: 26px; }
  .bp-rprev__row, .bp-rprev__note { display: none; }
  .bp-rcards { grid-template-columns: minmax(0, 1fr); }
  .bp-appcard__title { font-size: 26px; }
}

/* ── Phase 9 · account inside the form (signed out) ── */
.bp-racct { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.bp-racct__opt { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; min-width: 0;
  background: var(--bg); border: 1px solid var(--line-2); color: var(--text); text-align: left; cursor: pointer; }
.bp-racct__opt:hover { border-color: var(--sub); }
.bp-racct__opt.is-on { border-color: var(--league-accent); box-shadow: inset 3px 0 0 var(--league-accent); }
.bp-racct__t { font-size: 20px; text-transform: uppercase; font-style: italic; }
.bp-racct__s { font-size: 11px; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; }
.bp-ffield__help { font-size: 11px; color: var(--muted); margin: 0; }
.bp-racct__login { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.bp-racct__forgot { font-size: 12px; color: var(--league-accent); letter-spacing: .06em; text-transform: uppercase; }
@media (max-width: 520px) { .bp-racct { grid-template-columns: 1fr; } }
.bp-rsent { max-width: 680px; margin: 48px auto; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.bp-rsent__kicker { font-size: 12px; color: var(--league-accent); letter-spacing: .1em; text-transform: uppercase; margin: 0; }
.bp-rsent__title { font-size: 44px; margin: 0 0 10px; text-wrap: balance; }
