1 files changed, 20 insertions, 23 deletions

diff --git a/src/objects/_backdrop.scss b/src/objects/_backdrop.scss
index d0eaf52..346cf5f 100644
--- a/src/objects/_backdrop.scss
+++ b/src/objects/_backdrop.scss
@@ -1,26 +1,23 @@
-@use 'iro-sass/src/index' as iro;
-@use '../functions' as fn;
+@use 'sass:meta';
+@use 'iro-sass/src/bem';
+@use 'iro-sass/src/props';
+@use '../props' as *;
 
-@include iro.props-namespace('backdrop') {
-    @include iro.props-store((
-        --dims: (
-            --z-index: 10000,
-            --blur:    2em,
-        ),
-        --colors: (
-            --bg: rgba(#000, .75),
-        ),
-    ));
+@forward 'backdrop.vars';
+@use 'backdrop.vars' as vars;
 
-    @include iro.bem-object(iro.props-namespace()) {
-        display:          flex;
-        position:         fixed;
-        z-index:          fn.dim(--z-index);
-        inset:            0;
-        box-sizing:       border-box;
-        flex-direction:   column;
-        overflow:         auto;
-        background-color: fn.color(--bg);
-        backdrop-filter:  blur(fn.dim(--blur));
-    }
+@mixin styles {
+        @include materialize-at-root(meta.module-variables('vars'));
+
+        @include bem.object('backdrop') {
+                position:         fixed;
+                inset:            0;
+                z-index:          props.get(vars.$z-index);
+                box-sizing:       border-box;
+                display:          flex;
+                flex-direction:   column;
+                overflow:         auto;
+                background-color: props.get(vars.$bg-color);
+                backdrop-filter:  blur(props.get(vars.$blur));
+        }
 }