/* SHEM EANSIT — QA pass 3
   Targets the exact visual issues seen in the latest iPhone screenshots:
   iOS autofill yellow, awkward password recovery row, cramped member masthead,
   oversized/nested Guide frames, heavy Explore directory blocks, bright blue/yellow
   mismatches, and harsh Community action rows. Presentation only. */

/* ---------- global finishing ---------- */
:root{
  --se-blush:#F7E9EA;
  --se-blush-light:#FCF4F2;
  --se-blue-soft:#EDF4FA;
  --se-yellow-soft:#FFF4C9;
  --se-paper-soft:#FFFCF7;
  --se-hairline:rgba(59,42,32,.12);
}

.screen{
  background:
    radial-gradient(circle at 12% 5%,rgba(255,255,255,.82),transparent 28%),
    var(--se-cream)!important;
}

/* remove leftover legacy line art in the member masthead */
.member-head,.member-head-approved{
  background:none!important;
  background-image:none!important;
  min-height:58px!important;
  margin-bottom:30px!important;
  padding:2px 78px 16px 0!important;
  border-bottom:1px solid var(--se-hairline)!important;
}
.member-head::before,.member-head-approved::before,
.member-head::after,.member-head-approved::after{
  content:none!important;
  display:none!important;
}
.member-brand{
  min-width:0!important;
  gap:3px!important;
}
.member-brand-name{
  font-size:22px!important;
  line-height:1!important;
  letter-spacing:.115em!important;
}
.member-brand-translation{
  font-size:9px!important;
  letter-spacing:.09em!important;
}
.profile-dot{
  width:36px!important;
  height:36px!important;
  background:linear-gradient(180deg,#F9FCFF,#EAF2F9)!important;
  border:1px solid rgba(121,152,181,.24)!important;
  box-shadow:0 5px 14px rgba(59,42,32,.045)!important;
}

.quick-exit{
  min-width:58px!important;
  min-height:28px!important;
  padding:5px 8px!important;
  box-shadow:0 4px 14px rgba(59,42,32,.045)!important;
  border-color:rgba(59,42,32,.10)!important;
}
.quick-exit::before{width:15px!important;height:15px!important}
.quick-exit::after{font-size:6.5px!important;letter-spacing:.14em!important}

/* ---------- AUTH / SIGN IN ---------- */
.auth-panel{
  padding:18px!important;
  border:1px solid rgba(59,42,32,.09)!important;
  border-radius:24px!important;
  background:rgba(255,252,247,.72)!important;
  box-shadow:0 10px 28px rgba(59,42,32,.035)!important;
}

.auth-panel .form-group input,
.auth-panel .form-group select,
.auth-panel .form-group textarea{
  min-height:52px!important;
  background:var(--se-paper-soft)!important;
  border:1px solid rgba(59,42,32,.16)!important;
  border-radius:15px!important;
  color:var(--se-ink)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)!important;
  font-size:16px!important;
}

/* Safari/iOS autofill was painting the fields fluorescent yellow. */
.auth-panel input:-webkit-autofill,
.auth-panel input:-webkit-autofill:hover,
.auth-panel input:-webkit-autofill:focus,
.auth-panel input:-webkit-autofill:active{
  -webkit-text-fill-color:var(--se-ink)!important;
  caret-color:var(--se-ink)!important;
  -webkit-box-shadow:0 0 0 1000px var(--se-paper-soft) inset!important;
  box-shadow:0 0 0 1000px var(--se-paper-soft) inset!important;
  border:1px solid rgba(59,42,32,.16)!important;
  transition:background-color 9999s ease-out 0s!important;
}
#password{font-size:15px!important;letter-spacing:.04em!important}

.forgot-row{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:7px!important;
  width:100%!important;
  margin-top:16px!important;
  padding:14px 0 2px!important;
  border-top:1px solid var(--se-hairline)!important;
}
.forgot-password-link{
  min-height:36px!important;
  padding:8px 13px!important;
  border:1px solid rgba(121,152,181,.24)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#F7FBFE,#E8F2F9)!important;
  color:var(--se-chocolate)!important;
  box-shadow:none!important;
  font-size:8px!important;
  font-weight:700!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
}
.forgot-row>span{
  max-width:285px!important;
  color:var(--se-muted)!important;
  font-size:9px!important;
  line-height:1.5!important;
}
.auth-panel .btn:disabled{
  background:#8C8177!important;
  border-color:#8C8177!important;
  color:#FFF9F1!important;
  opacity:.78!important;
}

/* ---------- GUIDE ---------- */
.guide-stagebar{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  margin:4px 0 28px!important;
}
.guide-stage{
  min-height:42px!important;
  padding:10px 8px!important;
  border:1px solid rgba(59,42,32,.10)!important;
  border-radius:999px!important;
  background:rgba(255,252,247,.60)!important;
  color:#9A8D83!important;
  box-shadow:none!important;
  font-size:7.5px!important;
  font-weight:700!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
  text-align:center!important;
}
.guide-stage.active{
  border-color:rgba(121,152,181,.28)!important;
  background:var(--se-blue-soft)!important;
  color:var(--se-chocolate)!important;
}
.guide-stage.complete{
  border-color:rgba(242,211,122,.34)!important;
  background:#FFF9DF!important;
  color:#746452!important;
}

.guide-conversation-head{
  margin-bottom:22px!important;
}
.guide-conversation-head .page-title{
  max-width:100%!important;
  margin:8px 0 15px!important;
  font-size:clamp(42px,10.5vw,50px)!important;
  line-height:.98!important;
}
.guide-conversation-head .small{
  max-width:385px!important;
  font-size:11.5px!important;
  line-height:1.72!important;
}

/* Prompt: softer and lighter; no heavy nested frame or side stripe. */
.guide-prompt-card{
  position:relative!important;
  margin:0 0 26px!important;
  padding:22px 20px 23px!important;
  border:1px solid rgba(121,152,181,.20)!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 92% 18%,rgba(242,211,122,.55) 2px,transparent 2.5px) 0 0/20px 20px,
    linear-gradient(180deg,#F8FBFE,#EEF4F9)!important;
  box-shadow:0 8px 24px rgba(76,100,121,.045)!important;
  overflow:hidden!important;
}
.guide-prompt-card::before,.guide-prompt-card::after{content:none!important;display:none!important}
.guide-card-label{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  margin:0 0 13px!important;
  color:#7B5161!important;
  font-size:8px!important;
  font-weight:700!important;
  letter-spacing:.17em!important;
  text-transform:uppercase!important;
}
.guide-card-label::before{
  content:"✾"!important;
  color:#D4A94E!important;
  font-family:Georgia,serif!important;
  font-size:11px!important;
  line-height:1!important;
}
.guide-prompt-card>p{
  margin:0!important;
  color:#51463F!important;
  font-size:17px!important;
  line-height:1.55!important;
}

.guide-input-card{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.guide-input-card .form-group label{
  margin-bottom:10px!important;
  font-size:8.5px!important;
}
.guide-input-card textarea{
  min-height:170px!important;
  padding:16px!important;
  border:1px solid rgba(59,42,32,.13)!important;
  border-radius:20px!important;
  background:rgba(255,252,247,.86)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)!important;
  font-size:15px!important;
  line-height:1.6!important;
}
.guide-input-meta{
  margin:10px 2px 16px!important;
  color:var(--se-muted)!important;
  font-size:8.5px!important;
  line-height:1.55!important;
}

.guide-you-summary{
  margin:0 0 16px!important;
  padding:18px 19px!important;
  border:1px solid rgba(121,152,181,.16)!important;
  border-radius:20px!important;
  background:#F7FBFE!important;
  box-shadow:none!important;
}
.guide-you-summary>p{
  margin:5px 0 0!important;
  color:#5D534B!important;
  font-size:14px!important;
  line-height:1.55!important;
}

/* Response: one elegant card. Remove the box-inside-a-box feeling. */
.guide-response-card{
  position:relative!important;
  margin:0 0 26px!important;
  padding:23px 21px 22px!important;
  border:1px solid rgba(130,79,96,.14)!important;
  border-radius:26px!important;
  background:linear-gradient(180deg,#FCF5F4,#F8ECEE)!important;
  box-shadow:0 9px 28px rgba(100,55,71,.045)!important;
  overflow:hidden!important;
}
.guide-response-card::before,.guide-response-card::after{content:none!important;display:none!important}
.guide-response-card>p{
  margin:0!important;
  color:#55484C!important;
  font-size:16px!important;
  line-height:1.62!important;
}
.guide-follow-question{
  margin:20px 0 0!important;
  padding:20px 0 0!important;
  border:0!important;
  border-top:1px solid rgba(130,79,96,.14)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.guide-follow-question>span{
  display:block!important;
  margin-bottom:8px!important;
  color:#9A6D7A!important;
  font-size:7.5px!important;
  font-weight:700!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
}
.guide-follow-question>p{
  margin:0!important;
  color:#53303E!important;
  font-family:var(--se-serif)!important;
  font-size:clamp(27px,7.8vw,34px)!important;
  font-weight:400!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}

.guide-action-stack{
  display:grid!important;
  gap:9px!important;
  margin-top:16px!important;
}

/* ---------- EXPLORE ---------- */
.global-explore-strip{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:16px!important;
  width:100%!important;
  margin:24px 0 28px!important;
  padding:18px 19px!important;
  border:1px solid rgba(121,152,181,.18)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 92% 24%,rgba(242,211,122,.72) 2.2px,transparent 2.6px) 0 0/22px 22px,
    linear-gradient(180deg,#F8FBFE,#EDF4FA)!important;
  box-shadow:0 8px 22px rgba(76,100,121,.04)!important;
  overflow:hidden!important;
}
.global-explore-strip>div{min-width:0!important}
.global-explore-strip span{
  color:#8B6070!important;
  font-size:7.5px!important;
  font-weight:700!important;
  letter-spacing:.17em!important;
  text-transform:uppercase!important;
}
.global-explore-strip strong{
  display:block!important;
  margin:6px 0 5px!important;
  color:var(--se-chocolate)!important;
  font-family:var(--se-serif)!important;
  font-size:25px!important;
  font-weight:400!important;
  line-height:1!important;
}
.global-explore-strip p{
  margin:0!important;
  color:var(--se-muted)!important;
  font-size:9.5px!important;
  line-height:1.55!important;
}
.global-explore-strip button{
  flex:0 0 auto!important;
  min-height:38px!important;
  padding:9px 13px!important;
  border:1px solid rgba(121,152,181,.24)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.66)!important;
  color:var(--se-chocolate)!important;
  box-shadow:none!important;
  font-size:7.5px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

.screen:has(.hub-grid)>.page-title{
  max-width:390px!important;
  font-size:clamp(42px,10vw,50px)!important;
  line-height:1!important;
}
.hub-grid{
  display:grid!important;
  gap:12px!important;
}
.hub-card{
  position:relative!important;
  min-height:0!important;
  padding:23px 21px 24px!important;
  border:1px solid rgba(59,42,32,.11)!important;
  border-radius:22px!important;
  box-shadow:0 8px 22px rgba(59,42,32,.035)!important;
  overflow:hidden!important;
}
.hub-card:nth-child(1){background:linear-gradient(180deg,#FFFDF9,#FAF5ED)!important}
.hub-card:nth-child(2){background:linear-gradient(180deg,#F8FBFE,#EDF4FA)!important}
.hub-card:nth-child(3){
  background:
    radial-gradient(circle,rgba(211,166,73,.16) 1.4px,transparent 1.8px) 0 0/18px 18px,
    linear-gradient(180deg,#FFF9DD,#FFF2C5)!important;
}
.hub-card .eyebrow{color:#7F9BB2!important}
.hub-card h2{
  margin:10px 34px 10px 0!important;
  color:var(--se-chocolate)!important;
  font-size:clamp(31px,8.5vw,38px)!important;
  line-height:1.03!important;
}
.hub-card p{
  max-width:92%!important;
  color:var(--se-muted)!important;
  font-size:11px!important;
  line-height:1.62!important;
}
.hub-card::after{color:var(--se-chocolate)!important}
.hub-card:nth-child(3) h2,
.hub-card:nth-child(3) p,
.hub-card:nth-child(3) .eyebrow{
  color:inherit!important;
}
.hub-card:nth-child(3) .eyebrow{color:#8D6F35!important}
.hub-card:nth-child(3) h2{color:var(--se-chocolate)!important}
.hub-card:nth-child(3) p{color:#71624E!important}

/* ---------- COMMUNITY ---------- */
.feed{gap:14px!important}
.post{
  padding:22px 20px 20px!important;
  border:1px solid rgba(59,42,32,.10)!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,#FFFDF9,#FAF6EF)!important;
  box-shadow:0 8px 24px rgba(59,42,32,.035)!important;
}
.post:nth-child(even){background:linear-gradient(180deg,#F9FCFE,#EFF5FA)!important}
.post-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:7px!important;
  color:#8F8176!important;
}
/* When a post is anonymous, show one elegant identity pill rather than duplicate text. */
.post-meta:has(.anonymous-pill)>span:first-child{display:none!important}
.anonymous-pill{
  font-size:0!important;
  padding:6px 10px!important;
  border:1px solid rgba(121,152,181,.24)!important;
  border-radius:999px!important;
  background:#EAF2F8!important;
  color:#5F788D!important;
}
.anonymous-pill::after{
  content:"Anonymous member"!important;
  font-size:7px!important;
  font-weight:700!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
.post-title{
  margin:16px 0 10px!important;
  font-size:clamp(31px,8.6vw,38px)!important;
}
.post-body{font-size:12px!important;line-height:1.7!important}

/* Make post actions pretty and readable instead of four harsh text links. */
.post-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:20px!important;
  padding-top:17px!important;
  border-top:1px solid var(--se-hairline)!important;
}
.post-actions button{
  width:100%!important;
  min-width:0!important;
  min-height:38px!important;
  padding:8px 10px!important;
  border:1px solid rgba(59,42,32,.09)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.54)!important;
  color:#5D5047!important;
  box-shadow:none!important;
  font-size:7.3px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.post-actions [data-support]{
  border-color:rgba(121,152,181,.20)!important;
  background:#EDF4F9!important;
  color:#5E7487!important;
}
.post-actions [data-support].active{
  border-color:#7C314D!important;
  background:#7C314D!important;
  color:#FFF8F2!important;
}
.post-actions [data-thread]{background:#FFF8DB!important;color:#6A5946!important}
.post-actions [data-report-post]{background:#F7EFE8!important;color:#6D5A50!important}
.post-actions [data-delete-post]{
  border-color:rgba(157,91,91,.14)!important;
  background:#FAECEA!important;
  color:#9A5858!important;
}

/* replies and entry actions inherit the same softer utility treatment */
.entry-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
.entry-actions button{
  min-height:34px!important;
  padding:7px 11px!important;
  border:1px solid rgba(59,42,32,.09)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.52)!important;
  color:#66584E!important;
}

/* ---------- profile/location utility ---------- */
#hcEditLocation{
  min-height:54px!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 93% 50%,rgba(242,211,122,.82) 2.5px,transparent 3px) 0 0/20px 20px,
    linear-gradient(180deg,#F8FBFE,#EAF3F9)!important;
}
#hcEditLocation::before{content:"✾"!important;color:#C49A46!important}

/* ---------- narrow iPhone cleanup ---------- */
@media(max-width:430px){
  .member-head,.member-head-approved{padding-right:72px!important;margin-bottom:28px!important}
  .member-brand-name{font-size:20px!important}
  .global-explore-strip{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  .global-explore-strip button{justify-self:start!important}
  .guide-stage{font-size:7px!important;padding-left:5px!important;padding-right:5px!important}
  .guide-response-card{padding:21px 18px 20px!important}
  .guide-follow-question>p{font-size:clamp(26px,7.6vw,31px)!important}
  .hub-card{padding:21px 18px 22px!important}
  .post{padding:20px 17px 18px!important}
  .post-actions button{font-size:7px!important}
}

@media(max-width:360px){
  .member-brand-name{font-size:18px!important}
  .post-actions{grid-template-columns:minmax(0,1fr)!important}
}