diff --git a/test/css/samples/supports-charset/expected.css b/test/css/samples/supports-charset/expected.css
new file mode 100644
index 0000000000..55cfd4ea2d
--- /dev/null
+++ b/test/css/samples/supports-charset/expected.css
@@ -0,0 +1 @@
+@charset "utf-8";
\ No newline at end of file
diff --git a/test/css/samples/supports-charset/input.svelte b/test/css/samples/supports-charset/input.svelte
new file mode 100644
index 0000000000..25704d3eb4
--- /dev/null
+++ b/test/css/samples/supports-charset/input.svelte
@@ -0,0 +1,3 @@
+<style>
+	@charset "utf-8";
+</style>
diff --git a/test/css/samples/supports-font-face/expected.css b/test/css/samples/supports-font-face/expected.css
new file mode 100644
index 0000000000..652ecb1dc2
--- /dev/null
+++ b/test/css/samples/supports-font-face/expected.css
@@ -0,0 +1 @@
+@font-face{font-family:MyHelvetica;src:local('Helvetica Neue Bold'), local('HelveticaNeue-Bold'), url(MgOpenModernaBold.ttf);font-weight:bold}
\ No newline at end of file
diff --git a/test/css/samples/supports-font-face/input.svelte b/test/css/samples/supports-font-face/input.svelte
new file mode 100644
index 0000000000..3ed82008bf
--- /dev/null
+++ b/test/css/samples/supports-font-face/input.svelte
@@ -0,0 +1,7 @@
+<style>
+	@font-face {
+		font-family: MyHelvetica;
+		src: local('Helvetica Neue Bold'), local('HelveticaNeue-Bold'), url(MgOpenModernaBold.ttf);
+		font-weight: bold;
+	}
+</style>
diff --git a/test/css/samples/supports-import/expected.css b/test/css/samples/supports-import/expected.css
new file mode 100644
index 0000000000..485d9d272f
--- /dev/null
+++ b/test/css/samples/supports-import/expected.css
@@ -0,0 +1 @@
+@import 'custom.css';@import "common.css" screen;@import url(chrome://communicator/skin/);@import url(fineprint.css) print;@import url(landscape.css) screen and (orientation:landscape);@import url(red.css) (min-width:400px);
\ No newline at end of file
diff --git a/test/css/samples/supports-import/input.svelte b/test/css/samples/supports-import/input.svelte
new file mode 100644
index 0000000000..dccfc4cb95
--- /dev/null
+++ b/test/css/samples/supports-import/input.svelte
@@ -0,0 +1,8 @@
+<style>
+	@import 'custom.css';
+	@import "common.css" screen;
+	@import url(chrome://communicator/skin/);
+	@import url(fineprint.css) print;
+	@import url(landscape.css) screen and (orientation:landscape);
+	@import url(red.css) (min-width:400px);
+</style>
diff --git a/test/css/samples/supports-namespace/expected.css b/test/css/samples/supports-namespace/expected.css
new file mode 100644
index 0000000000..7ca9f4f23d
--- /dev/null
+++ b/test/css/samples/supports-namespace/expected.css
@@ -0,0 +1 @@
+@namespace url(http://www.w3.org/1999/xhtml);@namespace svg url(http://www.w3.org/2000/svg);a{color:blue}svg|a{color:green}*|a{color:red}
\ No newline at end of file
diff --git a/test/css/samples/supports-namespace/input.svelte b/test/css/samples/supports-namespace/input.svelte
new file mode 100644
index 0000000000..6322ac6310
--- /dev/null
+++ b/test/css/samples/supports-namespace/input.svelte
@@ -0,0 +1,19 @@
+<style>
+	@namespace url(http://www.w3.org/1999/xhtml);
+	@namespace svg url(http://www.w3.org/2000/svg);
+
+	/* This matches all XHTML <a> elements, as XHTML is the default unprefixed namespace */
+	:global(a) {
+		color: blue;
+	}
+
+	/* This matches all SVG <a> elements */
+	:global(svg|a) {
+		color: green;
+	}
+
+	/* This matches both XHTML and SVG <a> elements */
+	:global(*|a) {
+		color: red;
+	}
+</style>
diff --git a/test/css/samples/supports-nested-page/expected.css b/test/css/samples/supports-nested-page/expected.css
new file mode 100644
index 0000000000..d526b57989
--- /dev/null
+++ b/test/css/samples/supports-nested-page/expected.css
@@ -0,0 +1 @@
+@page vertical{size:A4 portrait;@top-center{content:"Vertical"}}@page :right{@top-center{content:"Preliminary edition"}@bottom-center{content:counter(page)}}@page :first{color:green;font-size:20pt;@top-left{content:"foo";color:blue}@top-right{content:"bar"}}
\ No newline at end of file
diff --git a/test/css/samples/supports-nested-page/input.svelte b/test/css/samples/supports-nested-page/input.svelte
new file mode 100644
index 0000000000..a36c8263ce
--- /dev/null
+++ b/test/css/samples/supports-nested-page/input.svelte
@@ -0,0 +1,32 @@
+<style>
+	@page vertical {
+		size: A4 portrait;
+		@top-center {
+			content: "Vertical";
+		}
+	}
+
+	@page :right {
+		@top-center {
+			content: "Preliminary edition";
+		}
+
+		@bottom-center {
+			content: counter(page);
+		}
+	}
+
+	@page :first {
+		color: green;
+		font-size: 20pt;
+
+		@top-left {
+			content: "foo";
+			color: blue;
+		}
+
+		@top-right {
+			content: "bar";
+		}
+	}
+</style>
diff --git a/test/css/samples/supports-page/expected.css b/test/css/samples/supports-page/expected.css
new file mode 100644
index 0000000000..6978c3ecec
--- /dev/null
+++ b/test/css/samples/supports-page/expected.css
@@ -0,0 +1 @@
+@page{margin:1cm;size:A4;bleed:7pt}
\ No newline at end of file
diff --git a/test/css/samples/supports-page/input.svelte b/test/css/samples/supports-page/input.svelte
new file mode 100644
index 0000000000..e360b23e77
--- /dev/null
+++ b/test/css/samples/supports-page/input.svelte
@@ -0,0 +1,7 @@
+<style>
+	@page{
+		margin: 1cm;
+		size: A4;
+	  bleed: 7pt;
+	}
+</style>