/* SHEM EANSIT — strongest feminine polish pass
   Matches approved mockups: elegant, warm, feminine, editorial, soft geometry,
   baby-blue + butter accents, visible polka dots, delicate botanical details,
   and reduced utility/app-dashboard feel. No bows. No hearts. */

:root{
  --se-soft-shadow:0 10px 30px rgba(59,42,32,.055);
  --se-card-border:rgba(93,71,56,.14);
  --se-blue-card:#EEF4F9;
  --se-yellow-card:#FFF0B9;
  --se-cream-card:#FCF8F1;
}

/* ---------- overall rhythm ---------- */
.screen{
  background:
    radial-gradient(circle at 10% 4%,rgba(255,255,255,.7),transparent 30%),
    var(--se-cream)!important;
}

.screen.with-nav{padding-bottom:calc(var(--nav-height) + env(safe-area-inset-bottom,0px) + 44px)!important}

.page-title{margin-bottom:12px!important}
.section-title{margin-top:38px!important}

/* ---------- Quick Exit: elegant and intentional, never a random dotted square ---------- */
.quick-exit{
  top:calc(env(safe-area-inset-top,0px) + 14px)!important;
  right:max(18px,calc((100vw - 520px)/2 + 18px))!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  min-height:34px!important;
  padding:7px 10px!important;
  border:1px solid rgba(59,42,32,.12)!important;
  border-radius:999px!important;
  background:rgba(252,248,241,.92)!important;
  color:var(--se-chocolate)!important;
  box-shadow:0 6px 18px rgba(59,42,32,.06)!important;
  backdrop-filter:blur(10px)!important;
  font-size:7.5px!important;
  letter-spacing:.16em!important;
}
.quick-exit::before{
  content:"↗";
  display:inline-grid;
  place-items:center;
  width:17px;height:17px;
  border:1px solid rgba(59,42,32,.28);
  border-radius:50%;
  font-size:9px;
  line-height:1;
}

/* ---------- member brand header ---------- */
.member-head,.member-head-approved{
  margin-bottom:40px!important;
  padding-bottom:17px!important;
}
.member-brand-name{font-size:19px!important;letter-spacing:.13em!important}
.member-brand-translation{font-size:9px!important;color:var(--se-blue-ink)!important}
.profile-dot{
  width:38px!important;height:38px!important;
  border:1px solid rgba(59,42,32,.14)!important;
  background:linear-gradient(180deg,#F9FCFF,var(--se-baby-light))!important;
  box-shadow:0 6px 16px rgba(59,42,32,.05)!important;
}

/* ---------- feminine cards / surfaces ---------- */
.card,.panel,.tool-panel,.post,.resource-card,.option-card,.hub-card,.status-card,.composer,.journal-entry,.plan-entry,.profile-card,.settings-button,.global-context-card,.resource-country-panel{
  border:1px solid var(--se-card-border)!important;
  border-radius:20px!important;
  background:rgba(252,248,241,.86)!important;
  box-shadow:var(--se-soft-shadow)!important;
}

/* restore openness where a full card would feel too app-like */
.feed,.tool-stack,.hub-grid,.option-grid,.resource-grid,.settings-list{background:transparent!important;box-shadow:none!important;border:0!important}

/* ---------- Home ---------- */
.approved-member-intro{
  margin-bottom:26px!important;
  padding:0 0 30px!important;
  border-bottom:0!important;
}
.approved-member-intro::after{
  content:"";
  display:block;
  width:58px;height:1px;
  margin-top:22px;
  background:var(--se-line);
}
.approved-member-accent{
  width:76px!important;height:62px!important;
  border:0!important;
  border-radius:18px 18px 0 18px!important;
  background-color:var(--se-baby)!important;
  background-image:radial-gradient(circle,var(--se-butter) 3.2px,transparent 3.6px)!important;
  background-size:21px 21px!important;
  box-shadow:0 8px 22px rgba(59,42,32,.06)!important;
}

.home-guide,.approved-home-guide{
  grid-template-columns:42px 1fr!important;
  margin:24px 0 28px!important;
  padding:30px 25px 32px!important;
  border:1px solid rgba(161,119,31,.18)!important;
  border-radius:24px!important;
  background-color:var(--se-yellow-card)!important;
  background-image:radial-gradient(circle,rgba(255,255,255,.82) 1.2px,transparent 1.35px)!important;
  background-size:14px 14px!important;
  box-shadow:0 12px 32px rgba(133,98,25,.075)!important;
  overflow:hidden!important;
}
.home-guide::after{
  content:"✾"!important;
  position:absolute!important;
  right:18px!important;
  bottom:8px!important;
  width:auto!important;height:auto!important;
  color:rgba(126,95,54,.18)!important;
  background:none!important;
  font-family:Georgia,serif!important;
  font-size:84px!important;
  line-height:1!important;
  transform:rotate(-10deg)!important;
}
.home-guide h2{font-size:31px!important}
.home-guide button{
  min-height:44px!important;
  padding:11px 20px!important;
  border:1px solid rgba(59,42,32,.16)!important;
  border-radius:999px!important;
  background:rgba(255,253,249,.82)!important;
  box-shadow:0 6px 18px rgba(59,42,32,.05)!important;
}

.home-grid,.approved-home-grid{display:grid!important;gap:10px!important;border:0!important}
.home-card{
  grid-template-columns:28px 42px 1fr 18px!important;
  gap:12px!important;
  padding:18px 18px!important;
  border:1px solid var(--se-card-border)!important;
  border-radius:18px!important;
  background:rgba(252,248,241,.9)!important;
  box-shadow:0 8px 22px rgba(59,42,32,.045)!important;
}
.home-card:first-child{border-top:1px solid var(--se-card-border)!important}
.home-card:nth-child(2){background:linear-gradient(180deg,#F7FBFE,var(--se-blue-card))!important}
.home-card:nth-child(3){background:linear-gradient(180deg,#FFFBF3,#FBF3E6)!important}
.home-card:nth-child(4){background:linear-gradient(180deg,#FFFDF7,#FBF7ED)!important}
.home-card svg{
  width:22px!important;height:22px!important;
  padding:9px!important;
  border-radius:50%!important;
  background:var(--se-baby-light)!important;
  color:#7595B0!important;
}
.home-card:nth-child(3) svg{background:#F5E8CE!important;color:#7B623D!important}
.home-card:nth-child(4) svg{background:#FFF2C6!important;color:#735E2A!important}
.home-card h3{font-size:25px!important}
.approved-home-number{align-self:center!important}

.support-strip,.approved-support-strip{
  margin-top:22px!important;
  padding:22px 22px!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#4A3328,#3B2A20)!important;
  box-shadow:0 10px 26px rgba(59,42,32,.10)!important;
}

/* ---------- buttons / utility actions ---------- */
.btn{border-radius:999px!important}
.btn-primary,.btn-dark{box-shadow:0 7px 18px rgba(59,42,32,.08)!important}
.btn-outline{background:rgba(255,255,255,.36)!important}
.text-button,.btn-link{border-radius:999px!important;border:1px solid rgba(59,42,32,.12)!important;padding:8px 12px!important;background:rgba(252,248,241,.7)!important}

#toggleComposer{
  min-height:42px!important;
  padding:10px 18px!important;
  border:1px solid rgba(102,135,163,.24)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#EDF5FC,#D9E8F6)!important;
  color:var(--se-chocolate)!important;
  box-shadow:0 8px 20px rgba(89,118,143,.07)!important;
}

/* Country/local resources button is the utility button the screenshots made look harsh. */
#hcEditLocation{
  margin:8px 0 12px!important;
  border:1px solid rgba(102,135,163,.24)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#F7FBFE,#E5F0F8)!important;
  box-shadow:0 8px 20px rgba(89,118,143,.06)!important;
}

/* ---------- forms: soft + feminine instead of hard utility lines ---------- */
.form-group input,.form-group textarea,.form-group select,.field,
.resource-country-panel select{
  border:1px solid rgba(59,42,32,.14)!important;
  border-radius:14px!important;
  background:rgba(255,253,249,.82)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}
.form-group textarea{border-radius:18px!important}
.auth-panel{border-top:0!important;padding-top:10px!important}
.attestation{border-radius:16px!important;background:linear-gradient(180deg,#F7FBFE,var(--se-baby-light))!important}

/* ---------- Community ---------- */
.section-head{
  align-items:center!important;
  gap:14px!important;
  border-bottom:0!important;
  margin-bottom:18px!important;
}
.privacy-note{
  border:1px solid rgba(179,137,56,.17)!important;
  border-radius:20px!important;
  background-color:#FFF8E9!important;
  background-image:radial-gradient(circle,rgba(242,211,122,.42) 1.2px,transparent 1.35px)!important;
  background-size:14px 14px!important;
  box-shadow:none!important;
}
.feed{display:grid!important;gap:12px!important;border-top:0!important}
.post{
  position:relative!important;
  margin:0!important;
  padding:22px 20px 20px!important;
  border:1px solid var(--se-card-border)!important;
  border-radius:22px!important;
  background:rgba(252,248,241,.9)!important;
  box-shadow:0 9px 25px rgba(59,42,32,.045)!important;
}
.post:nth-child(3n+2){background:linear-gradient(180deg,#FAFCFE,#F0F6FA)!important}
.post-title{font-size:29px!important;margin-top:10px!important}
.anonymous-pill,.pill{
  border-radius:999px!important;
  padding:5px 9px!important;
  background:#E5F0F9!important;
}
.post-actions button,.entry-actions button{
  border:0!important;
  border-radius:999px!important;
  padding:7px 10px!important;
  background:transparent!important;
}
.post-actions button:hover,.entry-actions button:hover{background:rgba(199,214,230,.32)!important}
.composer{
  padding:22px!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#FFFDF9,#FBF6EE)!important;
}

/* ---------- Guide ---------- */
.guide-topline{border-bottom:0!important;margin-bottom:20px!important}
.guide-hero-card{
  padding:0 0 22px!important;
  border-bottom:0!important;
}
.guide-inline-note{
  border-radius:18px!important;
  background:linear-gradient(180deg,#F7FBFE,#E9F2F8)!important;
}
.mode-grid,.guide-mode-grid{display:grid!important;gap:10px!important;border-top:0!important}
.mode-card,.guide-mode-card{
  grid-template-columns:34px 1fr 18px!important;
  padding:18px 18px!important;
  border:1px solid var(--se-card-border)!important;
  border-radius:18px!important;
  background:rgba(252,248,241,.9)!important;
  box-shadow:0 8px 22px rgba(59,42,32,.04)!important;
}
.guide-mode-card:nth-child(even){background:linear-gradient(180deg,#F8FBFD,#EEF5FA)!important}
.guide-mode-number{
  width:30px;height:30px;
  display:grid!important;place-items:center!important;
  border-radius:50%!important;
  background:#FFF2C9!important;
  color:var(--se-chocolate)!important;
}

/* ---------- Explore / resources ---------- */
.hub-grid,.option-grid,.resource-grid,.tool-grid{display:grid!important;gap:11px!important;border-top:0!important}
.hub-card,.option-card,.resource-card{
  position:relative!important;
  padding:21px 20px!important;
  border:1px solid var(--se-card-border)!important;
  border-radius:20px!important;
  background:rgba(252,248,241,.9)!important;
  box-shadow:0 8px 22px rgba(59,42,32,.04)!important;
}
.hub-card:nth-child(even),.option-card:nth-child(even),.resource-card:nth-child(even){background:linear-gradient(180deg,#F7FBFE,#ECF4F9)!important}
.resource-country-panel,
.global-context-card{
  padding:18px!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#F8FBFE,#EAF3FA)!important;
}
.resource-scope-pill{border-radius:999px!important}
.resource-actions a,.resource-actions button{
  border-radius:999px!important;
  padding:8px 12px!important;
  background:rgba(255,255,255,.55)!important;
}

/* ---------- Private ---------- */
.tool-stack{display:grid!important;gap:14px!important}
.tool-panel{
  padding:24px 20px!important;
  border-radius:22px!important;
  background:rgba(252,248,241,.92)!important;
}
.tool-panel:nth-child(1){background:linear-gradient(180deg,#FFF7DA,#FFF1BD)!important}
.tool-panel:nth-child(2){background:linear-gradient(180deg,#FBF8F2,#F7F0E7)!important}
.tool-panel:nth-child(3){background:linear-gradient(180deg,#F4F9FD,#E8F2F8)!important}
.tool-panel h3{font-size:29px!important}
.mood-grid{gap:8px!important}
.mood-button{
  min-height:40px!important;
  border:1px solid rgba(59,42,32,.13)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.54)!important;
}
.mood-button.selected{background:var(--se-chocolate)!important;color:var(--se-cream)!important}
.journal-entry,.plan-entry{
  margin-top:12px!important;
  padding:18px!important;
  border:1px solid rgba(59,42,32,.10)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.38)!important;
}
.saved-chip{border-radius:999px!important;background:rgba(255,255,255,.55)!important}

/* ---------- Profile / settings ---------- */
.profile-card{padding:8px 18px!important}
.profile-row{
  padding:16px 0!important;
  border-bottom:1px solid rgba(59,42,32,.10)!important;
}
.profile-row:last-child{border-bottom:0!important}
.settings-list{display:grid!important;gap:9px!important;margin-top:16px!important}
.settings-button{
  min-height:58px!important;
  padding:14px 16px!important;
  border:1px solid var(--se-card-border)!important;
  border-radius:17px!important;
  background:rgba(252,248,241,.88)!important;
  box-shadow:0 7px 18px rgba(59,42,32,.035)!important;
}
.settings-button:nth-child(even){background:linear-gradient(180deg,#F8FBFE,#EDF5FA)!important}

/* ---------- bottom nav ---------- */
.bottom-nav{
  height:calc(76px + env(safe-area-inset-bottom,0px))!important;
  padding:7px 10px env(safe-area-inset-bottom,0px)!important;
  border-top:1px solid rgba(59,42,32,.10)!important;
  background:rgba(251,247,239,.95)!important;
  box-shadow:0 -8px 28px rgba(59,42,32,.045)!important;
}
.nav-item{
  border-radius:16px!important;
  transition:background .18s ease,color .18s ease!important;
}
.nav-item.active{
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(247,239,225,.92))!important;
  color:var(--se-chocolate)!important;
  box-shadow:0 5px 16px rgba(59,42,32,.04)!important;
}
.nav-item.active::after{
  width:6px!important;height:6px!important;
  border-radius:50%!important;
  margin-top:3px!important;
  background:var(--se-butter)!important;
}

/* ---------- subtle feminine punctuation ---------- */
.page-title::after,.section-title::after{
  content:"";
  display:block;
  width:42px;height:1px;
  margin-top:13px;
  background:linear-gradient(90deg,var(--se-butter),transparent);
}
.center.page-title::after{margin-left:auto;margin-right:auto}

/* ---------- mobile ---------- */
@media(max-width:390px){
  .home-card{grid-template-columns:24px 38px 1fr 15px!important;padding:16px 14px!important}
  .home-card h3{font-size:23px!important}
  .home-guide,.approved-home-guide{padding:26px 20px!important}
  .post{padding:20px 17px!important}
  .settings-button{min-height:54px!important}
  .quick-exit{right:14px!important}
}