diff --git a/src/css.js b/src/css.js
index 112ecd2..63f4a0d 100644
--- a/src/css.js
+++ b/src/css.js
@@ -1,14 +1,28 @@
-Object.assign(window, { css, rule: css, styled: { new: css, rule: css } })
+Object.assign(window, { css, rule, styled: { new: css, rule: rule } })
 const cssmap = {}
-export function css(strings, ...values) {
-    let str = ''
-    for (let f of strings) {
-        str += f + (values.shift() || '')
+function scopify_css(uid, css) {
+    const virtualDoc = document.implementation.createHTMLDocument('')
+    const virtualStyleElement = document.createElement('style')
+    virtualDoc.body.appendChild(virtualStyleElement)
+
+    let cssParsed = ''
+
+    virtualStyleElement.textContent = css
+
+    //@ts-ignore
+    for (const rule of virtualStyleElement.sheet.cssRules) {
+        rule.selectorText = rule.selectorText.includes('self')
+            ? `.${uid}.self${rule.selectorText.replace('self', '')}`
+            : `.${uid} ${rule.selectorText}`
+        cssParsed += `${rule.cssText}\n`
     }
 
-    let cached = cssmap[str]
-    if (cached) return cached
-
+    return cssParsed
+}
+function tagcss(strings, values, isblock) {
+    let cached = cssmap[strings[0]]
+    let cachable = strings.length == 1
+    if (cachable && cached) return cached
     const uid = `dl${Array(5)
         .fill(0)
         .map(() => {
@@ -17,10 +31,46 @@ export function css(strings, ...values) {
         .join('')}`
 
     const styleElement = document.createElement('style')
+
     document.head.appendChild(styleElement)
 
-    styleElement.textContent = `.${uid} { ${str}; }`
-    cssmap[str] = uid
+    const flattened_template = []
+    for (const i in strings) {
+        flattened_template.push(strings[i])
+        if (values[i]) {
+            const prop = values[i]
+
+            if (isDLPtr(prop)) {
+                const current_i = flattened_template.length
+                let oldparsed
+                handle(prop, (val) => {
+                    flattened_template[current_i] = String(val)
+                    let parsed = flattened_template.join('')
+                    if (parsed != oldparsed)
+                        if (isblock)
+                            styleElement.textContent = scopify_css(uid, parsed)
+                        else styleElement.textContent = `.${uid} { ${parsed}; }`
+                    oldparsed = parsed
+                })
+            } else {
+                flattened_template.push(String(prop))
+            }
+        }
+    }
+
+    if (isblock) {
+        styleElement.textContent = scopify_css(uid, flattened_template.join(''))
+    } else {
+        styleElement.textContent = `.${uid} { ${flattened_template.join('')}; }`
+    }
+
+    if (cachable) cssmap[strings[0]] = uid
 
     return uid
 }
+function rule(strings, ...values) {
+    return tagcss(strings, values, false)
+}
+function css(strings, ...values) {
+    return tagcss(strings, values, true)
+}