/* 52Hz profile center: values mirror encounter-cards/cards.css and
   my-activities/dashboard.css. All rules stay inside profile-owned roots. */

#profileView .profile-section { width: min(100%, 1216px); padding-top: 34px; }
#profileView .profile-layout { grid-template-columns: 300px minmax(0, 1fr); gap: 24px; }
#profileView .profile-side,
#profilePageView .profile-encounter-card {
  border: 1px solid var(--pc-mint-edge);
  border-radius: 16px;
  color: var(--pc-ink);
  background: var(--pc-mint);
  box-shadow: none;
}
#profileView .profile-side { padding: 23px 22px; }
#profileView .profile-side::before { display: none; }
#profileView .profile-avatar-button { width: 94px; height: 94px; margin-bottom: 17px; border: 2px solid rgba(255,255,255,.88); }
#profileView .profile-side h3 { color: var(--pc-ink); font-size: 25px; line-height: 1.3; }
#profileView .profile-side-meta { color: var(--pc-body); font-size: 13px; line-height: 1.7; }
#profileView .profile-side-intro,
#profilePageView .profile-account-intro { margin: 8px 0 0; color: var(--pc-body); font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
#profileView .profile-side-intro.is-empty,
#profilePageView .profile-account-intro:empty { color: var(--pc-muted); }
#profileView .profile-portrait-pill { border-color: var(--pc-mint-edge); border-radius: 7px; color: var(--pc-teal); background: rgba(255,255,255,.58); }
#profileView .profile-completion { margin: 19px 0 15px; }
#profileView .profile-completion-track { background: rgba(255,255,255,.72); }
#profileView .profile-main-action,
#profileView .profile-edit-btn,
#profilePageView .profile-inline-action {
  min-height: 42px;
  border: 1px solid var(--pc-mint-edge);
  border-radius: 9px;
  color: var(--pc-teal);
  background: rgba(255,255,255,.74);
  box-shadow: none;
  font-weight: 700;
}
#profileView .profile-main-action:hover,
#profileView .profile-edit-btn:hover,
#profilePageView .profile-inline-action:hover { background: #fffefa; }

/* Move the existing, data-backed “52Hz眼中的你” section into the identity card. */
#profileView .profile-side #profileEncounterCard {
  margin: 18px 0 0;
  padding: 15px 0 0;
  border: 0;
  border-top: 1px solid rgba(63,103,86,.2);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#profileView .profile-side #profileEncounterCard .profile-identity-heading { display: none; }
#profileView .profile-side #profileEncounterCard .profile-encounter-content { margin: 0; padding: 0; border: 0; }
#profileView .profile-side #profileEncounterContentTitle,
#profileView .profile-side #webProfileEncounterContentTitle { color: var(--pc-ink); font-size: 17px; }
#profileView .profile-side .profile-encounter-topics { color: var(--pc-body); line-height: 1.8; }
#profileView .profile-side .profile-invite-toggle { border-color: var(--pc-mint-edge); background: rgba(255,255,255,.5); }

#profileView .profile-content { gap: 22px; }
#profileView .profile-content > :is(.profile-encounter-readiness, .profile-core-grid, .profile-lower-grid, .pc-quick-links, .pc-deepsea-card, .profile-coupons-panel, .profile-orders-panel) { margin: 0; }
#profileView .profile-page-header .sec-title { color: var(--pc-ink); }
#profileView .profile-page-header .sec-desc { color: var(--pc-body); }

/* The activity image is an existing local encounter-card asset; orders stay icon-led. */
.pc-quick-links { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.pc-quick-link {
  position: relative;
  display: grid;
  grid-template-columns: 104px minmax(0,1fr);
  grid-template-rows: minmax(0,1fr) auto;
  grid-template-areas: "art copy" "art action";
  align-items: center;
  gap: 6px 16px;
  min-height: 142px;
  padding: 13px;
  overflow: hidden;
  border: 1px solid var(--pc-mint-edge);
  border-radius: 16px;
  color: var(--pc-ink);
  background: var(--pc-mint);
  text-align: left;
  cursor: pointer;
  transition: background .18s ease, transform .18s ease;
}
.pc-quick-link + .pc-quick-link { border-left: 1px solid var(--pc-apricot-edge); }
.pc-quick-link.is-orders { border-color: var(--pc-apricot-edge); background: var(--pc-apricot); }
.pc-quick-link:hover { transform: translateY(-2px); background: #eaf1e9; }
.pc-quick-link.is-orders:hover { background: #f6ecde; }
.pc-quick-art { grid-area: art; display: grid; width: 104px; height: 114px; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.82); border-radius: 9px; color: #826040; background: rgba(255,255,255,.58); }
.pc-quick-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pc-quick-art .pc-icon { width: 34px; height: 34px; flex-basis: 34px; stroke-width: 1.55; }
.pc-quick-copy { grid-area: copy; display: grid; align-self: end; gap: 5px; min-width: 0; }
.pc-quick-copy strong { color: var(--pc-ink); font-size: 20px; line-height: 1.3; }
.pc-quick-copy small { color: var(--pc-body); font-size: 12px; line-height: 1.55; }
.pc-quick-state { grid-area: action; justify-self: start; display: inline-flex; align-items: center; min-height: 34px; padding: 0 13px; border: 1px solid var(--pc-mint-edge); border-radius: 7px; color: var(--pc-teal); background: rgba(255,255,255,.78); font-size: 12px; font-weight: 700; }
.pc-quick-link.is-orders .pc-quick-state { border-color: var(--pc-apricot-edge); color: #826040; }
.pc-quick-link:active { transform: scale(.99); }

/* Eligibility is summarized once; the security list remains the single place to manage identity. */
#profileView .profile-encounter-readiness,
#profilePageView .profile-readiness-card { display: none !important; }
#profileView .profile-encounter-readiness .profile-readiness-grid,
#profilePageView .profile-readiness-card .profile-readiness-grid { display: none; }
#profilePageView #profileMyEventsAction { display: none; }
#profileView .profile-card-head h3,
#profilePageView .profile-readiness-card .profile-card-heading-row > div > strong { color: var(--pc-ink); font-size: 20px; }
#profileView .profile-readiness-copy { color: var(--pc-body); }

/* Sea-salt blue matches the encounter deepsea strip; mapped fish artwork leads the card. */
.pc-deepsea-card { min-width: 0; padding: 21px 23px; border: 1px solid var(--pc-salt-edge); border-radius: 18px; color: #244f62; background: var(--pc-salt); box-shadow: none; }
.pc-deepsea-heading { gap: 13px; margin-bottom: 15px; }
.pc-deepsea-icon { width: 38px; height: 38px; flex-basis: 38px; border: 1px solid rgba(205,223,225,.8); border-radius: 12px; color: #527c87; background: rgba(255,255,255,.7); }
.pc-deepsea-heading p { color: #527c87; }
.pc-deepsea-heading h3 { color: #244f62; font-size: 24px; }
.pc-deepsea-status { border-color: var(--pc-salt-edge); border-radius: 7px; color: #52727a; background: rgba(255,255,255,.7); }
.pc-deepsea-open { grid-template-columns: 126px minmax(0,1fr) auto; gap: 18px; padding: 0; border: 0; border-radius: 0; color: #244f62; background: transparent; }
.pc-deepsea-fish { width: 126px; height: 134px; border: 1px solid var(--pc-salt-edge); border-radius: 15px; color: #397182; background: rgba(255,255,255,.68); }
.pc-deepsea-fish img { object-fit: contain; }
.pc-deepsea-copy strong { color: #244f62; font-size: 22px; }
.pc-deepsea-copy > span { color: #546e77; font-size: 14px; }
.pc-deepsea-cta { min-height: 42px; padding: 0 15px; border: 1px solid #c2d9dd; border-radius: 28px; color: #244f62; background: rgba(255,255,255,.72); font-size: 13px; }
.pc-deepsea-open:hover .pc-deepsea-cta { background: #fff; }
@media (hover:hover) { .pc-deepsea-open:hover .pc-deepsea-fish img { transform: translateY(-2px); } }

/* Warm financial sections borrow the campaign apricot and use compact lists. */
#profileView .profile-coupons-panel,
#profileView .profile-orders-panel,
#profilePageView .profile-coupons-panel,
#profilePageView .profile-orders-panel { padding: 18px 20px; border: 1px solid var(--pc-apricot-edge); border-radius: 16px; color: #674c2f; background: var(--pc-apricot); box-shadow: none; }
#profileView .profile-coupons-heading h3,
#profilePageView .profile-coupons-heading h3 { color: #674c2f; font-size: 20px; }
#profileView .profile-coupons-count,
#profilePageView .profile-coupons-count { color: #826040; }
#profileView .profile-coupon-row,
#profilePageView .coupon-item { border-color: rgba(142,116,80,.25); border-radius: 9px; background: rgba(255,255,255,.38); }
#profileView .profile-coupon-action,
#profilePageView .coupon-action { border-color: var(--pc-apricot-edge); border-radius: 7px; color: #826040; background: rgba(255,255,255,.78); }
#profileView .profile-order-row,
#profilePageView .order-item { border-color: rgba(142,116,80,.24); border-radius: 9px; background: rgba(255,255,255,.48); }
#profileView .profile-order-state,
#profilePageView .order-status { border-radius: 7px; }
#profileView .profile-order-details,
#profilePageView .order-details { border-color: rgba(142,116,80,.2); }
#profileView .profile-order-data,
#profilePageView .order-details dl { border-color: rgba(142,116,80,.2); }
#profileView .profile-coupon-history,
#profilePageView .history-disclosure { border-color: rgba(142,116,80,.24); }

/* One outline groups account and support rows, without nested white cards. */
#profileView .profile-lower-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0; overflow: hidden; border: 1px solid var(--pc-line); border-radius: 16px; background: var(--pc-white); box-shadow: none; }
#profileView .profile-account-card,
#profileView .profile-contact-card { min-width: 0; padding: 20px 22px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#profileView .profile-contact-card { border-left: 1px solid var(--pc-line); }
#profileView .profile-account-card .profile-card-head h3,
#profileView .profile-contact-card .profile-card-head h3 { color: var(--pc-ink); font-size: 20px; }
#profilePageView .profile-settings-stack { overflow: hidden; border: 1px solid var(--pc-line); border-radius: 16px; background: var(--pc-white); }
#profilePageView .profile-security-card,
#profilePageView .profile-support-card { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#profilePageView .profile-support-card { border-top: 1px solid var(--pc-line); }
#profilePageView .profile-settings-disclosure > summary,
#profilePageView .profile-support-disclosure > summary { min-height: 68px; padding: 13px 18px; color: var(--pc-ink); }
#profilePageView .profile-settings-body,
#profilePageView .profile-support-body { padding: 0 18px 16px; }
#profilePageView .profile-settings-body .password-setting-row,
#profilePageView .profile-support-body .contact-row { min-height: 48px; border-color: var(--pc-line); }
#profilePageView .profile-settings-body .password-setting-row > span,
#profilePageView .profile-support-body .contact-row > span { color: var(--pc-body); }
#profileView .profile-security-row,
#profileView .profile-contact-row { border-color: var(--pc-line); }
#profileView .profile-security-row > div > span,
#profileView .profile-contact-row > span { color: var(--pc-body); }
#profileView .profile-security-row .btn,
#profileView .profile-feedback-btn,
#profilePageView .settings-action-btn,
#profilePageView .contact-copy-btn { min-height: 38px; border: 1px solid var(--pc-line); border-radius: 7px; color: var(--pc-teal); background: #fffefa; box-shadow: none; }

/* Shared profile-owned forms: field spacing, error placement, and safe-area sheets. */
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) :is(.modal,.edit-profile-modal) {
  border: 1px solid rgba(38,61,53,.16);
  border-radius: 16px;
  color: var(--pc-ink, #263d35);
  background: #fffefa;
  box-shadow: 0 12px 34px rgba(38,61,53,.12);
}
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) :is(.field,.dialog-form > label) { display: grid; gap: 7px; min-width: 0; color: #263d35; font-size: 13px; }
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) :is(input:not([type=checkbox]),select,textarea) { min-width: 0; min-height: 43px; border: 1px solid rgba(38,61,53,.19); border-radius: 7px; color: #263d35; background: #fffefa; box-shadow: none; }
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) textarea { min-height: 104px; resize: vertical; }
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) :is(button.btn-primary,.primary-btn,.primary-action) { min-height: 43px; border: 1px solid var(--hz-accent,#57b7b7); border-radius: 7px; color: var(--hz-accent-ink,#173c3c); background: var(--hz-accent,#57b7b7); box-shadow: none; }
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) [aria-invalid="true"] { border-color: #a54843 !important; box-shadow: 0 0 0 3px rgba(165,72,67,.08); }
:is(#profileModal,#editProfileModal,#avatarModal,#phoneBindModal,#campusBindModal,#changePasswordModal,#supportTicketModal,#logoutConfirmModal,#deactivateConfirmModal,#pwdModal,#changePwdModal,#webPhoneBindModal,#webCampusBindModal,#webSupportModal,#webLogoutModal,#webDeactivateModal) :is(.modal-close,.dialog-close) { width: 38px; height: 38px; border: 1px solid var(--pc-line, rgba(38,61,53,.16)); border-radius: 8px; color: #48665d; background: #fffefa; }

@media (max-width: 760px) {
  #profileView .profile-section { padding: 22px 16px 56px; }
  #profileView .profile-layout { grid-template-columns: minmax(0,1fr); gap: 18px; }
  #profileView .profile-side { position: static; padding: 19px; border-radius: 15px; }
  #profileView .profile-side-intro,
  #profilePageView .profile-account-intro { font-size: 12px; }
  #profileView .profile-content { gap: 18px; }
  .pc-quick-links { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .pc-quick-link { grid-template-columns: 88px minmax(0,1fr); min-height: 112px; gap: 5px 13px; padding: 11px; border-radius: 15px; }
  .pc-quick-link + .pc-quick-link { border-left: 1px solid var(--pc-apricot-edge); }
  .pc-quick-art { width: 88px; height: 88px; border-radius: 8px; }
  .pc-quick-copy strong { font-size: 18px; }
  .pc-quick-copy small { font-size: 11px; }
  .pc-quick-state { min-height: 31px; font-size: 11px; }
  .pc-deepsea-card { padding: 17px; border-radius: 16px; }
  .pc-deepsea-heading h3 { font-size: 20px; }
  .pc-deepsea-open { grid-template-columns: 88px minmax(0,1fr); gap: 11px; }
  .pc-deepsea-fish { width: 88px; height: 102px; border-radius: 12px; }
  .pc-deepsea-copy strong { font-size: 17px; }
  .pc-deepsea-copy > span { font-size: 12px; }
  .pc-deepsea-cta { grid-column: 2; justify-self: start; min-height: 34px; padding: 0 12px; font-size: 11px; }
  #profileView .profile-lower-grid { grid-template-columns: minmax(0,1fr); }
  #profileView .profile-contact-card { border-top: 1px solid var(--pc-line); border-left: 0; }
  #profileView .profile-account-card,
  #profileView .profile-contact-card { padding: 18px 16px; }
  #profilePageView .profile-encounter-card,
  #profilePageView .profile-readiness-card,
  #profilePageView .profile-coupons-panel,
  #profilePageView .profile-orders-panel { border-radius: 15px; }
  #profilePageView .profile-settings-disclosure > summary,
  #profilePageView .profile-support-disclosure > summary { padding-inline: 15px; }
  #profilePageView .profile-settings-body,
  #profilePageView .profile-support-body { padding-inline: 15px; }
  :is(#profileModal,#editProfileModal,#supportTicketModal,#webSupportModal,#deactivateConfirmModal,#webDeactivateModal) .modal {
    position: fixed;
    inset: max(8px, env(safe-area-inset-top)) 0 0;
    width: 100%;
    max-width: none;
    max-height: calc(100dvh - max(8px, env(safe-area-inset-top)));
    margin: 0;
    padding-bottom: max(18px, env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
    border-radius: 17px 17px 0 0;
  }
  :is(#profileModal,#editProfileModal,#supportTicketModal,#webSupportModal,#deactivateConfirmModal,#webDeactivateModal) .edit-profile-modal { position: fixed; inset: max(8px, env(safe-area-inset-top)) 0 0; width: 100%; max-width: none; max-height: calc(100dvh - max(8px, env(safe-area-inset-top))); margin: 0; overflow-y: auto; overscroll-behavior: contain; border-radius: 17px 17px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  #profileView *, #profilePageView *,
  #profileModal *, #editProfileModal *, #avatarModal *, #phoneBindModal *, #campusBindModal *,
  #changePasswordModal *, #supportTicketModal *, #logoutConfirmModal *, #deactivateConfirmModal *,
  #webPhoneBindModal *, #webCampusBindModal *, #webSupportModal *, #webLogoutModal *, #webDeactivateModal * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Production parity: reuse real controls and real profile fields. */
#profileView .profile-core-grid, #profilePageView .profile-calibration-stack { display:none !important; }
#profileView .profile-lower-grid { grid-template-columns: minmax(0,1fr); }
#profileView .profile-contact-card { border-left: 0; border-top: 1px solid var(--pc-line); }
#profileView .profile-account-card, #profileView .profile-contact-card { padding: 26px; }
#profileView .profile-security-row > div { display:grid; grid-template-columns: minmax(110px,.7fr) minmax(0,1fr); align-items:center; gap:16px; flex:1; }
#profileView .profile-security-row { min-height:66px; gap:18px; }
#profileView .profile-contact-row { min-height:66px; }
#profileView .pc-identity-head { display:grid; grid-template-columns:74px minmax(0,1fr); gap:16px; align-items:center; }
#profileView .pc-identity-head .profile-avatar-button { width:74px; height:74px; margin:0; }
#profileView .pc-identity-copy h3 { margin:0; }
#profileView .pc-identity-copy { min-width:0; }
#profileView .profile-side { text-align:left; }
#profileView .profile-side .profile-main-action { width:auto; justify-self:start; margin-top:18px; padding:0 16px; }
#profileView .profile-side .profile-completion { width:100%; }
#profileView .profile-completion-track i { background:var(--pc-teal); }
#profileView .profile-side #profileEncounterCard { background:transparent; border-radius:0; box-shadow:none; }
#profileView .profile-side #profileEncounterCard::before, #profileView .profile-side #profileEncounterCard::after { display:none; }

#profileView .profile-frequency-card { padding:24px; background:var(--pc-white); border:1px solid var(--pc-line); border-radius:16px; box-shadow:none; }
#profileView .profile-frequency-card::before, #profileView .profile-frequency-card::after { display:none; }
#profileView .profile-frequency-summary { margin:18px 0; }
#profileView .profile-frequency-action { width:auto; min-height:40px; padding:8px 18px; color:var(--pc-teal); background:var(--pc-mint); border:1px solid var(--pc-mint-edge); border-radius:8px; box-shadow:none; }
@media(max-width:600px) {
 #profileView .profile-account-card, #profileView .profile-contact-card { padding:18px; }
 #profileView .profile-security-row > div { grid-template-columns:minmax(0,1fr); gap:4px; }
 #profileView .pc-identity-head { grid-template-columns:62px minmax(0,1fr); gap:12px; }
 #profileView .pc-identity-head .profile-avatar-button { width:62px;height:62px; }
}

/* Shared preference data lives beside the persona, not inside the identity rail. */
:is(#profileView, #profilePageView) .pc-preferences-card {
  min-width:0; margin:0; padding:24px; border:1px solid var(--pc-mint-edge, #cde1d8);
  border-radius:18px; background:#fffefa; color:var(--pc-ink, #244d49);
}
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-subhead { margin:0; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-subhead strong { font-size:22px; color:#244d49; }
.pc-preferences-lead { margin:8px 0 20px; color:#60776e; font-size:14px; line-height:1.6; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-topics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-topic-group { display:flex; flex-direction:column; align-items:stretch; gap:12px; min-width:0; padding:16px; margin:0; border:1px solid var(--hz-line-strong,rgba(80,130,130,.24)); border-radius:12px; background:var(--hz-accent-soft,#e6f3f1); }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-topic-group-label { display:flex; align-items:center; gap:8px; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-topic-group-icon { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; font-size:18px; background:transparent; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-topic-group h4 { margin:0; color:var(--hz-accent-ink,#173c3c); font-size:14px; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-topic-group-list { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-start; min-width:0; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-topic { max-width:100%; padding:7px 12px; border:1px solid #d5e5dd; border-radius:18px; background:#fffefa; box-shadow:none; color:#294b43; font-size:14px; overflow-wrap:anywhere; }
:is(#profileView, #profilePageView) .pc-preferences-card :is(.profile-encounter-auto-update,.profile-encounter-empty-state,.profile-encounter-suggestion) { grid-column:1/-1; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-auto-update { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; margin:0; padding-top:4px; font-size:13px; }
.pc-preferences-note { margin:18px 0 0; border-top:1px solid #dfebe4; padding-top:14px; font-size:12px; line-height:1.7; color:#61746c; }
.pc-invitation-settings { padding:18px 24px; border:1px solid #dfebe4; border-radius:16px; background:#f3f8f4; }
.pc-invitation-settings h3 { margin:0 0 12px; font-size:16px; color:#365e55; }
.pc-invitation-settings:has(.profile-invite-toggle.hidden) { display:none; }
#profilePageView > :is(.pc-preferences-card,.pc-invitation-settings) { margin:16px 0; }
@media(max-width:900px) { :is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-topics { grid-template-columns:1fr; } }
@media(max-width:480px) { :is(#profileView, #profilePageView) .pc-preferences-card { padding:18px; } }

/* Profile summary: Avatar / Card / Badge / Progress composition, using existing DOM. */
#profileView .profile-layout { grid-template-columns:minmax(0,1fr); }
#profileView .profile-side { position:static; display:grid; grid-template-columns:80px minmax(0,1fr) auto; gap:6px 22px; align-items:center; padding:24px 28px; }
#profileView .profile-avatar-button { grid-column:1; grid-row:1 / span 4; width:80px; height:80px; margin:0; }
#profileView .profile-side h3 { grid-column:2; grid-row:1; margin:0; }
#profileView .profile-side-meta { grid-column:2; grid-row:2; margin:0; }
#profileView .profile-side-intro { grid-column:2; grid-row:3; margin:0; }
#profileView .profile-side .pc-verified-summary { grid-column:2; grid-row:4; margin:0; }
#profileView .profile-side .profile-portrait-pill { display:none; }
#profileView .profile-side #profileEncounterCard { display:none; }
#profileView .profile-main-action { grid-column:3; grid-row:1 / span 2; justify-self:end; width:auto; margin:0; }
#profileView .profile-completion { grid-column:1 / -1; grid-row:5; width:100%; margin:14px 0 0; padding-top:14px; border-top:1px solid #cde1d8; }
#profileView .profile-content { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:22px; align-items:stretch; }
#profileView .profile-content > * { grid-column:1 / -1; min-width:0; }
#profileView .profile-content > .pc-deepsea-card { grid-column:1; }
#profileView .profile-content > .pc-preferences-card { grid-column:2; }
#profileView .pc-deepsea-card { padding:24px; }
#profileView .pc-deepsea-heading { flex-wrap:wrap; gap:8px; }
#profileView .pc-deepsea-heading h3 { font-size:21px; }
#profileView .pc-deepsea-open { grid-template-columns:80px minmax(0,1fr); gap:14px; }
#profileView .pc-deepsea-fish { width:80px; height:92px; }
#profileView .pc-deepsea-copy strong { font-size:20px; }
#profileView .pc-deepsea-cta { grid-column:1 / -1; justify-self:start; margin-top:8px; }
#profileView .pc-preferences-card .profile-encounter-topics { gap:10px; }
#profileView .pc-preferences-card .profile-topic-group { padding:12px; }
@media(max-width:1000px) {
 #profileView .profile-content { grid-template-columns:minmax(0,1fr); }
 #profileView .profile-content > .pc-preferences-card { grid-column:1; }
 #profileView .pc-preferences-card .profile-encounter-topics { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:600px) {
 #profileView .profile-side { grid-template-columns:64px minmax(0,1fr); padding:18px; gap:6px 14px; }
 #profileView .profile-avatar-button { width:64px; height:64px; }
 #profileView .profile-main-action { grid-column:1 / -1; grid-row:6; justify-self:start; margin-top:8px; }
 #profileView .pc-preferences-card .profile-encounter-topics { grid-template-columns:1fr; }
}

/* Support the identity grouping already present in the live profile component. */
#profileView .profile-side > .pc-identity-head { grid-column:1 / 3; grid-row:1 / 4; display:grid; grid-template-columns:80px minmax(0,1fr); min-width:0; width:100%; gap:22px; }
#profileView .pc-identity-head > .profile-avatar-button { grid-column:1; grid-row:1; width:80px; height:80px; }
#profileView .pc-identity-head > .pc-identity-copy { grid-column:2; grid-row:1; min-width:0; width:100%; }
#profileView .pc-identity-copy :is(h3,p) { width:auto; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
#profileView .profile-side > .profile-main-action { justify-self:end; margin:0; }
@media(max-width:600px) {
 #profileView .profile-side > .pc-identity-head { grid-column:1 / -1; grid-template-columns:64px minmax(0,1fr); gap:14px; }
 #profileView .pc-identity-head > .profile-avatar-button { width:64px; height:64px; }
 #profileView .profile-side > .profile-main-action { justify-self:start; margin-top:8px; }
}

/* Profile and encounter editors share quiet surfaces and explicit selection feedback. */
#profileModal .modal, .event-modal:has(#v23ProfileForm) { background:#fffefa; border:1px solid var(--hz-line-strong,rgba(80,130,130,.24)); border-radius:20px; padding:26px; }
#profileModal .field { margin-bottom:18px; }
#profileModal .choice-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
#profileModal .choice-btn { min-height:44px; padding:10px 16px; border:1px solid var(--hz-line-strong,rgba(80,130,130,.24)); border-radius:10px; color:var(--hz-accent-ink,#173c3c); background:var(--hz-accent-soft,#e6f3f1); transition:background .16s ease,border-color .16s ease,transform .16s ease; }
#profileModal .choice-btn.selected, #profileModal .choice-btn[aria-pressed="true"] { color:var(--hz-accent-ink,#173c3c); background:var(--hz-accent-soft,#e6f3f1); border-color:var(--hz-accent,#57b7b7); box-shadow:inset 0 0 0 1px rgba(87,183,183,.14); }
#profileModal .choice-btn:active, #v23ProfileForm button:active { transform:scale(.98); }
#profileModal .choice-btn:focus-visible, #v23ProfileForm button:focus-visible { outline:3px solid var(--hz-teal-700,var(--brand-deep,#2f7777)); outline-offset:3px; }
#profileModal :is(input,textarea,select), #v23ProfileForm :is(input[type="text"],textarea,select) { border:1px solid var(--hz-line-strong,rgba(80,130,130,.24)); border-radius:10px; background:#fff; color:#294b43; padding:12px; transition:border-color .16s ease,box-shadow .16s ease; }
#profileModal :is(input,textarea,select):focus, #v23ProfileForm :is(input,textarea,select):focus { border-color:var(--hz-accent,#57b7b7); outline:none; box-shadow:0 0 0 3px rgba(87,183,183,.2); }
#v23ProfileForm .event-v23-suggestion-group { padding:14px; border:1px solid var(--hz-line-strong,rgba(80,130,130,.24)); border-radius:12px; background:var(--hz-accent-soft,#e6f3f1); margin-block:12px; }
#v23ProfileForm .event-v23-suggestion-row { gap:10px; margin-top:10px; }
#v23ProfileForm input[type="checkbox"] { accent-color:var(--hz-accent,#57b7b7); width:18px; height:18px; }
#v23ProfileForm .event-v23-organize-row { gap:12px; flex-wrap:wrap; }
#v23ProfileForm .event-btn { min-height:44px; border-radius:10px; transition:background .16s ease,transform .16s ease; }
#v23ProfileForm .event-btn.primary { background:var(--hz-accent,#57b7b7); color:var(--hz-accent-ink,#173c3c); }
#v23ProfileForm .event-btn.secondary { border:1px solid var(--hz-line-strong,rgba(80,130,130,.24)); background:var(--hz-accent-soft,#e6f3f1); color:var(--hz-accent-ink,#173c3c); }
#v23ProfileForm .event-v23-detail-edit { border-color:var(--hz-line-strong,rgba(80,130,130,.24)); }
@keyframes hz-editor-enter { from { opacity:0; transform:translateY(10px) scale(.99); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:no-preference) {
 #profileModal:not(.hidden) .modal, .event-modal:has(#v23ProfileForm) { animation:hz-editor-enter .2s ease-out; }
}
@media(prefers-reduced-motion:reduce) {
 #profileModal *, #v23ProfileForm * { animation:none !important; transition:none !important; }
}
@media(max-width:600px) { #profileModal .modal, .event-modal:has(#v23ProfileForm) { padding:20px; border-radius:16px; } }

/* One compact reminder/action row beneath the preference tags. */
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-auto-update { display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between; gap:12px; padding-top:8px; border:0; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-auto-update > span { flex:1; min-width:0; color:#60776e; font-size:13px; line-height:1.6; }
:is(#profileView, #profilePageView) .pc-preferences-card .profile-encounter-update-action { flex-shrink:0; margin-left:auto; }

/* Align persona action with the neighbouring preference editor action. */
:is(#profileView, #profilePageView) .pc-deepsea-open .pc-deepsea-cta { grid-column:1 / -1; justify-self:end; margin-top:10px; }

.pc-preferences-card .pc-invite-status { grid-column:1 / -1; margin:0; color:#60776e; font-size:12px; line-height:1.5; }

/* The read-only dinner library is a compact full-width utility entry. */
:is(#profileView,#profilePageView) .pc-dinner-topics-card { grid-column:1 / -1; padding:18px 20px; border-color:#cde5e5; color:#244f50; background:#f2fafa; }
#profileView .profile-content > .pc-dinner-topics-card { grid-column:1 / -1; }
.pc-dinner-topics-card .pc-deepsea-heading { margin-bottom:12px; }
.pc-dinner-topics-card .pc-deepsea-heading h3 { color:#244f50; font-size:18px; }
:is(#profileView,#profilePageView) .pc-dinner-topics-card .pc-deepsea-open { grid-template-columns:48px minmax(0,1fr) auto; gap:14px; padding:0; }
:is(#profileView,#profilePageView) .pc-dinner-topics-card .pc-deepsea-fish { width:48px; height:56px; border-radius:10px; }
.pc-dinner-topics-card .pc-deepsea-fish .pc-icon { width:24px; height:24px; }
.pc-dinner-topics-card .pc-deepsea-copy strong { color:#244f50; font-size:16px; }
:is(#profileView,#profilePageView) .pc-dinner-topics-card .pc-deepsea-cta { grid-column:auto; margin-top:0; padding-inline:12px; }
.pc-dinner-topics-status { margin:12px 0 0; font-size:13px; line-height:1.6; }
@media(max-width:350px) { #profilePageView .pc-dinner-topics-card { padding:16px; } #profilePageView .pc-dinner-topics-card .pc-deepsea-open { grid-template-columns:36px minmax(0,1fr) auto; gap:8px; } #profilePageView .pc-dinner-topics-card .pc-deepsea-fish { width:36px; height:46px; } }
