body{background:var(--cream)}.active-link{color:var(--orange)}.account-shell,.profile-shell{padding:55px 5% 80px}.account-intro{max-width:760px;margin:0 auto 28px;text-align:center}.account-intro h1,.profile-hero h1{font-family:Georgia,"Times New Roman",serif;color:var(--forest);font-size:clamp(42px,6vw,68px);margin:0 0 12px}.account-intro p:last-child{color:var(--muted);font-size:18px;line-height:1.6}.account-card{max-width:980px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:var(--shadow)}.progress-row{display:flex;gap:10px;margin-bottom:28px}.progress-row span{flex:1;padding:12px;border-radius:999px;background:#eee;text-align:center;font-size:12px;font-weight:850}.progress-row .active{background:var(--forest);color:#fff}.role-choice{border:0;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.role-choice legend{grid-column:1/-1;font-size:22px;font-weight:900;margin-bottom:14px}.role-card{position:relative;padding:24px;border:2px solid var(--line);border-radius:14px;cursor:pointer}.role-card:has(input:checked){border-color:var(--orange);background:#fff8f1}.role-card input{position:absolute;top:14px;right:14px}.role-card>span{font-size:38px}.role-card strong{display:block;font-size:20px;margin:12px 0 8px}.role-card p{margin:0;color:var(--muted);line-height:1.5}.account-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}.account-fields label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:850}.account-fields input{min-height:50px;border:1px solid var(--line);border-radius:8px;padding:0 12px}.account-fields .full{grid-column:1/-1}.check{flex-direction:row!important;align-items:center}.check input{min-height:auto}.account-submit{width:100%;margin-top:22px}.account-message,.preview-note{color:var(--muted);font-size:13px}.profile-hero{display:flex;align-items:center;gap:24px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px;box-shadow:var(--shadow)}.profile-hero h1{font-size:48px}.profile-hero p{margin:5px 0;color:var(--muted)}.profile-avatar{width:105px;height:105px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#35634d,#d39b5c);color:#fff;font-size:42px;font-weight:900;flex:0 0 auto}.host-color{background:linear-gradient(135deg,#164e38,#ef8b38)}.profile-hero .action-button{margin-left:auto}.badge-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.badge-row span,.preference-grid span{padding:8px 10px;border-radius:999px;background:var(--cream);font-size:12px;font-weight:800}.profile-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:22px;margin-top:24px}.profile-main,.profile-sidebar{display:grid;gap:22px;align-content:start}.profile-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px}.profile-panel h2{font-family:Georgia,"Times New Roman",serif;margin:0 0 16px;font-size:28px}.profile-panel p{color:var(--muted);line-height:1.65}.vehicle-profile{display:flex;gap:22px;align-items:center}.vehicle-visual{font-size:68px}.preference-grid{display:flex;flex-wrap:wrap;gap:10px}.stats-panel div{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line)}.stats-panel strong{font-size:24px;color:var(--forest)}.stats-panel span{color:var(--muted);align-self:center}.clean-list{list-style:none;padding:0;margin:0;display:grid;gap:13px;color:var(--muted)}.listing-profile-card{display:grid;grid-template-columns:180px 1fr;gap:18px;align-items:center;color:inherit}.listing-profile-photo{height:125px;border-radius:12px;background:url("hero.jpg") center/cover}.listing-profile-card h3{font-size:24px;margin:4px 0}.review-grid.compact{display:grid;grid-template-columns:1fr 1fr;gap:14px}.review-grid.compact article{border:1px solid var(--line);border-radius:12px;padding:18px}.review-top{display:flex;justify-content:space-between}.review-top span{color:var(--orange)}.review-grid small{color:var(--orange);font-weight:800}@media(max-width:800px){.role-choice,.account-fields,.profile-grid{grid-template-columns:1fr}.account-fields .full{grid-column:auto}.profile-hero{align-items:flex-start;flex-wrap:wrap}.profile-hero .action-button{margin-left:0;width:100%;text-align:center}.review-grid.compact{grid-template-columns:1fr}.listing-profile-card{grid-template-columns:1fr}.listing-profile-photo{height:210px}}
.settings-section {

  margin-top: 28px;

  padding: 24px;

  background: #ffffff;

  border: 1px solid #ded8ca;

  border-radius: 18px;

}

.settings-section h2 {

  margin: 0 0 18px;

}

.settings-toggle {

  display: flex;

  align-items: center;

  gap: 12px;

  width: 100%;

  margin: 14px 0;

  font-size: 17px;

  line-height: 1.4;

}

.settings-toggle input[type="checkbox"] {

  width: 22px;

  height: 22px;

  flex: 0 0 22px;

  margin: 0;

}

.settings-action-button,

#save-notifications {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: auto;

  min-width: 180px;

  min-height: 54px;

  margin-top: 18px;

  padding: 14px 28px;

  white-space: nowrap;

} 
main .settings-section {

  display: block !important;

  width: 100% !important;

  margin: 28px 0 0 !important;

  padding: 24px !important;

  background: #ffffff !important;

  border: 1px solid #ded8ca !important;

  border-radius: 18px !important;

  box-sizing: border-box !important;

}

main .settings-section .settings-toggle {

  display: flex !important;

  align-items: center !important;

  width: 100% !important;

  margin: 14px 0 !important;

  gap: 12px !important;

  white-space: normal !important;

}

main .settings-section .settings-toggle input {

  flex: 0 0 22px !important;

  width: 22px !important;

  height: 22px !important;

  margin: 0 !important;

}

#settings-logout {

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  width: auto !important;

  min-width: 180px !important;

  padding: 14px 28px !important;

}
/* Traveller profile setup form */

#travelerProfileForm {

  display: grid;

  gap: 20px;

  margin-top: 28px;

}

#travelerProfileForm label {

  display: grid;

  gap: 8px;

  font-weight: 700;

  color: #123f32;

}

#travelerProfileForm input,

#travelerProfileForm select,

#travelerProfileForm textarea {

  width: 100%;

  box-sizing: border-box;

  padding: 14px 16px;

  border: 1px solid #d8d4cb;

  border-radius: 12px;

  font: inherit;

  background: #fff;

}

#travelerProfileForm textarea {

  min-height: 130px;

  resize: vertical;

}

#travelerProfileForm .full-button {

  width: 100%;

  margin-top: 8px;

}

@media (max-width: 700px) {

  .profile-shell {

    padding: 28px 16px 60px;

  }

  .profile-panel {

    padding: 28px 22px;

  }

}