/* R416: Community directory/detail — flat navigation and contextual cards.
 * Verified create, joining persona, posting & moderation controls unchanged.
 */
html body .comShell{padding:10px 14px calc(96px + env(safe-area-inset-bottom,0px))!important}
html body .comNav{min-height:46px!important}
html body .comNav .comBack{
  min-width:44px!important;width:44px!important;min-height:44px!important;height:44px!important;
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important
}
html body .comHero{padding:12px 2px 9px!important}
html body .comHero h1{font:600 clamp(29px,8vw,39px)/1.05 Georgia,serif!important;margin:3px 0 5px!important}
html body .comHero p{font-size:12px!important;line-height:1.45!important;margin:5px 0!important}
html body .comTools{
  background:transparent!important;box-shadow:none!important;
  border:0!important;border-radius:0!important;
  padding:5px 0 8px!important;margin:0!important
}
html body .comLabel{font-size:12px!important;margin-bottom:10px!important}
html body .comFilterLine{gap:9px!important;margin-top:7px!important}
html body .comFilterLine select{
  min-width:0!important;
  background:#0e0e15!important;border-color:rgba(255,255,255,.16)!important;
  border-radius:8px!important;min-height:44px!important;
  font-size:12px!important;padding:7px!important
}
html body #comSearch{
  min-height:45px!important;
  background:transparent!important;border:0!important;
  border-bottom:1px solid rgba(255,255,255,.3)!important;border-radius:0!important;
  box-shadow:none!important
}
html body #comSearch:focus{
  outline:0!important;border-bottom:2px solid var(--c-purple,#b06fff)!important
}
html body .comButtons{
  display:flex!important;flex-wrap:nowrap!important;gap:0!important;
  align-items:stretch!important;margin-top:9px!important;min-height:46px!important
}
html body[data-community-view="directory"] .comButtons #comAll,
html body[data-community-view="directory"] .comButtons #comMine{
  flex:1 1 27%!important;min-width:0!important;min-height:44px!important;
  padding:8px 2px!important;margin:0!important;border:0!important;
  border-bottom:2px solid transparent!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  color:rgba(255,255,255,.65)!important;
  font:830 clamp(11px,3vw,14px)/1.2 system-ui,sans-serif!important
}
html body[data-community-view="directory"] .comButtons #comAll.comBtnOn,
html body[data-community-view="directory"] .comButtons #comMine.comBtnOn{
  color:var(--c-purple,#b068ff)!important;border-bottom-color:var(--c-purple,#b068ff)!important
}
html body[data-community-view="directory"] .comButtons #comCreateToggle{
  flex:1 1 46%!important;min-width:0!important;
  margin:0 0 0 6px!important;padding:8px 6px!important;
  min-height:43px!important;border:0!important;border-radius:9px!important;
  box-shadow:none!important;
  font:850 clamp(11px,3.1vw,14px)/1.2 system-ui,sans-serif!important;
  background:linear-gradient(115deg,#8846db,#b143aa)!important
}
html body .comSection{padding-top:11px!important}
html body .comSection h2{font-size:18px!important;margin:0 0 9px!important}
html body .comCards{gap:0!important}
html body .comCard{
  padding:13px 2px!important;margin:0!important;
  border:0!important;border-bottom:1px solid rgba(255,255,255,.1)!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important
}
html body .comIcon{border-radius:12px!important}
html body .comTag{
  margin-right:6px!important;background:transparent!important;
  border:0!important;border-radius:0!important;
  padding:2px 0!important;color:#caa6ee!important
}
/* Unlike decorative filter cards, these contain permission-gated forms. */
html body :is(#comCreateArea,#comJoinPersonaWrap,#comMemberWrite){
  margin:10px 0!important;padding:12px 2px!important;
  border:0!important;border-top:1px solid rgba(255,255,255,.17)!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important
}
html body .comDetailHeader{padding-bottom:9px!important}
html body #comRules{
  padding:8px 0!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important
}
html body .comButtons #comShare,
html body .comButtons #comLeave,
html body #comLoadMore{
  min-height:44px!important;padding:8px 10px!important;
  border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  color:var(--c-purple,#c38aff)!important
}
html body .comButtons #comJoin,
html body #comCreateSubmit,
html body #comPostSubmit{
  min-height:44px!important;border:0!important;border-radius:9px!important;
  background:linear-gradient(115deg,#7b3dda,#ab399e)!important;box-shadow:none!important
}
html body .comNotice{padding:9px 2px!important;line-height:1.45!important}
html body .comFooter{margin-top:23px!important;line-height:1.5!important}
html body :is(.comBack,.comBtn,.comCard,.comTextLink):focus-visible{
  outline:2px solid var(--c-purple,#c88dff)!important;outline-offset:2px!important
}
@media(max-width:360px){
 html body .comShell{padding:8px 10px 90px!important}
 html body .comFilterLine{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html body .comFilterLine select{font-size:11px!important}
 html body[data-community-view="directory"] .comButtons #comCreateToggle{font-size:11px!important}
}