{
	"Predicted geometry": {
		"prefix": "predict",
		"body": ["@predict max-height max-width;"],
		"description": "Transition prerendered geometry"
	},
	"Predicted transitions": {
		"prefix": "predict-full",
		"body": ["@predict left top width height opacity transform;"],
		"description": "Full prediction transition list (pill/ribbon style)"
	},
	"Measure prediction target": {
		"prefix": "measure",
		"body": ["@measure;"],
		"description": "Mark this selector for prerender geometry prefill (inline prediction source)"
	},
	"Measure anchors": {
		"prefix": "measure-anchor",
		"body": ["@measure @${1:anchor}, ${0:.selector};"],
		"description": "Measure elements by relation anchor or class"
	},
	"Responsive rule": {
		"prefix": "responsive",
		"body": ["@responsive ${1:md} {", "  ${2}", "}"],
		"description": "Add a responsive STCSS rule"
	},
	"Media rule": {
		"prefix": "media",
		"body": ["@media ${1:(max-width: 48rem)} {", "  ${2}", "}"],
		"description": "Add a media query"
	},
	"Each loop": {
		"prefix": "each",
		"body": ["@each $${1:item} in ${2:items} {", "  ${0}", "}"],
		"description": "Repeat a block over a value list"
	},
	"For loop": {
		"prefix": "for",
		"body": ["@for $${1:i} from ${2:1} through ${3:5} {", "  ${0}", "}"],
		"description": "Count a range"
	},
	"Mixin declaration": {
		"prefix": "mixin",
		"body": ["@mixin ${1:name}($${2:arg}) {", "  ${0}", "}"],
		"description": "Declare an STCSS mixin"
	},
	"Include mixin": {
		"prefix": "include",
		"body": ["@include ${1:name}(${2:arg});"],
		"description": "Use an STCSS mixin"
	},
	"Interpolation": {
		"prefix": "interp",
		"body": ["#{$${1:scale} * 2}rem"],
		"description": "Compile-time value interpolation"
	},
	"d-string": {
		"prefix": "d",
		"body": ["d\"${1:calc(#{} )}\""],
		"description": "String with brace expressions evaluated at compile time"
	},
	"$refer geometry": {
		"prefix": "refer",
		"body": ["$refer[${1:left}](@${2:anchor})"],
		"description": "Read pre-computed anchor geometry (left/top/width/height)"
	},
	"$refer interpolated location": {
		"prefix": "refer-between",
		"body": [
			"calc($refer[${1:left}](@${2:anchor}) - $refer[${3:left}](@${4:relative}))"
		],
		"description": "Compute location between two anchors"
	},
	"$relate metrics": {
		"prefix": "relate",
		"body": ["$relate(${1:@anchor})"],
		"description": "Legacy relation value of an anchor"
	},
	"Computed mirror": {
		"prefix": "computed",
		"body": ["@${1:anchor}.computed.${2:backgroundColor}"],
		"description": "Mirror a live computed style of an anchor"
	},
	"Relation state selector": {
		"prefix": "with-state",
		"body": [":with(@${1:anchor}:${2|active,clicked,focus|})"],
		"description": "Anchor state selection (:has under the hood)"
	},
	"When selector": {
		"prefix": "when-state",
		"body": [":when(${1:root} @${2:anchor}:${3|active,clicked,focus|})"],
		"description": "Scoped anchor state selection"
	},
	"Concentric radius": {
		"prefix": "concentric",
		"body": ["border-radius: concentric ${1:0.75rem};"],
		"description": "Concentric nested corner radii"
	},
	"Freeform gradient": {
		"prefix": "freeform-gradient",
		"body": [
			"background-image: freeform-gradient(${1:#7c3aed} ${2:10%} ${3:50%}, ${4:#f00} ${5:70%} ${6:40%});"
		],
		"description": "Spawn layered freeform radial gradients"
	},
	"Concentric block": {
		"prefix": "concentric-block",
		"body": ["@concentric ${1:1rem} {", "  ${0}", "}"],
		"description": "Concentric radius at-rule"
	},
	"View transition": {
		"prefix": "view-transition",
		"body": ["@view-transition ${1:name};"],
		"description": "Emit a css view-transition-name"
	},
	"Compile-time values": {
		"prefix": "javascript",
		"body": ["javascript!", "  const ${1:space} = ${2:1};", "end"],
		"description": "Add compile-time values"
	}
}