:root {
    color-scheme: dark;
    --cf-bg-0: #000000;
    --cf-bg-1: #040404;
    --cf-bg-2: #090a0c;
    --cf-surface-0: rgba(5, 6, 7, 0.96);
    --cf-surface-1: rgba(10, 11, 13, 0.98);
    --cf-surface-2: rgba(16, 18, 22, 0.99);
    --cf-border: rgba(255, 255, 255, 0.08);
    --cf-border-strong: rgba(255, 255, 255, 0.14);
    --cf-text: #f3f5f8;
    --cf-muted: #8c939d;
    --cf-muted-soft: rgba(243, 245, 248, 0.42);
    --cf-theme-soft: rgba(255, 255, 255, 0);
    --cf-theme-surface: rgba(255, 255, 255, 0);
    --cf-theme-surface-strong: rgba(255, 255, 255, 0);
    --cf-theme-border: rgba(255, 255, 255, 0.08);
    --cf-theme-border-strong: rgba(255, 255, 255, 0.14);
    --cf-theme-glow: rgba(255, 255, 255, 0);
    --cf-theme-text: rgba(243, 245, 248, 0.84);
    --accent: rgba(var(--cf-theme-rgb, 255, 255, 255), 0.72);
    --accent-2: rgba(var(--cf-theme-rgb, 255, 255, 255), 0.58);
    --glow: rgba(var(--cf-theme-rgb, 255, 255, 255), 0.16);
    --text: var(--cf-text);
    --muted: var(--cf-muted);
}

html,
body {
    background: #000000 !important;
    color: var(--cf-text) !important;
}

::-webkit-scrollbar-track {
    background: #010101 !important;
}

::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.12) !important;
    border-radius: 999px;
}

.ambient-shell::before,
.ambient-shell::after,
.ambient-glow {
    opacity: 0 !important;
    background: none !important;
}

.ambient-shell::before,
.ambient-glow {
    background: none !important;
}

.ambient-shell::after {
    background: none !important;
}

.particle {
    background: rgba(255, 255, 255, 0.06) !important;
}

.particles-container,
.ambient-glow {
    display: none !important;
}

.glass-panel,
.glass-card,
.project-card,
.admin-sidebar-panel,
.admin-row-card,
.admin-row-card-active,
.profile-panel,
.settings-drawer,
.message-style-modal,
.showcase-hero,
.showcase-media-panel,
.showcase-detail-panel,
.floating-download,
.back-btn,
.main-btn,
.composer-bubble,
.empty-state-shell,
.hint-card {
    background: var(--cf-surface-1) !important;
    border: none !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.72) !important;
}

.glass-card:hover,
.project-card:hover,
.main-btn:hover,
.floating-download:hover,
.back-btn:hover,
.ghost-button:hover,
.admin-row-button:hover,
.admin-soft-button:hover {
    border-color: var(--cf-theme-border-strong) !important;
    box-shadow: 0 22px 62px rgba(0, 0, 0, 0.76), 0 0 20px var(--cf-theme-glow) !important;
}

.ghost-button,
.admin-row-button,
.admin-soft-button,
.glass-button,
.status-pill,
.presence-pill,
.typing-chip,
.tag,
.project-card .card-tag,
.subtle-chip,
.project-card.active {
    border: none !important;
    background: rgba(12, 13, 16, 0.94) !important;
    color: var(--cf-theme-text) !important;
}

.status-pill-live,
.admin-row-card-active {
    background: rgba(12, 14, 18, 0.98) !important;
    border: none !important;
    box-shadow: 0 0 18px var(--cf-theme-glow) !important;
}

.msg-bubble-user {
    background: rgba(20, 23, 28, 0.98) !important;
    border: none !important;
}

.msg-bubble-other {
    background: rgba(6, 7, 10, 0.99) !important;
    border: none !important;
}

.chat-input,
.admin-soft-field,
input,
textarea,
select,
.drawer-field,
.settings-color-label {
    background: rgba(5, 6, 8, 0.99) !important;
    border: none !important;
    color: var(--cf-text) !important;
    box-shadow: none !important;
}

.chat-input:focus,
.admin-soft-field:focus,
input:focus,
textarea:focus,
select:focus,
.drawer-field:focus {
    border-color: var(--cf-theme-border-strong) !important;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 0 18px var(--cf-theme-glow) !important;
    background: rgba(4, 5, 7, 1) !important;
}

input::placeholder,
textarea::placeholder {
    color: rgba(243, 245, 248, 0.34) !important;
}

.project-card::before,
.floating-download::before,
.main-btn::before {
    background: none !important;
}

.section-divider {
    background: rgba(255, 255, 255, 0.08) !important;
}

.page-title {
    background: none !important;
    -webkit-background-clip: initial;
    background-clip: initial;
    -webkit-text-fill-color: currentColor;
    color: #f3f5f8 !important;
    filter: drop-shadow(0 -1px 1px rgba(255, 255, 255, 0.1)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.86)) drop-shadow(0 20px 40px rgba(0, 0, 0, 0.94)) !important;
}

.soft-orb,
.typing-dots span,
.status-dot {
    background: rgba(255, 255, 255, 0.65) !important;
    box-shadow: 0 0 16px rgba(255, 255, 255, 0.1) !important;
}

.send-button {
    background: rgba(12, 14, 18, 1) !important;
    border: none !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34), 0 0 18px var(--cf-theme-glow) !important;
}

.profile-popover-card,
.profile-popover-banner,
.composer-shell,
.composer-bubble,
.showcase,
.showcase-header,
.project-selector,
.settings-section {
    color: inherit;
}

body[data-page="channels"] #channel-sidebar,
body[data-page="channels"] #admin-sidebar,
body[data-page="channels"] #chat-view > .border-b,
body[data-page="channels"] #chat-banner,
body[data-page="channels"] .composer-shell,
body[data-page="channels"] .composer-bubble,
body[data-page="channels"] .chat-input,
body[data-page="channels"] .send-button,
body[data-page="channels"] .status-pill,
body[data-page="channels"] .typing-chip,
body[data-page="channels"] .admin-soft-field,
body[data-page="channels"] .admin-soft-button,
body[data-page="channels"] .admin-sidebar-panel,
body[data-page="channels"] .admin-row-card,
body[data-page="channels"] .admin-row-card-active,
body[data-page="channels"] .admin-row-button,
body[data-page="channels"] .tag,
body[data-page="friends"] .glass-panel,
body[data-page="friends"] .ghost-button,
body[data-page="friends"] .subtle-chip,
body[data-page="friends"] article,
body[data-page="servers"] .glass-panel,
body[data-page="servers"] .ghost-button,
body[data-page="servers"] article,
body[data-page="servers"] #joined-list > article,
body[data-page="main"] .glass-panel,
body[data-page="main"] .ghost-button,
body[data-page="downloads"] .glass-panel,
body[data-page="downloads"] .ghost-button,
body[data-page="downloads"] .project-card,
body[data-page="downloads"] .project-card .card-tag {
    border: none !important;
}

body[data-page="channels"] [class*="border-"],
body[data-page="friends"] [class*="border-"],
body[data-page="servers"] [class*="border-"] {
    border: none !important;
}

body[data-page="channels"] #channel-sidebar {
    background: transparent !important;
    box-shadow: none !important;
}

body[data-page="channels"] #channel-sidebar .admin-sidebar-panel {
    background: transparent !important;
    box-shadow: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body[data-page="channels"] #channel-sidebar .admin-row-card,
body[data-page="channels"] #room-member-list .admin-row-card {
    background: rgba(9, 10, 13, 0.98) !important;
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.5) !important;
}

body[data-page="channels"] #channel-sidebar .admin-row-card-active,
body[data-page="channels"] #room-member-list .admin-row-card-active {
    background: rgba(13, 14, 18, 0.99) !important;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.54) !important;
}

body[data-page="channels"] #admin-sidebar,
body[data-page="channels"] #channel-sidebar,
body[data-page="channels"] #chat-view > .px-6,
body[data-page="channels"] .composer-shell {
    background: rgba(6, 7, 10, 0.92) !important;
}

body[data-page="friends"] article,
body[data-page="servers"] article,
body[data-page="servers"] #joined-list > article {
    background: rgba(10, 11, 13, 0.96) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.46) !important;
}
