/* HUMANIDAD Design System — BETA 20 surface transport v1
Visual-only layer from approved Penpot HDS.
Scope: Profile, Messages, Search/Person drawer, Invitations/Claims. */

:root{
  --h20-canvas:#030711;--h20-world:#02050a;--h20-surface:#07111f;--h20-elevated:#0b1320;
  --h20-border:#202c3a;--h20-border-strong:#334a63;--h20-text:#f3f0e9;
  --h20-text-2:#b7c0cc;--h20-text-3:#8d99a9;--h20-gold:#c9ad68;--h20-gold-soft:#ead69e;
  --h20-card:20px;--h20-control:14px;
}

/* Shared */
.account-view[data-view="profile"],.account-view[data-view="messages"],.account-view[data-view="invitations"]{color:var(--h20-text)!important}
.account-view[data-view="profile"] h1,.account-view[data-view="profile"] h2,.account-view[data-view="profile"] h3,
.account-view[data-view="messages"] h1,.account-view[data-view="messages"] h2,.account-view[data-view="messages"] h3,
.account-view[data-view="invitations"] h1,.account-view[data-view="invitations"] h2,.account-view[data-view="invitations"] h3{
  font-family:"Playfair Display",Georgia,serif!important;color:var(--h20-text)!important
}
.account-view[data-view="profile"] .account-kicker,.account-view[data-view="messages"] .account-kicker,
.account-view[data-view="invitations"] .account-kicker{color:var(--h20-gold)!important}

/* Profile */
.account-view[data-view="profile"] .profile-v50{max-width:1180px!important;margin:0 auto!important;padding:18px 0 34px!important}
.account-view[data-view="profile"] .profile-v50-hero{
  min-height:280px!important;border:1px solid var(--h20-border)!important;border-radius:24px!important;
  overflow:hidden!important;background:var(--h20-world)!important;box-shadow:none!important
}
.account-view[data-view="profile"] .profile-v50-cover{
  background:radial-gradient(circle at 76% 24%,rgba(201,173,104,.12),transparent 28%),linear-gradient(145deg,#08121e,#030711)!important
}
.account-view[data-view="profile"] .profile-v50-hero-content{min-height:280px!important;padding:30px!important;gap:26px!important}
.account-view[data-view="profile"] .profile-v50-avatar{
  width:150px!important;height:150px!important;border:1px solid rgba(201,173,104,.62)!important;
  box-shadow:0 0 0 8px rgba(201,173,104,.06)!important
}
.account-view[data-view="profile"] .profile-v50-name-row h3{
  color:var(--h20-text)!important;font-size:clamp(34px,3vw,48px)!important;letter-spacing:-.025em!important
}
.account-view[data-view="profile"] .profile-v50-badge,.account-view[data-view="profile"] .profile-v50-meta,
.account-view[data-view="profile"] .profile-social-v2-status{color:var(--h20-text-3)!important}
.account-view[data-view="profile"] .profile-social-v2-tabs{
  gap:6px!important;padding:6px!important;border:1px solid var(--h20-border)!important;border-radius:16px!important;
  background:rgba(7,17,31,.94)!important;box-shadow:none!important
}
.account-view[data-view="profile"] .profile-social-v2-tabs button{
  min-height:42px!important;border-radius:var(--h20-control)!important;color:var(--h20-text-3)!important;
  font:600 10px/1 Inter,Arial,sans-serif!important
}
.account-view[data-view="profile"] .profile-social-v2-tabs button:hover,
.account-view[data-view="profile"] .profile-social-v2-tabs button.is-active{
  background:rgba(201,173,104,.10)!important;color:var(--h20-gold-soft)!important
}
.account-view[data-view="profile"] .profile-v50-stats,.account-view[data-view="profile"] .profile-v50-card,
.account-view[data-view="profile"] .profile-social-v2-panel>*,
.account-view[data-view="profile"] .activity-card,.account-view[data-view="profile"] .composer-card{
  border:1px solid var(--h20-border)!important;border-radius:var(--h20-card)!important;
  background:var(--h20-surface)!important;box-shadow:none!important
}
.account-view[data-view="profile"] .profile-v50-card,.account-view[data-view="profile"] .activity-card,
.account-view[data-view="profile"] .composer-card{padding:22px!important}

/* Messages */
.account-view[data-view="messages"]{max-width:1180px!important;margin:0 auto!important;padding-top:18px!important}
.account-view[data-view="messages"] .social-head{margin-bottom:18px!important}
.account-view[data-view="messages"] .social-head h2{margin:4px 0 0!important;font-size:clamp(30px,3vw,42px)!important}
.account-view[data-view="messages"] .messages-layout{
  display:grid!important;grid-template-columns:300px minmax(0,1fr)!important;min-height:560px!important;max-height:690px!important;
  border:1px solid var(--h20-border)!important;border-radius:22px!important;overflow:hidden!important;
  background:var(--h20-world)!important;box-shadow:none!important
}
.account-view[data-view="messages"] .conversation-list{
  min-width:0!important;padding:12px!important;border-right:1px solid var(--h20-border)!important;
  background:var(--h20-surface)!important;overflow-y:auto!important
}
.account-view[data-view="messages"] .conversation-list button{
  width:100%!important;min-height:64px!important;margin:0 0 8px!important;padding:12px 14px!important;
  border:1px solid transparent!important;border-radius:15px!important;background:transparent!important;
  color:var(--h20-text-2)!important;font-family:Inter,Arial,sans-serif!important;text-align:left!important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease!important
}
.account-view[data-view="messages"] .conversation-list button:hover,
.account-view[data-view="messages"] .conversation-list button:focus-visible,
.account-view[data-view="messages"] .conversation-list button.is-active,
.account-view[data-view="messages"] .conversation-list button[aria-current="true"]{
  border-color:var(--h20-border-strong)!important;background:var(--h20-elevated)!important;color:var(--h20-text)!important;outline:none!important
}
.account-view[data-view="messages"] .chat-panel{
  min-width:0!important;padding:20px!important;background:linear-gradient(180deg,#07111f,#050a12)!important;overflow:hidden!important
}
.account-view[data-view="messages"] .empty-chat{
  max-width:340px!important;margin:auto!important;color:var(--h20-text-3)!important;
  font:400 12px/1.55 Inter,Arial,sans-serif!important;text-align:center!important
}
.account-view[data-view="messages"] .chat-messages{min-height:0!important;padding:8px 4px 10px!important;gap:10px!important;overflow-y:auto!important}
.account-view[data-view="messages"] .bubble{
  max-width:min(72%,560px)!important;padding:11px 14px!important;border:1px solid rgba(255,255,255,.025)!important;
  border-radius:16px!important;background:var(--h20-elevated)!important;color:var(--h20-text-2)!important;line-height:1.5!important
}
.account-view[data-view="messages"] .bubble.mine{
  border-color:rgba(201,173,104,.38)!important;background:#201e19!important;color:var(--h20-gold-soft)!important
}
.account-view[data-view="messages"] .chat-compose{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;margin-top:14px!important;
  padding-top:14px!important;border-top:1px solid var(--h20-border)!important
}
.account-view[data-view="messages"] .chat-compose .account-field{
  min-height:44px!important;border:1px solid var(--h20-border)!important;border-radius:14px!important;
  background:var(--h20-elevated)!important;color:var(--h20-text)!important
}
.account-view[data-view="messages"] .chat-compose .account-action{
  min-width:104px!important;min-height:44px!important;border-radius:14px!important;background:var(--h20-gold)!important;color:#101014!important
}
.account-view[data-view="messages"] .chat-status{grid-column:1/-1!important;color:var(--h20-text-3)!important}

/* Invitations */
.account-view[data-view="invitations"]{max-width:1180px!important;margin:0 auto!important;padding-top:18px!important}
.beta20-invitations .beta20-page-head{margin-bottom:18px!important}
.beta20-invitations .beta20-page-head h2{margin:4px 0 6px!important;font-size:clamp(32px,3vw,44px)!important}
.beta20-invitations .beta20-invite-summary{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;
  padding:0!important;margin-bottom:20px!important;border:0!important;background:transparent!important
}
.beta20-invitations .beta20-invite-summary span{
  display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:6px!important;
  min-height:86px!important;padding:14px 16px!important;border:1px solid var(--h20-border)!important;
  border-radius:16px!important;background:var(--h20-surface)!important;color:var(--h20-text-3)!important
}
.beta20-invitations .beta20-invite-summary strong{
  color:var(--h20-gold-soft)!important;font:600 26px/1 "Playfair Display",Georgia,serif!important
}
.beta20-invitations .beta20-invite-form-host>*,
.beta20-invitations .connection-card,.beta20-invitations .member-invitation-card,
.beta20-invitations .member-invitation-history{
  border:1px solid var(--h20-border)!important;border-radius:18px!important;background:var(--h20-surface)!important;box-shadow:none!important
}
.beta20-invitations .beta20-invite-form-host>*{padding:22px!important}
.beta20-invitations .invitation-flow-steps{gap:7px!important;margin:0 0 18px!important}
.beta20-invitations .invitation-flow-steps span{
  min-height:30px!important;padding:0 11px!important;border:1px solid rgba(201,173,104,.28)!important;
  border-radius:999px!important;background:#201e19!important;color:var(--h20-gold-soft)!important
}
.beta20-invitations .connection-card,.beta20-invitations .member-invitation-card{padding:16px!important;color:var(--h20-text-2)!important}
.beta20-invitations .connection-card small,.beta20-invitations .member-invitation-card small{color:var(--h20-text-3)!important}
.beta20-invitations .family-list-head{margin:24px 0 10px!important}
.beta20-invitations .family-list-head h3{margin:0 0 4px!important;font-size:20px!important}
.beta20-invitations .family-list-head small{color:var(--h20-gold)!important}
.beta20-invitations .account-field{
  border-color:var(--h20-border)!important;border-radius:14px!important;background:var(--h20-elevated)!important;color:var(--h20-text)!important
}
.beta20-invitations .account-action{border-radius:14px!important}

/* Search result cards */
#familyPeopleResults .people-result[data-humanity-search-interactive="true"],
#peopleResults .people-result[data-humanity-search-interactive="true"]{
  min-height:76px!important;padding:14px 16px!important;margin-bottom:10px!important;border:1px solid var(--h20-border)!important;
  border-radius:16px!important;background:var(--h20-surface)!important;color:var(--h20-text)!important;cursor:pointer!important;
  transition:transform .18s ease,border-color .18s ease,background-color .18s ease!important
}
#familyPeopleResults .people-result[data-humanity-search-interactive="true"]:hover,
#peopleResults .people-result[data-humanity-search-interactive="true"]:hover,
#familyPeopleResults .people-result[data-humanity-search-interactive="true"]:focus-visible,
#peopleResults .people-result[data-humanity-search-interactive="true"]:focus-visible{
  transform:translateY(-1px)!important;border-color:var(--h20-border-strong)!important;background:var(--h20-elevated)!important;
  outline:2px solid rgba(201,173,104,.28)!important;outline-offset:2px!important
}
#familyPeopleResults .people-result strong,#peopleResults .people-result strong{
  color:var(--h20-text)!important;font-family:"Playfair Display",Georgia,serif!important
}
#familyPeopleResults .people-result small,#peopleResults .people-result small{color:var(--h20-text-3)!important}

/* Search profile drawer */
.humanidad-search-profile-drawer{background:rgba(2,5,10,.72)!important;backdrop-filter:blur(10px)!important}
.humanidad-search-profile-drawer>section{
  width:min(460px,100%)!important;padding:28px!important;border-left:1px solid var(--h20-border-strong)!important;
  background:linear-gradient(180deg,#07111f,#040a12)!important;color:var(--h20-text)!important;
  box-shadow:-24px 0 70px rgba(0,0,0,.42)!important
}
.humanidad-search-profile-drawer>section>button{
  border:1px solid var(--h20-border)!important;border-radius:999px!important;background:var(--h20-elevated)!important;
  color:var(--h20-gold-soft)!important;font-family:Inter,Arial,sans-serif!important
}
.humanidad-search-profile-drawer>section>h2{
  margin:20px 0 6px!important;color:var(--h20-text)!important;
  font:600 30px/1.08 "Playfair Display",Georgia,serif!important;letter-spacing:-.02em!important
}
.humanidad-search-profile-drawer>section>p{
  color:var(--h20-text-2)!important;font:400 12px/1.6 Inter,Arial,sans-serif!important
}
.humanidad-search-profile-drawer [data-humanity-person-action="connect"]{
  min-height:42px!important;padding:0 16px!important;border:0!important;border-radius:14px!important;
  background:var(--h20-gold)!important;color:#101014!important;font:600 11px/1 Inter,Arial,sans-serif!important
}
.humanidad-search-profile-drawer [data-humanity-person-action="connect"]:disabled{opacity:.58!important;cursor:not-allowed!important}

/* Mobile */
@media(max-width:680px){
  .account-view[data-view="profile"],.account-view[data-view="messages"],.account-view[data-view="invitations"]{padding:14px 14px 92px!important}
  .account-view[data-view="profile"] .profile-v50{padding-top:4px!important}
  .account-view[data-view="profile"] .profile-v50-hero{min-height:0!important;border-radius:20px!important}
  .account-view[data-view="profile"] .profile-v50-hero-content{min-height:0!important;grid-template-columns:1fr!important;padding:20px!important;gap:14px!important}
  .account-view[data-view="profile"] .profile-v50-avatar{width:72px!important;height:72px!important}
  .account-view[data-view="profile"] .profile-v50-name-row h3{font-size:30px!important}
  .account-view[data-view="profile"] .profile-social-v2-tabs{overflow-x:auto!important;scrollbar-width:none!important}
  .account-view[data-view="profile"] .profile-social-v2-tabs::-webkit-scrollbar{display:none!important}
  .account-view[data-view="profile"] .profile-social-v2-tabs button{flex:0 0 auto!important;min-width:104px!important}
  .account-view[data-view="profile"] .profile-v50-grid,.account-view[data-view="profile"] .profile-v50-stats{grid-template-columns:1fr!important}

  .account-view[data-view="messages"] .social-head{margin:0 0 12px!important}
  .account-view[data-view="messages"] .social-head h2{font-size:30px!important}
  .account-view[data-view="messages"] .messages-layout{
    display:flex!important;flex-direction:column!important;min-height:560px!important;height:auto!important;max-height:none!important;border-radius:20px!important
  }
  .account-view[data-view="messages"] .conversation-list{
    display:flex!important;flex:0 0 auto!important;gap:8px!important;padding:10px!important;border-right:0!important;
    border-bottom:1px solid var(--h20-border)!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important
  }
  .account-view[data-view="messages"] .conversation-list::-webkit-scrollbar{display:none!important}
  .account-view[data-view="messages"] .conversation-list button{flex:0 0 236px!important;min-width:0!important;min-height:58px!important;margin:0!important}
  .account-view[data-view="messages"] .chat-panel{min-height:420px!important;padding:14px!important}
  .account-view[data-view="messages"] .bubble{max-width:86%!important}

  .beta20-invitations .beta20-page-head h2{font-size:32px!important}
  .beta20-invitations .beta20-invite-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .beta20-invitations .beta20-invite-summary span{min-height:74px!important;padding:12px!important}
  .beta20-invitations .beta20-invite-summary strong{font-size:22px!important}
  .beta20-invitations .beta20-invite-form-host>*{padding:16px!important}
  .beta20-invitations .invitation-flow-steps{
    overflow-x:auto!important;flex-wrap:nowrap!important;padding-bottom:3px!important;scrollbar-width:none!important
  }
  .beta20-invitations .invitation-flow-steps::-webkit-scrollbar{display:none!important}
  .beta20-invitations .invitation-flow-steps span{flex:0 0 auto!important}
  .beta20-invitations .connection-card,.beta20-invitations .member-invitation-card{
    align-items:flex-start!important;flex-direction:column!important;gap:10px!important
  }

  .humanidad-search-profile-drawer{align-items:flex-end!important;justify-content:stretch!important}
  .humanidad-search-profile-drawer>section{
    width:100%!important;height:min(82dvh,720px)!important;padding:24px 18px calc(28px + env(safe-area-inset-bottom))!important;
    border-left:0!important;border-top:1px solid var(--h20-border-strong)!important;border-radius:26px 26px 0 0!important;overflow:auto!important
  }
  .humanidad-search-profile-drawer>section::before{
    content:""!important;display:block!important;width:44px!important;height:4px!important;margin:-10px auto 14px!important;
    border-radius:999px!important;background:rgba(234,214,158,.38)!important
  }
}

@media(prefers-reduced-motion:reduce){
  #familyPeopleResults .people-result,#peopleResults .people-result,
  .account-view[data-view="messages"] .conversation-list button{transition:none!important}
}


/* TREE + PERSON DRAWER — hierarchy only, geometry/data contracts preserved */
.account-view[data-view="tree"] .tree-social-head{
  border:1px solid var(--h20-border)!important;
  border-radius:18px!important;
  background:var(--h20-surface)!important;
  color:var(--h20-text)!important;
  box-shadow:none!important;
}
.account-view[data-view="tree"] .tree-social-head h2{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
}
.account-view[data-view="tree"] .tree-help,
.account-view[data-view="tree"] .tree-workspace-status,
.account-view[data-view="tree"] .tree-selector-wrap>span{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="tree"] .tree-selector-wrap,
.account-view[data-view="tree"] .tree-project-manager{
  border-color:var(--h20-border)!important;
  background:var(--h20-surface)!important;
}
.account-view[data-view="tree"] .tree-selector-wrap select,
.account-view[data-view="tree"] .tree-project-manager select{
  border-color:var(--h20-border)!important;
  background:var(--h20-elevated)!important;
  color:var(--h20-text)!important;
}
.account-view[data-view="tree"] .humanidad-f3-card,
.account-view[data-view="tree"] .tree-node{
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
}
.account-view[data-view="tree"] .card.node-selected .humanidad-f3-card,
.account-view[data-view="tree"] .tree-node[aria-selected="true"],
.account-view[data-view="tree"] .tree-node.selected{
  border-color:rgba(201,173,104,.72)!important;
  box-shadow:0 0 0 1px rgba(201,173,104,.16),0 14px 34px rgba(0,0,0,.20)!important;
}
.account-view[data-view="tree"] .humanidad-f3-card.is-memorial,
.account-view[data-view="tree"] .tree-node.is-memorial{
  border-color:rgba(201,173,104,.42)!important;
  background:linear-gradient(180deg,#12130f,#0a0d10)!important;
}
.account-view[data-view="tree"] .humanidad-f3-life,
.account-view[data-view="tree"] .ht-drawer-life,
.account-view[data-view="tree"] .ht-drawer-place{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="tree"] .ht-memory-light,
.account-view[data-view="tree"] .ht-memory-dot{
  color:var(--h20-gold-soft)!important;
  filter:drop-shadow(0 0 7px rgba(201,173,104,.42))!important;
}

/* Canonical tree person drawer */
.person-drawer.ht-person-drawer{
  border-color:var(--h20-border-strong)!important;
  background:linear-gradient(180deg,#07111f,#040a12)!important;
  color:var(--h20-text)!important;
  box-shadow:0 26px 80px rgba(0,0,0,.48)!important;
}
.person-drawer.ht-person-drawer .ht-drawer-header{
  border-bottom-color:var(--h20-border)!important;
  background:var(--h20-surface)!important;
  box-shadow:none!important;
}
.person-drawer.ht-person-drawer .ht-drawer-avatar{
  border-color:rgba(234,214,158,.55)!important;
  background:linear-gradient(145deg,#ead69e,#a98240)!important;
  color:#101014!important;
  box-shadow:none!important;
}
.person-drawer.ht-person-drawer .ht-drawer-name{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
  font-weight:600!important;
}
.person-drawer.ht-person-drawer .ht-drawer-role{
  color:var(--h20-gold)!important;
}
.person-drawer.ht-person-drawer .ht-memorial-state{
  border-color:rgba(201,173,104,.28)!important;
  background:#211a12!important;
  color:var(--h20-gold-soft)!important;
}
.person-drawer.ht-person-drawer .ht-section{
  border-bottom-color:var(--h20-border)!important;
}
.person-drawer.ht-person-drawer .ht-section-title{
  color:var(--h20-text-3)!important;
}
.person-drawer.ht-person-drawer .ht-section-title:after{
  background:linear-gradient(90deg,rgba(201,173,104,.22),transparent 72%)!important;
}
.person-drawer.ht-person-drawer .account-field{
  border-color:var(--h20-border)!important;
  border-radius:14px!important;
  background:var(--h20-elevated)!important;
  color:var(--h20-text)!important;
}
.person-drawer.ht-person-drawer .account-action{
  min-height:42px!important;
  border-radius:14px!important;
}
.person-drawer.ht-person-drawer .account-action:not(.secondary){
  background:var(--h20-gold)!important;
  color:#101014!important;
}
.person-drawer.ht-person-drawer .account-action.secondary{
  border:1px solid var(--h20-border-strong)!important;
  background:var(--h20-elevated)!important;
  color:var(--h20-text)!important;
}
.person-drawer.ht-person-drawer .account-action:focus-visible,
.person-drawer.ht-person-drawer .ht-drawer-close:focus-visible{
  outline:2px solid rgba(234,214,158,.72)!important;
  outline-offset:2px!important;
}

/* Generic person drawer fallback */
.person-drawer:not(.ht-person-drawer){
  border-color:var(--h20-border-strong)!important;
  background:linear-gradient(180deg,#07111f,#040a12)!important;
  color:var(--h20-text)!important;
  box-shadow:0 26px 80px rgba(0,0,0,.48)!important;
}
.person-drawer:not(.ht-person-drawer) h2,
.person-drawer:not(.ht-person-drawer) h3{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
}
.person-drawer:not(.ht-person-drawer) .person-drawer-close{
  color:var(--h20-gold-soft)!important;
}

@media(max-width:680px){
  .person-drawer.ht-person-drawer,
  .person-drawer:not(.ht-person-drawer){
    left:0!important;right:0!important;top:auto!important;bottom:0!important;
    transform:none!important;width:100%!important;
    height:min(88dvh,760px)!important;max-height:none!important;
    padding-bottom:calc(28px + env(safe-area-inset-bottom))!important;
    border-left:0!important;border-right:0!important;border-bottom:0!important;
    border-radius:26px 26px 0 0!important;overflow-y:auto!important;
  }
  .person-drawer.ht-person-drawer::before,
  .person-drawer:not(.ht-person-drawer)::before{
    content:""!important;display:block!important;width:44px!important;height:4px!important;
    margin:10px auto 6px!important;border-radius:999px!important;
    background:rgba(234,214,158,.36)!important;
  }
  .person-drawer.ht-person-drawer .ht-drawer-header{
    grid-template-columns:52px minmax(0,1fr) 36px!important;
    gap:12px!important;padding:16px 18px!important;
  }
  .person-drawer.ht-person-drawer .ht-drawer-avatar{width:52px!important;height:52px!important}
  .person-drawer.ht-person-drawer .ht-drawer-name{font-size:20px!important}
  .person-drawer.ht-person-drawer .ht-drawer-body{padding:14px 18px 30px!important}
}

@media(prefers-reduced-motion:reduce){
  .account-view[data-view="tree"] .humanidad-f3-card,
  .account-view[data-view="tree"] .tree-node{transition:none!important}
}


/* MEMORIES / STORIES — archival HDS surface */
.account-view[data-view="memories"]{
  max-width:1180px!important;
  margin:0 auto!important;
  padding-top:18px!important;
  color:var(--h20-text)!important;
}
.account-view[data-view="memories"] .beta20-page-head{
  margin-bottom:18px!important;
}
.account-view[data-view="memories"] .beta20-page-head h2{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
  font-size:clamp(34px,3.4vw,48px)!important;
  line-height:1.05!important;
}
.account-view[data-view="memories"] .beta20-page-head p,
.account-view[data-view="memories"] .beta20-memory-note{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="memories"] .beta20-memory-toolbar{
  margin-bottom:16px!important;
  padding:10px 0!important;
}
.account-view[data-view="memories"] .beta20-memory-grid{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:14px!important;
}
.account-view[data-view="memories"] .beta20-memory-card{
  grid-column:span 6!important;
  min-height:230px!important;
  padding:22px!important;
  border:1px solid var(--h20-border)!important;
  border-radius:20px!important;
  background:linear-gradient(155deg,#091321,#050a12)!important;
  color:var(--h20-text)!important;
  box-shadow:none!important;
  transition:transform .18s ease,border-color .18s ease!important;
}
.account-view[data-view="memories"] .beta20-memory-card:hover,
.account-view[data-view="memories"] .beta20-memory-card:focus-within{
  transform:translateY(-2px)!important;
  border-color:var(--h20-border-strong)!important;
}
.account-view[data-view="memories"] .beta20-memory-card h3{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
  font-size:26px!important;
}
.account-view[data-view="memories"] .beta20-memory-card p,
.account-view[data-view="memories"] .beta20-memory-card small{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="memories"] .hmemory-overlay{
  background:rgba(2,5,10,.78)!important;
  backdrop-filter:blur(10px)!important;
}
.account-view[data-view="memories"] .hmemory-sheet{
  border:1px solid var(--h20-border-strong)!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,#07111f,#040a12)!important;
  color:var(--h20-text)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.52)!important;
}
.account-view[data-view="memories"] .hmemory-content h3{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
}
.account-view[data-view="memories"] .hmemory-body,
.account-view[data-view="memories"] .hmemory-meta small{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="memories"] .hmemory-person,
.account-view[data-view="memories"] .hmemory-meta>div{
  border-color:var(--h20-border)!important;
  background:var(--h20-surface)!important;
}
.account-view[data-view="memories"] .hmemory-close:focus-visible,
.account-view[data-view="memories"] .hmemory-person:focus-visible{
  outline:2px solid rgba(234,214,158,.72)!important;
  outline-offset:2px!important;
}

/* MURAL — public social surface, behavior preserved */
.account-view[data-view="mural"]{
  max-width:1180px!important;
  margin:0 auto!important;
  padding-top:18px!important;
  color:var(--h20-text)!important;
}
.account-view[data-view="mural"] .social-head h2{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
  font-size:clamp(34px,3.4vw,48px)!important;
}
.account-view[data-view="mural"] .mural-intro{
  max-width:760px!important;
  margin:-8px 0 18px!important;
  color:var(--h20-text-3)!important;
  line-height:1.65!important;
}
.account-view[data-view="mural"] .mural-composer{
  padding:20px!important;
  margin-bottom:16px!important;
  border:1px solid var(--h20-border)!important;
  border-radius:20px!important;
  background:var(--h20-surface)!important;
  box-shadow:none!important;
}
.account-view[data-view="mural"] .mural-composer textarea,
.account-view[data-view="mural"] .mural-comment-row input{
  border-color:var(--h20-border)!important;
  color:var(--h20-text)!important;
}
.account-view[data-view="mural"] .mural-composer small{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="mural"] .mural-card{
  padding:20px!important;
  margin-bottom:14px!important;
  border:1px solid var(--h20-border)!important;
  border-radius:20px!important;
  background:var(--h20-surface)!important;
  box-shadow:none!important;
}
.account-view[data-view="mural"] .mural-head-meta strong{
  color:var(--h20-text)!important;
  font-family:"Playfair Display",Georgia,serif!important;
}
.account-view[data-view="mural"] .mural-head-meta small,
.account-view[data-view="mural"] .mural-comment small{
  color:var(--h20-text-3)!important;
}
.account-view[data-view="mural"] .mural-body,
.account-view[data-view="mural"] .mural-comment p{
  color:var(--h20-text-2)!important;
}
.account-view[data-view="mural"] .mural-actions{
  gap:8px!important;
}
.account-view[data-view="mural"] .mural-mini{
  min-height:34px!important;
  padding:0 12px!important;
  border:1px solid var(--h20-border)!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--h20-gold-soft)!important;
  font-family:Inter,Arial,sans-serif!important;
  transition:border-color .18s ease,background-color .18s ease!important;
}
.account-view[data-view="mural"] .mural-mini:hover,
.account-view[data-view="mural"] .mural-mini:focus-visible{
  border-color:rgba(201,173,104,.52)!important;
  background:rgba(201,173,104,.08)!important;
  outline:none!important;
}
.account-view[data-view="mural"] .mural-comments{
  border-top-color:var(--h20-border)!important;
}
.account-view[data-view="mural"] .mural-comment-row .account-field{
  border:1px solid var(--h20-border)!important;
  border-radius:14px!important;
  background:var(--h20-elevated)!important;
  color:var(--h20-text)!important;
}

@media(max-width:680px){
  .account-view[data-view="memories"],
  .account-view[data-view="mural"]{
    padding:14px 14px 92px!important;
  }
  .account-view[data-view="memories"] .beta20-page-head,
  .account-view[data-view="mural"] .social-head{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:12px!important;
  }
  .account-view[data-view="memories"] .beta20-page-head h2,
  .account-view[data-view="mural"] .social-head h2{
    font-size:32px!important;
  }
  .account-view[data-view="memories"] .beta20-memory-grid{
    grid-template-columns:1fr!important;
  }
  .account-view[data-view="memories"] .beta20-memory-card{
    grid-column:auto!important;
    min-height:200px!important;
  }
  .account-view[data-view="memories"] .hmemory-sheet{
    width:100%!important;
    max-height:88dvh!important;
    margin-top:auto!important;
    border-radius:26px 26px 0 0!important;
    overflow:auto!important;
  }
  .account-view[data-view="mural"] .mural-composer,
  .account-view[data-view="mural"] .mural-card{
    padding:16px!important;
    border-radius:18px!important;
  }
  .account-view[data-view="mural"] .mural-composer>div,
  .account-view[data-view="mural"] .mural-comment-row{
    align-items:stretch!important;
    flex-direction:column!important;
  }
  .account-view[data-view="mural"] .mural-comment-row button{
    width:100%!important;
  }
}