/* OSANIME Member Community — Stage 11 Homepage Widgets v224 */
body.index-home-optimized .index-community-stage11{
  position:relative!important;
  margin-top:16px!important;
  padding:18px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(255,54,146,.09),transparent 30%),
    radial-gradient(circle at 92% 16%,rgba(130,105,255,.08),transparent 30%),
    linear-gradient(145deg,rgba(25,27,38,.96),rgba(15,16,24,.98))!important;
  box-shadow:0 18px 50px rgba(0,0,0,.18)!important;
  content-visibility:auto;
  contain-intrinsic-size:760px;
}
body.index-home-optimized .index-community-stage11::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:2px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,67,154,.8),rgba(139,112,255,.68),transparent);
  opacity:.8;
}
body.index-home-optimized .index-community-stage11-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin:0 0 15px!important;
}
body.index-home-optimized .index-community-stage11-head>div{min-width:0!important}
body.index-home-optimized .index-community-stage11-head h2{
  margin:2px 0 3px!important;
  font-size:18px!important;
  line-height:1.18!important;
  letter-spacing:-.02em!important;
}
body.index-home-optimized .index-community-stage11-head p{
  margin:0!important;
  max-width:650px!important;
  color:rgba(231,232,242,.62)!important;
  font-size:10.5px!important;
  line-height:1.55!important;
}
body.index-home-optimized .index-community-stage11-eyebrow{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#ff6eae!important;
  font-size:9px!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
body.index-home-optimized .index-community-stage11-head .see{
  flex:0 0 auto!important;
  min-height:32px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  border:1px solid rgba(255,91,166,.18)!important;
  border-radius:999px!important;
  background:rgba(255,58,149,.075)!important;
  color:#ff82bb!important;
  text-decoration:none!important;
  font-size:9.5px!important;
  font-weight:800!important;
  transition:transform .2s ease,background .2s ease,border-color .2s ease!important;
}
body.index-home-optimized .index-community-stage11-head .see:hover,
body.index-home-optimized .index-community-stage11-head .see:focus-visible{
  transform:translateY(-1px)!important;
  background:rgba(255,58,149,.13)!important;
  border-color:rgba(255,91,166,.32)!important;
}
body.index-home-optimized .index-community-stage11-stats{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:9px!important;
  margin-bottom:12px!important;
}
body.index-home-optimized .index-community-stage11-stat{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:32px auto 1fr!important;
  align-items:center!important;
  gap:8px!important;
  padding:9px 10px!important;
  border:1px solid rgba(255,255,255,.06)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.025)!important;
  color:#f5f5fb!important;
  text-decoration:none!important;
  transition:transform .2s ease,border-color .2s ease,background .2s ease!important;
}
body.index-home-optimized .index-community-stage11-stat:hover,
body.index-home-optimized .index-community-stage11-stat:focus-visible{
  transform:translateY(-1px)!important;
  border-color:rgba(255,83,160,.2)!important;
  background:rgba(255,255,255,.04)!important;
}
body.index-home-optimized .index-community-stage11-stat-icon{
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:10px!important;
  color:#ff70b2!important;
  background:rgba(255,61,151,.1)!important;
  font-size:11px!important;
}
body.index-home-optimized .index-community-stage11-stat.is-online .index-community-stage11-stat-icon{
  color:#6ee7a8!important;
  background:rgba(64,209,139,.09)!important;
}
body.index-home-optimized .index-community-stage11-stat.is-new .index-community-stage11-stat-icon{
  color:#aa98ff!important;
  background:rgba(133,107,255,.1)!important;
}
body.index-home-optimized .index-community-stage11-stat strong{
  font-size:15px!important;
  line-height:1!important;
  letter-spacing:-.025em!important;
}
body.index-home-optimized .index-community-stage11-stat small{
  min-width:0!important;
  overflow:hidden!important;
  color:rgba(230,231,240,.58)!important;
  font-size:9px!important;
  font-weight:700!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.index-home-optimized .index-community-stage11-rails{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
body.index-home-optimized .index-community-stage11-rail{
  min-width:0!important;
  padding:12px!important;
  border:1px solid rgba(255,255,255,.055)!important;
  border-radius:14px!important;
  background:rgba(8,9,15,.27)!important;
}
body.index-home-optimized .index-community-stage11-rail-head{
  display:grid!important;
  grid-template-columns:30px minmax(0,1fr) 28px!important;
  align-items:center!important;
  gap:8px!important;
  margin-bottom:9px!important;
}
body.index-home-optimized .index-community-stage11-rail-icon{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  color:#ff74b4!important;
  background:rgba(255,67,155,.09)!important;
  font-size:10px!important;
}
body.index-home-optimized .index-community-stage11-rail-online .index-community-stage11-rail-icon{color:#6fe8aa!important;background:rgba(60,210,137,.08)!important}
body.index-home-optimized .index-community-stage11-rail-new .index-community-stage11-rail-icon{color:#ac9aff!important;background:rgba(137,111,255,.09)!important}
body.index-home-optimized .index-community-stage11-rail-active .index-community-stage11-rail-icon{color:#ffd477!important;background:rgba(255,194,84,.08)!important}
body.index-home-optimized .index-community-stage11-rail-head h3{
  margin:0!important;
  color:#f3f3f8!important;
  font-size:11px!important;
  line-height:1.25!important;
}
body.index-home-optimized .index-community-stage11-rail-head p{
  margin:2px 0 0!important;
  overflow:hidden!important;
  color:rgba(225,226,235,.48)!important;
  font-size:8.3px!important;
  line-height:1.35!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.index-home-optimized .index-community-stage11-rail-head>a{
  width:28px!important;
  height:28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.035)!important;
  color:rgba(244,244,250,.58)!important;
  text-decoration:none!important;
  font-size:8px!important;
  transition:background .18s ease,color .18s ease,transform .18s ease!important;
}
body.index-home-optimized .index-community-stage11-rail-head>a:hover,
body.index-home-optimized .index-community-stage11-rail-head>a:focus-visible{
  transform:translateX(1px)!important;
  background:rgba(255,67,155,.1)!important;
  color:#ff7fb8!important;
}
body.index-home-optimized .index-community-stage11-member-list{display:grid!important;gap:5px!important}
body.index-home-optimized .index-community-stage11-member{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr) 14px!important;
  align-items:center!important;
  gap:8px!important;
  min-height:48px!important;
  padding:5px 6px!important;
  border-radius:10px!important;
  color:#f1f1f6!important;
  text-decoration:none!important;
  transition:background .18s ease,transform .18s ease!important;
}
body.index-home-optimized .index-community-stage11-member:hover,
body.index-home-optimized .index-community-stage11-member:focus-visible{
  transform:translateX(2px)!important;
  background:rgba(255,255,255,.035)!important;
}
body.index-home-optimized .index-community-stage11-avatar-wrap{
  position:relative!important;
  width:38px!important;
  height:38px!important;
}
body.index-home-optimized .index-community-stage11-avatar-wrap img{
  width:38px!important;
  height:38px!important;
  display:block!important;
  object-fit:cover!important;
  border:1px solid rgba(255,255,255,.1)!important;
  border-radius:50%!important;
  background:#171822!important;
}
body.index-home-optimized .index-community-stage11-online-dot{
  position:absolute!important;
  right:0!important;
  bottom:1px!important;
  width:9px!important;
  height:9px!important;
  border:2px solid #171820!important;
  border-radius:50%!important;
  background:#4bd78e!important;
  box-shadow:0 0 0 2px rgba(75,215,142,.08)!important;
}
body.index-home-optimized .index-community-stage11-member-copy{
  min-width:0!important;
  display:grid!important;
  gap:1px!important;
}
body.index-home-optimized .index-community-stage11-member-copy strong,
body.index-home-optimized .index-community-stage11-member-copy>span,
body.index-home-optimized .index-community-stage11-member-copy small{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.index-home-optimized .index-community-stage11-member-copy strong{font-size:10px!important;line-height:1.2!important}
body.index-home-optimized .index-community-stage11-member-copy>span{color:rgba(225,225,235,.46)!important;font-size:8px!important;line-height:1.2!important}
body.index-home-optimized .index-community-stage11-member-copy small{
  margin-top:2px!important;
  color:rgba(225,225,235,.62)!important;
  font-size:7.8px!important;
  line-height:1.2!important;
}
body.index-home-optimized .index-community-stage11-member-copy small i{margin-right:3px!important;color:#ff71b1!important;font-size:6.8px!important}
body.index-home-optimized .index-community-stage11-rail-online .index-community-stage11-member-copy small i{color:#65dfa1!important}
body.index-home-optimized .index-community-stage11-rail-active .index-community-stage11-member-copy small i{color:#ffd171!important}
body.index-home-optimized .index-community-stage11-member-arrow{color:rgba(226,227,235,.25)!important;font-size:7px!important;transition:color .18s ease!important}
body.index-home-optimized .index-community-stage11-member:hover .index-community-stage11-member-arrow{color:#ff75b5!important}
body.index-home-optimized .index-community-stage11-empty{
  min-height:118px!important;
  display:grid!important;
  place-items:center!important;
  padding:16px!important;
  border:1px dashed rgba(255,255,255,.06)!important;
  border-radius:10px!important;
  color:rgba(224,225,234,.42)!important;
  font-size:8.7px!important;
  line-height:1.45!important;
  text-align:center!important;
}
body.index-home-optimized .index-community-stage11-unavailable{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  padding:12px!important;
  border:1px solid rgba(255,255,255,.06)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.025)!important;
}
body.index-home-optimized .index-community-stage11-unavailable>i{font-size:16px!important;color:#ff71b1!important}
body.index-home-optimized .index-community-stage11-unavailable div{display:grid!important;gap:2px!important}
body.index-home-optimized .index-community-stage11-unavailable strong{font-size:10px!important}
body.index-home-optimized .index-community-stage11-unavailable span{font-size:8.5px!important;color:rgba(224,225,234,.5)!important}
body.index-home-optimized .index-community-stage11-unavailable a{color:#ff79b7!important;font-size:9px!important;font-weight:800!important;text-decoration:none!important}

@media (max-width:900px){
  body.index-home-optimized .index-community-stage11{padding:14px!important}
  body.index-home-optimized .index-community-stage11-rails{grid-template-columns:1fr!important}
  body.index-home-optimized .index-community-stage11-rail{padding:10px!important}
  body.index-home-optimized .index-community-stage11-member-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px!important}
}
@media (max-width:600px){
  body.index-home-optimized .index-community-stage11{margin-top:10px!important;padding:12px 10px!important;border-radius:14px!important;contain-intrinsic-size:980px}
  body.index-home-optimized .index-community-stage11-head{align-items:flex-start!important;gap:8px!important;margin-bottom:11px!important}
  body.index-home-optimized .index-community-stage11-head h2{font-size:14px!important}
  body.index-home-optimized .index-community-stage11-head p{font-size:8.8px!important;line-height:1.4!important}
  body.index-home-optimized .index-community-stage11-eyebrow{font-size:7.6px!important}
  body.index-home-optimized .index-community-stage11-head .see{min-height:28px!important;padding-inline:9px!important;font-size:8px!important}
  body.index-home-optimized .index-community-stage11-stats{gap:6px!important;margin-bottom:8px!important}
  body.index-home-optimized .index-community-stage11-stat{grid-template-columns:26px minmax(0,1fr)!important;gap:6px!important;padding:7px!important}
  body.index-home-optimized .index-community-stage11-stat-icon{grid-row:1/3;width:26px!important;height:26px!important;border-radius:8px!important;font-size:9px!important}
  body.index-home-optimized .index-community-stage11-stat strong{font-size:12px!important}
  body.index-home-optimized .index-community-stage11-stat small{font-size:7.4px!important}
  body.index-home-optimized .index-community-stage11-rails{gap:7px!important}
  body.index-home-optimized .index-community-stage11-rail{padding:8px!important;border-radius:11px!important}
  body.index-home-optimized .index-community-stage11-rail-head{grid-template-columns:26px minmax(0,1fr) 25px!important;gap:6px!important;margin-bottom:6px!important}
  body.index-home-optimized .index-community-stage11-rail-icon{width:26px!important;height:26px!important;font-size:8.5px!important}
  body.index-home-optimized .index-community-stage11-rail-head h3{font-size:9.6px!important}
  body.index-home-optimized .index-community-stage11-rail-head p{font-size:7.2px!important}
  body.index-home-optimized .index-community-stage11-rail-head>a{width:25px!important;height:25px!important}
  body.index-home-optimized .index-community-stage11-member-list{
    display:flex!important;
    gap:5px!important;
    overflow-x:auto!important;
    padding-bottom:2px!important;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  body.index-home-optimized .index-community-stage11-member-list::-webkit-scrollbar{display:none!important}
  body.index-home-optimized .index-community-stage11-member{
    flex:0 0 min(77vw,250px)!important;
    grid-template-columns:34px minmax(0,1fr) 12px!important;
    min-height:44px!important;
    padding:5px!important;
    scroll-snap-align:start;
  }
  body.index-home-optimized .index-community-stage11-avatar-wrap,
  body.index-home-optimized .index-community-stage11-avatar-wrap img{width:34px!important;height:34px!important}
  body.index-home-optimized .index-community-stage11-member-copy strong{font-size:9.2px!important}
  body.index-home-optimized .index-community-stage11-member-copy>span{font-size:7.3px!important}
  body.index-home-optimized .index-community-stage11-member-copy small{font-size:7.1px!important}
  body.index-home-optimized .index-community-stage11-empty{min-height:58px!important;padding:10px!important;font-size:7.8px!important}
  body.index-home-optimized .index-community-stage11-unavailable{grid-template-columns:30px minmax(0,1fr)!important;padding:9px!important}
  body.index-home-optimized .index-community-stage11-unavailable>a{grid-column:2!important}
}
@media (max-width:360px){
  body.index-home-optimized .index-community-stage11-head p{display:none!important}
  body.index-home-optimized .index-community-stage11-stat{padding:6px!important}
  body.index-home-optimized .index-community-stage11-stat-icon{width:24px!important;height:24px!important}
  body.index-home-optimized .index-community-stage11-stat strong{font-size:10.8px!important}
  body.index-home-optimized .index-community-stage11-stat small{font-size:6.8px!important}
}
@media (prefers-reduced-motion:reduce){
  body.index-home-optimized .index-community-stage11 *,
  body.index-home-optimized .index-community-stage11 *::before,
  body.index-home-optimized .index-community-stage11 *::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
