diff --git a/ui.css b/ui.css
index c98f694..5f94056 100755
--- a/ui.css
+++ b/ui.css
@@ -8,6 +8,15 @@
 14,814%
 */
 
+<<<<<<< Updated upstream
+=======
+:root {
+    --menu-opacity: 0.8;
+    /* Malth is a nerd btw */
+    --menu-bg-colour: 34, 34, 34;
+}
+
+>>>>>>> Stashed changes
 html {
     font-size: 2em;
 }
@@ -21,7 +30,13 @@ body {
 
     /*font-family: 'Droid Sans';*/
     font-size: 32px;
+<<<<<<< Updated upstream
     color: #FFF;
+=======
+    color: #dcdcdc;
+
+    text-shadow: 2px 2px 8px #000;
+>>>>>>> Stashed changes
 }
 
 h1 {
@@ -80,6 +95,7 @@ h1 {
 /* Note: We are defining :hover and .active separately because :active:not(.active) isn't working, and to avoid using !important */
 
 .button:hover {
+<<<<<<< Updated upstream
     background-color: rgb(27, 80, 55);
 }
 
@@ -92,6 +108,21 @@ h1 {
 
 .button:disabled, .button.disabled {
     background: #3c3c3c;
+=======
+    background-color: #3c3c3c;
+}
+
+.button:active {
+    background-color: #2a2a2a;
+}
+.button.active {
+    background-color: #a92800;
+}
+
+.button:disabled, .button.disabled {
+    background: #1a1a1a !important;
+    pointer-events: none;
+>>>>>>> Stashed changes
 }
 
 .button.color-primary:hover {
@@ -173,13 +204,17 @@ h1 {
 
 .list-filter h1 {
     text-align: center;
+<<<<<<< Updated upstream
     color: #FFF;
+=======
+    color: #dcdcdc;
+>>>>>>> Stashed changes
     margin-top: 0;
 }
 
 .list-content {
     width: 75%;
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 
     padding: 1%;
 
@@ -201,7 +236,7 @@ h1 {
 
     margin: 0 3% 3% 0;
 
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     position: relative;
 
@@ -225,7 +260,7 @@ h1 {
 }
 
 .filter-option {
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     border-radius: 0.25em;
     padding: 0.5em;
     margin-bottom: 0.5em;
@@ -311,7 +346,7 @@ h1 {
 
     border-radius: 0.25em;
 
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-btn.first {
@@ -414,7 +449,7 @@ h1 {
     left: 26%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-panic {
@@ -475,9 +510,35 @@ h1 {
     left: 79%;
 
     border-radius: 0.25em;
+<<<<<<< Updated upstream
     border: 3px solid #59885d;
     
     text-align: center;
+=======
+    border: 3px solid #404040;
+    display: flex;
+    min-width: 45%;
+    justify-content: center;
+    margin-left: 10px;
+    margin-right: 10px;
+    z-index: 1;
+}
+
+.content-profile .profile-btn img {
+    width: 2em;
+    height: 2em;
+    margin-right: 20px;
+}
+
+.content-profile .profile-btn p {
+    align-self: center;
+    margin-top: 0;
+    margin-bottom: 0;
+}
+
+.content-profile p {
+    margin: 0;
+>>>>>>> Stashed changes
 }
 
 @keyframes calling {
@@ -512,6 +573,13 @@ h1 {
     width: 100%;
     text-align: center;
     margin-bottom: 0.3em;
+<<<<<<< Updated upstream
+=======
+    border-bottom-color: rgba(64, 64, 64, 1.000000);
+    border-bottom-width: 2px;
+    border-bottom-style: solid;
+    align-self: center;
+>>>>>>> Stashed changes
 }
 
 .btn-row-wrapper {
@@ -531,7 +599,7 @@ h1 {
     width: 4em;
     height: 4em;
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     padding: 0 0.2em 0 0;
 }
 
@@ -542,7 +610,7 @@ h1 {
 
 /*World Detail*/
 #world-detail {
-    background-color: #373021;
+    background-color: #222222;
 }
 
 #world-detail h1 {
@@ -558,7 +626,7 @@ h1 {
     right: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     padding: 0.5em;
 
     width: 8em;
@@ -575,7 +643,7 @@ h1 {
     left: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-world-actions {
@@ -587,7 +655,7 @@ h1 {
     left: 26%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-world-author {
@@ -599,7 +667,7 @@ h1 {
     left: 75%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-world-author-worlds {
@@ -611,7 +679,7 @@ h1 {
     left: 75%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-world-instances {
@@ -623,7 +691,7 @@ h1 {
     left: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-world-instances .action-btn {
@@ -792,7 +860,7 @@ h1 {
     margin-right: 1em;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     position: relative;
 
@@ -856,7 +924,7 @@ h1 {
 /*Instancing*/
 .world-instancing {
     position: absolute;
-    background-color: #373021;
+    background-color: #222222;
     top: 6%;
     bottom: 9%;
     left: -100%;
@@ -864,7 +932,7 @@ h1 {
     height: 81%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     padding: 0.5em;
 }
@@ -898,21 +966,25 @@ h1 {
 
 .btn-region .region-select {
     width: 33.333333%;
-    background-color: #373021;
+    background-color: #222222;
 }
 .btn-rule .rule-select {
     width: 50%;
-    background-color: #373021;
+    background-color: #222222;
 }
 .btn-region .region-select + .region-select,
 .btn-rule .rule-select + .rule-select {
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 }
 .btn-region .region-select.active,
 .btn-region .region-select:hover,
 .btn-rule .rule-select.active,
 .btn-rule .rule-select:hover {
+<<<<<<< Updated upstream
     background-color: rgba(27, 80, 55, 1);
+=======
+    background-color: #a92800;
+>>>>>>> Stashed changes
 }
 
 .inp-hidden {
@@ -922,7 +994,7 @@ h1 {
 /*Avatar Categories*/
 .favorite-category-selection {
     position: absolute;
-    background-color: #373021;
+    background-color: #222222;
     top: 6%;
     bottom: 9%;
     left: -100%;
@@ -930,7 +1002,7 @@ h1 {
     height: 81%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     padding: 0.5em;
 }
@@ -976,7 +1048,7 @@ h1 {
 
 /*Instance Detail*/
 #instance-detail {
-    background-color: #373021;
+    background-color: #222222;
 }
 
 #instance-detail h1 {
@@ -986,6 +1058,21 @@ h1 {
     margin-right: 4em;
 }
 
+<<<<<<< Updated upstream
+=======
+/*Group Detail*/
+#group-detail {
+    background-color: #222222;
+}
+
+#group-detail h1 {
+    text-align: left;
+    margin-top: 0.3em;
+    margin-left: 0.5em;
+    margin-right: 4em;
+}
+
+>>>>>>> Stashed changes
 .content-instance-owner {
     position: absolute;
     top: 10%;
@@ -995,7 +1082,7 @@ h1 {
     left: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-instance-owner .profile-image {
@@ -1032,7 +1119,7 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .content-instance-world .world-image {
@@ -1057,7 +1144,7 @@ h1 {
     left: 43%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 .content-instance-information .cell-name {
     width: 8.000000em;
@@ -1072,8 +1159,13 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
+<<<<<<< Updated upstream
     border: 3px solid #59885d;
     
+=======
+    border: 3px solid #404040;
+
+>>>>>>> Stashed changes
     display: flex;
 }
 .content-instance-buttons .instance-btn {
@@ -1093,7 +1185,7 @@ h1 {
     background: rgba(80, 80, 80, 1);
 }
 .content-instance-buttons .instance-btn + .instance-btn {
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 }
 
 .content-instance-players {
@@ -1105,7 +1197,7 @@ h1 {
     left: 69%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 .content-instance-players .instancePlayer {
     display: flex;
@@ -1123,7 +1215,7 @@ h1 {
 
 /*User Detail*/
 #user-detail {
-    background-color: #373021;
+    background-color: #222222;
 }
 #user-detail h1 {
     text-align: left;
@@ -1131,6 +1223,18 @@ h1 {
     margin-left: 0.5em;
     margin-right: 4em;
 }
+<<<<<<< Updated upstream
+=======
+#our-user-detail {
+    background-color: #222222;
+}
+#our-user-detail h1 {
+    text-align: left;
+    margin-top: 0.3em;
+    margin-left: 0.5em;
+    margin-right: 4em;
+}
+>>>>>>> Stashed changes
 .user-sidebar {
     position: absolute;
     top: 10%;
@@ -1140,7 +1244,7 @@ h1 {
     left: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 #user-detail .online-state {
     position: absolute;
@@ -1193,7 +1297,7 @@ h1 {
     left: 22%;
 
     /*border-radius: 0.25em;
-    border: 3px solid #59885d;*/
+    border: 3px solid #404040;*/
 }
 .tab-list {
     display: flex;
@@ -1205,7 +1309,7 @@ h1 {
 }
 .tab-btn {
     border-radius: 0.25em 0.25em 0 0;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     width: 11.5%;
     padding: 0.2em 0;
     text-align: center;
@@ -1213,7 +1317,7 @@ h1 {
     position: relative;
 }
 .tab-btn:hover {
-    background-color: #59885d;
+    background-color: #404040;
 }
 .tab-btn.active .active-overlay {
     position: absolute;
@@ -1221,11 +1325,11 @@ h1 {
     height: 6px;
     width: 100%;
 
-    background-color: #373021;
+    background-color: #222222;
 }
 .tab-contents {
     border-radius: 0 0 0.25em 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     position: absolute;
     top: 2em;
@@ -1234,7 +1338,7 @@ h1 {
     bottom: 0;
     height: auto;
 
-    background-color: #373021;
+    background-color: #222222;
 }
 
 .tab-content {
@@ -1257,7 +1361,7 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     display: flex;
 }
@@ -1297,7 +1401,7 @@ h1 {
     position: absolute;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     display: flex;
 
@@ -1378,7 +1482,7 @@ h1 {
     width: 35em;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     border-radius: 0.25em;
 
@@ -1402,7 +1506,7 @@ h1 {
     width: auto;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     border-radius: 0.25em;
 
@@ -1434,10 +1538,15 @@ h1 {
     overflow: hidden;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
+<<<<<<< Updated upstream
     background-color: #373021;
     
+=======
+    background-color: #222222;
+
+>>>>>>> Stashed changes
     padding: 1em;
 
     left: -100%;
@@ -1549,7 +1658,7 @@ h1 {
     overflow: hidden;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     background-color: rgba(27, 80, 55, 0.5);
 
@@ -1563,7 +1672,11 @@ h1 {
 
     text-align: center;
     font-weight: normal;
+<<<<<<< Updated upstream
     color: #FFF;
+=======
+    color: #dcdcdc;
+>>>>>>> Stashed changes
     font-size: 1.3em;
 }
 
@@ -1572,7 +1685,7 @@ h1 {
 }
 
 .toolbar-btn + .toolbar-btn {
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 }
 
 .toolbar-btn-double {
@@ -1582,11 +1695,15 @@ h1 {
 
     text-align: center;
     font-weight: bold;
+<<<<<<< Updated upstream
     color: #FFF;
+=======
+    color: #dcdcdc;
+>>>>>>> Stashed changes
     font-size: 1.3em;
 
-    border-left: 3px solid #59885d;
-    border-right: 3px solid #59885d;
+    border-left: 3px solid #404040;
+    border-right: 3px solid #404040;
 }
 
 .toolbar-btn > img {
@@ -1612,9 +1729,9 @@ h1 {
     overflow: hidden;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
-    background-color: #373021;
+    background-color: #222222;
 
     text-align: center;
 }
@@ -1683,7 +1800,7 @@ h1 {
     left: 0.5em;
     right: 0.5em;
     height: 2em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     border-radius: 0.25em;
 }
 .message-box.alert-timed-box .message-time .message-time-bar {
@@ -1692,7 +1809,11 @@ h1 {
     left: 0;
     height: 100%;
     width: 0;
+<<<<<<< Updated upstream
     background: #FFFFFF;
+=======
+    background: #dcdcdc;
+>>>>>>> Stashed changes
     border: 0.25em solid rgb(128, 128, 128);
 }
 
@@ -1734,7 +1855,7 @@ h1 {
 }
 
 .message-content {
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     border-radius: 0.25em;
 
     margin-bottom: 1em;
@@ -1746,7 +1867,7 @@ h1 {
     width: 5em;
     height: 5em;
 
-    border-right: 3px solid #59885d;
+    border-right: 3px solid #404040;
 
     margin-right: 1em;
 }
@@ -1754,6 +1875,84 @@ h1 {
 .message-text-wrapper {
     flex: 1;
     padding: 0.5em 0;
+<<<<<<< Updated upstream
+=======
+    align-self: flex-start;
+}
+
+.message-name {
+    font-size: 1.3em;
+    font-weight: bold;
+}
+
+.message-text {
+    margin-right: 0.6em;
+    padding-left: 0.4em;
+    padding-top: 0.4em;
+}
+
+.content-feed .scroll-content {
+    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
+    top: 1.5em;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 93%;
+    overflow-x: hidden;
+    margin-left: 10px;
+    margin-right: 10px;
+    margin-bottom: 5px;
+}
+
+.feed-content {
+    border: 3px solid #404040;
+    border-radius: 0.25em;
+
+    margin-bottom: 0.2em;
+
+    display: flex;
+    align-items: center;
+    width: 100%;
+}
+
+.feed-image:hover {
+    filter: brightness(80%);
+}
+
+.feed-image {
+    width: 4em;
+    height: 4em;
+
+    border-right: 3px solid #404040;
+
+    margin-right: 0.6em;
+}
+
+.feed-text-wrapper {
+    flex: 1;
+    padding: 0.5em 0;
+    align-self: flex-start;
+}
+
+.feed-name {
+    font-size: 1.3em;
+    font-weight: bold;
+}
+
+.feed-text {
+    margin-right: 0.6em;
+    padding-left: 0.4em;
+    padding-top: 0.4em;
+}
+
+.feed-time-block {
+    align-self: flex-start;
+    margin: 10px;
+}
+
+.button-root {
+    display: flex;
+>>>>>>> Stashed changes
 }
 
 .message-btn {
@@ -1762,7 +1961,7 @@ h1 {
 
     text-align: center;
 
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 }
 
 .message-btn img {
@@ -1781,8 +1980,13 @@ h1 {
 .noMessagesInfo {
   position: absolute;
 
+<<<<<<< Updated upstream
   border-radius: 0.25em;
   border: 3px solid #59885d;
+=======
+    border-radius: 0.25em;
+    border: 3px solid #404040;
+>>>>>>> Stashed changes
 
   display: flex;
 
@@ -1817,7 +2021,11 @@ h1 {
 
 /*Inputs*/
 .inp_slider {
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     width: 100%;
     height: 2em;
     position: relative;
@@ -1861,7 +2069,11 @@ h1 {
     height: 8em;
 }
 .inp_dropdown {
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     width: 15em;
     height: 2em;
     position: relative;
@@ -1877,7 +2089,11 @@ h1 {
     width: 100%;
 }
 .inp_dropdown_large {
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     width: 30em;
     height: 2em;
     position: relative;
@@ -1908,9 +2124,13 @@ h1 {
     left: 0;
     width: 100%;
     display: none;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
 
-    background-color: #373021;
+    background-color: #222222;
 }
 .inp_dropdown.open .valueList {
     display: block;
@@ -1924,7 +2144,7 @@ h1 {
     text-align: center;
 }
 .valueList .listValue + .listValue {
-    border-top: 1px solid #59885d;
+    border-top: 1px solid #404040;
 }
 .inp_dropdown .valueList .listValue:hover {
     background-color: rgba(180, 180, 180, 1);
@@ -1938,7 +2158,11 @@ h1 {
 .inp_toggle {
     height: 2em;
     width: 2em;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     margin-bottom: 1em
 }
 .inp_toggle.checked {
@@ -1958,6 +2182,25 @@ h1 {
     align-items: flex-end;
 }
 
+<<<<<<< Updated upstream
+=======
+.option-input.flex-row {
+    flex-direction: column;
+    align-items: flex-start;
+}
+
+.option-input .visualized-slider {
+    margin-bottom: 0;
+}
+
+.option-input .slider-visualizer-level {
+    border-bottom: 5px solid #28c647;
+    width: 50%;
+    margin-bottom: 1em;
+    margin-top: 2px;
+}
+
+>>>>>>> Stashed changes
 .vertical-pack {
     flex-direction: column;
 }
@@ -1977,11 +2220,12 @@ h1 {
 
 .inp_search {
     width: 100%;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     background: transparent;
     border-radius: 0.25em;
     padding: 0.5em;
     margin-left: -0.05em;
+<<<<<<< Updated upstream
     color: #FFFFFF;
 }
 
@@ -2088,6 +2332,9 @@ h1 {
     left: 770px;
 
     padding: 0.25em 0;
+=======
+    color: #dcdcdc;
+>>>>>>> Stashed changes
 }
 
 /*Keyboard*/
@@ -2102,9 +2349,9 @@ h1 {
     overflow: hidden;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
-    background-color: #373021;
+    background-color: #222222;
 
     text-align: center;
 }
@@ -2126,7 +2373,7 @@ h1 {
     display: flex;
 }
 .keyboard-row + .keyboard-row {
-    border-top: 3px solid #59885d;
+    border-top: 3px solid #404040;
 }
 .keyboard-row.r1 {
     height: 10%;
@@ -2171,7 +2418,11 @@ h1 {
 .keyboard-key.active,
 .keyboard-mod.active,
 .keyboard-func.active {
+<<<<<<< Updated upstream
     background-color: rgba(27, 80, 55, 1);
+=======
+    background-color: #a92800;
+>>>>>>> Stashed changes
 }
 .keyboard-key + .keyboard-key,
 .keyboard-key + .keyboard-mod,
@@ -2182,7 +2433,7 @@ h1 {
 .keyboard-func + .keyboard-key,
 .keyboard-func + .keyboard-mod,
 .keyboard-func + .keyboard-func {
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 }
 .keyboard-key.wide,
 .keyboard-mod.wide,
@@ -2223,7 +2474,11 @@ h1 {
 
 .inp_button {
     width: 10%;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     text-align: center;
     line-height: 1.333333em;
     font-size: 1.5em;
@@ -2232,7 +2487,11 @@ h1 {
 }
 .imperialDisplay {
     width: 30%;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     text-align: center;
     line-height: 1.333333em;
     font-size: 1.5em;
@@ -2241,7 +2500,11 @@ h1 {
 
 .inp_btn_action {
     width: 30%;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     text-align: center;
     line-height: 1.333333em;
     font-size: 1.5em;
@@ -2252,7 +2515,11 @@ h1 {
 .inp_joystick {
     width: 12em;
     height: 12em;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     margin-bottom: 1em;
     position: relative;
     background-image: url(gfx/Joystick_bg.svg);
@@ -2263,7 +2530,11 @@ h1 {
     height: 1em;
     width: 1em;
     border-radius: 50%;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     background: white;
     margin-left: -0.5em;
     margin-top: -0.5em;
@@ -2272,7 +2543,11 @@ h1 {
 .inp_sliderH {
     width: 4em;
     height: 12em;
+<<<<<<< Updated upstream
     border: 1px solid #59885d;
+=======
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     position: absolute;
     left: 13em;
 }
@@ -2291,10 +2566,17 @@ h1 {
     text-align: center;
     line-height: 1.333333em;
     font-size: 1.5em;
+<<<<<<< Updated upstream
     color: #FFFFFF;
 }
 .inp_number {
     border: 1px solid #59885d;
+=======
+    color: #dcdcdc;
+}
+.inp_number {
+    border: 4px solid #404040;
+>>>>>>> Stashed changes
     width: 100%;
     height: 1.333em;
     position: relative;
@@ -2303,11 +2585,15 @@ h1 {
     text-align: center;
     line-height: 1.333333em;
     font-size: 1.5em;
+<<<<<<< Updated upstream
     color: #FFFFFF;
+=======
+    color: #dcdcdc;
+>>>>>>> Stashed changes
 }
 
 #avatar-settings {
-    background-color: #373021;
+    background-color: #222222;
 }
 .advAvtrProfile {
     width: 100%;
@@ -2321,20 +2607,25 @@ h1 {
 }
 .advAvtrProfName {
     flex: 1;
+<<<<<<< Updated upstream
     border: 2px solid #59885d;
     
+=======
+    border: 2px solid #404040;
+
+>>>>>>> Stashed changes
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }
 .advAvtrProfSave {
     width: 1.3em;
-    border: 2px solid #59885d;
+    border: 2px solid #404040;
     margin-left: 0.3em;
 }
 .advAvtrProfDelete {
     width: 1.3em;
-    border: 2px solid #59885d;
+    border: 2px solid #404040;
     margin-left: 0.3em;
 }
 
@@ -2352,9 +2643,9 @@ h1 {
     overflow: hidden;
 
     box-sizing: border-box;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
-    background-color: #373021;
+    background-color: #222222;
 
     text-align: center;
 }
@@ -2383,7 +2674,7 @@ h1 {
     display: flex;
 }
 .numpad-row + .numpad-row {
-    border-top: 3px solid #59885d;
+    border-top: 3px solid #404040;
 }
 .numpad-row.r1 {
     top: 0;
@@ -2425,12 +2716,12 @@ h1 {
     flex: 2;
 }
 .numpadButton + .numpadButton {
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
 }
 
 .numpadButton.horizontal {
     position: absolute;
-    border-left: 3px solid #59885d;
+    border-left: 3px solid #404040;
     width: 25%;
     height: 40%;
     right: 0;
@@ -2439,7 +2730,7 @@ h1 {
     height: 20%;
 }
 .numpadButton.horizontal + .numpadButton.horizontal {
-    border-top: 3px solid #59885d;
+    border-top: 3px solid #404040;
 }
 
 .numpadButton.btn-back {
@@ -2462,7 +2753,7 @@ h1 {
 
 /*Avatar Details*/
 #avatar-detail {
-    background-color: #373021;
+    background-color: #222222;
 }
 
 #avatar-detail h1 {
@@ -2480,7 +2771,7 @@ h1 {
     left: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 .avatar-image {
     width: 14.5em;
@@ -2505,7 +2796,7 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .avatar-toolbar {
@@ -2516,7 +2807,7 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     display: flex;
 }
@@ -2532,7 +2823,7 @@ h1 {
 /*Prop Detail*/
 /*Avatar Details*/
 #prop-detail {
-    background-color: #373021;
+    background-color: #222222;
 }
 
 #prop-detail h1 {
@@ -2550,7 +2841,7 @@ h1 {
     left: 1%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 .prop-image {
     width: 14.5em;
@@ -2575,7 +2866,7 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .prop-toolbar {
@@ -2586,7 +2877,7 @@ h1 {
     left: 22%;
 
     border-radius: 0.25em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 
     display: flex;
 }
@@ -2704,7 +2995,7 @@ td div {
 
     border-radius: 8px;
 
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 
 .support-code-hint {
@@ -2736,13 +3027,17 @@ td div {
     padding: 10px;
     position: relative;
     border-radius: 8px;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
 }
 .inp_search {
     height: 70px;
     font-size: 30px;
     color: #333333;
+<<<<<<< Updated upstream
     background: #FFFFFF;
+=======
+    background: #dcdcdc;
+>>>>>>> Stashed changes
 }
 
 .option-caption.nsfw-toggle-caption {
@@ -2842,7 +3137,7 @@ td div {
     width: 22%;
     margin: 0 1.5% 3%;
     padding: 1em;
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     border-radius: 10px;
 }
 .user-public-content img {
@@ -2854,13 +3149,13 @@ td div {
     margin: 5px 0;
 }
 .user-public-content .detail-btn {
-    border: 3px solid #59885d;
+    border: 3px solid #404040;
     border-radius: 5px;
     padding: 5px;
     text-align: center;
 }
 .user-public-content .detail-btn:hover {
-    background: #59885d;
+    background: #404040;
 }
 
 img[data-loading-url] {
@@ -2925,4 +3220,438 @@ img[data-loading-url] {
 }
 .log-level-WARNING {
     color: #BBBB00;
+<<<<<<< Updated upstream
+=======
+}
+
+/* Content Share: Base */
+
+.content-sharing-base-dialog {
+    position: fixed;
+    background-color: #222222;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 800px;
+    min-width: 500px;
+    border: 3px solid #404040;
+    padding: 20px;
+    z-index: 100000;
+    opacity: 0;
+    transition: opacity 0.2s linear;
+}
+
+.content-sharing-base-dialog.in {
+    opacity: 1;
+}
+
+.content-sharing-base-dialog.out {
+    opacity: 0;
+}
+
+.content-sharing-base-dialog.hidden {
+    display: none;
+}
+
+.content-sharing-base-dialog h2,
+.content-sharing-base-dialog h3 {
+    margin-top: 0;
+    margin-bottom: 0.5em;
+    text-align: left;
+}
+
+.content-sharing-base-dialog .description {
+    margin-bottom: 1em;
+    text-align: left;
+    font-size: 0.9em;
+    color: #aaa;
+}
+
+.content-sharing-base-dialog .close-btn {
+    position: absolute;
+    top: 1%;
+    right: 1%;
+    border-radius: 0.25em;
+    border: 3px solid #404040;
+    padding: 0.5em;
+    width: 8em;
+    text-align: center;
+}
+
+.page-btn {
+    border-radius: 0.25em;
+    border: 3px solid #404040;
+    padding: 0.5em;
+    width: 8em;
+    text-align: center;
+}
+
+.page-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
+.inp-hidden {
+    display: none;
+}
+
+/* Content Share: Share Bubble */
+
+.share-bubble-dialog {
+    max-width: 800px;
+    transform: translate(-50%, -60%);
+}
+
+.share-bubble-dialog .content-btn {
+    position: relative;
+    margin-bottom: 0.5em;
+}
+
+.share-bubble-dialog .btn-group {
+    display: flex;
+    margin-bottom: 1em;
+}
+
+.share-bubble-dialog .option-select {
+    flex: 1 1 0;
+    min-width: 0;
+    background-color: inherit;
+    text-align: center;
+    padding: 0.5em;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid inherit;
+}
+
+.share-bubble-dialog .option-select + .option-select {
+    margin-left: -1px;
+}
+
+.share-bubble-dialog .option-select.active {
+    background-color: #a92800;
+}
+.share-bubble-dialog .option-select:hover {
+    background-color: #3c3c3c;
+}
+
+.share-bubble-dialog .action-buttons {
+    margin-top: 1em;
+    display: flex;
+    justify-content: space-between;
+}
+
+.share-bubble-dialog .action-btn {
+    flex: 1;
+    text-align: center;
+    padding: 0.5em;
+    border-radius: 0.25em;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-right: 0.5em;
+}
+
+.share-bubble-dialog .action-btn:last-child {
+    margin-right: 0;
+}
+
+/* Content Share: Share Select */
+
+.share-select-dialog {
+    width: 650px;
+    height: 480px;
+    transform: translate(-50%, -80%);
+}
+
+.share-select-dialog .share-options {
+    display: flex;
+    flex-direction: column;
+    gap: 15px;
+    margin-top: 20px;
+}
+
+.share-select-dialog .share-option {
+    padding: 20px;
+    text-align: left;
+    cursor: pointer;
+    background: rgba(0, 0, 0, 0.2);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 4px;
+    transition: background-color 0.2s ease;
+}
+
+.share-select-dialog .share-option:hover {
+    background-color: #3c3c3c;
+    border-color: rgba(255, 255, 255, 0.2);
+}
+
+.share-select-dialog h3 {
+    margin: 0 0 8px 0;
+    font-size: 1.2em;
+}
+
+.share-select-dialog p {
+    margin: 0;
+    opacity: 0.8;
+    font-size: 0.95em;
+    line-height: 1.4;
+}
+
+/* Content Share: Direct Share */
+
+.direct-share-dialog {
+    width: 800px;
+    height: 1000px;
+    transform: translate(-50%, -60%);
+    display: flex;
+    flex-direction: column;
+}
+
+.direct-share-dialog .search-container {
+    margin: 20px 0;
+    padding: 10px;
+    background: rgba(0, 0, 0, 0.2);
+    border-radius: 4px;
+}
+
+.direct-share-dialog .search-input {
+    width: 100%;
+    padding: 10px;
+    border: none;
+    background: transparent;
+    color: inherit;
+    font-size: 1.1em;
+}
+
+.direct-share-dialog .source-indicator {
+    padding: 10px;
+    text-align: center;
+    opacity: 0.8;
+    background: rgba(0, 0, 0, 0.1);
+    border-radius: 4px;
+    margin-bottom: 20px;
+}
+
+.direct-share-dialog .users-container {
+    flex: 1;
+    overflow-y: auto;
+    margin-bottom: 20px;
+    min-height: 0;
+}
+
+.direct-share-dialog .user-item {
+    display: flex;
+    align-items: center;
+    padding: 15px;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    margin-bottom: 10px;
+    background: rgba(0, 0, 0, 0.2);
+    border-radius: 4px;
+    min-height: 96px;
+}
+
+.direct-share-dialog .user-item img {
+    width: 96px;
+    height: 96px;
+    margin-right: 15px;
+    cursor: pointer;
+    border-radius: 4px;
+}
+
+.direct-share-dialog .user-item .user-name {
+    flex: 1;
+    font-size: 1.3em;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    margin-right: 15px;
+    cursor: pointer;
+}
+
+.direct-share-dialog .user-item .action-btn {
+    width: 140px;
+    height: 50px;
+    font-size: 1.2em;
+    color: white;
+    background-color: #222222;
+    border-radius: 4px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.direct-share-dialog .user-item .action-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    background-color: #4a9eff;
+}
+
+.direct-share-dialog .pagination {
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    padding-top: 20px;
+}
+
+.direct-share-dialog .page-info {
+    font-size: 1.1em;
+    opacity: 0.8;
+    margin-bottom: 15px;
+    text-align: center;
+}
+
+.direct-share-dialog .page-buttons {
+    display: flex;
+    justify-content: center;
+    gap: 20px;
+}
+
+.direct-share-dialog .user-item .action-btn {
+    width: 180px;
+    height: 60px;
+    font-size: 1.2em;
+    color: white;
+    border-radius: 4px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: 10px;
+    padding: 0 20px;
+    text-align: center;
+    background-color: #222222;
+}
+
+.direct-share-dialog .user-item .action-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
+.direct-share-dialog .user-item .action-btn.shared {
+    background-color: #4a9eff;
+}
+
+.direct-share-dialog .user-item .action-btn.failed {
+    background-color: #ff6b6b;
+}
+
+.direct-share-dialog #users-loading,
+.direct-share-dialog #users-error,
+.direct-share-dialog #users-empty {
+    text-align: center;
+    padding: 2em;
+    font-size: 1.1em;
+}
+
+.direct-share-dialog #shares-error {
+    color: #ff6b6b;
+}
+
+/* Content Share: Unshare */
+
+.unshare-dialog {
+    width: 800px;
+    height: 1000px;
+    transform: translate(-50%, -60%);
+    display: flex;
+    flex-direction: column;
+}
+
+.unshare-dialog .shares-container {
+    flex: 1;
+    overflow-y: auto;
+    margin: 20px 0;
+    min-height: 0;
+}
+
+.unshare-dialog #shares-loading,
+.unshare-dialog #shares-error,
+.unshare-dialog #shares-empty {
+    text-align: center;
+    padding: 2em;
+    font-size: 1.1em;
+}
+
+.unshare-dialog #shares-error {
+    color: #ff6b6b;
+}
+
+.unshare-dialog .share-item {
+    display: flex;
+    align-items: center;
+    padding: 15px;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    margin-bottom: 10px;
+    background: rgba(0, 0, 0, 0.2);
+    border-radius: 4px;
+    min-height: 120px;
+}
+
+.unshare-dialog .share-item img {
+    width: 96px;
+    height: 96px;
+    border-radius: 4px;
+    margin-right: 15px;
+    cursor: pointer;
+}
+
+.unshare-dialog .share-item .user-name {
+    flex: 1;
+    font-size: 1.3em;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    margin-right: 15px;
+    cursor: pointer;
+}
+
+.unshare-dialog .action-btn {
+    width: 180px;
+    height: 60px;
+    font-size: 1.2em;
+    color: white;
+    border-radius: 4px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: 10px;
+    padding: 0 20px;
+    text-align: center;
+}
+
+.unshare-dialog .revoke-btn {
+    background-color: #ff6b6b;
+}
+
+.unshare-dialog .undo-btn {
+    background-color: #4a9eff;
+}
+
+.unshare-dialog .action-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    background-color: #666;
+}
+
+.unshare-dialog .pagination {
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    padding-top: 20px;
+}
+
+.unshare-dialog .page-info {
+    font-size: 1.1em;
+    opacity: 0.8;
+    margin-bottom: 15px;
+    text-align: center;
+}
+
+.unshare-dialog .page-buttons {
+    display: flex;
+    justify-content: center;
+    gap: 20px;
+}
+
+.unshare-dialog .share-item.revoked {
+    opacity: 0.7;
+>>>>>>> Stashed changes
 }
\ No newline at end of file