/* One pass, drawn by assets/pass-view.js (registration.html and my.html; 18 Oct 2026, moved out of registration.html
   unchanged). Builds on assets/reg-a.css (tokens, rx-* components). */
.rx-two{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s5);align-items:start}
.rx-stack{display:grid;gap:var(--s5);min-width:0}
.rx-okhead .rx-tag{margin:0 0 var(--s2)}
/* confirm the email and mobile after paying (RG-11) */
.rx-vrow{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);flex-wrap:wrap;padding:var(--s3) 0;border-top:1px solid var(--a-line)}
.rx-vrow>div:first-child{display:flex;flex-direction:column;min-width:0}.rx-vrow>div:first-child .rx-mut{overflow-wrap:anywhere}
.rx-vcode{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);max-width:100%}.rx-vcode .rx-ctl{width:150px;letter-spacing:.2em}
.rx-vcode .rx-hint{flex-basis:100%;display:block}
/* the visa letter card's heading and its state (20 Oct 2026) */
.pv-vh{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s2)}.pv-vh h2{margin:0 0 var(--s2)}.pv-vh .rx-tag{flex:none}
.rx-tfg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3) var(--s4);margin:var(--s3) 0}
.rx-tf{display:flex;flex-direction:column;gap:var(--s1);font-weight:600;font-size:14px}.rx-tf .rx-ctl{font-weight:400}
.rx-tf .rx-hint{font-weight:400}
@media (max-width:640px){.rx-tfg{grid-template-columns:minmax(0,1fr)}}
/* the same fields as the registration form (register.html) for the transfer and code boxes; field edges in the 3:1 token
   --a-field (18 Oct 2026, review #7) */
.rx-tf .rx-ctl,.rx-vcode .rx-ctl{width:100%;height:var(--a-ctl-h);border:1px solid var(--a-field);border-radius:var(--r1);background:var(--a-surface);padding:0 var(--s4);font:400 16px/24px var(--sans);color:var(--a-ink);appearance:none;-webkit-appearance:none;box-shadow:none;transition:border-color .15s,box-shadow .15s}
.rx-tf .rx-ctl::placeholder,.rx-vcode .rx-ctl::placeholder{color:var(--a-ink-3)}
.rx-tf .rx-ctl:hover,.rx-vcode .rx-ctl:hover{border-color:var(--a-ink-3)}
.rx-tf .rx-ctl:focus,.rx-vcode .rx-ctl:focus{outline:none;border-color:var(--a-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--a-focus) 25%,transparent)}
.rx-tf select.rx-ctl{padding-right:40px;background:var(--a-surface) var(--a-chev) no-repeat right 12px center;cursor:pointer}
.rx-vcode .rx-ctl{width:160px}
.rx-link{all:unset;cursor:pointer;color:var(--a-accent-text);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.rx-link:focus-visible{outline:2px solid var(--a-focus);outline-offset:2px}
.rx-okhead .rbtn{margin-top:var(--s4)}
.rx-okhead .rx-err{color:var(--a-err);font:500 14px/20px var(--sans);margin:var(--s2) 0 0}
.rx-card .rx-err{color:var(--a-err);font:500 14px/20px var(--sans);margin:var(--s2) 0 0}
.rx-incl{margin:var(--s3) 0 0;padding:0;list-style:none;display:grid;gap:var(--s2);font-size:14px;line-height:20px}
.rx-incl li{display:flex;gap:var(--s2)}.rx-incl li svg.i{width:16px;height:16px;margin-top:2px;color:var(--a-accent-text)}
.rx-incl li.no,.rx-incl li.no svg.i{color:var(--a-ink-3)}
.rx-more{margin-top:var(--s4)}
.rx-more summary{cursor:pointer;display:inline-flex;align-items:center;gap:var(--s2);font:600 14px/20px var(--sans);color:var(--a-accent-text);border-radius:4px}
.rx-card .rx-rcmeta{margin:0}
.rx-mut{color:var(--a-ink-2);font-size:14px;line-height:20px}
.rx-card p{margin:0}
@media (max-width:1040px){.rx-two{grid-template-columns:minmax(0,1fr)}}
/* phone: the four facts as one column of label/value rows, so "BA27-REG-0001" and the pass name stay on one line
   (18 Oct 2026, review #63) */
@media (max-width:640px){.rx-facts{grid-template-columns:minmax(0,1fr);gap:0;border:1px solid var(--a-line);border-radius:var(--r2)}
  .rx-facts div{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);padding:var(--s3) var(--s4);border:0;border-radius:0}
  .rx-facts div+div{border-top:1px solid var(--a-line)}.rx-facts dd{margin:0;text-align:right}}
.rx-tips{margin:var(--s3) 0 0;padding-left:20px;display:grid;gap:4px;font-size:14px;line-height:20px;color:var(--a-ink-2)}
.rx-tips a{color:var(--a-accent-text);font-weight:600}
