diff --git a/src/ui/components/_panel.scss b/src/ui/components/_panel.scss
index 4c18199..ef24da3 100644
--- a/src/ui/components/_panel.scss
+++ b/src/ui/components/_panel.scss
@@ -1,14 +1,12 @@
 @import "../base.scss";
 
 $panel-aspect-ratio: 1/1.618;
-$panel-padding-v: 5%;
-$panel-padding-h: 5%;
 
-%panel {
-    padding: $panel-padding-v $panel-padding-h;
+@mixin panel($padding-v: 2%, $padding-h: 2%) {
+    padding: $padding-v $padding-h;
 
-    height: calc(100% - $panel-padding-v - (2 * $border-big-width));
-    width: calc(100% - $panel-padding-h - (2 * $border-big-width));
+    height: calc(100% - (2 * $padding-v) - (2 * $border-big-width));
+    width: calc(100% - (2 * $padding-h) - (2 * $border-big-width));
     flex-shrink: 0;
 
     border: $border-big;
diff --git a/src/ui/components/login.scss b/src/ui/components/login.scss
index 59692c4..0c23b7e 100644
--- a/src/ui/components/login.scss
+++ b/src/ui/components/login.scss
@@ -3,7 +3,8 @@
 @import "./spinner.scss";
 
 .login {
-    @extend %panel;
+    $padding: 5%;
+    @include panel($padding, $padding);
 
     $aspect-ratio: var(--aspect-ratio);