/* 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:600 15px/1.2 var(--ob-font,inherit); color:var(--g-contrast); }
.rider-fields .rf-label span { margin-left:6px; font-weight:500; font-size:13px; color:var(--g-muted); }
.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 rgba(var(--g-ink-rgb),0.078); border-radius:999px; background:var(--g-raised); color:var(--g-contrast); font-size:14px; --g-contrast:var(--g-ink);--g-secondary-contrast:var(--g-muted);--ui-on-dark:var(--g-ink);}
.rider-fields .rf-chip b { font-weight:600; }
.rider-fields .rf-pop { min-height:36px; padding:0 13px; font-size:13px; color:var(--g-muted); }
.rider-fields .rf-pop::before { content:'＋ '; color:var(--g-muted); }
.rider-fields :is(.rf-chip,.rf-level)[aria-pressed="true"] { background:var(--g-accent); border-color:var(--g-accent); color:var(--g-contrast); --g-contrast:var(--g-on-accent);--g-secondary-contrast:var(--g-on-accent);--ui-on-dark:var(--g-on-accent);}
.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 rgba(var(--g-ink-rgb),0.078); border-radius:14px; background:var(--g-raised); color:var(--g-contrast); text-align:left; --g-contrast:var(--g-ink);--g-secondary-contrast:var(--g-muted);--ui-on-dark:var(--g-ink);}
.rider-fields .rf-level b { font-size:15px; font-weight:600; }
.rider-fields .rf-level small { font-size:12px; color:var(--g-muted); }
.rider-fields .rf-level[aria-pressed="true"] small { color:var(--g-contrast); }
.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:var(--g-accent); color:var(--g-contrast); font-size:14px; --g-contrast:var(--g-on-accent);--g-secondary-contrast:var(--g-on-accent);--ui-on-dark:var(--g-on-accent);}
.rider-fields .rf-place span { color:var(--g-warning); }
.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 rgba(var(--g-ink-rgb),0.122); border-radius:14px; background:var(--g-surface); color:var(--g-contrast); font:500 16px/1 var(--ob-font,inherit); outline:none; --g-contrast:var(--g-ink);--g-secondary-contrast:var(--g-muted);--ui-on-dark:var(--g-ink);}
.rider-fields .rf-search:focus { border-color:var(--g-accent); }
.rider-fields .rf-search::placeholder { color:var(--g-muted); }
.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:var(--g-raised); color:var(--g-contrast); text-align:left; --g-contrast:var(--g-ink);--g-secondary-contrast:var(--g-muted);--ui-on-dark:var(--g-ink);}
.rider-fields .rf-result b { font-size:15px; font-weight:600; }
.rider-fields .rf-result small { grid-column:1; font-size:12px; color:var(--g-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rider-fields .rf-add { grid-column:2; grid-row:1 / span 2; font-size:18px; color:var(--g-accent); }
.rider-fields .rf-empty { margin:0; font-size:13px; color:var(--g-muted); }

/* 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:var(--g-raised) center 42%/cover no-repeat; -webkit-mask-image:linear-gradient(#000 35%,transparent); mask-image:linear-gradient(#000 35%,transparent); transition:height .25s; --g-contrast:var(--g-ink);--g-secondary-contrast:var(--g-muted);--ui-on-dark:var(--g-ink);}
.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; }
/* "Your name" on top of the setup: the same field as the mountain search. */
.profile-setup .ps-name-group { margin-bottom:22px; text-align:left; }
.profile-setup .ps-name-group .rf-label { display:block; margin:0 0 10px; font:600 15px/1.2 var(--ob-font,inherit); color:var(--g-contrast); }
.profile-setup .ps-name { box-sizing:border-box; width:100%; height:48px; padding:0 16px; border:1px solid rgba(var(--g-ink-rgb),0.122); border-radius:14px; background:var(--g-surface); color:var(--g-contrast); font:500 16px/1 var(--ob-font,inherit); outline:none; --g-contrast:var(--g-ink);}
.profile-setup .ps-name:focus { border-color:var(--g-accent); }
.profile-setup .ps-name::placeholder { color:var(--g-muted); }
.profile-setup .ps-foot { flex:none; padding:10px 22px calc(12px + env(safe-area-inset-bottom,0px)); background:var(--g-surface); box-shadow:0 -1px 0 rgba(var(--g-shadow-rgb),0.071); --g-contrast:var(--g-ink);--g-secondary-contrast:var(--g-muted);--ui-on-dark:var(--g-ink);}
.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:var(--g-danger); 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 rgba(var(--g-ink-rgb),0.078); }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-label { margin:0 0 10px; font-size:15px!important; font-weight:600!important; line-height:1.2; color:var(--g-contrast)!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:var(--g-muted)!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-level small { color:var(--g-muted)!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:var(--g-contrast)!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-place span { color:var(--g-warning)!important; }
.vertex-v3 #app#app#app#app#app #profileRiderFields .rf-private { margin:-12px 0 0; font-size:12px!important; line-height:1.4; color:var(--g-muted)!important; }