/* space-parts.css — "What's in this space" on a space's Settings tab
 * (js/space-parts.js). App-shell tokens only, scoped under #route-spaces like
 * community-spaces.css. Each row: the part's name and one line, a switch. */
#route-spaces .spp-body { padding: 6px 20px 14px; }
#route-spaces .spp-lead { margin: 8px 0 6px; line-height: 1.5; }
#route-spaces .spp-row {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 0; border-top: 1px solid var(--border-soft);
}
#route-spaces .spp-row:first-of-type { border-top: 0; }
#route-spaces .spp-text { flex: 1 1 auto; min-width: 0; }
#route-spaces .spp-name { font-weight: 600; color: var(--text); margin-bottom: 2px; }
#route-spaces .spp-sw {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0 4px; background: none; border: 0; cursor: pointer;
  color: var(--text-2); font: inherit; font-size: 13px; font-weight: 600;
}
#route-spaces .spp-sw .spp-knob {
  position: relative; width: 44px; height: 26px; border-radius: 999px;
  background: var(--surface-3); border: 1px solid var(--border-strong); transition: background .15s;
}
#route-spaces .spp-sw .spp-knob::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px;
  border-radius: 50%; background: var(--surface); box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: left .15s;
}
#route-spaces .spp-sw.on { color: var(--accent); }
#route-spaces .spp-sw.on .spp-knob { background: var(--accent); border-color: var(--accent); }
#route-spaces .spp-sw.on .spp-knob::after { left: 20px; }
#route-spaces .spp-sw:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 8px; }
#route-spaces .spp-sw[disabled] { opacity: .5; cursor: default; }
#route-spaces .spp-state { min-width: 24px; text-align: left; }
