Generated by SassMeister.com.

input.scss

// vars are implied/provided globally
$font-size-1000: 10px;

/** before*/
.node {
    someProp: $font-size-1000
}


/**
 * after codemod
 * 1. inject media query
 * 2. assign responsive values
 * 3. reassign variable
 */

@media (max-width: 480px) { // (1)
    :root {
        --font-size-1000: 50px; // (2)
    }
}

$font-size-1000: var(--font-size-1000, $font-size-1000); // (3)

.node {
    someProp: $font-size-1000
}

output.css

/** before*/
.node {
  someProp: 10px;
}

/**
 * after codemod
 * 1. inject media query
 * 2. assign responsive values
 * 3. reassign variable
 */
@media (max-width: 480px) {
  :root {
    --font-size-1000: 50px;
  }
}
.node {
  someProp: var(--font-size-1000, 10px);
}

settings.json

{
  "sass": {
    "compiler": "dart-sass/1.32.12",
    "extensions": {},
    "syntax": "SCSS",
    "outputStyle": "expanded"
  },
  "autoprefixer": false
}