.community-spotlight {
  margin: 18px 0 28px;
  padding: 16px 0 4px;
  border-top: 1px solid #2b3037;
}
.community-spotlight-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:4px; }
.community-spotlight-kicker { color:#73dae5; font:10px/1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.16em; text-transform:uppercase; }
.community-spotlight h2 { margin:7px 0 0; color:#f4f6f8; font:600 20px/1.1 Arial,Helvetica,sans-serif; letter-spacing:-.025em; }
.community-spotlight-controls { display:flex; gap:8px; }
.community-spotlight-controls button { width:44px; height:44px; padding:0; color:#f4f6f8; background:#0b0d10; border:1px solid #2b3037; border-radius:7px; font:24px/1 Arial,Helvetica,sans-serif; cursor:pointer; }
.community-spotlight-controls button:disabled { color:#59616b; border-color:#20252b; cursor:default; opacity:.65; }
.community-spotlight-controls button:hover, .community-spotlight-controls button:focus-visible { color:#73dae5; border-color:#73dae5; outline:2px solid #73dae533; outline-offset:2px; }
.community-spotlight-status { min-height:16px; margin:8px 0 10px; color:#a2aab4; font:10px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; }
.community-spotlight-viewport { overflow-x:auto; overflow-y:hidden; scrollbar-width:none; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; outline:none; }
.community-spotlight-viewport::-webkit-scrollbar { display:none; }
.community-spotlight-viewport:focus-visible { outline:2px solid #73dae5; outline-offset:4px; }
.community-spotlight-track { display:flex; gap:10px; }
.community-spotlight-card { position:relative; flex:0 0 calc((100% - 20px) / 3); min-width:0; height:125px; display:grid; grid-template-columns:64px minmax(0,1fr); grid-template-rows:1fr auto; gap:7px 12px; padding:12px; color:#f4f6f8; background:#0b0d10; border:1px solid #2b3037; border-radius:8px; scroll-snap-align:start; }
.community-spotlight-card:hover { border-color:#73dae599; }
.community-spotlight-art { width:64px; height:64px; display:grid; place-items:center; grid-row:1 / span 2; overflow:hidden; color:#73dae5; background:#11161a; border:1px solid #73dae566; border-radius:8px; font:700 14px Arial,Helvetica,sans-serif; }
.community-spotlight-card-violet .community-spotlight-art { color:#c7b4f4; background:#15121e; border-color:#b99bea66; }
.community-spotlight-art img { width:100%; height:100%; object-fit:cover; }
.community-spotlight-copy { min-width:0; display:flex; flex-direction:column; justify-content:center; gap:3px; }
.community-spotlight-copy strong { overflow:hidden; color:#f4f6f8; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.community-spotlight-copy small { overflow:hidden; color:#a2aab4; font:10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace; text-overflow:ellipsis; white-space:nowrap; }
.community-spotlight-counts { color:#73dae5 !important; }
.community-spotlight-volume { color:#a2aab4 !important; }
.community-spotlight-open { grid-column:2; justify-self:start; min-height:30px; padding:5px 9px; color:#73dae5; background:transparent; border:1px solid #2b3037; border-radius:5px; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; cursor:pointer; }
.community-spotlight-open:hover, .community-spotlight-open:focus-visible { color:#000; background:#73dae5; border-color:#73dae5; outline:2px solid #73dae533; outline-offset:2px; }
@media (max-width: 760px) {
  .community-spotlight-card { flex-basis:100%; }
}
@media (prefers-reduced-motion: reduce) {
  .community-spotlight-viewport { scroll-behavior:auto; }
}

/* Featured rooms borrow the family's quiet illuminated HUD edges. */
.community-spotlight-card{grid-template-columns:80px minmax(0,1fr);height:136px;background:linear-gradient(110deg,#73dae509,transparent 50%),#0b0f15}.community-spotlight-card-violet{background:linear-gradient(110deg,#b99bea09,transparent 50%),#0b0f15}.community-spotlight-art{width:80px;height:80px}.community-spotlight-copy strong{font-size:16px;font-weight:500}.community-spotlight-copy small{font-size:11px}.community-spotlight-open{font-size:11px;min-height:32px}.community-spotlight-card{transition:border-color var(--motion-cardLift),box-shadow var(--motion-cardLift)}.community-spotlight-card:hover{box-shadow:inset 0 1px #73dae533}.community-spotlight-card:focus-within{border-color:#73dae599}