.driver-popover.driverjs-theme {
    background-color: #1f2020;
    color: #e7e5e4;
    border: 1px solid #252626;
    border-radius: 0.5rem;
    font-family: 'Inter', sans-serif;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.driver-popover.driverjs-theme .driver-popover-title {
    font-size: 14px;
    font-weight: 600;
    color: #e7e5e4;
}

.driver-popover.driverjs-theme .driver-popover-description {
    font-size: 12px;
    color: #acabaa;
}

.driver-popover.driverjs-theme .driver-popover-footer button {
    background-color: #3b3b3b;
    color: #e7e5e4;
    border: none;
    border-radius: 4px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 4px 10px;
    text-shadow: none;
}

.driver-popover.driverjs-theme .driver-popover-footer button:hover {
    background-color: #484848;
}

.driver-popover.driverjs-theme .driver-popover-footer .driver-popover-next-btn {
    background-color: #e7e5e4 !important;
    color: #0e0e0e !important;
    font-weight: 700;
}

.driver-popover.driverjs-theme .driver-popover-footer .driver-popover-next-btn:hover {
    background-color: white !important;
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    font-size: 18px;
}

::selection {
    background: #f7603e;
    color: black;
    text-shadow: none;
}

::-moz-selection {
    background: #f7603e;
    color: #EEE;
    text-shadow: none;
}

body {
    background-color: #0e0e0e;
    color: #e7e5e4;
    font-family: 'Inter', sans-serif;
    overflow: hidden;
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #252626;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #3b3b3b;
}

/* Markdown Preview Styles */
#artifact-preview h1 {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 1rem;
    color: #e7e5e4;
}

#artifact-preview h2 {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 0.75rem;
    margin-top: 1.5rem;
    color: #e7e5e4;
}

#artifact-preview p {
    margin-bottom: 1rem;
    line-height: 1.6;
    color: #acabaa;
}

#artifact-preview ul {
    list-style-type: disc;
    margin-left: 1.5rem;
    margin-bottom: 1rem;
    color: #acabaa;
}

#artifact-preview pre {
    background: #1f2020;
    padding: 1rem;
    border-radius: 0.5rem;
    overflow-x: auto;
    margin-bottom: 1rem;
}

#artifact-preview code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.875rem;
    color: #c6c6c6;
}

#artifact-preview blockquote {
    border-left: 2px solid #b8b9b9;
    padding-left: 1rem;
    margin-left: 0;
    font-style: italic;
    color: #acabaa;
    background: #131313;
    padding: 1rem;
}

#artifact-preview a {
    color: #c6c6c6;
    text-decoration: underline;
}

#artifact-preview em {
    color: #c6c6c6;
    font-style: italic;
}

#artifact-preview strong {
    color: #e7e5e4;
    font-weight: bold;
}

/* Make Vditor toolbar sticky when scrolling editor-viewport (if enabled) */
body.sticky-toolbar .vditor-toolbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
}

html.light {
    color-scheme: light;
}

html.light .bg-\[\#0e0e0e\] {
    background-color: #fcfcfc !important;
}

html.light .bg-\[\#131313\] {
    background-color: #f3f4f6 !important;
}

html.light .bg-\[\#1f2020\] {
    background-color: #e5e7eb !important;
}

html.light .bg-\[\#252626\] {
    background-color: #d1d5db !important;
}

html.light .bg-\[\#303030\] {
    background-color: #9ca3af !important;
}

html.light .bg-\[\#484848\] {
    background-color: #d1d5db !important;
}

html.light .hover\:bg-\[\#1f2020\]:hover {
    background-color: #e5e7eb !important;
}

html.light .hover\:bg-\[\#252626\]:hover {
    background-color: #d1d5db !important;
}

html.light .border-\[\#1f2020\] {
    border-color: #e5e7eb !important;
}

html.light .border-\[\#252626\] {
    border-color: #d1d5db !important;
}

html.light .border-\[\#303030\] {
    border-color: #9ca3af !important;
}

html.light .border-\[\#484848\] {
    border-color: #d1d5db !important;
}

html.light .text-\[\#e7e5e4\] {
    color: #111827 !important;
}

html.light .text-\[\#c6c6c6\] {
    color: #374151 !important;
}

html.light .text-\[\#acabaa\] {
    color: #4b5563 !important;
}

html.light .text-\[\#8e8d8c\] {
    color: #6b7280 !important;
}

html.light .text-\[\#767575\] {
    color: #9ca3af !important;
}

html.light .text-\[\#575656\] {
    color: #9ca3af !important;
}

html.light .text-\[\#3f4041\] {
    color: #111827 !important;
}

html.light .hover\:text-\[\#e7e5e4\]:hover {
    color: #111827 !important;
}

html.light .hover\:text-\[\#c6c6c6\]:hover {
    color: #374151 !important;
}

html.light .hover\:text-\[\#acabaa\]:hover {
    color: #4b5563 !important;
}

html.light ::-webkit-scrollbar-thumb {
    background: #d1d5db !important;
}

html.light ::-webkit-scrollbar-thumb:hover {
    background: #9ca3af !important;
}

html.light .vditor-ir__link,
html.light .vditor-reset a {
    color: #2563eb !important;
}

html.light .vditor-reset,
html.light .agent-message-content {
    color: #374151 !important;
}

html.light #artifact-title-input {
    color: #111827 !important;
}

/* solarized light */
html.solarized {
    background-color: #fdf6e3;
    color: #586e75;
    color-scheme: light;
}

html.solarized .bg-\[\#0e0e0e\] {
    background-color: #fdf6e3 !important;
}

html.solarized .bg-\[\#131313\] {
    background-color: #eee8d5 !important;
}

html.solarized .bg-\[\#1f2020\] {
    background-color: #e5dfc5 !important;
}

html.solarized .bg-\[\#252626\] {
    background-color: #dcd5b9 !important;
}

html.solarized .bg-\[\#303030\] {
    background-color: #c9c2a6 !important;
}

html.solarized .bg-\[\#484848\] {
    background-color: #dcd5b9 !important;
}

html.solarized .hover\:bg-\[\#1f2020\]:hover {
    background-color: #e5dfc5 !important;
}

html.solarized .hover\:bg-\[\#252626\]:hover {
    background-color: #dcd5b9 !important;
}

html.solarized .border-\[\#1f2020\] {
    border-color: #e5dfc5 !important;
}

html.solarized .border-\[\#252626\] {
    border-color: #dcd5b9 !important;
}

html.solarized .border-\[\#303030\] {
    border-color: #c9c2a6 !important;
}

html.solarized .border-\[\#484848\] {
    border-color: #dcd5b9 !important;
}

html.solarized .text-\[\#e7e5e4\] {
    color: #073642 !important;
}

html.solarized .text-\[\#c6c6c6\] {
    color: #268bd2 !important;
}

html.solarized .text-primary { color: #268bd2 !important; }
html.solarized .bg-primary { background-color: #268bd2 !important; }
html.solarized .border-primary { border-color: #268bd2 !important; }
html.solarized .text-on-primary { color: #fdf6e3 !important; }

html.solarized .text-error { color: #dc322f !important; }
html.solarized .bg-error { background-color: #dc322f !important; }
html.solarized .border-error { border-color: #dc322f !important; }

html.solarized .text-\[\#acabaa\] {
    color: #657b83 !important;
}

html.solarized .text-\[\#8e8d8c\] {
    color: #839496 !important;
}

html.solarized .text-\[\#767575\] {
    color: #93a1a1 !important;
}

html.solarized .text-\[\#575656\] {
    color: #93a1a1 !important;
}

html.solarized .text-\[\#3f4041\] {
    color: #fdf6e3 !important;
}

html.solarized .hover\:text-\[\#e7e5e4\]:hover {
    color: #073642 !important;
}

html.solarized .hover\:text-\[\#c6c6c6\]:hover {
    color: #2aa198 !important;
}

html.solarized .hover\:text-primary:hover { color: #2aa198 !important; }

html.solarized .hover\:text-\[\#acabaa\]:hover {
    color: #657b83 !important;
}

html.solarized ::-webkit-scrollbar-thumb {
    background: #dcd5b9 !important;
}

html.solarized ::-webkit-scrollbar-thumb:hover {
    background: #c9c2a6 !important;
}

html.solarized .vditor-ir__link,
html.solarized .vditor-reset a {
    color: #268bd2 !important;
}

html.solarized .vditor-reset,
html.solarized .agent-message-content {
    color: #586e75 !important;
}

html.solarized #artifact-title-input {
    color: #073642 !important;
}

/* solarized dark */
html.solarized-dark {
    background-color: #002b36;
    color: #839496;
    color-scheme: dark;
}

html.solarized-dark .bg-\[\#0e0e0e\] {
    background-color: #002b36 !important;
}

html.solarized-dark .bg-\[\#131313\] {
    background-color: #073642 !important;
}

html.solarized-dark .bg-\[\#1f2020\] {
    background-color: #06404d !important;
}

html.solarized-dark .bg-\[\#252626\] {
    background-color: #0a4f5f !important;
}

html.solarized-dark .bg-\[\#303030\] {
    background-color: #0d6074 !important;
}

html.solarized-dark .bg-\[\#484848\] {
    background-color: #586e75 !important;
}

html.solarized-dark .hover\:bg-\[\#1f2020\]:hover {
    background-color: #06404d !important;
}

html.solarized-dark .hover\:bg-\[\#252626\]:hover {
    background-color: #0a4f5f !important;
}

html.solarized-dark .border-\[\#1f2020\] {
    border-color: #06404d !important;
}

html.solarized-dark .border-\[\#252626\] {
    border-color: #0a4f5f !important;
}

html.solarized-dark .border-\[\#303030\] {
    border-color: #0d6074 !important;
}

html.solarized-dark .border-\[\#484848\] {
    border-color: #586e75 !important;
}

html.solarized-dark .text-\[\#e7e5e4\] {
    color: #93a1a1 !important;
}

html.solarized-dark .text-\[\#c6c6c6\] {
    color: #2aa198 !important;
}

html.solarized-dark .text-primary { color: #2aa198 !important; }
html.solarized-dark .bg-primary { background-color: #2aa198 !important; }
html.solarized-dark .border-primary { border-color: #2aa198 !important; }
html.solarized-dark .text-on-primary { color: #002b36 !important; }

html.solarized-dark .text-error { color: #dc322f !important; }
html.solarized-dark .bg-error { background-color: #dc322f !important; }
html.solarized-dark .border-error { border-color: #dc322f !important; }

html.solarized-dark .text-\[\#acabaa\] {
    color: #657b83 !important;
}

html.solarized-dark .text-\[\#8e8d8c\] {
    color: #586e75 !important;
}

html.solarized-dark .text-\[\#767575\] {
    color: #586e75 !important;
}

html.solarized-dark .text-\[\#575656\] {
    color: #586e75 !important;
}

html.solarized-dark .text-\[\#3f4041\] {
    color: #002b36 !important;
}

html.solarized-dark .hover\:text-\[\#e7e5e4\]:hover {
    color: #93a1a1 !important;
}

html.solarized-dark .hover\:text-\[\#c6c6c6\]:hover {
    color: #268bd2 !important;
}

html.solarized-dark .hover\:text-primary:hover { color: #268bd2 !important; }

html.solarized-dark .hover\:text-\[\#acabaa\]:hover {
    color: #657b83 !important;
}

html.solarized-dark ::-webkit-scrollbar-thumb {
    background: #0a4f5f !important;
}

html.solarized-dark ::-webkit-scrollbar-thumb:hover {
    background: #0d6074 !important;
}

html.solarized-dark .vditor-ir__link,
html.solarized-dark .vditor-reset a {
    color: #2aa198 !important;
}

html.solarized-dark .vditor-reset,
html.solarized-dark .agent-message-content {
    color: #839496 !important;
}

html.solarized-dark #artifact-title-input {
    color: #93a1a1 !important;
}

/* matrix */
html.matrix {
    background-color: #000000;
    color: #00FF41;
    color-scheme: dark;
}

html.matrix .bg-\[\#0e0e0e\] {
    background-color: #000000 !important;
}

html.matrix .bg-\[\#131313\] {
    background-color: #021102 !important;
}

html.matrix .bg-\[\#1f2020\] {
    background-color: #042304 !important;
}

html.matrix .bg-\[\#252626\] {
    background-color: #063506 !important;
}

html.matrix .bg-\[\#303030\] {
    background-color: #084708 !important;
}

html.matrix .bg-\[\#484848\] {
    background-color: #0a590a !important;
}

html.matrix .hover\:bg-\[\#1f2020\]:hover {
    background-color: #042304 !important;
}

html.matrix .hover\:bg-\[\#252626\]:hover {
    background-color: #063506 !important;
}

html.matrix .border-\[\#1f2020\] {
    border-color: #042304 !important;
}

html.matrix .border-\[\#252626\] {
    border-color: #063506 !important;
}

html.matrix .border-\[\#303030\] {
    border-color: #084708 !important;
}

html.matrix .border-\[\#484848\] {
    border-color: #0a590a !important;
}

html.matrix .text-\[\#e7e5e4\] {
    color: #00FF41 !important;
}

html.matrix .text-\[\#c6c6c6\] {
    color: #00cc33 !important;
}

html.matrix .text-\[\#acabaa\] {
    color: #009926 !important;
}

html.matrix .text-\[\#8e8d8c\] {
    color: #00661a !important;
}

html.matrix .text-\[\#767575\] {
    color: #004d13 !important;
}

html.matrix .text-\[\#575656\] {
    color: #00330d !important;
}

html.matrix .text-\[\#3f4041\] {
    color: #000000 !important;
}

html.matrix .hover\:text-\[\#e7e5e4\]:hover {
    color: #00FF41 !important;
}

html.matrix .hover\:text-\[\#c6c6c6\]:hover {
    color: #00cc33 !important;
}

html.matrix .hover\:text-\[\#acabaa\]:hover {
    color: #009926 !important;
}

html.matrix ::-webkit-scrollbar-thumb {
    background: #063506 !important;
}

html.matrix ::-webkit-scrollbar-thumb:hover {
    background: #084708 !important;
}

html.matrix .vditor-ir__link,
html.matrix .vditor-reset a {
    color: #00FF41 !important;
}

html.matrix .vditor-reset,
html.matrix .agent-message-content {
    color: #00cc33 !important;
}

html.matrix #artifact-title-input {
    color: #00FF41 !important;
}

/* blue */
html.blue {
    background-color: #050B14;
    color: #E6F1FF;
    color-scheme: dark;
}

html.blue .bg-\[\#0e0e0e\] {
    background-color: #050B14 !important;
}

html.blue .bg-\[\#131313\] {
    background-color: #0A192F !important;
}

html.blue .bg-\[\#1f2020\] {
    background-color: #112240 !important;
}

html.blue .bg-\[\#252626\] {
    background-color: #172A45 !important;
}

html.blue .bg-\[\#303030\] {
    background-color: #1d3b63 !important;
}

html.blue .bg-\[\#484848\] {
    background-color: #2b5082 !important;
}

html.blue .hover\:bg-\[\#1f2020\]:hover {
    background-color: #112240 !important;
}

html.blue .hover\:bg-\[\#252626\]:hover {
    background-color: #172A45 !important;
}

html.blue .border-\[\#1f2020\] {
    border-color: #112240 !important;
}

html.blue .border-\[\#252626\] {
    border-color: #172A45 !important;
}

html.blue .border-\[\#303030\] {
    border-color: #1d3b63 !important;
}

html.blue .border-\[\#484848\] {
    border-color: #2b5082 !important;
}

html.blue .text-\[\#e7e5e4\] {
    color: #E6F1FF !important;
}

html.blue .text-\[\#c6c6c6\] {
    color: #CCD6F6 !important;
}

html.blue .text-\[\#acabaa\] {
    color: #8892B0 !important;
}

html.blue .text-\[\#8e8d8c\] {
    color: #606A86 !important;
}

html.blue .text-\[\#767575\] {
    color: #495670 !important;
}

html.blue .text-\[\#575656\] {
    color: #2e3c54 !important;
}

html.blue .text-\[\#3f4041\] {
    color: #050B14 !important;
}

html.blue .hover\:text-\[\#e7e5e4\]:hover {
    color: #E6F1FF !important;
}

html.blue .hover\:text-\[\#c6c6c6\]:hover {
    color: #CCD6F6 !important;
}

html.blue .hover\:text-\[\#acabaa\]:hover {
    color: #8892B0 !important;
}

html.blue ::-webkit-scrollbar-thumb {
    background: #172A45 !important;
}

html.blue ::-webkit-scrollbar-thumb:hover {
    background: #1d3b63 !important;
}

html.blue .vditor-ir__link,
html.blue .vditor-reset a {
    color: #64FFDA !important;
}

html.blue .vditor-reset,
html.blue .agent-message-content {
    color: #CCD6F6 !important;
}

html.blue #artifact-title-input {
    color: #E6F1FF !important;
}

/* cyberpunk */
html.cyberpunk {
    background-color: #0B0014;
    color: #00FFFF;
    color-scheme: dark;
}

html.cyberpunk .bg-\[\#0e0e0e\] {
    background-color: #0B0014 !important;
}

html.cyberpunk .bg-\[\#131313\] {
    background-color: #1A0B2E !important;
}

html.cyberpunk .bg-\[\#1f2020\] {
    background-color: #2B1055 !important;
}

html.cyberpunk .bg-\[\#252626\] {
    background-color: #3D1577 !important;
}

html.cyberpunk .bg-\[\#303030\] {
    background-color: #501B9A !important;
}

html.cyberpunk .bg-\[\#484848\] {
    background-color: #791cbf !important;
}

html.cyberpunk .hover\:bg-\[\#1f2020\]:hover {
    background-color: #2B1055 !important;
}

html.cyberpunk .hover\:bg-\[\#252626\]:hover {
    background-color: #3D1577 !important;
}

html.cyberpunk .border-\[\#1f2020\] {
    border-color: #2B1055 !important;
}

html.cyberpunk .border-\[\#252626\] {
    border-color: #3D1577 !important;
}

html.cyberpunk .border-\[\#303030\] {
    border-color: #501B9A !important;
}

html.cyberpunk .border-\[\#484848\] {
    border-color: #9D00FF !important;
}

html.cyberpunk .text-\[\#e7e5e4\] {
    color: #FF003C !important;
}

html.cyberpunk .text-\[\#c6c6c6\] {
    color: #00FFFF !important;
}

html.cyberpunk .text-\[\#acabaa\] {
    color: #FCEE0A !important;
}

html.cyberpunk .text-\[\#8e8d8c\] {
    color: #B18CFF !important;
}

html.cyberpunk .text-\[\#767575\] {
    color: #8F5CFF !important;
}

html.cyberpunk .text-\[\#575656\] {
    color: #6222CC !important;
}

html.cyberpunk .text-\[\#3f4041\] {
    color: #0B0014 !important;
}

html.cyberpunk .hover\:text-\[\#e7e5e4\]:hover {
    color: #FF003C !important;
}

html.cyberpunk .hover\:text-\[\#c6c6c6\]:hover {
    color: #00FFFF !important;
}

html.cyberpunk .hover\:text-\[\#acabaa\]:hover {
    color: #FCEE0A !important;
}

html.cyberpunk ::-webkit-scrollbar-thumb {
    background: #3D1577 !important;
}

html.cyberpunk ::-webkit-scrollbar-thumb:hover {
    background: #9D00FF !important;
}

html.cyberpunk .vditor-ir__link,
html.cyberpunk .vditor-reset a {
    color: #FCEE0A !important;
}

html.cyberpunk .vditor-reset,
html.cyberpunk .agent-message-content {
    color: #00FFFF !important;
}

html.cyberpunk #artifact-title-input {
    color: #FF003C !important;
}

/* focus */
html.focus {
    background-color: #F4F1EA;
    color: #3A3A3A;
    color-scheme: light;
}

html.focus .bg-\[\#0e0e0e\] {
    background-color: #F4F1EA !important;
}

html.focus .bg-\[\#131313\] {
    background-color: #EAE6DB !important;
}

html.focus .bg-\[\#1f2020\] {
    background-color: #E0DCCD !important;
}

html.focus .bg-\[\#252626\] {
    background-color: #D6D1C1 !important;
}

html.focus .bg-\[\#303030\] {
    background-color: #CCC7B6 !important;
}

html.focus .bg-\[\#484848\] {
    background-color: #C1BCA8 !important;
}

html.focus .hover\:bg-\[\#1f2020\]:hover {
    background-color: #E0DCCD !important;
}

html.focus .hover\:bg-\[\#252626\]:hover {
    background-color: #D6D1C1 !important;
}

html.focus .border-\[\#1f2020\] {
    border-color: #E0DCCD !important;
}

html.focus .border-\[\#252626\] {
    border-color: #D6D1C1 !important;
}

html.focus .border-\[\#303030\] {
    border-color: #CCC7B6 !important;
}

html.focus .border-\[\#484848\] {
    border-color: #C1BCA8 !important;
}

html.focus .text-\[\#e7e5e4\] {
    color: #3A3A3A !important;
}

html.focus .text-\[\#c6c6c6\] {
    color: #4A4A4A !important;
}

html.focus .text-\[\#acabaa\] {
    color: #5A5A5A !important;
}

html.focus .text-\[\#8e8d8c\] {
    color: #6A6A6A !important;
}

html.focus .text-\[\#767575\] {
    color: #7A7A7A !important;
}

html.focus .text-\[\#575656\] {
    color: #8A8A8A !important;
}

html.focus .text-\[\#3f4041\] {
    color: #F4F1EA !important;
}

html.focus .hover\:text-\[\#e7e5e4\]:hover {
    color: #3A3A3A !important;
}

html.focus .hover\:text-\[\#c6c6c6\]:hover {
    color: #4A4A4A !important;
}

html.focus .hover\:text-\[\#acabaa\]:hover {
    color: #5A5A5A !important;
}

html.focus ::-webkit-scrollbar-thumb {
    background: #D6D1C1 !important;
}

html.focus ::-webkit-scrollbar-thumb:hover {
    background: #CCC7B6 !important;
}

html.focus .vditor-ir__link,
html.focus .vditor-reset a {
    color: #D28F33 !important;
}

html.focus .vditor-reset,
html.focus .agent-message-content {
    color: #4A4A4A !important;
}

html.focus #artifact-title-input {
    color: #3A3A3A !important;
}