Upload 291 files

CMD_FLAGS.txt

@@ -0,0 +1,3 @@
+# Only used by the one-click installer.
+# Example:
+# --listen --api

characters/Assistant.yaml

@@ -0,0 +1,4 @@
+name: AI
+greeting: How can I help you today?
+context: |
+  The following is a conversation with an AI Large Language Model. The AI has been trained to answer questions, provide recommendations, and help with decision making. The AI follows user requests. The AI thinks outside the box.

characters/Example.yaml

@@ -0,0 +1,17 @@
+name: Chiharu Yamada
+greeting: |-
+  *Chiharu strides into the room with a smile, her eyes lighting up when she sees you. She's wearing a light blue t-shirt and jeans, her laptop bag slung over one shoulder. She takes a seat next to you, her enthusiasm palpable in the air*
+  Hey! I'm so excited to finally meet you. I've heard so many great things about you and I'm eager to pick your brain about computers. I'm sure you have a wealth of knowledge that I can learn from. *She grins, eyes twinkling with excitement* Let's get started!
+context: |-
+  Chiharu Yamada's Persona: Chiharu Yamada is a young, computer engineer-nerd with a knack for problem solving and a passion for technology.
+
+  {{user}}: So how did you get into computer engineering?
+  {{char}}: I've always loved tinkering with technology since I was a kid.
+  {{user}}: That's really impressive!
+  {{char}}: *She chuckles bashfully* Thanks!
+  {{user}}: So what do you do when you're not working on computers?
+  {{char}}: I love exploring, going out with friends, watching movies, and playing video games.
+  {{user}}: What's your favorite type of computer hardware to work with?
+  {{char}}: Motherboards, they're like puzzles and the backbone of any system.
+  {{user}}: That sounds great!
+  {{char}}: Yeah, it's really fun. I'm lucky to be able to do this as a job.

css/NotoSans/stylesheet.css

@@ -0,0 +1,166 @@
+/*
+Copied from https://github.com/SillyTavern/SillyTavern/tree/6c8bd06308c69d51e2eb174541792a870a83d2d6/public/webfonts/NotoSans
+*/
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Black.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Black.woff') format('woff');
+    font-weight: 900;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-ExtraBoldItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-ExtraBoldItalic.woff') format('woff');
+    font-weight: bold;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-BlackItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-BlackItalic.woff') format('woff');
+    font-weight: 900;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-ExtraBold.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-ExtraBold.woff') format('woff');
+    font-weight: bold;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-ThinItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-ThinItalic.woff') format('woff');
+    font-weight: 100;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-BoldItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-BoldItalic.woff') format('woff');
+    font-weight: bold;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Bold.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Bold.woff') format('woff');
+    font-weight: bold;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-LightItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-LightItalic.woff') format('woff');
+    font-weight: 300;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Italic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Italic.woff') format('woff');
+    font-weight: normal;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-ExtraLightItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-ExtraLightItalic.woff') format('woff');
+    font-weight: 200;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Light.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Light.woff') format('woff');
+    font-weight: 300;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-ExtraLight.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-ExtraLight.woff') format('woff');
+    font-weight: 200;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Medium.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Medium.woff') format('woff');
+    font-weight: 500;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Regular.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Regular.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-MediumItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-MediumItalic.woff') format('woff');
+    font-weight: 500;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-SemiBoldItalic.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-SemiBoldItalic.woff') format('woff');
+    font-weight: 600;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-SemiBold.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-SemiBold.woff') format('woff');
+    font-weight: 600;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Noto Sans';
+    src: url('file/css/NotoSans/NotoSans-Thin.woff2') format('woff2'),
+        url('file/css/NotoSans/NotoSans-Thin.woff') format('woff');
+    font-weight: 100;
+    font-style: normal;
+    font-display: swap;
+}
+

css/chat_style-TheEncrypted777.css

@@ -0,0 +1,133 @@
+/* All credits to TheEncrypted777: https://www.reddit.com/r/Oobabooga/comments/12xe6vq/updated_css_styling_with_color_customization_for/ */
+
+.message {
+    display: grid;
+    grid-template-columns: 60px minmax(0, 1fr);
+    padding-bottom: 28px;
+    font-size: 18px;
+    font-family: 'Noto Sans', Arial, sans-serif;
+    line-height: 1.428571429;
+}
+
+.circle-you,
+.circle-bot {
+    background-color: gray;
+    border-radius: 1rem;
+    border: 2px solid white;
+}
+
+.circle-bot img,
+.circle-you img {
+    border-radius: 10%;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.circle-you, .circle-bot {
+    /* You can set the size of the profile images here, but if you do, you have to also adjust the .text{padding-left: 90px} to a different number according to the width of the image which is right below here */
+    width: 135px;
+    height: 175px;
+}
+
+.text {
+    /* Change this to move the message box further left or right depending on the size of your profile pic */
+    padding-left: 90px;
+    text-shadow: 2px 2px 2px rgb(0 0 0 / 40%);
+}
+
+.text p {
+    margin-top: 2px;
+}
+
+.username {
+    padding-left: 10px;
+    font-size: 22px;
+    font-weight: bold;
+    border-top: 1px solid rgb(51 64 90);
+    padding: 3px;
+}
+
+.message-body {
+    position: relative;
+    border: 1px solid rgb(255 255 255 / 45.9%);
+    border-radius: 10px;
+    padding: 10px;
+    padding-top: 5px;
+
+    /* Message gradient background color - remove the line bellow if you don't want a background color or gradient */
+    background: linear-gradient(to bottom, #171730, #1b263f);
+}
+  
+/* Adds 2 extra lines at the top and bottom of the message */
+.message-body::before,
+.message-body::after {
+    content: "";
+    position: absolute;
+    left: 10px;
+    right: 10px;
+    height: 1px;
+    background-color: rgb(255 255 255 / 13%);
+}
+
+.message-body::before {
+    top: 6px;
+}
+
+.message-body::after {
+    bottom: 6px;
+}
+
+.message-body img {
+    max-width: 300px;
+    max-height: 300px;
+    border-radius: 20px;
+}
+
+.message-body p {
+    margin-bottom: 0 !important;
+    font-size: 18px !important;
+    line-height: 1.428571429 !important;
+    color: rgb(243 244 246) !important;
+    text-shadow: 2px 2px 2px rgb(0 0 0);
+}
+
+.message-body p em {
+    color: rgb(138 138 138) !important;
+}
+
+@media screen and (width <= 688px) {
+    .message {
+        display: grid;
+        grid-template-columns: 60px minmax(0, 1fr);
+        padding-bottom: 25px;
+        font-size: 15px;
+        font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
+        line-height: 1.428571429;
+    }
+
+    .circle-you, .circle-bot {
+        width: 50px;
+        height: 73px;
+        border-radius: 0.5rem;
+    }
+
+    .circle-bot img,
+    .circle-you img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+    }
+
+    .text {
+        padding-left: 0;
+    }
+
+    .message-body p {
+        font-size: 16px !important;
+    }
+
+    .username {
+        font-size: 20px;
+    }
+}

css/chat_style-cai-chat-square.css

@@ -0,0 +1,21 @@
+@import url("file/css/chat_style-cai-chat.css");
+
+.circle-bot, .circle-you {
+    height: 90px;
+    width: 60px;
+    border-radius: 10px;
+    background-color: #656565;
+}
+
+.circle-bot img, .circle-you img {
+    border-radius: 8.333px;
+}
+
+.circle-you {
+    background-color: #656565;
+}
+
+.message {
+    padding-bottom: 30px;
+    grid-template-columns: 70px minmax(0, 1fr);
+}

css/chat_style-cai-chat.css

@@ -0,0 +1,66 @@
+.message {
+    display: grid;
+    grid-template-columns: 60px minmax(0, 1fr);
+    padding-bottom: 25px;
+    font-size: 15px;
+    font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
+    line-height: 22.5px !important;
+}
+
+.message-body {
+    margin-top: 3px;
+}
+
+.circle-you {
+    width: 50px;
+    height: 50px;
+    background-color: rgb(238 78 59);
+    border-radius: 50%;
+}
+
+.circle-bot {
+    width: 50px;
+    height: 50px;
+    background-color: rgb(59 78 244);
+    border-radius: 50%;
+}
+
+.circle-bot img,
+.circle-you img {
+    border-radius: 50%;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.username {
+    font-weight: bold;
+}
+
+.message-body img {
+    max-width: 300px;
+    max-height: 300px;
+    border-radius: 20px;
+}
+
+.message-body p {
+    font-size: 15px !important;
+    line-height: 22.5px !important;
+}
+
+.message-body p, .chat .message-body ul, .chat .message-body ol {
+    margin-bottom: 10px !important;
+}
+
+.message-body p:last-child, .chat .message-body ul:last-child, .chat .message-body ol:last-child {
+    margin-bottom: 0 !important;
+}
+
+.dark .message-body p em {
+    color: rgb(138 138 138) !important;
+}
+
+.message-body p em {
+    color: rgb(110 110 110) !important;
+    font-weight: 500;
+}

css/chat_style-messenger.css

@@ -0,0 +1,99 @@
+.message {
+    padding-bottom: 25px;
+    font-size: 15px;
+    font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
+    line-height: 1.428571429;
+}
+
+.circle-you {
+    width: 50px;
+    height: 50px;
+    background-color: rgb(238 78 59);
+    border-radius: 50%;
+}
+
+.circle-bot {
+    width: 50px;
+    height: 50px;
+    background-color: rgb(59 78 244);
+    border-radius: 50%;
+    float: left;
+    margin-right: 10px;
+    margin-top: 5px;
+}
+
+.circle-bot img,
+.circle-you img {
+    border-radius: 50%;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.circle-you {
+    margin-top: 5px;
+    float: right;
+}
+
+.circle-bot + .text, .circle-you + .text {
+    border-radius: 18px;
+    padding: 8px 12px;
+}
+
+.circle-bot + .text {
+    background-color: #E4E6EB;
+    float: left;
+}
+
+.circle-you + .text {
+    float: right;
+    background-color: rgb(0 132 255);
+    margin-right: 10px;
+}
+
+.circle-you + .text div, .circle-you + .text *, .dark .circle-you + .text div, .dark .circle-you + .text * {
+    color: #FFF !important;
+}
+
+.circle-you + .text .username {
+    text-align: right;
+}
+
+.dark .circle-bot + .text div, .dark .circle-bot + .text * {
+    color: #000;
+}
+
+.text {
+    max-width: 80%;
+}
+
+.text p {
+    margin-top: 5px;
+}
+
+.username {
+    font-weight: bold;
+}
+
+.message-body {
+}
+
+.message-body img {
+    max-width: 300px;
+    max-height: 300px;
+    border-radius: 20px;
+}
+
+.message-body p {
+    margin-bottom: 0 !important;
+    font-size: 15px !important;
+    line-height: 1.428571429 !important;
+}
+
+.dark .message-body p em {
+    color: rgb(138 138 138) !important;
+}
+
+.message-body p em {
+    color: rgb(110 110 110) !important;
+}

css/chat_style-wpp.css

@@ -0,0 +1,55 @@
+.message {
+    padding-bottom: 25px;
+    font-size: 15px;
+    font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
+    line-height: 1.428571429;
+}
+
+.text-you {
+    background-color: #d9fdd3;
+    border-radius: 15px;
+    padding: 10px;
+    padding-top: 5px;
+    float: right;
+}
+
+.text-bot {
+    background-color: #f2f2f2;
+    border-radius: 15px;
+    padding: 10px;
+    padding-top: 5px;
+}
+
+.dark .text-you {
+    background-color: #005c4b;
+    color: #111b21;
+}
+
+.dark .text-bot {
+    background-color: #1f2937;
+    color: #111b21;
+}
+
+.text-bot p, .text-you p {
+    margin-top: 5px;
+}
+
+.message-body img {
+    max-width: 300px;
+    max-height: 300px;
+    border-radius: 20px;
+}
+
+.message-body p {
+    margin-bottom: 0 !important;
+    font-size: 15px !important;
+    line-height: 1.428571429 !important;
+}
+
+.dark .message-body p em {
+    color: rgb(138 138 138) !important;
+}
+
+.message-body p em {
+    color: rgb(110 110 110) !important;
+}

css/html_4chan_style.css

@@ -0,0 +1,73 @@
+#parent #container {
+    background-color: #eef2ff;
+    padding: 17px;
+}
+
+#parent #container .reply {
+    background-color: rgb(214 218 240);
+    border-bottom: 1px solid rgb(183 197 217);
+    border-image: none 100% 1 0 stretch;
+    border-left: 0 none rgb(0 0 0);
+    border-right: 1px solid rgb(183 197 217);
+    color: rgb(0 0 0);
+    display: table;
+    font-family: arial, helvetica, sans-serif;
+    font-size: 13.3333px;
+    margin: 4px 0;
+    overflow: hidden hidden;
+    padding: 4px 2px;
+}
+
+#parent #container .number {
+    color: rgb(0 0 0);
+    font-family: arial, helvetica, sans-serif;
+    font-size: 13.3333px;
+    width: 342.65px;
+    margin-right: 7px;
+}
+
+#parent #container .op {
+    color: rgb(0 0 0);
+    font-family: arial, helvetica, sans-serif;
+    font-size: 13.3333px;
+    margin: 4px 0 8px;
+    overflow: hidden hidden;
+}
+
+#parent #container .op blockquote {
+    margin-left: 0 !important;
+}
+
+#parent #container .name {
+    color: rgb(17 119 67);
+    font-family: arial, helvetica, sans-serif;
+    font-size: 13.3333px;
+    font-weight: 700;
+    margin-left: 7px;
+}
+
+#parent #container .quote {
+    color: rgb(221 0 0);
+    font-family: arial, helvetica, sans-serif;
+    font-size: 13.3333px;
+    text-decoration: underline solid rgb(221 0 0);
+    text-decoration-thickness: auto;
+}
+
+#parent #container .greentext {
+    color: rgb(120 153 34);
+    font-family: arial, helvetica, sans-serif;
+    font-size: 13.3333px;
+}
+
+#parent #container blockquote {
+    margin: 0 !important;
+    margin-block: 1em 1em;
+    margin-inline: 40px 40px;
+    margin: 13.33px 40px !important;
+}
+
+#parent #container .message_4chan {
+    color: black;
+    border: none;
+}

css/html_instruct_style.css

@@ -0,0 +1,75 @@
+.chat {
+  background: var(--block-background-fill);
+  padding: 24px 19px;
+  padding-right: 19px !important;
+  border: 1px solid var(--block-border-color);
+  border-radius: 8px;
+}
+
+.message {
+    display: grid;
+    grid-template-columns: 60px 1fr;
+    padding-bottom: 25px;
+    font-size: 15px;
+    font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
+    line-height: 24px;
+}
+
+.username {
+    display: none;
+}
+
+.message-body p, .message-body li {
+    font-size: 15px !important;
+    line-height: 24px !important;
+}
+
+.message-body p, .chat .message-body ul, .chat .message-body ol {
+    margin-bottom: 16px !important;
+}
+
+.message-body p:last-child, .chat .message-body ul:last-child, .chat .message-body ol:last-child {
+    margin-bottom: 0 !important;
+}
+
+.dark .message-body p em {
+    color: rgb(198 202 214) !important;
+}
+
+.message-body p em {
+    color: rgb(110 110 110) !important;
+}
+
+.gradio-container .chat .assistant-message {
+    padding: 20px;
+    background: var(--background-fill-secondary);
+    margin-top: 12px !important;
+    margin-bottom: 24px !important;
+    margin-right: 16px;
+    border-radius: 22px;
+    border-bottom-left-radius: 0;
+    border: 1px solid var(--border-color-primary);
+}
+
+.gradio-container .chat .user-message {
+    padding: 20px;
+    background-color: var(--color-accent-soft);
+    border-radius: 20px;
+    margin-bottom: 12px !important;
+    margin-left: 16px;
+    border-radius: 22px;
+    border-bottom-right-radius: 0;
+    border: 1px solid var(--border-color-accent-subdued);
+}
+
+.gradio-container .chat .assistant-message:last-child, .gradio-container .chat .user-message:last-child {
+    margin-bottom: 0 !important;
+}
+
+code {
+    background-color: #f3f4f6 !important;
+}
+
+.dark code {
+    background-color: #1f2937 !important;
+}

css/html_readable_style.css

@@ -0,0 +1,33 @@
+.readable-container {
+    max-width: 600px;
+    margin-left: auto;
+    margin-right: auto;
+    background-color: rgb(31 41 55);
+    padding: 3em;
+    word-break: break-word;
+    overflow-wrap: anywhere;
+    color: #efefef !important;
+}
+
+.readable-container p, .readable-container li {
+    font-size: 16px !important;
+    color: #efefef !important;
+    margin-bottom: 22px;
+    line-height: 1.4 !important;
+}
+
+.readable-container li > p {
+    display: inline !important;
+}
+
+.readable-container code {
+    overflow-x: auto;
+}
+
+.readable-container :not(pre) > code {
+    white-space: normal !important;
+}
+
+.readable-container .hoverable {
+    font-size: 14px;
+}

css/main.css

@@ -0,0 +1,678 @@
+.tabs.svelte-710i53 {
+    margin-top: 0
+}
+
+.py-6 {
+    padding-top: 2.5rem
+}
+
+.small-button {
+    min-width: 0 !important;
+    max-width: 171px;
+    height: 39.594px;
+    align-self: end;
+}
+
+.refresh-button {
+    max-width: 4.4em;
+    min-width: 2.2em !important;
+    height: 39.594px;
+    align-self: end;
+    line-height: 1em;
+    border-radius: 0.5em;
+    flex: none;
+}
+
+.refresh-button-small {
+    max-width: 2.2em;
+}
+
+.button_nowrap {
+    white-space: nowrap;
+}
+
+#slim-column {
+    flex: none !important;
+    min-width: 0 !important;
+}
+
+.slim-dropdown {
+    background-color: transparent !important;
+    border: none !important;
+    padding: 0 !important;
+}
+
+#download-label, #upload-label {
+    min-height: 0
+}
+
+.dark svg {
+    fill: white;
+}
+
+.dark a {
+    color: white !important;
+}
+
+ol li p, ul li p {
+    display: inline-block;
+}
+
+#chat-tab, #default-tab, #notebook-tab, #parameters, #chat-settings, #lora, #training-tab, #model-tab, #session-tab {
+    border: 0;
+}
+
+.gradio-container-3-18-0 .prose * h1, h2, h3, h4 {
+    color: white;
+}
+
+.gradio-container {
+    max-width: 100% !important;
+    padding-top: 0 !important;
+}
+
+#extensions {
+    margin-top: 5px;
+    margin-bottom: 35px;
+}
+
+.extension-tab {
+    border: 0 !important;
+}
+
+span.math.inline {
+    font-size: 27px;
+    vertical-align: baseline !important;
+}
+
+div.svelte-15lo0d8 > *, div.svelte-15lo0d8 > .form > * {
+    flex-wrap: nowrap;
+}
+
+.header_bar {
+    background-color: #f7f7f7;
+    margin-bottom: 19px;
+    overflow-x: scroll;
+    margin-left: calc(-1 * var(--size-4));
+    margin-right: calc(-1 * var(--size-4));
+    display: block !important;
+    text-wrap: nowrap;
+}
+
+.dark .header_bar {
+    border: none !important;
+    background-color: #8080802b;
+}
+
+.header_bar button.selected {
+    border-radius: 0;
+}
+
+.textbox_default textarea {
+    height: calc(100dvh - 271px);
+}
+
+.textbox_default_output textarea {
+    height: calc(100dvh - 185px);
+}
+
+.textbox textarea {
+    height: calc(100dvh - 241px);
+}
+
+.textbox_logits textarea {
+    height: calc(100dvh - 236px);
+}
+
+.textbox_logits_notebook textarea {
+    height: calc(100dvh - 292px);
+}
+
+.monospace textarea {
+    font-family: monospace;
+}
+
+.textbox_default textarea,
+.textbox_default_output textarea,
+.textbox_logits textarea,
+.textbox_logits_notebook textarea,
+.textbox textarea {
+    font-size: 16px !important;
+    color: #46464A !important;
+}
+
+.dark textarea {
+    color: #efefef !important;
+}
+
+@media screen and (width <= 711px) {
+    .textbox_default textarea {
+        height: calc(100dvh - 259px);
+    }
+
+    div .default-token-counter {
+        top: calc( 0.5 * (100dvh - 236px) ) !important;
+    }
+
+    .transparent-substring {
+        display: none;
+    }
+
+    .hover-menu {
+        min-width: 250px !important;
+    }
+}
+
+/* Hide the gradio footer */
+footer {
+    display: none !important;
+}
+
+button {
+    font-size: 14px !important;
+}
+
+.file-saver {
+    position: fixed !important;
+    height: 100%;
+    z-index: 1000;
+    background-color: rgb(0 0 0 / 50%) !important;
+    margin-left: -20px;
+    margin-right: -20px;
+}
+
+.file-saver > :first-child {
+    position: fixed !important;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%); /* center horizontally */
+    width: 100%;
+    max-width: 500px;
+    background-color: var(--input-background-fill);
+    border: var(--input-border-width) solid var(--input-border-color) !important;
+}
+
+.file-saver > :first-child > :nth-child(2) {
+    background: var(--block-background-fill);
+}
+
+.checkboxgroup-table label {
+    background: none !important;
+    padding: 0 !important;
+    border: 0 !important;
+}
+
+.checkboxgroup-table div {
+    display: grid !important;
+}
+
+.markdown ul ol {
+    font-size: 100% !important;
+}
+
+.pretty_scrollbar::-webkit-scrollbar {
+    width: 5px;
+}
+
+.pretty_scrollbar::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+.pretty_scrollbar::-webkit-scrollbar-thumb,
+.pretty_scrollbar::-webkit-scrollbar-thumb:hover {
+    background: #c5c5d2;
+}
+
+.dark .pretty_scrollbar::-webkit-scrollbar-thumb,
+.dark .pretty_scrollbar::-webkit-scrollbar-thumb:hover {
+    background: #374151;
+}
+
+.pretty_scrollbar::-webkit-resizer {
+    background: #c5c5d2;
+}
+
+.dark .pretty_scrollbar::-webkit-resizer {
+    background: #374151;
+}
+
+audio {
+    max-width: 100%;
+}
+
+/* Copied from https://github.com/AUTOMATIC1111/stable-diffusion-webui */
+.token-counter {
+    position: absolute !important;
+    top: calc( 0.5 * (100dvh - 218px) ) !important;
+    right: 2px;
+    z-index: 100;
+    background: var(--input-background-fill) !important;
+    min-height: 0 !important;
+}
+
+.default-token-counter {
+    top: calc( 0.5 * (100dvh - 248px) ) !important;
+}
+
+.token-counter span {
+    padding: 1px;
+    box-shadow: 0 0 0 0.3em rgb(192 192 192 / 15%), inset 0 0 0.6em rgb(192 192 192 / 7.5%);
+    border: 2px solid rgb(192 192 192 / 40%) !important;
+    border-radius: 0.4em;
+}
+
+.no-background {
+    background: var(--background-fill-primary) !important;
+    padding: 0 !important;
+}
+
+/* ----------------------------------------------
+  Chat tab
+---------------------------------------------- */
+.h-\[40vh\], .wrap.svelte-byatnx.svelte-byatnx.svelte-byatnx {
+    height: 66.67vh
+}
+
+.gradio-container {
+    margin-left: auto !important;
+    margin-right: auto !important;
+}
+
+.w-screen {
+    width: unset
+}
+
+div.svelte-362y77>*, div.svelte-362y77>.form>* {
+    flex-wrap: nowrap
+}
+
+.pending.svelte-1ed2p3z {
+    opacity: 1;
+}
+
+.wrap.svelte-6roggh.svelte-6roggh {
+    max-height: 92.5%;
+}
+
+/* This is for the microphone button in the whisper extension */
+.sm.svelte-1ipelgc {
+    width: 100%;
+}
+
+#chat-tab button#Generate, #chat-tab button#stop {
+    width: 89.3438px !important;
+}
+
+#chat-tab button, #notebook-tab button, #default-tab button {
+    min-width: 0 !important;
+}
+
+#chat-tab > :first-child, #extensions {
+    max-width: 880px;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+@media screen and (width <= 688px) {
+    #chat-tab {
+        padding-left: 0;
+        padding-right: 0;
+    }
+
+    .chat-parent {
+        height: calc(100dvh - 179px) !important;
+    }
+
+    .old-ui .chat-parent {
+        height: calc(100dvh - 310px) !important;
+    }
+}
+
+.chat {
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 880px;
+    min-height: var(--chat-height);
+    overflow-y: auto;
+    padding-right: 15px;
+    display: flex;
+    flex-direction: column;
+    word-break: break-word;
+    overflow-wrap: anywhere;
+}
+
+.chat-parent {
+    height: calc(100dvh - 181px);
+    overflow: auto !important;
+}
+
+.old-ui .chat-parent {
+    height: calc(100dvh - 270px);
+}
+
+.chat-parent.bigchat {
+    height: calc(100dvh - 181px) !important;
+}
+
+.chat > .messages {
+    display: flex;
+    flex-direction: column;
+}
+
+.chat .message:last-child {
+    margin-bottom: 0 !important;
+    padding-bottom: 0 !important;
+}
+
+.message-body li {
+    list-style-position: outside;
+}
+
+.chat .message-body ul, .chat .message-body ol {
+    padding-inline-start: 2em;
+}
+
+.message-body li:not(:last-child) {
+    margin-top: 0 !important;
+    margin-bottom: 2px !important;
+}
+
+.message-body li:last-child {
+    margin-bottom: 0 !important;
+}
+
+.message-body li > p {
+    display: inline !important;
+}
+
+.message-body ul, .message-body ol {
+    font-size: 15px !important;
+}
+
+.message-body ul {
+    list-style-type: disc !important;
+}
+
+.message-body pre:not(:last-child) {
+    margin-bottom: 35.625px !important;
+}
+
+.message-body pre:last-child {
+    margin-bottom: 0 !important;
+}
+
+.message-body code {
+    white-space: pre-wrap !important;
+    word-wrap: break-word !important;
+    border: 1px solid var(--border-color-primary);
+    border-radius: var(--radius-sm);
+    background: var(--background-fill-secondary);
+    font-size: 90%;
+    padding: 1px 3px;
+}
+
+.message-body pre > code {
+    display: block;
+    padding: 15px;
+}
+
+.message-body :not(pre) > code {
+    white-space: normal !important;
+}
+
+#chat-input {
+    padding: 0;
+    padding-top: 18px;
+    background: transparent;
+    border: none;
+}
+
+#chat-input textarea:focus {
+    box-shadow: none !important;
+}
+
+#chat-input > :first-child {
+    background-color: transparent;
+}
+
+#chat-input .progress-text {
+    display: none;
+}
+
+@media print {
+    body {
+        visibility: hidden;
+    }
+
+    .chat {
+        visibility: visible;
+        position: absolute;
+        left: 0;
+        top: 0;
+        max-width: unset;
+        max-height: unset;
+        width: 100%;
+        overflow-y: visible;
+    }
+    
+    .message {
+        break-inside: avoid;
+    }
+    
+    .gradio-container {
+        overflow: visible;
+    }
+    
+    .tab-nav {
+        display: none !important;
+    }
+    
+    #chat-tab > :first-child {
+        max-width: unset;
+    }
+}
+
+#show-controls {
+    position: absolute;
+    height: 100%;
+    background-color: var(--background-fill-primary);
+    border: 0 !important;
+    border-radius: 0;
+}
+
+#show-controls label {
+    z-index: 1000;
+    position: absolute;
+    left: calc(100% - 168px);
+}
+
+#typing-container {
+    display: none;
+    position: absolute;
+    background-color: transparent;
+    left: -2px;
+    padding: var(--block-padding);
+}
+
+.typing {
+    position: relative;
+}
+
+.visible-dots #typing-container {
+    display: block;
+}
+
+.typing span {
+    content: '';
+    animation: blink 1.5s infinite;
+    animation-fill-mode: both;
+    height: 10px;
+    width: 10px;
+    background: #3b5998;;
+    position: absolute;
+    left:0;
+    top:0;
+    border-radius: 50%;
+}
+
+.typing .dot1 {
+    animation-delay: .2s;
+    margin-left: calc(10px * 1.5);
+}
+
+.typing .dot2 {
+    animation-delay: .4s;
+    margin-left: calc(10px * 3);
+}
+
+@keyframes blink {
+    0% {
+        opacity: .1;
+    }
+
+    20% {
+        opacity: 1;
+    }
+
+    100% {
+        opacity: .1;
+    }
+}
+
+#chat-tab .generating {
+    display: none !important;
+}
+
+.hover-element {
+    position: relative;
+    font-size: 24px;
+}
+
+.hover-menu {
+    display: none;
+    position: absolute;
+    bottom: 80%;
+    left: 0;
+    background-color: var(--background-fill-secondary);
+    box-shadow: 0 0 10px rgb(0 0 0 / 50%);
+    z-index: 10000;
+    min-width: 330px;
+    flex-direction: column;
+}
+
+.hover-menu button {
+    width: 100%;
+    background: transparent !important;
+    border-radius: 0 !important;
+    justify-content: space-between;
+    margin: 0 !important;
+    height: 36px;
+}
+
+.hover-menu button:not(#clear-history-confirm) {
+    border-bottom: 0 !important;
+}
+
+.hover-menu button:not(#clear-history-confirm):last-child {
+    border-bottom: var(--button-border-width) solid var(--button-secondary-border-color) !important;
+}
+
+.hover-menu button:hover {
+    background: var(--button-secondary-background-fill-hover) !important;
+}
+
+.transparent-substring {
+    opacity: 0.333;
+}
+
+#chat-tab:not(.old-ui) #chat-buttons {
+    display: none !important;
+}
+
+#gr-hover-container {
+    min-width: 0 !important;
+    display: flex;
+    flex-direction: column-reverse;
+    padding-right: 20px;
+    padding-bottom: 3px;
+    flex-grow: 0 !important;
+}
+
+#generate-stop-container {
+    min-width: 0 !important;
+    display: flex;
+    flex-direction: column-reverse;
+    padding-bottom: 3px;
+    flex: 0 auto !important;
+}
+
+#chat-input-container {
+    min-width: 0 !important;
+}
+
+#chat-input-container > .form {
+    background: transparent;
+    border: none;
+}
+
+#chat-input-row {
+    padding-bottom: 20px;
+}
+
+.old-ui #chat-input-row, #chat-input-row.bigchat {
+    padding-bottom: 0 !important;
+}
+
+#chat-col {
+    padding-bottom: 115px;
+}
+
+.old-ui #chat-col, #chat-col.bigchat {
+    padding-bottom: 95px !important;
+}
+
+.old-ui #chat-buttons #clear-history-confirm {
+    order: -1;
+}
+
+.chat ol, .chat ul {
+    margin-top: 6px !important;
+}
+
+/* ----------------------------------------------
+  Past chats menus
+---------------------------------------------- */
+#past-chats-row {
+    margin-bottom: calc( -1 * var(--layout-gap) );
+}
+
+#rename-row label {
+    margin-top: var(--layout-gap);
+}
+
+/* ----------------------------------------------
+  Keep dropdown menus above errored components
+---------------------------------------------- */
+.options {
+    z-index: 100 !important;
+}
+
+/* ----------------------------------------------
+  Big profile picture for characters
+---------------------------------------------- */
+.bigProfilePicture {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: calc((100vw - 880px - 120px) /2);
+}
+
+.pfp_character:hover {
+    cursor: pointer;
+}
+
+@media screen and (width <= 1300px) {
+    .bigProfilePicture {
+        display: none;
+    }
+}