/* Profile setup (src/profile-setup.js): the screen after Create account, and the same fields in Edit profile. */
.rider-fields { display:grid; gap:22px; text-align:left; }
.rider-fields .rf-label { margin:0 0 10px; font:700 15px/1.2 var(--ob-font,inherit); color:#f1f3f5; }
.rider-fields .rf-label span { margin-left:6px; font-weight:500; font-size:13px; color:#8f99a3; }
.rider-fields :is(.rf-styles,.rf-popular,.rf-picked) { display:flex; flex-wrap:wrap; gap:8px; }
.rider-fields button { font-family:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.rider-fields .rf-chip { min-height:42px; padding:0 15px; border:1px solid #ffffff14; border-radius:999px; background:#2a2e35; color:#e7ebef; font-size:14px; }
.rider-fields .rf-chip b { font-weight:600; }
.rider-fields .rf-pop { min-height:36px; padding:0 13px; font-size:13px; color:#c4cad1; }
.rider-fields .rf-pop::before { content:'＋ '; color:#8f99a3; }
.rider-fields :is(.rf-chip,.rf-level)[aria-pressed="true"] { background:#3b82f6; border-color:#3b82f6; color:#fff; }
.rider-fields .rf-levels { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.rider-fields .rf-level { display:flex; flex-direction:column; align-items:flex-start; gap:3px; min-height:58px; padding:10px 14px; border:1px solid #ffffff14; border-radius:16px; background:#2a2e35; color:#f1f3f5; text-align:left; }
.rider-fields .rf-level b { font-size:15px; font-weight:700; }
.rider-fields .rf-level small { font-size:12px; color:#9aa3ad; }
.rider-fields .rf-level[aria-pressed="true"] small { color:#ffffffd9; }
.rider-fields .rf-picked { margin-bottom:10px; }
.rider-fields .rf-picked[hidden] { display:none; }
.rider-fields .rf-place { display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:0 12px; border:0; border-radius:999px; background:#3b82f6; color:#fff; font-size:14px; }
.rider-fields .rf-place span { color:#ffe28a; }
.rider-fields .rf-place b { font-weight:600; }
.rider-fields .rf-place i { font-style:normal; font-size:12px; opacity:.8; }
.rider-fields .rf-search { box-sizing:border-box; width:100%; height:48px; margin:0 0 10px; padding:0 16px; border:1px solid #ffffff1f; border-radius:14px; background:#1e2126; color:#f1f3f5; font:500 16px/1 var(--ob-font,inherit); outline:none; }
.rider-fields .rf-search:focus { border-color:#3b82f6; }
.rider-fields .rf-search::placeholder { color:#7d8791; }
.rider-fields :is(.rf-search,.rf-results)[hidden] { display:none; }
.rider-fields .rf-results { display:grid; gap:6px; }
.rider-fields .rf-result { display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; align-items:center; column-gap:10px; min-height:52px; padding:8px 14px; border:0; border-radius:14px; background:#2a2e35; color:#f1f3f5; text-align:left; }
.rider-fields .rf-result b { font-size:15px; font-weight:600; }
.rider-fields .rf-result small { grid-column:1; font-size:12px; color:#9aa3ad; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rider-fields .rf-add { grid-column:2; grid-row:1 / span 2; font-size:18px; color:#3b82f6; }
.rider-fields .rf-empty { margin:0; font-size:13px; color:#9aa3ad; }

/* The setup screen: picture band on top, the questions, a fixed Continue at the bottom. */
.profile-setup .ob-frame { display:flex; flex-direction:column; }
.profile-setup .ps-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.profile-setup .ps-band { height:calc(150px + env(safe-area-inset-top,0px)); background:#1a1d22 center 30%/cover no-repeat; -webkit-mask-image:linear-gradient(#000 35%,transparent); mask-image:linear-gradient(#000 35%,transparent); transition:height .25s; }
.profile-setup.ps-typing .ps-band { height:calc(12px + env(safe-area-inset-top,0px)); }
.profile-setup .ps-copy { margin-top:-34px; padding:0 22px 24px; position:relative; }
.profile-setup .ps-copy > .ob-body { margin-bottom:22px; }
.profile-setup .ps-foot { flex:none; padding:10px 22px calc(12px + env(safe-area-inset-bottom,0px)); background:#0f1114; box-shadow:0 -1px 0 #ffffff12; }
.profile-setup .ps-foot .ob-cta:not(.ob-ghost) { margin-top:0; }
.profile-setup .ps-foot .ob-ghost { height:40px; margin-top:4px; }
.profile-setup .ps-note { margin:0; font-size:13px; color:#ff8a80; text-align:center; }
.profile-setup .ps-note:not(:empty) { margin-bottom:8px; }
@media (max-height:700px) {
  .profile-setup .ps-band { height:calc(104px + env(safe-area-inset-top,0px)); }
  .profile-setup .rider-fields { gap:18px; }
  .profile-setup .ps-foot .ob-cta:not(.ob-ghost) { height:50px; }
}

/* Edit profile: the same fields under Bio, with the sheet's own text styles kept out. */
.profile-editor-rider { margin:6px 0 4px; padding-top:16px; border-top:1px solid #ffffff14; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-label { margin:0 0 10px; font-size:15px!important; font-weight:700!important; line-height:1.2; color:#f1f3f5!important; letter-spacing:0; text-transform:none; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-label span { margin-left:6px; font-size:13px!important; font-weight:500!important; color:#8f99a3!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-level small { color:#9aa3ad!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-level[aria-pressed="true"] :is(b,small),.vertex-v3 #app#app#app#app#app #profileRiderFields :is(.rf-chip[aria-pressed="true"],.rf-place) :is(b,i) { color:#fff!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-place span { color:#ffe28a!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-private { margin:-12px 0 0; font-size:12px!important; line-height:1.4; color:#8f99a3!important; }