Edit some styles

Author: WebCoder49

plugins/special-chars.css

@@ -41,20 +41,8 @@
     text-shadow: none;
 
     vertical-align: middle;
-}
-
-.code-input_special-char::before, .code-input_special-char::after {
-    white-space: pre;
-    color: inherit;
-    background-color: inherit;
-
-    font-size: calc(100% - 2px);
-    position: absolute;
-    line-height: 1;
-
-    height: 2em;
-    width: calc(100% - 2px);
-    text-align: center;
+    
+    outline: 1px solid currentColor;
 }
 
 /* Default - Two bytes - 4 hex chars */
@@ -65,7 +53,7 @@
     background-color: currentColor;
     image-rendering: pixelated;
     display: inline-block;
-    width: 100%;
+    width: calc(100%-2px);
     height: 100%;
 
     --char-0: var(--code-input_special-chars_0);
@@ -75,17 +63,15 @@
 
     mask-image: var(--char-0), var(--char-1), var(--char-2), var(--char-3);
     mask-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
-    mask-size: 45%, 45%, 45%, 45%;
-    mask-position: 2% 2%, 100% 2%, 2% 100%, 100% 100%;
+    mask-size: 40%, 40%, 40%, 40%;
+    mask-position: 10% 10%, 90% 10%, 10% 90%, 90% 90%;
 
     -webkit-mask-image: var(--char-0), var(--char-1), var(--char-2), var(--char-3);
     -webkit-mask-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
-    -webkit-mask-size: 40%, 40%, 40%, 40%;
-    -webkit-mask-position: 10% 10%, 90% 10%, 10% 90%, 90% 90%;
+    -webkit-mask-size: min(40%, 0.25em), min(40%, 0.25em), min(40%, 0.25em), min(40%, 0.25em);
+    -webkit-mask-position: 10% 10%, min(90%, 0.5em) 10%, 10% 90%, min(90%, 0.5em) 90%;
 }
 
-/* Zero-width - style so takes up no space */
-
 .code-input_special-char_zero-width {
     z-index: 1;
     width: 1em;