diff --git a/postcss.config.js b/postcss.config.js
index 2f196b3..64f49d6 100755
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,8 +1,6 @@
 export default {
   plugins: {
     '@tailwindcss/postcss': {},
-    'postcss-use': {
-      modules: '*',
-    },
+    'postcss-calc': {},
   },
 };
diff --git a/resources/css/98.css b/resources/css/98.css
index 019a6d4..e48ff8d 100644
--- a/resources/css/98.css
+++ b/resources/css/98.css
@@ -1,10 +1,3 @@
-/*noinspection CssInvalidAtRule*/
-@use postcss-inline-svg();
-/*noinspection CssInvalidAtRule*/
-@use postcss-css-variables();
-/*noinspection CssInvalidAtRule*/
-@use postcss-calc();
-
 /**
  * 98.css
  * Copyright (c) 2020 Jordan Scales <thatjdanisso.cool>
@@ -109,6 +102,7 @@ body {
 }
 
 button,
+.button,
 label,
 input,
 legend,
@@ -148,6 +142,7 @@ u {
 }
 
 button,
+.button,
 input[type="submit"],
 input[type="reset"] {
     box-sizing: border-box;
@@ -164,6 +159,7 @@ input[type="reset"] {
 }
 
 button.default,
+.button.default,
 input[type="submit"].default,
 input[type="reset"].default {
     box-shadow: var(--default-button-border-raised-outer), var(--default-button-border-raised-inner);
@@ -177,6 +173,7 @@ .vertical-bar {
 }
 
 button:not(:disabled):active,
+.button:not(:disabled):active,
 input[type="submit"]:not(:disabled):active,
 input[type="reset"]:not(:disabled):active {
     box-shadow: var(--border-sunken-outer), var(--border-sunken-inner);
@@ -184,29 +181,25 @@ input[type="reset"]:not(:disabled):active {
 }
 
 button.default:not(:disabled):active,
+.button.default:not(:disabled):active,
 input[type="submit"].default:not(:disabled):active,
 input[type="reset"].default:not(:disabled):active {
     box-shadow: var(--default-button-border-sunken-outer), var(--default-button-border-sunken-inner);
 }
 
-@media (
-
-not
-(
-hover
-
-)
-)
-{
-button:not(:disabled):hover,
-input[type="submit"]:not(:disabled):hover,
-input[type="reset"]:not(:disabled):hover {
-    box-shadow: var(--border-sunken-outer), var(--border-sunken-inner);
-}
-
+/* @formatter:off */
+@media(not(hover)) {
+    button:not(:disabled):hover,
+    .button:not(:disabled):hover,
+    input[type="submit"]:not(:disabled):hover,
+    input[type="reset"]:not(:disabled):hover {
+        box-shadow: var(--border-sunken-outer), var(--border-sunken-inner);
+    }
 }
+/* @formatter:on */
 
 button:focus,
+.button:focus,
 input[type="submit"]:focus,
 input[type="reset"]:focus {
     outline: 1px dotted #000000;
@@ -214,6 +207,7 @@ input[type="reset"]:focus {
 }
 
 button::-moz-focus-inner,
+.button::-moz-focus-inner,
 input[type="submit"]::-moz-focus-inner,
 input[type="reset"]::-moz-focus-inner {
     border: 0;
@@ -227,6 +221,7 @@ input[readonly] + label {
 }
 
 button:disabled,
+.button:disabled,
 input[type="submit"]:disabled,
 input[type="reset"]:disabled,
 :disabled + label {
@@ -286,50 +281,56 @@ .title-bar-controls button:focus {
 }
 
 .title-bar-controls button[aria-label="Minimize"],
-.title-bar-controls button[aria-label].minimize {
+.title-bar-controls button.minimize {
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/minimize.svg");
+    /*background-image: svg-load("./icon/minimize.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 0h6v2H0z'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: bottom 3px left 4px;
 }
 
 .title-bar-controls button[aria-label="Maximize"],
-.title-bar-controls button[aria-label].maximize {
+.title-bar-controls button.maximize {
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/maximize.svg");
+    /*background-image: svg-load("./icon/maximize.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='9' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='%23000'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: top 2px left 3px;
 }
 
 .title-bar-controls button[aria-label="Maximize"]:disabled,
-.title-bar-controls button[aria-label].maximize:disabled {
+.title-bar-controls button.maximize:disabled {
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/maximize-disabled.svg");
+    /*background-image: svg-load("./icon/maximize-disabled.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='10' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 1H1v9h9V1zM9 3H2v6h7V3z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='gray'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: top 2px left 3px;
 }
 
 .title-bar-controls button[aria-label="Restore"],
-.title-bar-controls button[aria-label].restore {
+.title-bar-controls button.restore {
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/restore.svg");
+    /*background-image: svg-load("./icon/restore.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M2 0h6v2H2zM7 2h1v4H7zM2 2h1v1H2zM6 5h1v1H6zM0 3h6v2H0zM5 5h1v4H5zM0 5h1v4H0zM1 8h4v1H1z'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: top 2px left 3px;
 }
 
 .title-bar-controls button[aria-label="Help"],
-.title-bar-controls button[aria-label].help {
+.title-bar-controls button.help {
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/help.svg");
+    /*background-image: svg-load("./icon/help.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 1h2v2H0zM1 0h4v1H1zM4 1h2v2H4zM3 3h2v1H3zM2 4h2v2H2zM2 7h2v2H2z'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: top 2px left 5px;
 }
 
 .title-bar-controls button[aria-label="Close"],
-.title-bar-controls button[aria-label].close {
+.title-bar-controls button.close {
     margin-left: 2px;
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/close.svg");
+    /*background-image: svg-load("icon/close.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h2v1h1v1h2V1h1V0h2v1H7v1H6v1H5v1h1v1h1v1h1v1H6V6H5V5H3v1H2v1H0V6h1V5h1V4h1V3H2V2H1V1H0V0z' fill='%23000'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: top 3px left 4px;
 }
@@ -353,7 +354,7 @@ .window-body {
 
 fieldset {
     /*noinspection CssInvalidFunction*/
-    border-image: svg-load("./icon/groupbox-border.svg") 2;
+    border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' fill='gray' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h5v5H0V2h2v1h1V2H0' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h4v4H0V1h1v2h2V1H0'/%3E%3C/svg%3E") 2;
     padding: calc(2 * var(--border-width) + var(--element-spacing));
     padding-block-start: var(--element-spacing);
     margin: 0;
@@ -423,12 +424,14 @@ input[type="radio"] + label::before {
     height: var(--radio-width);
     margin-right: var(--radio-label-spacing);
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/radio-border.svg");
+    /*background: svg-load("./icon/radio-border.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='%23fff'/%3E%3C/svg%3E");
 }
 
 input[type="radio"]:active + label::before {
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/radio-border-disabled.svg");
+    /*background: svg-load("./icon/radio-border-disabled.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E");
 }
 
 input[type="radio"]:checked + label::after {
@@ -440,7 +443,8 @@ input[type="radio"]:checked + label::after {
     left: var(--radio-dot-left);
     position: absolute;
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/radio-dot.svg");
+    /*background: svg-load("./icon/radio-dot.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3 0H1v1H0v2h1v1h2V3h1V1H3V0z' fill='%23000'/%3E%3C/svg%3E");
 }
 
 input[type="radio"]:focus + label,
@@ -450,12 +454,14 @@ input[type="checkbox"]:focus + label {
 
 input[type="radio"][disabled] + label::before {
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/radio-border-disabled.svg");
+    /*background: svg-load("./icon/radio-border-disabled.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E");
 }
 
 input[type="radio"][disabled]:checked + label::after {
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/radio-dot-disabled.svg");
+    /*background: svg-load("./icon/radio-dot-disabled.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E");
 }
 
 input[type="checkbox"] + label {
@@ -489,7 +495,8 @@ input[type="checkbox"]:checked + label::after {
         -1 * (var(--checkbox-total-width-precalc)) + var(--checkmark-left)
     );
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/checkmark.svg");
+    /*background: svg-load("./icon/checkmark.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0H6v1H5v1H4v1H3v1H2V3H1V2H0v3h1v1h1v1h1V6h1V5h1V4h1V3h1V0z' fill='%23000'/%3E%3C/svg%3E");
 }
 
 input[type="checkbox"][disabled] + label::before {
@@ -498,7 +505,8 @@ input[type="checkbox"][disabled] + label::before {
 
 input[type="checkbox"][disabled]:checked + label::after {
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/checkmark-disabled.svg");
+    /*background: svg-load("./icon/checkmark-disabled.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0H6v1H5v1H4v1H3v1H2V3H1V2H0v3h1v1h1v1h1V6h1V5h1V4h1V3h1V0z' fill='gray'/%3E%3C/svg%3E");
 }
 
 input[type="text"],
@@ -593,7 +601,8 @@ select {
     position: relative;
     padding-right: 32px;
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/button-down.svg");
+    /*background-image: svg-load("./icon/button-down.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 6H4v1h1v1h1v1h1v1h1V9h1V8h1V7h1V6z' fill='%23000'/%3E%3C/svg%3E");
     background-position: top 2px right 2px;
     background-repeat: no-repeat;
     border-radius: 0;
@@ -626,7 +635,8 @@ input[type="range"]::-webkit-slider-thumb {
     height: 21px;
     width: 11px;
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/indicator-horizontal.svg");
+    /*background: svg-load("./icon/indicator-horizontal.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v16h2v2h2v2h1v-1H3v-2H1V1h9V0z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 1v15h1v1h1v1h1v1h2v-1h1v-1h1v-1h1V1z' fill='%23C0C7C8'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v15H8v2H6v2H5v-1h2v-2h2z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v16H9v2H7v2H5v1h1v-2h2v-2h2z' fill='%23000'/%3E%3C/svg%3E");
     transform: translateY(-8px);
     box-shadow: none;
     border: none;
@@ -634,7 +644,8 @@ input[type="range"]::-webkit-slider-thumb {
 
 input[type="range"].has-box-indicator::-webkit-slider-thumb {
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/indicator-rectangle-horizontal.svg");
+    /*background: svg-load("./icon/indicator-rectangle-horizontal.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v20h1V1h9V0z' fill='%23fff'/%3E%3Cpath fill='%23C0C7C8' d='M1 1h8v18H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v19H1v-1h8z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v21H0v-1h10z' fill='%23000'/%3E%3C/svg%3E");
     transform: translateY(-10px);
 }
 
@@ -644,13 +655,15 @@ input[type="range"]::-moz-range-thumb {
     border: 0;
     border-radius: 0;
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/indicator-horizontal.svg");
+    /*background: svg-load("icon/indicator-horizontal.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v16h2v2h2v2h1v-1H3v-2H1V1h9V0z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 1v15h1v1h1v1h1v1h2v-1h1v-1h1v-1h1V1z' fill='%23C0C7C8'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v15H8v2H6v2H5v-1h2v-2h2z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v16H9v2H7v2H5v1h1v-2h2v-2h2z' fill='%23000'/%3E%3C/svg%3E");
     transform: translateY(2px);
 }
 
 input[type="range"].has-box-indicator::-moz-range-thumb {
     /*noinspection CssInvalidFunction*/
-    background: svg-load("./icon/indicator-rectangle-horizontal.svg");
+    /*background: svg-load("./icon/indicator-rectangle-horizontal.svg");*/
+    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v20h1V1h9V0z' fill='%23fff'/%3E%3Cpath fill='%23C0C7C8' d='M1 1h8v18H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v19H1v-1h8z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v21H0v-1h10z' fill='%23000'/%3E%3C/svg%3E");
     transform: translateY(0px);
 }
 
@@ -735,7 +748,8 @@ select:focus option {
 
 select:active {
     /*noinspection CssInvalidFunction*/
-    background-image: svg-load("./icon/button-down-active.svg");
+    /*background-image: svg-load("./icon/button-down-active.svg");*/
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h16v17H0V0zm1 16h14V1H1v15z' fill='gray'/%3E%3Cpath fill='silver' d='M1 1h14v15H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 7H5v1h1v1h1v1h1v1h1v-1h1V9h1V8h1V7z' fill='%23000'/%3E%3C/svg%3E");
 }
 
 a {
diff --git a/resources/css/app.css b/resources/css/app.css
index 60d2431..dd3a70f 100755
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -36,4 +36,30 @@ @layer base {
     ::file-selector-button {
         border-color: var(--color-gray-200, currentColor);
     }
+
+    html {
+        background-image: url("../images/set/bflyBRDR.gif");
+        background-repeat: repeat-y;
+        background-color: #e1c0b9;
+    }
+
+    body {
+        margin-left: 175px;
+    }
+
+    .button {
+        text-decoration: none;
+        display: inline-block;
+        padding-inline-end: 12px;
+        padding-inline-start: 12px;
+        padding-left: 12px;
+        padding-right: 12px;
+        text-align: center;
+        user-select: none;
+        line-height: 23px;
+    }
+
+    button {
+        cursor: pointer;
+    }
 }
diff --git a/resources/css/icon/button-down-active.svg b/resources/images/icon/button-down-active.svg
similarity index 100%
rename from resources/css/icon/button-down-active.svg
rename to resources/images/icon/button-down-active.svg
diff --git a/resources/css/icon/button-down.svg b/resources/images/icon/button-down.svg
similarity index 100%
rename from resources/css/icon/button-down.svg
rename to resources/images/icon/button-down.svg
diff --git a/resources/css/icon/button-left.svg b/resources/images/icon/button-left.svg
similarity index 100%
rename from resources/css/icon/button-left.svg
rename to resources/images/icon/button-left.svg
diff --git a/resources/css/icon/button-right.svg b/resources/images/icon/button-right.svg
similarity index 100%
rename from resources/css/icon/button-right.svg
rename to resources/images/icon/button-right.svg
diff --git a/resources/css/icon/button-up.svg b/resources/images/icon/button-up.svg
similarity index 100%
rename from resources/css/icon/button-up.svg
rename to resources/images/icon/button-up.svg
diff --git a/resources/css/icon/checkmark-disabled.svg b/resources/images/icon/checkmark-disabled.svg
similarity index 100%
rename from resources/css/icon/checkmark-disabled.svg
rename to resources/images/icon/checkmark-disabled.svg
diff --git a/resources/css/icon/checkmark.svg b/resources/images/icon/checkmark.svg
similarity index 100%
rename from resources/css/icon/checkmark.svg
rename to resources/images/icon/checkmark.svg
diff --git a/resources/css/icon/close.svg b/resources/images/icon/close.svg
similarity index 100%
rename from resources/css/icon/close.svg
rename to resources/images/icon/close.svg
diff --git a/resources/css/icon/groupbox-border.svg b/resources/images/icon/groupbox-border.svg
similarity index 100%
rename from resources/css/icon/groupbox-border.svg
rename to resources/images/icon/groupbox-border.svg
diff --git a/resources/css/icon/help.svg b/resources/images/icon/help.svg
similarity index 100%
rename from resources/css/icon/help.svg
rename to resources/images/icon/help.svg
diff --git a/resources/css/icon/indicator-horizontal.svg b/resources/images/icon/indicator-horizontal.svg
similarity index 100%
rename from resources/css/icon/indicator-horizontal.svg
rename to resources/images/icon/indicator-horizontal.svg
diff --git a/resources/css/icon/indicator-rectangle-horizontal.svg b/resources/images/icon/indicator-rectangle-horizontal.svg
similarity index 100%
rename from resources/css/icon/indicator-rectangle-horizontal.svg
rename to resources/images/icon/indicator-rectangle-horizontal.svg
diff --git a/resources/css/icon/maximize-disabled.svg b/resources/images/icon/maximize-disabled.svg
similarity index 100%
rename from resources/css/icon/maximize-disabled.svg
rename to resources/images/icon/maximize-disabled.svg
diff --git a/resources/css/icon/maximize.svg b/resources/images/icon/maximize.svg
similarity index 100%
rename from resources/css/icon/maximize.svg
rename to resources/images/icon/maximize.svg
diff --git a/resources/css/icon/minimize.svg b/resources/images/icon/minimize.svg
similarity index 100%
rename from resources/css/icon/minimize.svg
rename to resources/images/icon/minimize.svg
diff --git a/resources/css/icon/radio-border-disabled.svg b/resources/images/icon/radio-border-disabled.svg
similarity index 100%
rename from resources/css/icon/radio-border-disabled.svg
rename to resources/images/icon/radio-border-disabled.svg
diff --git a/resources/css/icon/radio-border.svg b/resources/images/icon/radio-border.svg
similarity index 100%
rename from resources/css/icon/radio-border.svg
rename to resources/images/icon/radio-border.svg
diff --git a/resources/css/icon/radio-dot-disabled.svg b/resources/images/icon/radio-dot-disabled.svg
similarity index 100%
rename from resources/css/icon/radio-dot-disabled.svg
rename to resources/images/icon/radio-dot-disabled.svg
diff --git a/resources/css/icon/radio-dot.svg b/resources/images/icon/radio-dot.svg
similarity index 100%
rename from resources/css/icon/radio-dot.svg
rename to resources/images/icon/radio-dot.svg
diff --git a/resources/css/icon/restore.svg b/resources/images/icon/restore.svg
similarity index 100%
rename from resources/css/icon/restore.svg
rename to resources/images/icon/restore.svg
diff --git a/resources/css/icon/scrollbar-background.svg b/resources/images/icon/scrollbar-background.svg
similarity index 100%
rename from resources/css/icon/scrollbar-background.svg
rename to resources/images/icon/scrollbar-background.svg
diff --git a/resources/css/icon/sunken-panel-border.svg b/resources/images/icon/sunken-panel-border.svg
similarity index 100%
rename from resources/css/icon/sunken-panel-border.svg
rename to resources/images/icon/sunken-panel-border.svg
diff --git a/resources/images/set/bflyBAR.gif b/resources/images/set/bflyBAR.gif
new file mode 100644
index 0000000..1e7a8cd
Binary files /dev/null and b/resources/images/set/bflyBAR.gif differ
diff --git a/resources/images/set/bflyBRDR.gif b/resources/images/set/bflyBRDR.gif
new file mode 100644
index 0000000..8afa8de
Binary files /dev/null and b/resources/images/set/bflyBRDR.gif differ
diff --git a/resources/images/set/bflyBUT1.gif b/resources/images/set/bflyBUT1.gif
new file mode 100644
index 0000000..6fa55de
Binary files /dev/null and b/resources/images/set/bflyBUT1.gif differ
diff --git a/resources/images/set/bflyBUT2.gif b/resources/images/set/bflyBUT2.gif
new file mode 100644
index 0000000..76f7bf2
Binary files /dev/null and b/resources/images/set/bflyBUT2.gif differ
diff --git a/resources/images/set/bflyBUT3.gif b/resources/images/set/bflyBUT3.gif
new file mode 100644
index 0000000..993abe7
Binary files /dev/null and b/resources/images/set/bflyBUT3.gif differ
diff --git a/resources/images/set/bflyBUT4.gif b/resources/images/set/bflyBUT4.gif
new file mode 100644
index 0000000..8089b99
Binary files /dev/null and b/resources/images/set/bflyBUT4.gif differ
diff --git a/resources/images/set/bflyBUT5.gif b/resources/images/set/bflyBUT5.gif
new file mode 100644
index 0000000..7e92705
Binary files /dev/null and b/resources/images/set/bflyBUT5.gif differ
diff --git a/resources/images/set/bflyBUT6.gif b/resources/images/set/bflyBUT6.gif
new file mode 100644
index 0000000..596c5e1
Binary files /dev/null and b/resources/images/set/bflyBUT6.gif differ
diff --git a/resources/images/set/bflyBUT7.gif b/resources/images/set/bflyBUT7.gif
new file mode 100644
index 0000000..329f2bf
Binary files /dev/null and b/resources/images/set/bflyBUT7.gif differ
diff --git a/resources/images/set/bflyBUT8.gif b/resources/images/set/bflyBUT8.gif
new file mode 100644
index 0000000..5d7d31f
Binary files /dev/null and b/resources/images/set/bflyBUT8.gif differ
diff --git a/resources/images/set/bflyBUT9.gif b/resources/images/set/bflyBUT9.gif
new file mode 100644
index 0000000..3f82135
Binary files /dev/null and b/resources/images/set/bflyBUT9.gif differ
diff --git a/resources/images/set/bflyICON1.gif b/resources/images/set/bflyICON1.gif
new file mode 100644
index 0000000..f7331a0
Binary files /dev/null and b/resources/images/set/bflyICON1.gif differ
diff --git a/resources/images/set/bflyICON2.gif b/resources/images/set/bflyICON2.gif
new file mode 100644
index 0000000..faf0419
Binary files /dev/null and b/resources/images/set/bflyICON2.gif differ
diff --git a/resources/images/set/bflyICON3.gif b/resources/images/set/bflyICON3.gif
new file mode 100644
index 0000000..eab50bf
Binary files /dev/null and b/resources/images/set/bflyICON3.gif differ
diff --git a/resources/images/set/bflyICON4.gif b/resources/images/set/bflyICON4.gif
new file mode 100644
index 0000000..490789f
Binary files /dev/null and b/resources/images/set/bflyICON4.gif differ
diff --git a/resources/images/set/bflyICON5.gif b/resources/images/set/bflyICON5.gif
new file mode 100644
index 0000000..1b2abeb
Binary files /dev/null and b/resources/images/set/bflyICON5.gif differ
diff --git a/resources/images/set/bflyLOGO.gif b/resources/images/set/bflyLOGO.gif
new file mode 100644
index 0000000..41162f3
Binary files /dev/null and b/resources/images/set/bflyLOGO.gif differ
diff --git a/resources/views/admin.blade.php b/resources/views/admin.blade.php
index a3bb9e1..e1b6026 100644
--- a/resources/views/admin.blade.php
+++ b/resources/views/admin.blade.php
@@ -1,7 +1,5 @@
 <x-app-layout>
-  <x-slot:header>
-    <h2>Admin</h2>
-  </x-slot>
+  <x-slot:header>Admin</x-slot>
 
   <p>You're logged in!</p>
 
diff --git a/resources/views/components/home-btn.blade.php b/resources/views/components/home-btn.blade.php
new file mode 100644
index 0000000..a1eda98
--- /dev/null
+++ b/resources/views/components/home-btn.blade.php
@@ -0,0 +1,5 @@
+<img
+  src="{{ Vite::asset('resources/images/set/bflyBUT1.gif') }}"
+  alt="Home"
+  {{ $attributes }}
+/>
diff --git a/resources/views/components/window/status-bar-field.blade.php b/resources/views/components/window/status-bar-field.blade.php
new file mode 100644
index 0000000..ecff0a3
--- /dev/null
+++ b/resources/views/components/window/status-bar-field.blade.php
@@ -0,0 +1 @@
+<p class="status-bar-field">{{ $slot }}</p>
diff --git a/resources/views/components/window/window.blade.php b/resources/views/components/window/window.blade.php
new file mode 100644
index 0000000..d36cf9d
--- /dev/null
+++ b/resources/views/components/window/window.blade.php
@@ -0,0 +1,52 @@
+@props([
+  'title',
+  'minimize' => true,
+  'maximize' => false,
+  'restore' => true,
+  'help' => false,
+  'close' => true,
+])
+
+@php
+  if ($restore) {
+    $maximize = false;
+  }
+@endphp
+
+<div {{ $attributes->merge(['class' => 'window']) }}>
+  <div class="title-bar">
+    @isset($title)
+      <div class="title-bar-text">{{ $title }}</div>
+    @endisset
+
+    @if ($minimize || $maximize || $restore || $help || $close)
+      <div class="title-bar-controls">
+        @if ($minimize)
+          <button class="minimize" aria-hidden="true"></button>
+        @endif
+
+        @if ($maximize)
+          <button class="maximize" aria-hidden="true"></button>
+        @endif
+
+        @if ($restore)
+          <button class="restore" aria-hidden="true"></button>
+        @endif
+
+        @if ($help)
+          <button class="help" aria-hidden="true"></button>
+        @endif
+
+        @if ($close)
+          <button class="close" aria-hidden="true"></button>
+        @endif
+      </div>
+    @endif
+  </div>
+
+  <div class="window-body">{{ $slot }}</div>
+
+  @isset($status_bar)
+    <div class="status-bar">{{ $status_bar }}</div>
+  @endisset
+</div>
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 11da659..e4277bb 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -5,16 +5,8 @@
   <body>
     @include('layouts.navigation')
 
-    <!-- Page Heading -->
-    @isset($header)
-      <header>
-        {{ $header }}
-      </header>
-    @endisset
-
-    <!-- Page Content -->
-    <main>
+    <x-window :title="$header" minimize restore close class="max-w-[600px]">
       {{ $slot }}
-    </main>
+    </x-window>
   </body>
 </html>
diff --git a/resources/views/layouts/navigation.blade.php b/resources/views/layouts/navigation.blade.php
index a2f343d..b4f49b0 100644
--- a/resources/views/layouts/navigation.blade.php
+++ b/resources/views/layouts/navigation.blade.php
@@ -2,23 +2,32 @@
   <!-- Primary Navigation Menu -->
   <div>
     <!-- Logo -->
-    <a href="{{ route('admin') }}">
-      <x-application-logo class="w-20" />
+    <a href="/" class="no-underline">
+      <x-home-btn />
     </a>
 
-    <!-- Navigation Links -->
-    <a href="{{ route('admin') }}">Admin</a>
+    <div class="py-2">
+      @auth
+        <a class="button" href="{{ route('admin') }}">Admin</a>
 
-    <!-- Profile -->
-    <a href="{{ route('profile.edit') }}">
-      {{ Auth::user()->name }}
-    </a>
+        <!-- Profile -->
+        <a class="button" href="{{ route('profile.edit') }}">
+          {{ Auth::user()->name }}
+        </a>
 
-    <!-- Log Out -->
-    <form method="POST" action="{{ route('logout') }}">
-      @csrf
+        <!-- Log Out -->
+        <form
+          class="inline-block"
+          method="POST"
+          action="{{ route('logout') }}"
+        >
+          @csrf
 
-      <button>Log Out</button>
-    </form>
+          <button>Log Out</button>
+        </form>
+      @else
+        <a href="{{ route('login') }}">Login</a>
+      @endauth
+    </div>
   </div>
 </nav>
diff --git a/resources/views/welcome.blade.php b/resources/views/welcome.blade.php
index f2d15c7..90254c9 100755
--- a/resources/views/welcome.blade.php
+++ b/resources/views/welcome.blade.php
@@ -1,13 +1 @@
-@if (Route::has('login'))
-  <nav>
-    @auth
-      <a href="{{ route('admin') }}">Admin</a>
-    @else
-      <a href="{{ route('login') }}">Log in</a>
-
-      @if (Route::has('register'))
-        <a href="{{ route('register') }}">Register</a>
-      @endif
-    @endauth
-  </nav>
-@endif
+<x-app-layout></x-app-layout>