/* Светлая тема */
body {
    --mud-palette-drawer-background: #FAFAFA;
    --mud-palette-drawer-text: #311718;
    --mud-selected: #F5F4FD;
    --mud-palette-surface: #fafafa;
    --mud-palette-action-default-hover: #f1f1f1;
    --mud-palette-overlay-dark: rgba(0, 0, 0, .5);
    --mud-palette-text-primary: #311718;
    --mud-palette-drawer-icon: #838383;
    --mud-palette-table-lines: #eeeeee;
    --mud-palette-primary: #E2552C;
    --mud-zindex-snackbar: 99999;
    font-family: "Proxima Nova" !important;
}

.i-item-data label:first-of-type[b-e6d51dka8t] {
    font-weight: 600;
}

h2 {
    font-family: "Proxima Nova" !important;
}

.mud-button-label {
    font-family: "Proxima Nova" !important;
}

/* Стили для модального окна (как в Header) */
.withdraw-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(5px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn 0.2s ease;
}

.withdraw-modal-container {
    background: var(--mud-palette-surface);
    border-radius: 24px;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp 0.3s ease;
}

.withdraw-modal-header {
    display: flex;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    position: relative;
}

    .withdraw-modal-header h2 {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 600;
        color: var(--mud-palette-text-primary);
        flex: 1;
    }

.withdraw-icon {
    width: 28px;
    height: 28px;
    fill: var(--mud-palette-primary);
    margin-right: 12px;
}

.close-btn {
    background: none;
    border: none;
    font-size: 28px;
    cursor: pointer;
    color: var(--mud-palette-text-secondary);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.2s;
}

    .close-btn:hover {
        background-color: rgba(0, 0, 0, 0.04);
    }

.withdraw-modal-content {
    padding: 24px;
}

.withdraw-section {
    margin-bottom: 24px;
}

.section-label {
    display: flex;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 12px;
}

.label-icon {
    margin-right: 8px;
    font-size: 1.1rem;
}

/* Стили для поля ввода */
.wallet-input-container {
    background: rgba(0, 0, 0, 0.02);
    border-radius: 16px;
    padding: 8px 16px;
    border: 2px solid transparent;
    transition: all 0.2s;
}

    .wallet-input-container:focus-within {
        border-color: var(--mud-palette-primary);
        background: var(--mud-palette-surface);
        box-shadow: 0 0 0 4px rgba(98, 0, 238, 0.1);
    }

    .wallet-input-container label {
        display: block;
        font-size: 0.75rem;
        color: var(--mud-palette-text-secondary);
        margin-bottom: 4px;
    }

.wallet-input {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 1rem;
    padding: 8px 0;
    color: var(--mud-palette-text-primary);
    outline: none;
}

    .wallet-input::placeholder {
        color: var(--mud-palette-text-disabled);
    }

/* Стили для summary секции */
.summary {
    background: rgba(0, 0, 0, 0.02);
    border-radius: 16px;
    padding: 16px;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    color: var(--mud-palette-text-primary);
}

    .summary-row:not(:last-child) {
        border-bottom: 1px dashed rgba(0, 0, 0, 0.08);
    }

    .summary-row span:first-child {
        color: var(--mud-palette-text-secondary);
        font-size: 0.9rem;
    }

.summary-value {
    font-weight: 600;
    font-size: 0.95rem;
}

/* Стили для кнопок */
.withdraw-modal-actions {
    display: flex;
    gap: 12px;
    padding: 20px 24px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.action-btn {
    flex: 1;
    padding: 12px;
    border: none;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s;
}

    .action-btn.primary {
        background: var(--mud-palette-primary);
        color: white;
    }

        .action-btn.primary:hover {
            background: var(--mud-palette-primary-darken);
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(98, 0, 238, 0.3);
        }

    .action-btn.secondary {
        background: transparent;
        border: 2px solid rgba(0, 0, 0, 0.12);
        color: var(--mud-palette-text-primary);
    }

        .action-btn.secondary:hover {
            background: rgba(0, 0, 0, 0.04);
        }

/* Анимации */
@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Темная тема */
.mud-dark-theme .withdraw-modal-container {
    background: #1e1e1e;
}

.mud-dark-theme .withdraw-modal-header {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.mud-dark-theme .close-btn:hover {
    background-color: rgba(255, 255, 255, 0.04);
}

.mud-dark-theme .wallet-input-container {
    background: rgba(255, 255, 255, 0.02);
}

    .mud-dark-theme .wallet-input-container:focus-within {
        background: #2d2d2d;
        border-color: var(--mud-palette-primary);
        box-shadow: 0 0 0 4px rgba(187, 134, 252, 0.2);
    }

.mud-dark-theme .summary {
    background: rgba(255, 255, 255, 0.02);
}

.mud-dark-theme .summary-row:not(:last-child) {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.mud-dark-theme .action-btn.secondary {
    border-color: rgba(255, 255, 255, 0.12);
}

    .mud-dark-theme .action-btn.secondary:hover {
        background: rgba(255, 255, 255, 0.04);
    }

.mud-dark-theme .withdraw-modal-actions {
    border-top-color: rgba(255, 255, 255, 0.08);
}

.wallets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.user-wallet {
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 15px;
    transition: box-shadow 0.3s ease;
}

    .user-wallet:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

.wallet-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
}

    .wallet-line:last-child {
        border-bottom: none;
    }

    .wallet-line label:first-child {
        color: #666;
        font-size: 0.9em;
    }

    .wallet-line label:last-child {
        font-weight: 500;
        color: #333;
    }

.user-wallet-action {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 15px;
}

/* Темная тема */
.mud-dark-theme .user-wallet {
    background: #1a1a1a;
    border-color: #333;
}

.mud-dark-theme .wallet-line label:first-child {
    color: #aaa;
}

.mud-dark-theme .wallet-line label:last-child {
    color: #fff;
}

.mud-dark-theme .wallet-line {
    border-bottom-color: #333;
}

/* Стили для провайдера */
.provider-wallet {
    border-left: 4px solid #4CAF50;
}

/* Адаптивность */
@media (max-width: 600px) {
    .withdraw-modal-container {
        width: 95%;
        max-height: 95vh;
    }

    .withdraw-modal-header {
        padding: 16px;
    }

        .withdraw-modal-header h2 {
            font-size: 1.2rem;
        }

    .withdraw-modal-content {
        padding: 16px;
    }

    .withdraw-modal-actions {
        padding: 16px;
        flex-direction: column;
    }

    .action-btn {
        width: 100%;
    }
}

.loader {
    position: absolute;
    top: calc(50% - 32px);
    left: calc(50% - 32px);
    width: 64px;
    height: 64px;
    border-radius: 50%;
    perspective: 800px;
}

.inner {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

    .inner.one {
        left: 0%;
        top: 0%;
        animation: rotate-one 1s linear infinite;
        border-bottom: 3px solid #000;
    }

    .inner.two {
        right: 0%;
        top: 0%;
        animation: rotate-two 1s linear infinite;
        border-right: 3px solid #000;
    }

    .inner.three {
        right: 0%;
        bottom: 0%;
        animation: rotate-three 1s linear infinite;
        border-top: 3px solid #000;
    }

@keyframes rotate-one {
    0% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@keyframes rotate-two {
    0% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@keyframes rotate-three {
    0% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}


/* Анимации для лоадера и контента */
.fade-in {
    animation: fadeIn 0.8s ease-in-out;
}

.fade-in11 {
    transition: all .1s;
}

.fade-out {
    animation: fadeOut 0.8s ease-in-out;
}

.slide-up {
    animation: slideUp 0.8s ease-out;
}

.scale-in {
    animation: scaleIn 0.6s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}


.nav-badge {
    background: #E2552C;
    color: white;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 10px;
    margin-left: 0.5rem;
    min-width: 20px;
    text-align: center;
    display: inline-block;
}

/* Для разных типов уведомлений можно сделать разные цвета */
.mud-nav-link .nav-badge {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}

/* Для плавного перехода между состояниями */
.layout-transition {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 999;
    transition: all 0.8s ease-in-out;
}

.loader-hidden {
    opacity: 0;
    pointer-events: none;
}

.content-visible {
    opacity: 1;
}



.mud-drawer {
    background-color: #131936 !important;
    color: white !important;
    z-index: 1200 !important;
    position: fixed !important;
}

    .mud-nav-link {
        transition: all .22s !important;
    }

.simple-stats {
    background-color: #fafafa5c !important;
    color: #000 !important;
    border: 1px solid #80808038;
    border-radius: 20px !important;
}

.indicator-collection.gray {
    background-color: #FAFAFA !important;
    color: #000 !important;
}

.mud-drawer {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

    .mud-drawer::-webkit-scrollbar {
        display: none !important;
    }

/* Горизонтальное верхнее меню */
.nav-drawer-horizontal {
    top: 0;
    left: 0;
    width: 100% !important;
    height: 64px;
    display: flex;
    align-items: center;
    padding: 0 24px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

/* MudDrawer по умолчанию тянется на 100vh — фиксируем как top-bar */
.nav-drawer-horizontal.mud-drawer {
    height: 64px !important;
    bottom: auto !important;
    right: 0 !important;
    overflow: visible !important;
}

.nav-drawer-horizontal .mud-drawer-content {
    height: 64px !important;
    overflow: visible !important;
}

/* Чтобы контент не заезжал под top-bar */
.mud-main-content {
    padding-top: 64px;
}

.nav-container-horizontal {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
}

.nav-left {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.9rem;
    color: var(--mud-palette-text-primary);
    white-space: nowrap;
}

.nav-steps-wrapper {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: nowrap;
}

.nav-step > label {
    font-weight: 600;
    font-size: 0.85rem;
    color: white;
    white-space: nowrap;
}

.nav-logo-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
}

.nav-logo-image {
    height: 28px;
    width: auto;
}

.nav-logo-text {
    font-family: "Proxima Nova", sans-serif;
    font-weight: 500;
}

/* Тёмная тема для горизонтального меню */
.mud-dark-theme .nav-drawer-horizontal {
    background-color: #1a1a1a !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
}

.mud-dark-theme .nav-menu-horizontal .mud-nav-link.select,
.mud-dark-theme .nav-menu-horizontal .mud-nav-link.mud-nav-link-active {
    background-color: #202020;
}

.mud-dark-theme .nav-menu-horizontal .mud-nav-link:hover {
    background-color: #202020;
}

/* Адаптив для мобильных: меню снова становится вертикальным */
@media (max-width: 900px) {
    .nav-drawer-horizontal {
        height: auto;
        flex-direction: column;
        align-items: stretch;
        padding: 8px 12px;
    }

    .nav-drawer-horizontal.mud-drawer,
    .nav-drawer-horizontal .mud-drawer-content {
        height: auto !important;
    }

    .mud-main-content {
        padding-top: 0;
    }

    .nav-container-horizontal {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .nav-steps-wrapper {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .nav-menu-horizontal {
        flex-wrap: wrap;
        row-gap: 4px;
    }
}

.pagination-container {
    display: flex;
    justify-content: center;
    margin-top: 24px;
    padding: 16px;
}

.pagination-controls {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 8px 16px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.pagination-button {
    padding: 8px 16px;
    border: 1px solid #e0e0e0;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s;
}

    .pagination-button:hover:not(.disabled) {
        background: #f5f5f5;
        border-color: #2196f3;
        color: #2196f3;
    }

    .pagination-button.disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

.pagination-info {
    font-size: 14px;
    color: #666;
}

.items-per-page {
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: white;
    cursor: pointer;
    margin-left: 16px;
}

    .items-per-page:hover {
        border-color: #2196f3;
    }

.invoice-stats {
    padding: 16px;
    color: #666;
    font-size: 14px;
    border-bottom: 1px solid #e0e0e0;
}

    .mud-button-filled {
        background-color: #fafafa !important;
        color: #000 !important;
    }

    .profile {
        background-color: #f9f9f9 !important;
        color: #000 !important;
    }

    .mud-tab.mud-tab-active {
        background-color: transparent !important;
        color: black !important;
    }

body {
    background-color: #f0e1ce !important;
}


/* ===== ОБЩИЕ СТИЛИ НАВИГАЦИИ ===== */
.modern-nav {
    background: #ffffff !important;
    border-right: 1px solid #e8eaed !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.3s ease !important;
}

    .modern-nav .mud-drawer-content {
        background: transparent !important;
        padding: 0 !important;
    }

/* Хедер навигации */
.nav-header {
    padding: 24px 20px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 16px;
}

.nav-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

.nav-logo-icon {
    width: 40px;
    height: 40px;
    color: #1976d2;
    background: linear-gradient(135deg, #1976d2, #2196f3);
    border-radius: 10px;
    padding: 8px;
}

.nav-logo-text {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
    letter-spacing: -0.5px;
}

/* Тумблер темы в навигации */
.nav-theme-toggle {
    background: transparent;
    border: 1px solid #e8eaed;
    border-radius: 20px;
    padding: 8px 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    color: #5f6368;
    font-size: 0.875rem;
    font-weight: 500;
}

    .nav-theme-toggle:hover {
        background: #f8f9fa;
        border-color: #dadce0;
    }

    .nav-theme-toggle svg {
        width: 18px;
        height: 18px;
        color: #5f6368;
    }

/* Информация о курсе */
.nav-course-info {
    padding: 16px 20px;
    background: linear-gradient(135deg, #f8f9fa, #eef2f7);
    border-bottom: 1px solid #f0f0f0;
    margin: 0;
}

.nav-course-label {
    font-size: 0.875rem;
    color: #5f6368;
    font-weight: 500;
}

.nav-course-value {
    font-size: 1rem;
    font-weight: 600;
    color: #1976d2;
    margin-left: 8px;
}

/* Разделы меню */
.nav-section {
    padding: 8px 0;
}

.nav-section-title {
    font-size: 0.75rem;
    font-weight: 600;
    color: #5f6368;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 20px 8px;
    margin: 0;
}

/* Ссылки навигации */
.nav-link {
    padding: 12px 20px !important;
    margin: 4px 8px !important;
    border-radius: 10px !important;
    transition: all 0.2s ease !important;
    color: #5f6368 !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-weight: 500 !important;
    font-size: 0.9375rem !important;
}

    .nav-link:hover {
        background: #f8f9fa !important;
        color: #1976d2 !important;
        transform: translateX(4px);
    }

    .nav-link.active {
        background: linear-gradient(135deg, #1976d2, #2196f3) !important;
        color: white !important;
        box-shadow: 0 4px 12px rgba(25, 118, 210, 0.2) !important;
    }

        .nav-link.active .mud-icon {
            color: white !important;
        }

    .nav-link .mud-icon {
        width: 20px !important;
        height: 20px !important;
        color: #5f6368 !important;
        font-size: 1.25rem !important;
    }

/* Футер навигации */
.nav-footer {
    padding: 16px 20px;
    border-top: 1px solid #f0f0f0;
    margin-top: auto;
    background: #f8f9fa;
}

.nav-user-info {
    text-align: center;
}

.nav-user-name {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #2c3e50;
}

.nav-user-role {
    font-size: 0.75rem;
    color: #5f6368;
    margin-top: 4px;
}

/* Мобильная версия */
.mobile-nav-btn {
    position: fixed;
    top: 16px;
    left: 16px;
    z-index: 1300;
    background: white;
    border: 1px solid #e8eaed;
    border-radius: 12px;
    padding: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

    .mobile-nav-btn .mud-icon {
        color: #5f6368;
    }

/* ===== ТЕМНАЯ ТЕМА НАВИГАЦИИ ===== */
.mud-dark-theme .modern-nav {
    background: #1e1e1e !important;
    border-right: 1px solid #333333 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

.mud-dark-theme .nav-header {
    border-bottom-color: #333333;
}

.mud-dark-theme .nav-logo-text {
    color: #ffffff;
}

.mud-dark-theme .nav-logo-icon {
    color: #90caf9;
    background: linear-gradient(135deg, #0d47a1, #1565c0);
}

.mud-dark-theme .nav-theme-toggle {
    border-color: #333333;
    color: #b0b0b0;
    background: #2d2d2d;
}

    .mud-dark-theme .nav-theme-toggle:hover {
        background: #3d3d3d;
        border-color: #444444;
    }

    .mud-dark-theme .nav-theme-toggle svg {
        color: #b0b0b0;
    }

.mud-dark-theme .nav-course-info {
    background: linear-gradient(135deg, #2d2d2d, #252525);
    border-bottom-color: #333333;
}

.mud-dark-theme .nav-course-label {
    color: #b0b0b0;
}

.mud-dark-theme .nav-course-value {
    color: #90caf9;
}

.mud-dark-theme .nav-section-title {
    color: #b0b0b0;
}

.mud-dark-theme .nav-link {
    color: #b0b0b0 !important;
}

    .mud-dark-theme .nav-link:hover {
        background: #2d2d2d !important;
        color: #90caf9 !important;
    }

    .mud-dark-theme .nav-link.active {
        background: linear-gradient(135deg, #0d47a1, #1565c0) !important;
        color: white !important;
        box-shadow: 0 4px 12px rgba(144, 202, 249, 0.2) !important;
    }

    .mud-dark-theme .nav-link .mud-icon {
        color: #b0b0b0 !important;
    }

    .mud-dark-theme .nav-link.active .mud-icon {
        color: white !important;
    }

.mud-dark-theme .nav-footer {
    background: #252525;
    border-top-color: #333333;
}

.mud-dark-theme .nav-user-name {
    color: #ffffff;
}

.mud-dark-theme .nav-user-role {
    color: #b0b0b0;
}

.mud-dark-theme .mobile-nav-btn {
    background: #2d2d2d;
    border-color: #333333;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

    .mud-dark-theme .mobile-nav-btn .mud-icon {
        color: #b0b0b0;
    }


/* Темная тема */
.mud-dark-theme {
    --mud-palette-drawer-background: #1a1a1a;
    --mud-palette-surface: #1a1a1a;
    --mud-palette-overlay-dark: rgba(0, 0, 0, .5);
    --mud-selected: #1a1a1a;
    --mud-palette-drawer-text: #ffffff;
    --mud-palette-text-primary: #ffffff;
    --mud-palette-action-default-hover: #202020;
    --mud-palette-drawer-icon: #cccccc;
}

    .mud-dark-theme .mud-drawer {
        background-color: #1a1a1a !important;
        color: #ffffff !important;
        z-index: 1200 !important;
        position: fixed !important;
    }

    .mud-dark-theme .simple-stats {
        background-color: #1a1a1a !important;
        color: #fff !important;
    }

    .mud-dark-theme .indicator-collection.gray {
        background-color: #1a1a1a !important;
        color: #fff !important;
    }

    .mud-dark-theme .mud-nav-link {
        transition: all .22s !important;
    }

    .mud-dark-theme .mud-button-filled {
        background-color: #1a1a1a !important;
        color: #fff !important;
    }

    .mud-dark-theme .mud-tabs-tabbar .mud-tabs-tabbar-inner {
        border-color: #202020 !important
    }

    .mud-dark-theme .indicator {
        border-color: #202020 !important
    }

.mud-input-control.mud-input-outlined-with-label {
    margin-top: 15px !important;
}

.mud-input-outlined-border {
    border-color: #1a1a1a1a !important
}

.mud-input > input.mud-input-root-outlined, div.mud-input-slot.mud-input-root-outlined {
    padding: 15.5px 15.5px;
}

.mud-dark-theme .mud-input-outlined-border {
    border-color: #1a1a1a1a !important
}

    .mud-dark-theme .log-item {
        background-color: #202020 !important
    }

    .mud-dark-theme .profile {
        background-color: #1a1a1a !important;
        color: #fff !important;
        border-color: #202020 !important
    }

#stars-container {
    height: 100vh;
    width: 100%;
    background: radial-gradient(ellipse at bottom, #1B2735 0%, #191F24 100%);
    overflow: hidden;
    -webkit-transform: translate(-50, -50%);
    -ms-transform: translate(-50, -50%);
    -o-transform: translate(-50, -50%);
    transform: translate(-50, -50%);
}

.logo-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.logo-with-text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.logo-image {
    margin-top: -50px;
    margin-bottom: -35px;
    width: 300px;
    object-fit: contain;
}

.logo-text {
    font-size: 2rem;
    font-weight: 400;
    color: black;
    font-family: 'Proxima Nova', sans-serif;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.logo-footer {
    top: 1vh;
    position: relative
}

body .login-layout .login {
    margin-top: 0;
    text-align: center;
}

body .login-layout {
    position: absolute;
    left: 50%;
    top: 20%;
    opacity: 0;
    font-family: "Proxima Nova" !important;
    animation: simpleFadeIn 0.8s ease-out 0.3s forwards;
    background: white;
    border-radius: 2vh;

    transform: translate(-50%,-50%)
}

.login .login-action button {
    transition: opacity .33s;
}

.login .login-action button:hover {
    opacity: .8;
}

.login-header label[b-nrussp26aw] {
    font-weight: 400 !important
}

body .mud-tabs-panels .tab-data {
    opacity: 0;
    animation: simpleFadeIn1 0.8s ease-out 0.3s forwards;
}

@keyframes simpleFadeIn1 {
    to {
        opacity: 1;
    }
}

@keyframes simpleFadeIn {
    to {
        opacity: 1;
        top: 50%;
    }
}

#stars {
    width: 1px;
    height: 1px;
    background: transparent;
    box-shadow: 0 880px 1797px #FFF, 1052px 548px #FFF, 1834px 214px #FFF, 1650px 1505px #FFF, 995px 1694px #FFF, 404px 713px #FFF, 652px 206px #FFF, 158px 1378px #FFF, 789px 1746px #FFF, 667px 1546px #FFF, 1703px 792px #FFF, 1368px 767px #FFF, 174px 1079px #FFF, 1609px 936px #FFF, 189px 1497px #FFF, 3px 1711px #FFF, 592px 103px #FFF, 1809px 1166px #FFF, 1642px 156px #FFF, 912px 1909px #FFF, 331px 1120px #FFF, 1001px 1552px #FFF, 988px 98px #FFF, 601px 535px #FFF, 232px 1842px #FFF, 1187px 812px #FFF, 842px 1592px #FFF, 1862px 1231px #FFF, 1866px 1924px #FFF, 47px 1076px #FFF, 1111px 385px #FFF, 531px 1815px #FFF, 8px 1340px #FFF, 944px 485px #FFF, 1097px 612px #FFF, 1287px 1477px #FFF, 231px 1962px #FFF, 1273px 1542px #FFF, 1071px 1595px #FFF, 637px 769px #FFF, 1946px 36px #FFF, 1711px 546px #FFF, 1591px 511px #FFF, 1644px 1471px #FFF, 911px 1729px #FFF, 1676px 594px #FFF, 358px 383px #FFF, 1286px 1741px #FFF, 970px 861px #FFF, 418px 489px #FFF, 338px 1840px #FFF, 1228px 421px #FFF, 1480px 1811px #FFF, 48px 1161px #FFF, 1315px 1487px #FFF, 291px 508px #FFF, 643px 1px #FFF, 1501px 105px #FFF, 1154px 248px #FFF, 1751px 561px #FFF, 905px 1144px #FFF, 917px 1064px #FFF, 1616px 697px #FFF, 82px 1872px #FFF, 826px 297px #FFF, 689px 690px #FFF, 1498px 1266px #FFF, 205px 962px #FFF, 1073px 244px #FFF, 132px 1785px #FFF, 913px 1741px #FFF, 1078px 1454px #FFF, 522px 1625px #FFF, 1628px 739px #FFF, 306px 1524px #FFF, 1022px 1451px #FFF, 836px 1595px #FFF, 1466px 1647px #FFF, 1859px 128px #FFF, 784px 1977px #FFF, 469px 1436px #FFF, 1656px 157px #FFF, 1081px 1288px #FFF, 1677px 1030px #FFF, 1417px 1637px #FFF, 817px 963px #FFF, 1970px 373px #FFF, 596px 1229px #FFF, 550px 53px #FFF, 380px 1736px #FFF, 1746px 711px #FFF, 109px 720px #FFF, 688px 89px #FFF, 2px 1823px #FFF, 1524px 172px #FFF, 536px 679px #FFF, 1314px 1856px #FFF, 426px 1832px #FFF, 588px 1451px #FFF, 1996px 385px #FFF, 1766px 335px #FFF, 1720px 562px #FFF, 1590px 374px #FFF, 410px 1526px #FFF, 656px 1638px #FFF, 512px 1268px #FFF, 313px 1428px #FFF, 840px 1072px #FFF, 1326px 1240px #FFF, 663px 919px #FFF, 402px 1067px #FFF, 944px 1493px #FFF, 1692px 1139px #FFF, 1159px 479px #FFF, 185px 471px #FFF, 211px 1043px #FFF, 127px 1790px #FFF, 318px 305px #FFF, 928px 885px #FFF, 1320px 74px #FFF, 488px 1819px #FFF, 1609px 787px #FFF, 878px 1624px #FFF, 1883px 1665px #FFF, 1237px 1712px #FFF, 50px 1417px #FFF, 1732px 1959px #FFF, 1513px 1899px #FFF, 1695px 299px #FFF, 1462px 1589px #FFF, 807px 1228px #FFF, 105px 200px #FFF, 787px 1390px #FFF, 1410px 1875px #FFF, 846px 573px #FFF, 1890px 1830px #FFF, 187px 1350px #FFF, 84px 295px #FFF, 1511px 24px #FFF, 1292px 1473px #FFF, 1973px 1425px #FFF, 1116px 927px #FFF, 1689px 1737px #FFF, 660px 1685px #FFF, 748px 419px #FFF, 1934px 1022px #FFF, 1998px 1130px #FFF, 405px 1312px #FFF, 1219px 1267px #FFF, 751px 1708px #FFF, 1185px 1107px #FFF, 931px 1913px #FFF, 786px 1157px #FFF, 1791px 1909px #FFF, 1162px 28px #FFF, 1201px 269px #FFF, 1534px 84px #FFF, 727px 864px #FFF, 1676px 1404px #FFF, 1299px 1048px #FFF, 1039px 406px #FFF, 674px 215px #FFF, 856px 1232px #FFF, 1461px 61px #FFF, 1855px 1307px #FFF, 324px 1289px #FFF, 747px 54px #FFF, 1083px 818px #FFF, 1901px 1843px #FFF, 131px 1228px #FFF, 1552px 594px #FFF, 1632px 109px #FFF, 1815px 1243px #FFF, 1429px 1563px #FFF, 1129px 718px #FFF, 1852px 967px #FFF, 1038px 195px #FFF, 1271px 181px #FFF, 712px 598px #FFF, 968px 1838px #FFF, 966px 1303px #FFF, 1789px 843px #FFF, 284px 1790px #FFF, 1253px 96px #FFF, 1922px 803px #FFF, 603px 1942px #FFF, 1565px 1776px #FFF, 667px 1957px #FFF, 82px 816px #FFF, 621px 1689px #FFF, 609px 97px #FFF, 1857px 1279px #FFF, 526px 631px #FFF, 1344px 1985px #FFF, 877px 104px #FFF, 769px 1774px #FFF, 830px 1519px #FFF, 1228px 136px #FFF, 1835px 1652px #FFF, 1104px 1457px #FFF, 1649px 1225px #FFF, 172px 694px #FFF, 1968px 1377px #FFF, 1195px 1042px #FFF, 48px 1314px #FFF, 1886px 1961px #FFF, 1835px 8px #FFF, 1768px 374px #FFF, 351px 1018px #FFF, 1185px 416px #FFF, 1146px 367px #FFF, 29px 1935px #FFF, 1954px 1979px #FFF, 1292px 1784px #FFF, 1814px 844px #FFF, 495px 1125px #FFF, 1187px 491px #FFF, 883px 1007px #FFF, 1173px 336px #FFF, 1258px 839px #FFF, 1895px 1655px #FFF, 1441px 482px #FFF, 1676px 763px #FFF, 158px 469px #FFF, 1475px 1937px #FFF, 330px 1224px #FFF, 1938px 886px #FFF, 1420px 694px #FFF, 796px 1902px #FFF, 480px 1199px #FFF, 976px 1926px #FFF, 922px 772px #FFF, 62px 1210px #FFF, 814px 412px #FFF, 998px 834px #FFF, 939px 849px #FFF, 357px 1757px #FFF, 511px 22px #FFF, 638px 1218px #FFF, 1719px 1166px #FFF, 243px 441px #FFF, 728px 853px #FFF, 1608px 1805px #FFF, 848px 965px #FFF, 1291px 633px #FFF, 229px 1787px #FFF, 1127px 1061px #FFF, 349px 80px #FFF, 1966px 1132px #FFF, 1536px 845px #FFF, 1265px 701px #FFF, 1981px 1924px #FFF, 403px 148px #FFF, 1468px 588px #FFF, 400px 1913px #FFF, 1666px 176px #FFF, 385px 1267px #FFF, 1259px 1705px #FFF, 254px 337px #FFF, 1949px 1407px #FFF, 917px 927px #FFF, 1944px 295px #FFF, 709px 959px #FFF, 911px 331px #FFF, 470px 990px #FFF, 1836px 1541px #FFF, 135px 223px #FFF, 197px 837px #FFF, 698px 336px #FFF, 1922px 1076px #FFF, 410px 862px #FFF, 1173px 950px #FFF, 1187px 1107px #FFF, 545px 780px #FFF, 1394px 1334px #FFF, 1866px 1280px #FFF, 1924px 674px #FFF, 212px 941px #FFF, 199px 1194px #FFF, 1218px 312px #FFF, 938px 505px #FFF, 1578px 1721px #FFF, 497px 1987px #FFF, 1837px 1027px #FFF, 687px 1013px #FFF, 1177px 1269px #FFF, 739px 1508px #FFF, 1556px 639px #FFF, 241px 1416px #FFF, 1881px 1559px #FFF, 52px 1161px #FFF, 791px 713px #FFF, 1093px 556px #FFF, 1028px 332px #FFF, 1216px 45px #FFF, 606px 924px #FFF, 835px 290px #FFF, 860px 547px #FFF, 1520px 1234px #FFF, 130px 1009px #FFF, 1876px 1985px #FFF, 1059px 535px #FFF, 1319px 1093px #FFF, 1801px 326px #FFF, 1537px 1530px #FFF, 1949px 1942px #FFF, 1911px 489px #FFF, 142px 1970px #FFF, 1677px 1817px #FFF, 1474px 1479px #FFF, 96px 1835px #FFF, 926px 676px #FFF, 1639px 706px #FFF, 152px 141px #FFF, 485px 1290px #FFF, 1839px 1904px #FFF, 799px 456px #FFF, 1556px 140px #FFF, 929px 268px #FFF, 1102px 264px #FFF, 1375px 1148px #FFF, 1244px 726px #FFF, 360px 1656px #FFF, 810px 951px #FFF, 1834px 750px #FFF, 273px 1779px #FFF, 350px 1335px #FFF, 302px 1738px #FFF, 1309px 1225px #FFF, 1086px 465px #FFF, 1543px 1761px #FFF, 59px 504px #FFF, 913px 879px #FFF, 331px 1554px #FFF, 225px 902px #FFF, 60px 1911px #FFF, 728px 1700px #FFF, 709px 1578px #FFF, 1089px 1648px #FFF, 1108px 929px #FFF, 1290px 1171px #FFF, 651px 1856px #FFF, 468px 1259px #FFF, 108px 1893px #FFF, 326px 1145px #FFF, 613px 1318px #FFF, 1829px 1595px #FFF, 1764px 1644px #FFF, 524px 1574px #FFF, 497px 263px #FFF, 529px 1300px #FFF, 1704px 922px #FFF, 1531px 454px #FFF, 250px 116px #FFF, 864px 602px #FFF, 1163px 515px #FFF, 410px 423px #FFF, 1202px 824px #FFF, 996px 653px #FFF, 266px 1276px #FFF, 1117px 214px #FFF, 1675px 149px #FFF, 1012px 1868px #FFF, 808px 1588px #FFF, 1391px 1614px #FFF, 619px 1546px #FFF, 1087px 1620px #FFF, 430px 437px #FFF, 1269px 119px #FFF, 1401px 1537px #FFF, 701px 525px #FFF, 962px 1149px #FFF, 1998px 580px #FFF, 762px 261px #FFF, 1052px 196px #FFF, 102px 307px #FFF, 1211px 1040px #FFF, 982px 1692px #FFF, 1120px 916px #FFF, 1317px 1843px #FFF, 1368px 427px #FFF, 1313px 1631px #FFF, 1453px 1000px #FFF, 564px 1604px #FFF, 4px 975px #FFF, 1273px 1808px #FFF, 1681px 1296px #FFF, 370px 1678px #FFF, 1742px 445px #FFF, 995px 875px #FFF, 1748px 1453px #FFF, 1473px 636px #FFF, 31px 74px #FFF, 1457px 880px #FFF, 335px 1239px #FFF, 163px 1512px #FFF, 517px 586px #FFF, 587px 1102px #FFF, 1684px 370px #FFF, 362px 1894px #FFF, 1569px 15px #FFF, 1075px 1728px #FFF, 736px 491px #FFF, 1369px 1330px #FFF, 682px 443px #FFF, 1349px 987px #FFF, 140px 1752px #FFF, 806px 451px #FFF, 1119px 518px #FFF, 229px 1388px #FFF, 85px 1078px #FFF, 532px 1962px #FFF, 219px 543px #FFF, 1053px 287px #FFF, 678px 51px #FFF, 502px 1752px #FFF, 1859px 1518px #FFF, 1653px 1525px #FFF, 1069px 717px #FFF, 763px 1253px #FFF, 1869px 614px #FFF, 1827px 866px #FFF, 1190px 1088px #FFF, 1327px 148px #FFF, 1833px 1737px #FFF, 966px 1563px #FFF, 462px 1021px #FFF, 156px 1865px #FFF, 1790px 479px #FFF, 1056px 1821px #FFF, 1316px 1267px #FFF, 881px 1661px #FFF, 43px 1514px #FFF, 1387px 1693px #FFF, 1656px 1947px #FFF, 1466px 1324px #FFF, 978px 1262px #FFF, 962px 472px #FFF, 1004px 391px #FFF, 1759px 128px #FFF, 614px 1086px #FFF, 51px 1687px #FFF, 87px 1657px #FFF, 1167px 696px #FFF, 742px 1106px #FFF, 1436px 77px #FFF, 132px 1848px #FFF, 1090px 1835px #FFF, 1333px 1740px #FFF, 1383px 1159px #FFF, 1892px 1174px #FFF, 1195px 728px #FFF, 193px 802px #FFF, 1958px 1442px #FFF, 1103px 737px #FFF, 1583px 648px #FFF, 1790px 1538px #FFF, 1963px 743px #FFF, 1748px 1277px #FFF, 1795px 397px #FFF, 1529px 830px #FFF, 564px 74px #FFF, 1256px 678px #FFF, 1979px 1748px #FFF, 1024px 1781px #FFF, 865px 960px #FFF, 1710px 800px #FFF, 219px 369px #FFF, 1437px 540px #FFF, 357px 120px #FFF, 557px 784px #FFF, 1597px 1089px #FFF, 614px 1963px #FFF, 1342px 423px #FFF, 1869px 1545px #FFF, 1671px 1719px #FFF, 1441px 1791px #FFF, 1264px 243px #FFF, 1589px 1882px #FFF, 1162px 687px #FFF, 255px 524px #FFF, 1627px 1632px #FFF, 1267px 754px #FFF, 1126px 1355px #FFF, 1814px 863px #FFF, 1762px 1930px #FFF, 1379px 474px #FFF, 1449px 1195px #FFF, 753px 13px #FFF, 641px 1106px #FFF, 752px 373px #FFF, 1140px 906px #FFF, 1892px 1870px #FFF, 563px 550px #FFF, 478px 864px #FFF, 801px 1915px #FFF, 887px 1251px #FFF, 1406px 1985px #FFF, 1882px 174px #FFF, 1175px 735px #FFF, 1218px 1745px #FFF, 1237px 1708px #FFF, 599px 1928px #FFF, 381px 705px #FFF, 1011px 1437px #FFF, 1320px 404px #FFF, 567px 1942px #FFF, 376px 1910px #FFF, 949px 228px #FFF, 359px 83px #FFF, 795px 931px #FFF, 1897px 2px #FFF, 1243px 632px #FFF, 125px 1776px #FFF, 134px 1077px #FFF, 1275px 1384px #FFF, 1380px 44px #FFF, 594px 1136px #FFF, 1835px 1868px #FFF, 1722px 1290px #FFF, 759px 1719px #FFF, 775px 1551px #FFF, 1500px 465px #FFF, 895px 1144px #FFF, 171px 1302px #FFF, 1735px 436px #FFF, 1026px 1798px #FFF, 1791px 155px #FFF, 885px 469px #FFF, 398px 1601px #FFF, 1043px 608px #FFF, 511px 1420px #FFF, 1700px 1409px #FFF, 1221px 1996px #FFF, 998px 1749px #FFF, 1036px 1232px #FFF, 855px 1421px #FFF, 334px 1952px #FFF, 905px 538px #FFF, 1054px 1540px #FFF, 338px 519px #FFF, 986px 1592px #FFF, 1859px 1722px #FFF, 1713px 712px #FFF, 1152px 719px #FFF, 1739px 568px #FFF, 964px 432px #FFF, 1848px 880px #FFF, 143px 709px #FFF, 1448px 1290px #FFF, 469px 1686px #FFF, 977px 189px #FFF, 1345px 913px #FFF, 996px 665px #FFF, 522px 863px #FFF, 34px 96px #FFF, 991px 1626px #FFF, 177px 728px #FFF, 1924px 652px #FFF, 1718px 569px #FFF, 167px 1239px #FFF, 542px 113px #FFF, 237px 889px #FFF, 908px 1608px #FFF, 844px 28px #FFF, 1858px 1412px #FFF, 735px 1519px #FFF, 840px 1927px #FFF, 1487px 1867px #FFF, 869px 164px #FFF, 470px 1701px #FFF, 1681px 427px #FFF, 1647px 1120px #FFF, 33px 104px #FFF, 89px 1364px #FFF, 1066px 1902px #FFF, 290px 1847px #FFF, 987px 1832px #FFF, 1672px 1637px #FFF, 1125px 626px #FFF, 389px 1100px #FFF, 1857px 1937px #FFF, 1247px 99px #FFF, 1952px 41px #FFF, 1028px 1040px #FFF, 426px 220px #FFF, 751px 932px #FFF, 802px 1913px #FFF, 33px 838px #FFF, 1588px 1526px #FFF, 503px 564px #FFF, 8px 662px #FFF, 46px 1075px #FFF, 1912px 143px #FFF, 142px 583px #FFF, 1527px 181px #FFF, 1736px 802px #FFF, 978px 1942px #FFF, 171px 1383px #FFF, 454px 268px #FFF, 1708px 1804px #FFF, 1100px 1013px #FFF, 836px 248px #FFF, 135px 1508px #FFF, 1806px 813px #FFF, 1796px 481px #FFF, 1912px 1840px #FFF, 328px 222px #FFF, 583px 919px #FFF, 1039px 878px #FFF, 508px 531px #FFF, 1021px 761px #FFF, 666px 172px #FFF, 1909px 1874px #FFF, 51px 804px #FFF, 479px 1862px #FFF, 643px 637px #FFF, 1739px 281px #FFF, 204px 747px #FFF, 617px 1587px #FFF, 387px 1460px #FFF, 1472px 1451px #FFF, 1031px 802px #FFF, 1921px 1540px #FFF, 1054px 1226px #FFF, 612px 595px #FFF, 1196px 1711px #FFF, 1655px 229px #FFF, 1689px 844px #FFF, 920px 176px #FFF, 1909px 390px #FFF, 1886px 298px #FFF, 699px 337px #FFF, 1002px 291px #FFF, 381px 1090px #FFF, 603px 1158px #FFF, 508px 1511px #FFF, 894px 1591px #FFF, 164px 1853px #FFF, 435px 303px #FFF, 286px 1260px #FFF, 1784px 395px #FFF, 1183px 744px #FFF, 56px 1282px #FFF, 59px 1382px #FFF, 688px 1243px #FFF, 1511px 757px #FFF, 1050px 1953px #FFF, 70px 1547px #FFF, 431px 1526px #FFF, 1136px 1162px #FFF, 2px 1127px #FFF, 1371px 1503px #FFF, 62px 1437px #FFF, 1365px 1586px #FFF, 1813px 1577px #FFF, 1757px 1776px #FFF, 1143px 1715px #FFF, 1305px 340px #FFF, 74px 1732px #FFF, 1117px 1761px #FFF, 1478px 1408px #FFF, 784px 1351px #FFF, 1104px 1047px #FFF, 1066px 978px #FFF, 501px 1084px #FFF, 977px 1608px #FFF, 190px 1169px #FFF, 87px 1654px #FFF, 613px 883px #FFF, 1860px 221px #FFF, 239px 1540px #FFF, 612px 902px #FFF, 1392px 1871px #FFF, 960px 806px #FFF, 370px 740px #FFF, 815px 1069px #FFF, 1845px 1219px #FFF, 650px 309px #FFF, 243px 30px #FFF, 705px 1966px #FFF, 5px 1503px #FFF, 1944px 105px #FFF, 867px 1744px #FFF, 717px 597px #FFF, 1084px 1252px #FFF, 482px 749px #FFF, 1292px 1111px #FFF, 1794px 1266px #FFF, 1823px 900px #FFF, 1558px 1944px #FFF, 706px 191px #FFF, 964px 1476px #FFF, 1543px 541px #FFF, 364px 1124px #FFF, 1355px 1956px #FFF, 1069px 240px #FFF, 1931px 70px #FFF, 1227px 181px #FFF, 1223px 707px #FFF;
    animation: animateStars 28.5s ease-in-out infinite;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

    #stars::after {
        content: " ";
        position: absolute;
        margin: auto;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 1px;
        height: 1px;
        background: transparent;
        box-shadow: 0 880px 1797px #FFF, 1052px 548px #FFF, 1834px 214px #FFF, 1650px 1505px #FFF, 995px 1694px #FFF, 404px 713px #FFF, 652px 206px #FFF, 158px 1378px #FFF, 789px 1746px #FFF, 667px 1546px #FFF, 1703px 792px #FFF, 1368px 767px #FFF, 174px 1079px #FFF, 1609px 936px #FFF, 189px 1497px #FFF, 3px 1711px #FFF, 592px 103px #FFF, 1809px 1166px #FFF, 1642px 156px #FFF, 912px 1909px #FFF, 331px 1120px #FFF, 1001px 1552px #FFF, 988px 98px #FFF, 601px 535px #FFF, 232px 1842px #FFF, 1187px 812px #FFF, 842px 1592px #FFF, 1862px 1231px #FFF, 1866px 1924px #FFF, 47px 1076px #FFF, 1111px 385px #FFF, 531px 1815px #FFF, 8px 1340px #FFF, 944px 485px #FFF, 1097px 612px #FFF, 1287px 1477px #FFF, 231px 1962px #FFF, 1273px 1542px #FFF, 1071px 1595px #FFF, 637px 769px #FFF, 1946px 36px #FFF, 1711px 546px #FFF, 1591px 511px #FFF, 1644px 1471px #FFF, 911px 1729px #FFF, 1676px 594px #FFF, 358px 383px #FFF, 1286px 1741px #FFF, 970px 861px #FFF, 418px 489px #FFF, 338px 1840px #FFF, 1228px 421px #FFF, 1480px 1811px #FFF, 48px 1161px #FFF, 1315px 1487px #FFF, 291px 508px #FFF, 643px 1px #FFF, 1501px 105px #FFF, 1154px 248px #FFF, 1751px 561px #FFF, 905px 1144px #FFF, 917px 1064px #FFF, 1616px 697px #FFF, 82px 1872px #FFF, 826px 297px #FFF, 689px 690px #FFF, 1498px 1266px #FFF, 205px 962px #FFF, 1073px 244px #FFF, 132px 1785px #FFF, 913px 1741px #FFF, 1078px 1454px #FFF, 522px 1625px #FFF, 1628px 739px #FFF, 306px 1524px #FFF, 1022px 1451px #FFF, 836px 1595px #FFF, 1466px 1647px #FFF, 1859px 128px #FFF, 784px 1977px #FFF, 469px 1436px #FFF, 1656px 157px #FFF, 1081px 1288px #FFF, 1677px 1030px #FFF, 1417px 1637px #FFF, 817px 963px #FFF, 1970px 373px #FFF, 596px 1229px #FFF, 550px 53px #FFF, 380px 1736px #FFF, 1746px 711px #FFF, 109px 720px #FFF, 688px 89px #FFF, 2px 1823px #FFF, 1524px 172px #FFF, 536px 679px #FFF, 1314px 1856px #FFF, 426px 1832px #FFF, 588px 1451px #FFF, 1996px 385px #FFF, 1766px 335px #FFF, 1720px 562px #FFF, 1590px 374px #FFF, 410px 1526px #FFF, 656px 1638px #FFF, 512px 1268px #FFF, 313px 1428px #FFF, 840px 1072px #FFF, 1326px 1240px #FFF, 663px 919px #FFF, 402px 1067px #FFF, 944px 1493px #FFF, 1692px 1139px #FFF, 1159px 479px #FFF, 185px 471px #FFF, 211px 1043px #FFF, 127px 1790px #FFF, 318px 305px #FFF, 928px 885px #FFF, 1320px 74px #FFF, 488px 1819px #FFF, 1609px 787px #FFF, 878px 1624px #FFF, 1883px 1665px #FFF, 1237px 1712px #FFF, 50px 1417px #FFF, 1732px 1959px #FFF, 1513px 1899px #FFF, 1695px 299px #FFF, 1462px 1589px #FFF, 807px 1228px #FFF, 105px 200px #FFF, 787px 1390px #FFF, 1410px 1875px #FFF, 846px 573px #FFF, 1890px 1830px #FFF, 187px 1350px #FFF, 84px 295px #FFF, 1511px 24px #FFF, 1292px 1473px #FFF, 1973px 1425px #FFF, 1116px 927px #FFF, 1689px 1737px #FFF, 660px 1685px #FFF, 748px 419px #FFF, 1934px 1022px #FFF, 1998px 1130px #FFF, 405px 1312px #FFF, 1219px 1267px #FFF, 751px 1708px #FFF, 1185px 1107px #FFF, 931px 1913px #FFF, 786px 1157px #FFF, 1791px 1909px #FFF, 1162px 28px #FFF, 1201px 269px #FFF, 1534px 84px #FFF, 727px 864px #FFF, 1676px 1404px #FFF, 1299px 1048px #FFF, 1039px 406px #FFF, 674px 215px #FFF, 856px 1232px #FFF, 1461px 61px #FFF, 1855px 1307px #FFF, 324px 1289px #FFF, 747px 54px #FFF, 1083px 818px #FFF, 1901px 1843px #FFF, 131px 1228px #FFF, 1552px 594px #FFF, 1632px 109px #FFF, 1815px 1243px #FFF, 1429px 1563px #FFF, 1129px 718px #FFF, 1852px 967px #FFF, 1038px 195px #FFF, 1271px 181px #FFF, 712px 598px #FFF, 968px 1838px #FFF, 966px 1303px #FFF, 1789px 843px #FFF, 284px 1790px #FFF, 1253px 96px #FFF, 1922px 803px #FFF, 603px 1942px #FFF, 1565px 1776px #FFF, 667px 1957px #FFF, 82px 816px #FFF, 621px 1689px #FFF, 609px 97px #FFF, 1857px 1279px #FFF, 526px 631px #FFF, 1344px 1985px #FFF, 877px 104px #FFF, 769px 1774px #FFF, 830px 1519px #FFF, 1228px 136px #FFF, 1835px 1652px #FFF, 1104px 1457px #FFF, 1649px 1225px #FFF, 172px 694px #FFF, 1968px 1377px #FFF, 1195px 1042px #FFF, 48px 1314px #FFF, 1886px 1961px #FFF, 1835px 8px #FFF, 1768px 374px #FFF, 351px 1018px #FFF, 1185px 416px #FFF, 1146px 367px #FFF, 29px 1935px #FFF, 1954px 1979px #FFF, 1292px 1784px #FFF, 1814px 844px #FFF, 495px 1125px #FFF, 1187px 491px #FFF, 883px 1007px #FFF, 1173px 336px #FFF, 1258px 839px #FFF, 1895px 1655px #FFF, 1441px 482px #FFF, 1676px 763px #FFF, 158px 469px #FFF, 1475px 1937px #FFF, 330px 1224px #FFF, 1938px 886px #FFF, 1420px 694px #FFF, 796px 1902px #FFF, 480px 1199px #FFF, 976px 1926px #FFF, 922px 772px #FFF, 62px 1210px #FFF, 814px 412px #FFF, 998px 834px #FFF, 939px 849px #FFF, 357px 1757px #FFF, 511px 22px #FFF, 638px 1218px #FFF, 1719px 1166px #FFF, 243px 441px #FFF, 728px 853px #FFF, 1608px 1805px #FFF, 848px 965px #FFF, 1291px 633px #FFF, 229px 1787px #FFF, 1127px 1061px #FFF, 349px 80px #FFF, 1966px 1132px #FFF, 1536px 845px #FFF, 1265px 701px #FFF, 1981px 1924px #FFF, 403px 148px #FFF, 1468px 588px #FFF, 400px 1913px #FFF, 1666px 176px #FFF, 385px 1267px #FFF, 1259px 1705px #FFF, 254px 337px #FFF, 1949px 1407px #FFF, 917px 927px #FFF, 1944px 295px #FFF, 709px 959px #FFF, 911px 331px #FFF, 470px 990px #FFF, 1836px 1541px #FFF, 135px 223px #FFF, 197px 837px #FFF, 698px 336px #FFF, 1922px 1076px #FFF, 410px 862px #FFF, 1173px 950px #FFF, 1187px 1107px #FFF, 545px 780px #FFF, 1394px 1334px #FFF, 1866px 1280px #FFF, 1924px 674px #FFF, 212px 941px #FFF, 199px 1194px #FFF, 1218px 312px #FFF, 938px 505px #FFF, 1578px 1721px #FFF, 497px 1987px #FFF, 1837px 1027px #FFF, 687px 1013px #FFF, 1177px 1269px #FFF, 739px 1508px #FFF, 1556px 639px #FFF, 241px 1416px #FFF, 1881px 1559px #FFF, 52px 1161px #FFF, 791px 713px #FFF, 1093px 556px #FFF, 1028px 332px #FFF, 1216px 45px #FFF, 606px 924px #FFF, 835px 290px #FFF, 860px 547px #FFF, 1520px 1234px #FFF, 130px 1009px #FFF, 1876px 1985px #FFF, 1059px 535px #FFF, 1319px 1093px #FFF, 1801px 326px #FFF, 1537px 1530px #FFF, 1949px 1942px #FFF, 1911px 489px #FFF, 142px 1970px #FFF, 1677px 1817px #FFF, 1474px 1479px #FFF, 96px 1835px #FFF, 926px 676px #FFF, 1639px 706px #FFF, 152px 141px #FFF, 485px 1290px #FFF, 1839px 1904px #FFF, 799px 456px #FFF, 1556px 140px #FFF, 929px 268px #FFF, 1102px 264px #FFF, 1375px 1148px #FFF, 1244px 726px #FFF, 360px 1656px #FFF, 810px 951px #FFF, 1834px 750px #FFF, 273px 1779px #FFF, 350px 1335px #FFF, 302px 1738px #FFF, 1309px 1225px #FFF, 1086px 465px #FFF, 1543px 1761px #FFF, 59px 504px #FFF, 913px 879px #FFF, 331px 1554px #FFF, 225px 902px #FFF, 60px 1911px #FFF, 728px 1700px #FFF, 709px 1578px #FFF, 1089px 1648px #FFF, 1108px 929px #FFF, 1290px 1171px #FFF, 651px 1856px #FFF, 468px 1259px #FFF, 108px 1893px #FFF, 326px 1145px #FFF, 613px 1318px #FFF, 1829px 1595px #FFF, 1764px 1644px #FFF, 524px 1574px #FFF, 497px 263px #FFF, 529px 1300px #FFF, 1704px 922px #FFF, 1531px 454px #FFF, 250px 116px #FFF, 864px 602px #FFF, 1163px 515px #FFF, 410px 423px #FFF, 1202px 824px #FFF, 996px 653px #FFF, 266px 1276px #FFF, 1117px 214px #FFF, 1675px 149px #FFF, 1012px 1868px #FFF, 808px 1588px #FFF, 1391px 1614px #FFF, 619px 1546px #FFF, 1087px 1620px #FFF, 430px 437px #FFF, 1269px 119px #FFF, 1401px 1537px #FFF, 701px 525px #FFF, 962px 1149px #FFF, 1998px 580px #FFF, 762px 261px #FFF, 1052px 196px #FFF, 102px 307px #FFF, 1211px 1040px #FFF, 982px 1692px #FFF, 1120px 916px #FFF, 1317px 1843px #FFF, 1368px 427px #FFF, 1313px 1631px #FFF, 1453px 1000px #FFF, 564px 1604px #FFF, 4px 975px #FFF, 1273px 1808px #FFF, 1681px 1296px #FFF, 370px 1678px #FFF, 1742px 445px #FFF, 995px 875px #FFF, 1748px 1453px #FFF, 1473px 636px #FFF, 31px 74px #FFF, 1457px 880px #FFF, 335px 1239px #FFF, 163px 1512px #FFF, 517px 586px #FFF, 587px 1102px #FFF, 1684px 370px #FFF, 362px 1894px #FFF, 1569px 15px #FFF, 1075px 1728px #FFF, 736px 491px #FFF, 1369px 1330px #FFF, 682px 443px #FFF, 1349px 987px #FFF, 140px 1752px #FFF, 806px 451px #FFF, 1119px 518px #FFF, 229px 1388px #FFF, 85px 1078px #FFF, 532px 1962px #FFF, 219px 543px #FFF, 1053px 287px #FFF, 678px 51px #FFF, 502px 1752px #FFF, 1859px 1518px #FFF, 1653px 1525px #FFF, 1069px 717px #FFF, 763px 1253px #FFF, 1869px 614px #FFF, 1827px 866px #FFF, 1190px 1088px #FFF, 1327px 148px #FFF, 1833px 1737px #FFF, 966px 1563px #FFF, 462px 1021px #FFF, 156px 1865px #FFF, 1790px 479px #FFF, 1056px 1821px #FFF, 1316px 1267px #FFF, 881px 1661px #FFF, 43px 1514px #FFF, 1387px 1693px #FFF, 1656px 1947px #FFF, 1466px 1324px #FFF, 978px 1262px #FFF, 962px 472px #FFF, 1004px 391px #FFF, 1759px 128px #FFF, 614px 1086px #FFF, 51px 1687px #FFF, 87px 1657px #FFF, 1167px 696px #FFF, 742px 1106px #FFF, 1436px 77px #FFF, 132px 1848px #FFF, 1090px 1835px #FFF, 1333px 1740px #FFF, 1383px 1159px #FFF, 1892px 1174px #FFF, 1195px 728px #FFF, 193px 802px #FFF, 1958px 1442px #FFF, 1103px 737px #FFF, 1583px 648px #FFF, 1790px 1538px #FFF, 1963px 743px #FFF, 1748px 1277px #FFF, 1795px 397px #FFF, 1529px 830px #FFF, 564px 74px #FFF, 1256px 678px #FFF, 1979px 1748px #FFF, 1024px 1781px #FFF, 865px 960px #FFF, 1710px 800px #FFF, 219px 369px #FFF, 1437px 540px #FFF, 357px 120px #FFF, 557px 784px #FFF, 1597px 1089px #FFF, 614px 1963px #FFF, 1342px 423px #FFF, 1869px 1545px #FFF, 1671px 1719px #FFF, 1441px 1791px #FFF, 1264px 243px #FFF, 1589px 1882px #FFF, 1162px 687px #FFF, 255px 524px #FFF, 1627px 1632px #FFF, 1267px 754px #FFF, 1126px 1355px #FFF, 1814px 863px #FFF, 1762px 1930px #FFF, 1379px 474px #FFF, 1449px 1195px #FFF, 753px 13px #FFF, 641px 1106px #FFF, 752px 373px #FFF, 1140px 906px #FFF, 1892px 1870px #FFF, 563px 550px #FFF, 478px 864px #FFF, 801px 1915px #FFF, 887px 1251px #FFF, 1406px 1985px #FFF, 1882px 174px #FFF, 1175px 735px #FFF, 1218px 1745px #FFF, 1237px 1708px #FFF, 599px 1928px #FFF, 381px 705px #FFF, 1011px 1437px #FFF, 1320px 404px #FFF, 567px 1942px #FFF, 376px 1910px #FFF, 949px 228px #FFF, 359px 83px #FFF, 795px 931px #FFF, 1897px 2px #FFF, 1243px 632px #FFF, 125px 1776px #FFF, 134px 1077px #FFF, 1275px 1384px #FFF, 1380px 44px #FFF, 594px 1136px #FFF, 1835px 1868px #FFF, 1722px 1290px #FFF, 759px 1719px #FFF, 775px 1551px #FFF, 1500px 465px #FFF, 895px 1144px #FFF, 171px 1302px #FFF, 1735px 436px #FFF, 1026px 1798px #FFF, 1791px 155px #FFF, 885px 469px #FFF, 398px 1601px #FFF, 1043px 608px #FFF, 511px 1420px #FFF, 1700px 1409px #FFF, 1221px 1996px #FFF, 998px 1749px #FFF, 1036px 1232px #FFF, 855px 1421px #FFF, 334px 1952px #FFF, 905px 538px #FFF, 1054px 1540px #FFF, 338px 519px #FFF, 986px 1592px #FFF, 1859px 1722px #FFF, 1713px 712px #FFF, 1152px 719px #FFF, 1739px 568px #FFF, 964px 432px #FFF, 1848px 880px #FFF, 143px 709px #FFF, 1448px 1290px #FFF, 469px 1686px #FFF, 977px 189px #FFF, 1345px 913px #FFF, 996px 665px #FFF, 522px 863px #FFF, 34px 96px #FFF, 991px 1626px #FFF, 177px 728px #FFF, 1924px 652px #FFF, 1718px 569px #FFF, 167px 1239px #FFF, 542px 113px #FFF, 237px 889px #FFF, 908px 1608px #FFF, 844px 28px #FFF, 1858px 1412px #FFF, 735px 1519px #FFF, 840px 1927px #FFF, 1487px 1867px #FFF, 869px 164px #FFF, 470px 1701px #FFF, 1681px 427px #FFF, 1647px 1120px #FFF, 33px 104px #FFF, 89px 1364px #FFF, 1066px 1902px #FFF, 290px 1847px #FFF, 987px 1832px #FFF, 1672px 1637px #FFF, 1125px 626px #FFF, 389px 1100px #FFF, 1857px 1937px #FFF, 1247px 99px #FFF, 1952px 41px #FFF, 1028px 1040px #FFF, 426px 220px #FFF, 751px 932px #FFF, 802px 1913px #FFF, 33px 838px #FFF, 1588px 1526px #FFF, 503px 564px #FFF, 8px 662px #FFF, 46px 1075px #FFF, 1912px 143px #FFF, 142px 583px #FFF, 1527px 181px #FFF, 1736px 802px #FFF, 978px 1942px #FFF, 171px 1383px #FFF, 454px 268px #FFF, 1708px 1804px #FFF, 1100px 1013px #FFF, 836px 248px #FFF, 135px 1508px #FFF, 1806px 813px #FFF, 1796px 481px #FFF, 1912px 1840px #FFF, 328px 222px #FFF, 583px 919px #FFF, 1039px 878px #FFF, 508px 531px #FFF, 1021px 761px #FFF, 666px 172px #FFF, 1909px 1874px #FFF, 51px 804px #FFF, 479px 1862px #FFF, 643px 637px #FFF, 1739px 281px #FFF, 204px 747px #FFF, 617px 1587px #FFF, 387px 1460px #FFF, 1472px 1451px #FFF, 1031px 802px #FFF, 1921px 1540px #FFF, 1054px 1226px #FFF, 612px 595px #FFF, 1196px 1711px #FFF, 1655px 229px #FFF, 1689px 844px #FFF, 920px 176px #FFF, 1909px 390px #FFF, 1886px 298px #FFF, 699px 337px #FFF, 1002px 291px #FFF, 381px 1090px #FFF, 603px 1158px #FFF, 508px 1511px #FFF, 894px 1591px #FFF, 164px 1853px #FFF, 435px 303px #FFF, 286px 1260px #FFF, 1784px 395px #FFF, 1183px 744px #FFF, 56px 1282px #FFF, 59px 1382px #FFF, 688px 1243px #FFF, 1511px 757px #FFF, 1050px 1953px #FFF, 70px 1547px #FFF, 431px 1526px #FFF, 1136px 1162px #FFF, 2px 1127px #FFF, 1371px 1503px #FFF, 62px 1437px #FFF, 1365px 1586px #FFF, 1813px 1577px #FFF, 1757px 1776px #FFF, 1143px 1715px #FFF, 1305px 340px #FFF, 74px 1732px #FFF, 1117px 1761px #FFF, 1478px 1408px #FFF, 784px 1351px #FFF, 1104px 1047px #FFF, 1066px 978px #FFF, 501px 1084px #FFF, 977px 1608px #FFF, 190px 1169px #FFF, 87px 1654px #FFF, 613px 883px #FFF, 1860px 221px #FFF, 239px 1540px #FFF, 612px 902px #FFF, 1392px 1871px #FFF, 960px 806px #FFF, 370px 740px #FFF, 815px 1069px #FFF, 1845px 1219px #FFF, 650px 309px #FFF, 243px 30px #FFF, 705px 1966px #FFF, 5px 1503px #FFF, 1944px 105px #FFF, 867px 1744px #FFF, 717px 597px #FFF, 1084px 1252px #FFF, 482px 749px #FFF, 1292px 1111px #FFF, 1794px 1266px #FFF, 1823px 900px #FFF, 1558px 1944px #FFF, 706px 191px #FFF, 964px 1476px #FFF, 1543px 541px #FFF, 364px 1124px #FFF, 1355px 1956px #FFF, 1069px 240px #FFF, 1931px 70px #FFF, 1227px 181px #FFF, 1223px 707px #FFF;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
    }

#stars2 {
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 0 1452px 383px #FFF, 905px 1611px #FFF, 690px 1642px #FFF, 418px 151px #FFF, 1109px 1336px #FFF, 1851px 107px #FFF, 1757px 7px #FFF, 893px 1964px #FFF, 417px 983px #FFF, 615px 1443px #FFF, 144px 1927px #FFF, 271px 1605px #FFF, 734px 1598px #FFF, 1069px 1668px #FFF, 942px 283px #FFF, 123px 260px #FFF, 263px 227px #FFF, 668px 1960px #FFF, 288px 1170px #FFF, 664px 812px #FFF, 575px 660px #FFF, 1168px 567px #FFF, 24px 1448px #FFF, 1317px 728px #FFF, 47px 1364px #FFF, 704px 1059px #FFF, 46px 1480px #FFF, 1032px 703px #FFF, 1230px 248px #FFF, 145px 1277px #FFF, 1545px 660px #FFF, 337px 1896px #FFF, 1094px 1514px #FFF, 1862px 956px #FFF, 260px 1819px #FFF, 1428px 1171px #FFF, 519px 1905px #FFF, 521px 846px #FFF, 408px 510px #FFF, 1704px 1784px #FFF, 272px 483px #FFF, 89px 1921px #FFF, 157px 11px #FFF, 1360px 833px #FFF, 927px 1625px #FFF, 360px 215px #FFF, 990px 1395px #FFF, 1774px 1799px #FFF, 991px 359px #FFF, 616px 826px #FFF, 560px 213px #FFF, 3px 1374px #FFF, 500px 1432px #FFF, 1035px 844px #FFF, 1837px 479px #FFF, 1769px 1520px #FFF, 1040px 687px #FFF, 1944px 364px #FFF, 965px 1929px #FFF, 967px 1775px #FFF, 1730px 1919px #FFF, 770px 1760px #FFF, 1330px 716px #FFF, 1493px 1530px #FFF, 1609px 968px #FFF, 1183px 1202px #FFF, 1724px 1419px #FFF, 256px 1401px #FFF, 611px 176px #FFF, 896px 1306px #FFF, 817px 1865px #FFF, 1229px 344px #FFF, 1297px 49px #FFF, 1927px 1837px #FFF, 1398px 1293px #FFF, 1649px 1413px #FFF, 1366px 874px #FFF, 97px 1857px #FFF, 963px 1934px #FFF, 374px 607px #FFF, 652px 229px #FFF, 1844px 757px #FFF, 1534px 1675px #FFF, 1109px 1464px #FFF, 1534px 651px #FFF, 933px 38px #FFF, 1110px 1279px #FFF, 1260px 25px #FFF, 1397px 1434px #FFF, 618px 599px #FFF, 1844px 1718px #FFF, 911px 117px #FFF, 187px 1240px #FFF, 511px 1938px #FFF, 90px 1234px #FFF, 687px 763px #FFF, 1326px 763px #FFF, 284px 279px #FFF, 1751px 1487px #FFF, 882px 725px #FFF, 832px 1719px #FFF, 796px 193px #FFF, 1236px 1745px #FFF, 701px 1457px #FFF, 1538px 778px #FFF, 492px 1590px #FFF, 543px 79px #FFF, 730px 701px #FFF, 238px 1234px #FFF, 931px 553px #FFF, 1010px 1126px #FFF, 1464px 448px #FFF, 563px 64px #FFF, 1012px 1477px #FFF, 425px 940px #FFF, 251px 675px #FFF, 1500px 88px #FFF, 325px 388px #FFF, 1418px 757px #FFF, 1540px 1609px #FFF, 1131px 1639px #FFF, 1466px 1210px #FFF, 943px 867px #FFF, 1247px 1671px #FFF, 607px 758px #FFF, 1879px 347px #FFF, 1580px 1994px #FFF, 869px 1557px #FFF, 371px 442px #FFF, 1401px 1637px #FFF, 1658px 860px #FFF, 319px 349px #FFF, 1761px 486px #FFF, 216px 645px #FFF, 913px 1525px #FFF, 1745px 1383px #FFF, 906px 651px #FFF, 19px 1244px #FFF, 417px 483px #FFF, 218px 586px #FFF, 274px 908px #FFF, 1782px 384px #FFF, 1551px 1560px #FFF, 893px 1122px #FFF, 1243px 1262px #FFF, 1176px 1469px #FFF, 599px 1420px #FFF, 759px 54px #FFF, 575px 1040px #FFF, 245px 912px #FFF, 1660px 1412px #FFF, 1883px 1573px #FFF, 1462px 1045px #FFF, 715px 1830px #FFF, 190px 1613px #FFF, 1391px 1597px #FFF, 1352px 1851px #FFF, 1367px 1233px #FFF, 1100px 746px #FFF, 556px 560px #FFF, 226px 496px #FFF, 1021px 1055px #FFF, 1539px 300px #FFF, 1381px 1267px #FFF, 167px 381px #FFF, 1558px 1610px #FFF, 121px 1444px #FFF, 1601px 954px #FFF, 1107px 181px #FFF, 1999px 980px #FFF, 408px 932px #FFF, 1812px 1496px #FFF, 317px 303px #FFF, 1766px 1970px #FFF, 749px 1245px #FFF, 255px 756px #FFF, 95px 342px #FFF, 1861px 88px #FFF, 1265px 785px #FFF, 570px 199px #FFF, 673px 274px #FFF, 1426px 1735px #FFF, 648px 185px #FFF, 1322px 1553px #FFF, 833px 902px #FFF, 312px 1032px #FFF, 1932px 722px #FFF, 1645px 480px #FFF, 1442px 1941px #FFF, 1515px 467px #FFF, 1818px 288px #FFF, 1662px 203px #FFF, 975px 559px #FFF, 460px 1685px #FFF, 257px 268px #FFF, 98px 636px #FFF, 1714px 1755px #FFF, 130px 1205px #FFF, 618px 787px #FFF, 123px 1267px #FFF;
    animation: animateStars 30s ease-in-out infinite;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

    #stars2::after {
        content: " ";
        position: absolute;
        margin: auto;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 2px;
        height: 2px;
        background: transparent;
        box-shadow: 0 1452px 383px #FFF, 905px 1611px #FFF, 690px 1642px #FFF, 418px 151px #FFF, 1109px 1336px #FFF, 1851px 107px #FFF, 1757px 7px #FFF, 893px 1964px #FFF, 417px 983px #FFF, 615px 1443px #FFF, 144px 1927px #FFF, 271px 1605px #FFF, 734px 1598px #FFF, 1069px 1668px #FFF, 942px 283px #FFF, 123px 260px #FFF, 263px 227px #FFF, 668px 1960px #FFF, 288px 1170px #FFF, 664px 812px #FFF, 575px 660px #FFF, 1168px 567px #FFF, 24px 1448px #FFF, 1317px 728px #FFF, 47px 1364px #FFF, 704px 1059px #FFF, 46px 1480px #FFF, 1032px 703px #FFF, 1230px 248px #FFF, 145px 1277px #FFF, 1545px 660px #FFF, 337px 1896px #FFF, 1094px 1514px #FFF, 1862px 956px #FFF, 260px 1819px #FFF, 1428px 1171px #FFF, 519px 1905px #FFF, 521px 846px #FFF, 408px 510px #FFF, 1704px 1784px #FFF, 272px 483px #FFF, 89px 1921px #FFF, 157px 11px #FFF, 1360px 833px #FFF, 927px 1625px #FFF, 360px 215px #FFF, 990px 1395px #FFF, 1774px 1799px #FFF, 991px 359px #FFF, 616px 826px #FFF, 560px 213px #FFF, 3px 1374px #FFF, 500px 1432px #FFF, 1035px 844px #FFF, 1837px 479px #FFF, 1769px 1520px #FFF, 1040px 687px #FFF, 1944px 364px #FFF, 965px 1929px #FFF, 967px 1775px #FFF, 1730px 1919px #FFF, 770px 1760px #FFF, 1330px 716px #FFF, 1493px 1530px #FFF, 1609px 968px #FFF, 1183px 1202px #FFF, 1724px 1419px #FFF, 256px 1401px #FFF, 611px 176px #FFF, 896px 1306px #FFF, 817px 1865px #FFF, 1229px 344px #FFF, 1297px 49px #FFF, 1927px 1837px #FFF, 1398px 1293px #FFF, 1649px 1413px #FFF, 1366px 874px #FFF, 97px 1857px #FFF, 963px 1934px #FFF, 374px 607px #FFF, 652px 229px #FFF, 1844px 757px #FFF, 1534px 1675px #FFF, 1109px 1464px #FFF, 1534px 651px #FFF, 933px 38px #FFF, 1110px 1279px #FFF, 1260px 25px #FFF, 1397px 1434px #FFF, 618px 599px #FFF, 1844px 1718px #FFF, 911px 117px #FFF, 187px 1240px #FFF, 511px 1938px #FFF, 90px 1234px #FFF, 687px 763px #FFF, 1326px 763px #FFF, 284px 279px #FFF, 1751px 1487px #FFF, 882px 725px #FFF, 832px 1719px #FFF, 796px 193px #FFF, 1236px 1745px #FFF, 701px 1457px #FFF, 1538px 778px #FFF, 492px 1590px #FFF, 543px 79px #FFF, 730px 701px #FFF, 238px 1234px #FFF, 931px 553px #FFF, 1010px 1126px #FFF, 1464px 448px #FFF, 563px 64px #FFF, 1012px 1477px #FFF, 425px 940px #FFF, 251px 675px #FFF, 1500px 88px #FFF, 325px 388px #FFF, 1418px 757px #FFF, 1540px 1609px #FFF, 1131px 1639px #FFF, 1466px 1210px #FFF, 943px 867px #FFF, 1247px 1671px #FFF, 607px 758px #FFF, 1879px 347px #FFF, 1580px 1994px #FFF, 869px 1557px #FFF, 371px 442px #FFF, 1401px 1637px #FFF, 1658px 860px #FFF, 319px 349px #FFF, 1761px 486px #FFF, 216px 645px #FFF, 913px 1525px #FFF, 1745px 1383px #FFF, 906px 651px #FFF, 19px 1244px #FFF, 417px 483px #FFF, 218px 586px #FFF, 274px 908px #FFF, 1782px 384px #FFF, 1551px 1560px #FFF, 893px 1122px #FFF, 1243px 1262px #FFF, 1176px 1469px #FFF, 599px 1420px #FFF, 759px 54px #FFF, 575px 1040px #FFF, 245px 912px #FFF, 1660px 1412px #FFF, 1883px 1573px #FFF, 1462px 1045px #FFF, 715px 1830px #FFF, 190px 1613px #FFF, 1391px 1597px #FFF, 1352px 1851px #FFF, 1367px 1233px #FFF, 1100px 746px #FFF, 556px 560px #FFF, 226px 496px #FFF, 1021px 1055px #FFF, 1539px 300px #FFF, 1381px 1267px #FFF, 167px 381px #FFF, 1558px 1610px #FFF, 121px 1444px #FFF, 1601px 954px #FFF, 1107px 181px #FFF, 1999px 980px #FFF, 408px 932px #FFF, 1812px 1496px #FFF, 317px 303px #FFF, 1766px 1970px #FFF, 749px 1245px #FFF, 255px 756px #FFF, 95px 342px #FFF, 1861px 88px #FFF, 1265px 785px #FFF, 570px 199px #FFF, 673px 274px #FFF, 1426px 1735px #FFF, 648px 185px #FFF, 1322px 1553px #FFF, 833px 902px #FFF, 312px 1032px #FFF, 1932px 722px #FFF, 1645px 480px #FFF, 1442px 1941px #FFF, 1515px 467px #FFF, 1818px 288px #FFF, 1662px 203px #FFF, 975px 559px #FFF, 460px 1685px #FFF, 257px 268px #FFF, 98px 636px #FFF, 1714px 1755px #FFF, 130px 1205px #FFF, 618px 787px #FFF, 123px 1267px #FFF;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
    }

#stars3 {
    width: 3px;
    height: 3px;
    background: transparent;
    box-shadow: 0 186px 1886px #FFF, 822px 325px #FFF, 719px 1252px #FFF, 544px 523px #FFF, 1721px 952px #FFF, 1408px 1407px #FFF, 1443px 1766px #FFF, 348px 1156px #FFF, 221px 1256px #FFF, 1945px 896px #FFF, 1943px 1282px #FFF, 1159px 121px #FFF, 1286px 1138px #FFF, 1763px 257px #FFF, 779px 1694px #FFF, 275px 550px #FFF, 1575px 466px #FFF, 235px 691px #FFF, 1666px 1776px #FFF, 802px 826px #FFF, 779px 171px #FFF, 1945px 454px #FFF, 294px 455px #FFF, 1229px 1315px #FFF, 1168px 1855px #FFF, 760px 1932px #FFF, 1068px 1645px #FFF, 1606px 212px #FFF, 845px 1004px #FFF, 1296px 887px #FFF, 1605px 1345px #FFF, 514px 395px #FFF, 1821px 1544px #FFF, 1211px 1892px #FFF, 1691px 870px #FFF, 1187px 290px #FFF, 899px 872px #FFF, 800px 75px #FFF, 1751px 821px #FFF, 993px 1958px #FFF, 194px 36px #FFF, 898px 829px #FFF, 178px 467px #FFF, 1722px 1386px #FFF, 1651px 656px #FFF, 783px 715px #FFF, 1409px 1145px #FFF, 1218px 1976px #FFF, 262px 576px #FFF, 1911px 1149px #FFF, 1086px 965px #FFF, 1621px 1333px #FFF, 1988px 428px #FFF, 764px 1851px #FFF, 1049px 133px #FFF, 1771px 1405px #FFF, 1779px 1424px #FFF, 827px 1089px #FFF, 1627px 1640px #FFF, 91px 1180px #FFF, 1601px 947px #FFF, 717px 1576px #FFF, 1588px 767px #FFF, 1164px 1283px #FFF, 1086px 228px #FFF, 1391px 1646px #FFF, 540px 330px #FFF, 584px 94px #FFF, 596px 1046px #FFF, 1021px 673px #FFF, 1663px 1883px #FFF, 350px 821px #FFF, 1899px 506px #FFF, 1979px 1015px #FFF, 1775px 14px #FFF, 1591px 1215px #FFF, 329px 174px #FFF, 907px 501px #FFF, 369px 1768px #FFF, 1233px 1457px #FFF, 1694px 577px #FFF, 402px 952px #FFF, 87px 935px #FFF, 16px 812px #FFF, 1291px 66px #FFF, 190px 990px #FFF, 506px 799px #FFF, 1069px 1917px #FFF, 145px 1470px #FFF, 814px 1063px #FFF, 421px 1266px #FFF, 1369px 436px #FFF, 117px 1921px #FFF, 626px 1025px #FFF, 1999px 803px #FFF, 135px 249px #FFF, 1456px 388px #FFF, 335px 1268px #FFF, 1036px 1420px #FFF, 866px 1635px #FFF;
    animation: animateStars 31.5s ease-in-out infinite;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

    #stars3:after {
        content: " ";
        position: absolute;
        margin: auto;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 3px;
        height: 3px;
        background: transparent;
        box-shadow: 0 186px 1886px #FFF, 822px 325px #FFF, 719px 1252px #FFF, 544px 523px #FFF, 1721px 952px #FFF, 1408px 1407px #FFF, 1443px 1766px #FFF, 348px 1156px #FFF, 221px 1256px #FFF, 1945px 896px #FFF, 1943px 1282px #FFF, 1159px 121px #FFF, 1286px 1138px #FFF, 1763px 257px #FFF, 779px 1694px #FFF, 275px 550px #FFF, 1575px 466px #FFF, 235px 691px #FFF, 1666px 1776px #FFF, 802px 826px #FFF, 779px 171px #FFF, 1945px 454px #FFF, 294px 455px #FFF, 1229px 1315px #FFF, 1168px 1855px #FFF, 760px 1932px #FFF, 1068px 1645px #FFF, 1606px 212px #FFF, 845px 1004px #FFF, 1296px 887px #FFF, 1605px 1345px #FFF, 514px 395px #FFF, 1821px 1544px #FFF, 1211px 1892px #FFF, 1691px 870px #FFF, 1187px 290px #FFF, 899px 872px #FFF, 800px 75px #FFF, 1751px 821px #FFF, 993px 1958px #FFF, 194px 36px #FFF, 898px 829px #FFF, 178px 467px #FFF, 1722px 1386px #FFF, 1651px 656px #FFF, 783px 715px #FFF, 1409px 1145px #FFF, 1218px 1976px #FFF, 262px 576px #FFF, 1911px 1149px #FFF, 1086px 965px #FFF, 1621px 1333px #FFF, 1988px 428px #FFF, 764px 1851px #FFF, 1049px 133px #FFF, 1771px 1405px #FFF, 1779px 1424px #FFF, 827px 1089px #FFF, 1627px 1640px #FFF, 91px 1180px #FFF, 1601px 947px #FFF, 717px 1576px #FFF, 1588px 767px #FFF, 1164px 1283px #FFF, 1086px 228px #FFF, 1391px 1646px #FFF, 540px 330px #FFF, 584px 94px #FFF, 596px 1046px #FFF, 1021px 673px #FFF, 1663px 1883px #FFF, 350px 821px #FFF, 1899px 506px #FFF, 1979px 1015px #FFF, 1775px 14px #FFF, 1591px 1215px #FFF, 329px 174px #FFF, 907px 501px #FFF, 369px 1768px #FFF, 1233px 1457px #FFF, 1694px 577px #FFF, 402px 952px #FFF, 87px 935px #FFF, 16px 812px #FFF, 1291px 66px #FFF, 190px 990px #FFF, 506px 799px #FFF, 1069px 1917px #FFF, 145px 1470px #FFF, 814px 1063px #FFF, 421px 1266px #FFF, 1369px 436px #FFF, 117px 1921px #FFF, 626px 1025px #FFF, 1999px 803px #FFF, 135px 249px #FFF, 1456px 388px #FFF, 335px 1268px #FFF, 1036px 1420px #FFF, 866px 1635px #FFF;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
    }

@keyframes animateStars {
    0% {
        -webkit-transform: rotate3d(-1, 1, 0, 0deg);
        -ms-transform: rotate3d(-1, 1, 0, 0deg);
        -o-transform: rotate3d(-1, 1, 0, 0deg);
        transform: rotate3d(-1, 1, 0, 0deg);
    }

    25% {
        -webkit-transform: rotate3d(-1, 1, 0, 30deg);
        -ms-transform: rotate3d(-1, 1, 0, 30deg);
        -o-transform: rotate3d(-1, 1, 0, 30deg);
        transform: rotate3d(-1, 1, 0, 30deg);
    }

    50% {
        -webkit-transform: rotate3d(-1, 1, 0, 0deg);
        -ms-transform: rotate3d(-1, 1, 0, 0deg);
        -o-transform: rotate3d(-1, 1, 0, 0deg);
        transform: rotate3d(-1, 1, 0, 0deg);
    }

    75% {
        -webkit-transform: rotate3d(-1, 1, 0, -30deg);
        -ms-transform: rotate3d(-1, 1, 0, -30deg);
        -o-transform: rotate3d(-1, 1, 0, -30deg);
        transform: rotate3d(-1, 1, 0, -30deg);
    }

    100% {
        -webkit-transform: rotate3d(-1, 1, 0, 0deg);
        -ms-transform: rotate3d(-1, 1, 0, 0deg);
        -o-transform: rotate3d(-1, 1, 0, 0deg);
        transform: rotate3d(-1, 1, 0, 0deg);
    }
}

    .mud-dark-theme .reflective {
        background-color: #1a1a1a !important;
        border-color: #202020 !important
    }
        .mud-dark-theme .reflective .action button {
            background-color: #202020 !important
        }

        .mud-dark-theme .user-wallet {
            border-color: #202020 !important
        }

        .mud-dark-theme .list {
            background-color: #202020 !important
        }

    .mud-dark-theme .reflective .settings .settings-item {
        background-color: #202020 !important
    }

    .mud-dark-theme .grid-item {
        background-color: #1a1a1a !important;
    }

    .mud-dark-theme .settings-item {
        background-color: #202020 !important;
    }

    .mud-dark-theme .mud-overlay {
        background-color: rgba(0, 0, 0, .5) !important;
    }

    .mud-dark-theme .mud-tab.mud-tab-active {
        background-color: #202020 !important;
        color: white !important;
    }

body.mud-dark-theme {
    background-color: #121212 !important;
}

/* Контейнер карточек */
.invoice-cards-container {
    padding: 20px;
    animation: fadeIn 0.8s ease-out;
}

.invoice-filters {
    margin-bottom: 24px;
    padding: 16px;
    background-color: var(--mud-palette-surface);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.filters-row {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
}

.status-select {
    min-width: 200px;
}

.search-field {
    flex: 1;
}

.invoice-stats {
    margin-bottom: 20px;
    padding: 12px 16px;
    background-color: var(--mud-palette-surface);
    border-radius: 8px;
    font-size: 14px;
    color: var(--mud-palette-text-secondary);
}

/* Сетка карточек */
.invoice-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

/* Карточка заявки */
.invoice-card {
    background-color: var(--mud-palette-surface);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border-left: 4px solid #FFBD00;
    position: relative;
    overflow: hidden;
}

    .invoice-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    }

    /* Статусы карточек */
    .invoice-card.status-created {
        border-left-color: #FFBD00;
    }

    .invoice-card.status-completed {
        border-left-color: #31D057;
    }

    .invoice-card.status-dispute {
        border-left-color: #ff0044;
    }

    .invoice-card.status-canceled {
        border-left-color: #fd7f00;
    }

    .invoice-card.status-payed {
        border-left-color: #FFBD00;
    }

/* Заголовок карточки */
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--mud-palette-divider);
}

.card-id {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.status-badge {
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .status-badge.status-created {
        background-color: #FFF3CD;
        color: #856404;
    }

    .status-badge.status-completed {
        background-color: #D4EDDA;
        color: #155724;
    }

    .status-badge.status-dispute {
        background-color: #F8D7DA;
        color: #721C24;
    }

    .status-badge.status-canceled {
        background-color: #FFE5D0;
        color: #856404;
    }

    .status-badge.status-payed {
        background-color: #FFF3CD;
        color: #856404;
    }

.card-date {
    color: var(--mud-palette-text-secondary);
    font-size: 12px;
    text-align: center;
}

/* Контент карточки */
.card-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.card-field {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 8px 0;
    border-bottom: 1px dashed var(--mud-palette-divider);
}

    .card-field:last-child {
        border-bottom: none;
    }

.field-label {
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
    font-size: 13px;
    min-width: 120px;
}

.field-value {
    color: var(--mud-palette-text-primary);
    font-size: 14px;
    text-align: right;
    word-break: break-all;
}

/* Строка с суммами */
.amounts-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 2px solid var(--mud-palette-divider);
}

.amount-item {
    text-align: center;
}

.amount-label {
    font-size: 12px;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 4px;
}

.amount-value {
    font-size: 18px;
    font-weight: 700;
}

    .amount-value.rub {
        color: #4CAF50;
    }

    .amount-value.usdt {
        color: #26A17B;
    }

/* Действия */
.card-actions {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--mud-palette-divider);
    display: flex;
    justify-content: flex-end;
}

/* Пагинация */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
    padding: 20px;
}

.page-info {
    color: var(--mud-palette-text-secondary);
    font-size: 14px;
}

/* Загрузка */
.loading-container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 300px;
}

.loader {
    width: 50px;
    height: 50px;
    border: 3px solid var(--mud-palette-divider);
    border-top-color: var(--mud-palette-primary);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Нет данных */
.no-data {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 300px;
    color: var(--mud-palette-text-secondary);
}

    .no-data .mud-icon {
        font-size: 64px;
        margin-bottom: 16px;
        opacity: 0.5;
    }

    .no-data p {
        font-size: 18px;
    }

/* Темная тема */
.mud-dark-theme .invoice-filters,
.mud-dark-theme .invoice-stats {
    background-color: #1E1E1E;
    border: 1px solid #2D2D2D;
}

.mud-dark-theme .invoice-card {
    background-color: #1E1E1E;
    border: 1px solid #2D2D2D;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.mud-dark-theme .card-header,
.mud-dark-theme .card-field {
    border-color: #2D2D2D;
}

.mud-dark-theme .field-label {
    color: #B0B0B0;
}

.mud-dark-theme .status-badge.status-created {
    background-color: rgba(255, 189, 0, 0.2);
    color: #FFBD00;
}

.mud-dark-theme .status-badge.status-completed {
    background-color: rgba(49, 208, 87, 0.2);
    color: #31D057;
}

.mud-dark-theme .status-badge.status-dispute {
    background-color: rgba(255, 0, 68, 0.2);
    color: #ff0044;
}

.mud-dark-theme .status-badge.status-canceled {
    background-color: rgba(253, 127, 0, 0.2);
    color: #fd7f00;
}

/* Адаптивность */
@media (max-width: 768px) {
    .invoice-cards-grid {
        grid-template-columns: 1fr;
    }

    .filters-row {
        flex-direction: column;
        align-items: stretch;
    }

    .status-select,
    .search-field {
        width: 100%;
    }

    .card-field {
        flex-direction: column;
        gap: 4px;
    }

    .field-label {
        min-width: auto;
    }

    .field-value {
        text-align: left;
    }
}

/* Анимации */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Специфичные классы для разных типов платежей */
.card-field.payment-details {
    background-color: var(--mud-palette-background);
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 8px;
}

/* Индикатор срочности */
.urgent-indicator {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 8px;
    height: 8px;
    background-color: #ff4444;
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
    }
}

/* Withdraw Modal Styles */
.withdraw-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: modalOverlayFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    animation-fill-mode: forwards;
}

.withdraw-modal-container {
    background: #1a1a1a;
    border-radius: 24px;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
    border: 1px solid #2a2a2a;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5), 0 8px 32px rgba(0, 212, 170, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    animation: modalSlideUp 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s both;
    transform: translateY(20px);
    opacity: 0;
}

.withdraw-modal-header {
    background: linear-gradient(135deg, #222222 0%, #1a1a1a 100%);
    padding: 28px 32px;
    border-radius: 24px 24px 0 0;
    display: flex;
    align-items: center;
    gap: 16px;
    border-bottom: 1px solid #2a2a2a;
    position: relative;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.withdraw-icon {
    width: 36px;
    height: 36px;
    fill: #00d4aa;
    filter: drop-shadow(0 0 8px rgba(0, 212, 170, 0.3));
    animation: iconPulse 2s ease-in-out infinite;
}

.withdraw-modal-header h2 {
    margin: 0;
    color: #ffffff;
    font-size: 26px;
    font-weight: 700;
    flex-grow: 1;
    background: linear-gradient(135deg, #fff 0%, #a0a0a0 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.5px;
}

.close-btn {
    background: rgba(42, 42, 42, 0.8);
    border: 1px solid #333;
    color: #888;
    font-size: 28px;
    cursor: pointer;
    padding: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 300;
    line-height: 1;
}

    .close-btn:hover {
        background: #2a2a2a;
        color: #fff;
        border-color: #444;
        transform: rotate(90deg);
        box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
    }

.withdraw-modal-content {
    padding: 32px;
}

.withdraw-section {
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid #2a2a2a;
    animation: sectionFadeIn 0.5s ease-out forwards;
    opacity: 0;
    transform: translateY(10px);
}

    .withdraw-section:nth-child(1) {
        animation-delay: 0.2s;
    }

    .withdraw-section:nth-child(2) {
        animation-delay: 0.3s;
    }

    .withdraw-section:nth-child(3) {
        animation-delay: 0.4s;
    }

    .withdraw-section:nth-child(4) {
        animation-delay: 0.5s;
    }

    .withdraw-section:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .withdraw-section.summary {
        background: linear-gradient(135deg, rgba(42, 42, 42, 0.5) 0%, rgba(26, 26, 26, 0.3) 100%);
        border-radius: 16px;
        padding: 24px;
        border: 1px solid rgba(0, 212, 170, 0.1);
        box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.3);
    }

.section-label {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #888;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    margin-bottom: 20px;
    font-weight: 600;
    background: linear-gradient(135deg, #666 0%, #888 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.label-icon {
    font-size: 18px;
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Balance Selector */
.balance-selector {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.balance-option {
    background: linear-gradient(135deg, #2a2a2a 0%, #222 100%);
    border: 2px solid #333;
    border-radius: 16px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

    .balance-option::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(0, 212, 170, 0.1), transparent);
        transition: left 0.6s ease;
    }

    .balance-option:hover::before {
        left: 100%;
    }

    .balance-option:hover {
        transform: translateY(-2px);
        border-color: #00d4aa;
        box-shadow: 0 8px 24px rgba(0, 212, 170, 0.15);
    }

    .balance-option.selected {
        border-color: #00d4aa;
        background: linear-gradient(135deg, rgba(0, 212, 170, 0.1) 0%, rgba(42, 42, 42, 0.8) 100%);
        box-shadow: 0 8px 32px rgba(0, 212, 170, 0.2);
    }

.balance-icon {
    font-size: 28px;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
    border-radius: 12px;
    border: 1px solid #333;
    flex-shrink: 0;
}

.balance-option.selected .balance-icon {
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
    color: #000;
    border-color: #00d4aa;
    animation: iconBounce 0.5s ease;
}

.balance-info {
    flex-grow: 1;
}

.balance-name {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 4px;
}

.balance-amount {
    color: #00d4aa;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.5px;
}

.checkmark {
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-weight: bold;
    font-size: 14px;
    opacity: 0;
    transform: scale(0);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.balance-option.selected .checkmark {
    opacity: 1;
    transform: scale(1);
    animation: checkmarkPop 0.3s ease;
}

/* Amount Input */
.amount-input-container {
    position: relative;
    margin-bottom: 20px;
}

.amount-input {
    width: 100%;
    padding: 22px 80px 22px 24px;
    background: linear-gradient(135deg, #2a2a2a 0%, #222 100%);
    border: 2px solid #333;
    border-radius: 16px;
    color: #fff;
    font-size: 32px;
    font-weight: 700;
    transition: all 0.3s ease;
    font-family: monospace;
    letter-spacing: -1px;
}

    .amount-input:focus {
        outline: none;
        border-color: #00d4aa;
        box-shadow: 0 0 0 3px rgba(0, 212, 170, 0.1), inset 0 2px 8px rgba(0, 0, 0, 0.3);
        transform: translateY(-1px);
    }

    .amount-input::placeholder {
        color: #555;
    }

.currency-label {
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    color: #00d4aa;
    font-size: 20px;
    font-weight: 600;
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Slider */
.amount-slider {
    width: 100%;
    height: 8px;
    -webkit-appearance: none;
    appearance: none;
    background: linear-gradient(90deg, #00d4aa, #00b894);
    border-radius: 4px;
    outline: none;
    margin: 24px 0;
    cursor: pointer;
}

    .amount-slider::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 24px;
        height: 24px;
        background: linear-gradient(135deg, #fff 0%, #00d4aa 100%);
        border-radius: 50%;
        border: 2px solid #1a1a1a;
        box-shadow: 0 4px 12px rgba(0, 212, 170, 0.5);
        cursor: pointer;
        transition: all 0.2s ease;
    }

        .amount-slider::-webkit-slider-thumb:hover {
            transform: scale(1.2);
            box-shadow: 0 6px 20px rgba(0, 212, 170, 0.7);
        }

    .amount-slider::-moz-range-thumb {
        width: 24px;
        height: 24px;
        background: linear-gradient(135deg, #fff 0%, #00d4aa 100%);
        border-radius: 50%;
        border: 2px solid #1a1a1a;
        box-shadow: 0 4px 12px rgba(0, 212, 170, 0.5);
        cursor: pointer;
    }

.amount-hint {
    color: #888;
    font-size: 14px;
    text-align: center;
    padding: 8px;
    background: rgba(42, 42, 42, 0.5);
    border-radius: 8px;
    border: 1px solid #333;
}

/* Method Selector */
.method-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
}

.method-option {
    flex: 1;
    min-width: 120px;
    background: linear-gradient(135deg, #2a2a2a 0%, #222 100%);
    border: 2px solid #333;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .method-option:hover {
        transform: translateY(-2px);
        border-color: #00d4aa;
        box-shadow: 0 8px 24px rgba(0, 212, 170, 0.1);
    }

    .method-option.selected {
        border-color: #00d4aa;
        background: linear-gradient(135deg, rgba(0, 212, 170, 0.1) 0%, rgba(42, 42, 42, 0.8) 100%);
        box-shadow: 0 8px 32px rgba(0, 212, 170, 0.2);
    }

.method-icon {
    font-size: 32px;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
    border-radius: 50%;
    border: 2px solid #333;
}

.method-option.selected .method-icon {
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
    border-color: #00d4aa;
    animation: iconSpin 0.6s ease;
}

.method-name {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
}

/* Wallet Input */
.wallet-input-container {
    margin-top: 20px;
}

    .wallet-input-container label {
        display: block;
        color: #888;
        font-size: 13px;
        margin-bottom: 8px;
        font-weight: 600;
    }

.wallet-input {
    width: 100%;
    padding: 18px 20px;
    background: linear-gradient(135deg, #2a2a2a 0%, #222 100%);
    border: 2px solid #333;
    border-radius: 16px;
    color: #fff;
    font-size: 16px;
    font-family: monospace;
    transition: all 0.3s ease;
}

    .wallet-input:focus {
        outline: none;
        border-color: #00d4aa;
        box-shadow: 0 0 0 3px rgba(0, 212, 170, 0.1);
        transform: translateY(-1px);
    }

    .wallet-input::placeholder {
        color: #555;
    }

/* Summary */
.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    animation: rowSlideIn 0.4s ease-out forwards;
    opacity: 0;
    transform: translateX(-10px);
}

    .summary-row:nth-child(1) {
        animation-delay: 0.1s;
    }

    .summary-row:nth-child(2) {
        animation-delay: 0.2s;
    }

    .summary-row:nth-child(3) {
        animation-delay: 0.3s;
    }

    .summary-row:last-child {
        border-bottom: none;
    }

    .summary-row span:first-child {
        color: #aaa;
        font-size: 15px;
    }

.summary-value {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}

.summary-row.total .summary-value {
    color: #00d4aa;
    font-size: 24px;
    font-weight: 700;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.3);
}

.success-check {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
    padding: 16px;
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.1) 0%, rgba(0, 184, 148, 0.05) 100%);
    border: 1px solid rgba(0, 212, 170, 0.2);
    border-radius: 12px;
    color: #00d4aa;
    font-size: 15px;
    font-weight: 600;
    animation: successPulse 2s ease-in-out infinite;
}

.mud-snackbar-location-top-center {
    z-index: 99999;
}

.success-check span {
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-weight: bold;
    font-size: 14px;
    animation: checkmarkSpin 1s ease;
}

/* Actions */
.withdraw-modal-actions {
    display: flex;
    gap: 16px;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #2a2a2a;
}

.action-btn {
    flex: 1;
    padding: 9px;
    border: none;
    border-radius: 16px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-transform: uppercase;
    letter-spacing: 1px;
}

    .action-btn.secondary {
        background: linear-gradient(135deg, #2a2a2a 0%, #222 100%);
        color: #aaa;
        border: 2px solid #333;
    }

        .action-btn.secondary:hover {
            background: linear-gradient(135deg, #333 0%, #2a2a2a 100%);
            color: #fff;
            border-color: #444;
            transform: translateY(-2px);
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
        }

    .action-btn.primary {
        background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%);
        color: #000;
        border: 2px solid transparent;
        font-weight: 700;
        position: relative;
        overflow: hidden;
    }

        .action-btn.primary::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
            transition: left 0.6s ease;
        }

        .action-btn.primary:hover::before {
            left: 100%;
        }

        .action-btn.primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 32px rgba(0, 212, 170, 0.4), 0 4px 16px rgba(0, 212, 170, 0.3);
        }

        .action-btn.primary:active {
            transform: translateY(0);
        }

/* Animations */
@keyframes modalOverlayFadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes modalSlideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes sectionFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes rowSlideIn {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes iconPulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 8px rgba(0, 212, 170, 0.3));
    }

    50% {
        transform: scale(1.05);
        filter: drop-shadow(0 0 12px rgba(0, 212, 170, 0.5));
    }
}

@keyframes iconBounce {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }
}

@keyframes iconSpin {
    from {
        transform: rotate(0deg) scale(0.5);
        opacity: 0;
    }

    to {
        transform: rotate(360deg) scale(1);
        opacity: 1;
    }
}

@keyframes checkmarkPop {
    0% {
        transform: scale(0) rotate(-180deg);
        opacity: 0;
    }

    70% {
        transform: scale(1.2) rotate(10deg);
    }

    100% {
        transform: scale(1) rotate(0);
        opacity: 1;
    }
}

.withdraw-modal-container::-webkit-scrollbar {
    display: none;
}

@keyframes checkmarkSpin {
    from {
        transform: rotate(-180deg) scale(0);
    }

    to {
        transform: rotate(0) scale(1);
    }
}

@keyframes successPulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(0, 212, 170, 0.1);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(0, 212, 170, 0);
    }
}

/* Темная тема для страниц вывода */
.withdraw-page,
.withdraw-history-page {
    padding: 24px;
    max-width: 1200px;
    margin-top: -50px;
    color: #000;
}

.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
}

    .page-header h2 {
        margin: 0;
        font-size: 28px;
        font-weight: 600;
        color: #000;
    }

/* Карточки статистики */
.stats-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 32px;
}

.stat-card {
    background: #1E1E1E;
    border: 1px solid #2D2D2D;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    gap: 20px;
}

.stat-icon {
    font-size: 48px;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #2196F3 0%, #0D47A1 100%);
    color: white;
}

.stat-card.balance .stat-icon {
    background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);
}

.stat-card.min .stat-icon {
    background: linear-gradient(135deg, #FF9800 0%, #F57C00 100%);
}

.stat-card.total .stat-icon {
    background: linear-gradient(135deg, #9C27B0 0%, #6A1B9A 100%);
}

.stat-content {
    flex: 1;
}

.stat-label {
    font-size: 14px;
    color: #B0B0B0;
    margin-bottom: 8px;
}

.stat-value {
    font-size: 28px;
    font-weight: 700;
    color: #ffffff;
}

/* Форма вывода */
.withdraw-form-container {
    max-width: 600px;
    margin: 0 auto;
}

.form-card {
    background: #1E1E1E;
    border: 1px solid #2D2D2D;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

    .form-card h3 {
        margin: 0 0 24px 0;
        font-size: 22px;
        font-weight: 600;
        color: #ffffff;
    }

.history-link {
    text-align: center;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #2D2D2D;
}

/* История выводов */
.filters-row {
    margin-bottom: 24px;
}

.status-filter {
    width: 250px;
}

.withdraw-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.withdraw-item {
    background: #f1f1f1;
    border: 1px solid #fafafa;
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #FF9800;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

    .withdraw-item:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    .withdraw-item.status-completed {
        border-left-color: #4CAF50;
    }

    .withdraw-item.status-rejected {
        border-left-color: #F44336;
    }

    .withdraw-item.status-canceled {
        border-left-color: #757575;
    }

    .withdraw-item.status-processing {
        border-left-color: #2196F3;
    }

.item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #fafafa;
}

.item-id {
    font-weight: 600;
    color: #000;
}

.status-badge {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .status-badge.status-pending {
        background-color: rgba(255, 193, 7, 0.2);
        color: #FFC107;
        border: 1px solid rgba(255, 193, 7, 0.3);
    }

    .status-badge.status-processing {
        background-color: rgba(33, 150, 243, 0.2);
        color: #2196F3;
        border: 1px solid rgba(33, 150, 243, 0.3);
    }

    .status-badge.status-completed {
        background-color: rgba(76, 175, 80, 0.2);
        color: #4CAF50;
        border: 1px solid rgba(76, 175, 80, 0.3);
    }

    .status-badge.status-rejected {
        background-color: rgba(244, 67, 54, 0.2);
        color: #F44336;
        border: 1px solid rgba(244, 67, 54, 0.3);
    }

    .status-badge.status-canceled {
        background-color: rgba(158, 158, 158, 0.2);
        color: #9E9E9E;
        border: 1px solid rgba(158, 158, 158, 0.3);
    }

.item-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.user-item[b-5to019l9nm] {
    background: #f1f1f1;
    transition: all .22s;
}

.item-content .item-row {
    display: grid;
    grid-template-columns: 150px 1fr;
    align-items: start;
}

.item-label {
    font-weight: 600;
    color: #B0B0B0;
    font-size: 14px;
}

.item-value {
    color: #000;
    word-break: break-all;
}

.transaction-link {
    color: #2196F3;
    text-decoration: none;
    transition: color 0.2s ease;
}

    .transaction-link:hover {
        color: #64B5F6;
        text-decoration: underline;
    }

.item-actions {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #2D2D2D;
    display: flex;
    justify-content: flex-end;
}

/* Загрузка и пустые состояния */
.loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    gap: 16px;
}

.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
    text-align: center;
}

    .empty-state h3 {
        margin: 0;
        color: #000;
    }

    .empty-state p {
        margin: 0;
        color: #B0B0B0;
    }

    .empty-state .mud-icon {
        color: #666666;
        font-size: 64px;
    }

/* Пагинация */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    margin-top: 32px;
    padding: 24px;
}

.page-info {
    color: #B0B0B0;
    font-size: 14px;
}


/* Адаптивность */
@media (max-width: 768px) {
    .stats-cards {
        grid-template-columns: 1fr;
    }

    .item-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .withdraw-page,
    .withdraw-history-page {
        padding: 16px;
    }

    .form-card {
        padding: 20px;
    }

    .page-header {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
    }

    .status-filter {
        width: 100%;
    }
}

/* Иконки внутри селектов */
.withdraw-page .mud-select-item .mud-icon,
.withdraw-history-page .mud-select-item .mud-icon {
    margin-right: 8px;
    color: #B0B0B0;
}

/* Ховер на элементах списка */
.withdraw-page .mud-select-item:hover,
.withdraw-history-page .mud-select-item:hover {
    background-color: rgba(33, 150, 243, 0.1) !important;
}

/* Скроллбар (Webkit) */
.withdraw-list::-webkit-scrollbar {
    width: 8px;
}

.withdraw-list::-webkit-scrollbar-track {
    background: #1E1E1E;
    border-radius: 4px;
}

.withdraw-list::-webkit-scrollbar-thumb {
    background: #2D2D2D;
    border-radius: 4px;
}

    .withdraw-list::-webkit-scrollbar-thumb:hover {
        background: #2196F3;
    }

/* Тултипы для полей */
.field-value[title] {
    cursor: help;
    border-bottom: 1px dotted var(--mud-palette-divider);
}

/* Темная тема для страниц вывода */
.mud-dark-theme .withdraw-page,
.mud-dark-theme .withdraw-history-page {
    padding: 24px;
    max-width: 1200px;
    color: #ffffff;
}

.mud-dark-theme .page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
}

    .mud-dark-theme .page-header h2 {
        margin: 0;
        font-size: 28px;
        font-weight: 600;
        color: #ffffff;
    }

/* Карточки статистики */
.mud-dark-theme .stats-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 32px;
}

.mud-dark-theme .stat-card {
    background: #1E1E1E;
    border: 1px solid #2D2D2D;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    gap: 20px;
}

.mud-dark-theme .stat-icon {
    font-size: 48px;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #2196F3 0%, #0D47A1 100%);
    color: white;
}

.mud-dark-theme .stat-card.balance .stat-icon {
    background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);
}

.mud-dark-theme .stat-card.min .stat-icon {
    background: linear-gradient(135deg, #FF9800 0%, #F57C00 100%);
}

.mud-dark-theme .stat-card.total .stat-icon {
    background: linear-gradient(135deg, #9C27B0 0%, #6A1B9A 100%);
}

.mud-dark-theme .stat-content {
    flex: 1;
}

.mud-dark-theme .stat-label {
    font-size: 14px;
    color: #B0B0B0;
    margin-bottom: 8px;
}

.mud-dark-theme .stat-value {
    font-size: 28px;
    font-weight: 700;
    color: #ffffff;
}

/* Форма вывода */
.mud-dark-theme .withdraw-form-container {
    max-width: 600px;
    margin: 0 auto;
}

.mud-dark-theme .form-card {
    background: #1E1E1E;
    border: 1px solid #2D2D2D;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

    .mud-dark-theme .form-card h3 {
        margin: 0 0 24px 0;
        font-size: 22px;
        font-weight: 600;
        color: #ffffff;
    }

.mud-dark-theme .history-link {
    text-align: center;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #2D2D2D;
}

/* История выводов */
.mud-dark-theme .filters-row {
    margin-bottom: 24px;
}

.mud-dark-theme .status-filter {
    width: 250px;
}

.mud-dark-theme .withdraw-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.mud-dark-theme .withdraw-item {
    background: #1E1E1E;
    border: 1px solid #2D2D2D;
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #FF9800;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

    .mud-dark-theme .withdraw-item:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    .mud-dark-theme .withdraw-item.status-completed {
        border-left-color: #4CAF50;
    }

    .mud-dark-theme .withdraw-item.status-rejected {
        border-left-color: #F44336;
    }

    .mud-dark-theme .withdraw-item.status-canceled {
        border-left-color: #757575;
    }

    .mud-dark-theme .withdraw-item.status-processing {
        border-left-color: #2196F3;
    }

.mud-dark-theme .item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #2D2D2D;
}

.mud-dark-theme .item-id {
    font-weight: 600;
    color: #ffffff;
}

.mud-dark-theme .status-badge {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .mud-dark-theme .status-badge.status-pending {
        background-color: rgba(255, 193, 7, 0.2);
        color: #FFC107;
        border: 1px solid rgba(255, 193, 7, 0.3);
    }

    .mud-dark-theme .status-badge.status-processing {
        background-color: rgba(33, 150, 243, 0.2);
        color: #2196F3;
        border: 1px solid rgba(33, 150, 243, 0.3);
    }

    .mud-dark-theme .status-badge.status-completed {
        background-color: rgba(76, 175, 80, 0.2);
        color: #4CAF50;
        border: 1px solid rgba(76, 175, 80, 0.3);
    }

    .mud-dark-theme .status-badge.status-rejected {
        background-color: rgba(244, 67, 54, 0.2);
        color: #F44336;
        border: 1px solid rgba(244, 67, 54, 0.3);
    }

    .mud-dark-theme .status-badge.status-canceled {
        background-color: rgba(158, 158, 158, 0.2);
        color: #9E9E9E;
        border: 1px solid rgba(158, 158, 158, 0.3);
    }

.mud-dark-theme .item-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .mud-dark-theme .item-content .item-row {
        display: grid;
        grid-template-columns: 150px 1fr;
        align-items: start;
    }

.mud-dark-theme .item-label {
    font-weight: 600;
    color: #B0B0B0;
    font-size: 14px;
}

.mud-dark-theme .item-value {
    color: #ffffff;
    word-break: break-all;
}

.mud-dark-theme .transaction-link {
    color: #2196F3;
    text-decoration: none;
    transition: color 0.2s ease;
}

    .mud-dark-theme .transaction-link:hover {
        color: #64B5F6;
        text-decoration: underline;
    }

.mud-dark-theme .item-actions {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #2D2D2D;
    display: flex;
    justify-content: flex-end;
}

/* Загрузка и пустые состояния */
.mud-dark-theme .loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    gap: 16px;
}

.mud-dark-theme .empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
    text-align: center;
}

    .mud-dark-theme .empty-state h3 {
        margin: 0;
        color: #ffffff;
    }

    .mud-dark-theme .empty-state p {
        margin: 0;
        color: #B0B0B0;
    }

    .mud-dark-theme .empty-state .mud-icon {
        color: #666666;
        font-size: 64px;
    }

/* Пагинация */
.mud-dark-theme .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    margin-top: 32px;
    padding: 24px;
}

.mud-dark-theme .page-info {
    color: #B0B0B0;
    font-size: 14px;
}


/* Адаптивность */
@media (max-width: 768px) {
    .stats-cards {
        grid-template-columns: 1fr;
    }

    .item-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .withdraw-page,
    .withdraw-history-page {
        padding: 16px;
    }

    .form-card {
        padding: 20px;
    }

    .page-header {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
    }

    .status-filter {
        width: 100%;
    }
}

/* Иконки внутри селектов */
.mud-dark-theme .withdraw-page .mud-select-item .mud-icon,
.withdraw-history-page .mud-select-item .mud-icon {
    margin-right: 8px;
    color: #B0B0B0;
}

/* Ховер на элементах списка */
.mud-dark-theme .withdraw-page .mud-select-item:hover,
.withdraw-history-page .mud-select-item:hover {
    background-color: rgba(33, 150, 243, 0.1) !important;
}

/* Скроллбар (Webkit) */
.mud-dark-theme .withdraw-list::-webkit-scrollbar {
    width: 8px;
}

.mud-dark-theme .withdraw-list::-webkit-scrollbar-track {
    background: #1E1E1E;
    border-radius: 4px;
}

.mud-dark-theme .withdraw-list::-webkit-scrollbar-thumb {
    background: #2D2D2D;
    border-radius: 4px;
}

    .mud-dark-theme .withdraw-list::-webkit-scrollbar-thumb:hover {
        background: #2196F3;
    }


.finance-stats {
    --fs-bg: #fafafa5c;
    --fs-text: #1e293b;
    --fs-text-secondary: #1e293b;
    --fs-border: #80808038;
    --fs-hover: #f8fafc;
    --fs-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --fs-item-top-bg: transparent;
    --fs-item-bottom-bg: transparent;
    --fs-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    background: var(--fs-bg);
    color: var(--fs-text);
    border-radius: 1rem;
    box-shadow: var(--fs-shadow);
    overflow: hidden;
    transition: var(--fs-transition);
}

/* Темная тема через mud-theme */
.mud-dark-theme .finance-stats {
    --fs-bg: #1a1a1a;
    --fs-text: #f1f5f9;
    --fs-text-secondary: #94a3b8;
    --fs-border: #334155;
    --fs-hover: #2d3a4f;
    --fs-item-top-bg: #2d3a4f;
    --fs-item-bottom-bg: transparent;
}

/* Варианты */
.finance-stats--filled {
    background: var(--fs-bg);
}

.finance-stats--outlined {
    border: 1px solid var(--fs-border);
    box-shadow: none;
}

.mud-dark-theme .finance-stats--outlined {
    border-color: var(--fs-border);
}

.finance-stats--ghost {
    background: transparent;
    box-shadow: none;
}

.finance-stats--dense {
    font-size: 0.875rem;
}

    .finance-stats--dense .finance-stats__header {
        padding: 1rem 1.25rem;
    }

    .finance-stats--dense .finance-stats__item {
        padding: 0.625rem 1.25rem;
    }

.finance-stats--borderless {
    border: none;
    box-shadow: none;
}

/* Header */
.finance-stats__header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--fs-border);
    transition: var(--fs-transition);
}

.finance-stats__header-icon {
    color: var(--fs-text-secondary);
    font-size: 1.25rem;
    transition: var(--fs-transition);
}

.finance-stats__title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: var(--fs-text);
    letter-spacing: 0.025em;
    text-transform: uppercase;
    transition: var(--fs-transition);
}

/* Content */
.finance-stats__content {
    display: flex;
    flex-direction: column;
}

/* Sections */
.finance-stats__section {
    display: flex;
    flex-direction: column;
}

.finance-stats__section--top {
    background: var(--fs-item-top-bg);
    transition: var(--fs-transition);
}

.finance-stats__section--bottom {
    background: var(--fs-item-bottom-bg);
    transition: var(--fs-transition);
}

/* Items */
.finance-stats__item {
    display: flex;
    align-items: center;
    padding: 0.875rem 1.5rem;
    cursor: default;
    transition: var(--fs-transition);
    border-bottom: 1px solid var(--fs-border);
}

    .finance-stats__item:last-child {
        border-bottom: none;
    }

    .finance-stats__item[role="button"] {
        cursor: pointer;
    }

        .finance-stats__item[role="button"]:hover {
            background: var(--fs-hover);
        }

.mud-dark-theme .finance-stats__item[role="button"]:hover {
    background: rgba(255, 255, 255, 0.05);
}

.finance-stats__item--top {
    font-weight: 500;
}

.finance-stats__item--bottom {
    color: var(--fs-text-secondary);
}

/* Item content */
.finance-stats__item-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 1rem;
}

/* Left section */
.finance-stats__item-left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.finance-stats__item-icon {
    color: var(--fs-text-secondary);
    font-size: 1.125rem;
    flex-shrink: 0;
    transition: var(--fs-transition);
}

.finance-stats__item--top .finance-stats__item-icon {
    color: var(--fs-text);
}

.finance-stats__item-header {
    font-size: inherit;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: var(--fs-transition);
}

/* Right section */
.finance-stats__item-right {
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
    flex-shrink: 0;
}

.finance-stats__item-value {
    font-weight: 600;
    font-size: 1.125rem;
    transition: var(--fs-transition);
}

.finance-stats--dense .finance-stats__item-value {
    font-size: 1rem;
}

.finance-stats__item-prefix {
    font-size: 0.75rem;
    color: var(--fs-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    transition: var(--fs-transition);
}

/* Анимации при загрузке */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.finance-stats__item {
    animation: slideIn 0.3s ease forwards;
}

    .finance-stats__item:nth-child(1) {
        animation-delay: 0.05s;
    }

    .finance-stats__item:nth-child(2) {
        animation-delay: 0.1s;
    }

    .finance-stats__item:nth-child(3) {
        animation-delay: 0.15s;
    }

    .finance-stats__item:nth-child(4) {
        animation-delay: 0.2s;
    }

    .finance-stats__item:nth-child(5) {
        animation-delay: 0.25s;
    }

    .finance-stats__item:nth-child(6) {
        animation-delay: 0.3s;
    }

    .finance-stats__item:nth-child(7) {
        animation-delay: 0.35s;
    }

    .finance-stats__item:nth-child(8) {
        animation-delay: 0.4s;
    }

/* Градиент для топ секции в темной теме */
.mud-dark-theme .finance-stats__section--top {
    background: #1a1a1a;
}

/* Эффект стекла для outlined варианта в темной теме */
.mud-dark-theme .finance-stats--outlined {
    backdrop-filter: blur(10px);
    background: #1a1a1a;
}

.reflective {
    --reflective-bg: #ffffff;
    --reflective-surface: #f8fafc;
    --reflective-surface-hover: #f1f5f9;
    --reflective-text: #1e293b;
    --reflective-text-secondary: #64748b;
    --reflective-text-muted: #94a3b8;
    --reflective-border: #e2e8f0;
    --reflective-border-light: #f1f5f9;
    --reflective-primary: #6366f1;
    --reflective-primary-hover: #4f46e5;
    --reflective-success: #10b981;
    --reflective-warning: #f59e0b;
    --reflective-error: #ef4444;
    --reflective-info: #3b82f6;
    --reflective-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --reflective-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --reflective-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    background: var(--reflective-bg);
    color: var(--reflective-text);
    border-radius: 1rem;
    box-shadow: var(--reflective-shadow);
    overflow: hidden;
    transition: var(--reflective-transition);
}

/* Темная тема - фон #1a1a1a */
.mud-dark-theme .reflective,
:root.dark .reflective {
    --reflective-bg: #1a1a1a;
    --reflective-surface: #2d2d2d;
    --reflective-surface-hover: #3d3d3d;
    --reflective-text: #e5e7eb;
    --reflective-text-secondary: #9ca3af;
    --reflective-text-muted: #6b7280;
    --reflective-border: #404040;
    --reflective-border-light: #2d2d2d;
    --reflective-primary: #818cf8;
    --reflective-primary-hover: #6366f1;
    --reflective-success: #34d399;
    --reflective-warning: #fbbf24;
    --reflective-error: #f87171;
    --reflective-info: #60a5fa;
    --reflective-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.2);
}

/* Header */
.reflective__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--reflective-border);
    background: var(--reflective-surface);
    transition: var(--reflective-transition);
}

.reflective__header-left {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.reflective__title {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
    color: var(--reflective-text);
    letter-spacing: 0.025em;
}

.reflective__copy-btn {
    color: var(--reflective-text-secondary);
    transition: var(--reflective-transition);
}

    .reflective__copy-btn:hover {
        color: var(--reflective-primary);
        background: transparent;
    }

/* Status */
.reflective__status {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.reflective__status-label {
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    transition: var(--reflective-transition);
}

    .reflective__status-label.active {
        background: rgba(16, 185, 129, 0.1);
        color: var(--reflective-success);
    }

.mud-dark-theme .reflective__status-label.active {
    background: rgba(52, 211, 153, 0.2);
}

.reflective__status-label.inactive {
    background: rgba(239, 68, 68, 0.1);
    color: var(--reflective-error);
}

.mud-dark-theme .reflective__status-label.inactive {
    background: rgba(248, 113, 113, 0.2);
}

.reflective__status-indicator {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    transition: var(--reflective-transition);
}

    .reflective__status-indicator.active {
        background: var(--reflective-success);
        box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
    }

    .reflective__status-indicator.inactive {
        background: var(--reflective-error);
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2);
    }

/* Sections */
.reflective__section {
    padding: 1.5rem;
    border-bottom: 1px solid var(--reflective-border);
    transition: var(--reflective-transition);
}

    .reflective__section:last-child {
        border-bottom: none;
    }

.reflective__section--important {
    background: var(--reflective-surface);
}

.reflective__section--info {
    background: var(--reflective-bg);
}

.reflective__section--settings {
    background: var(--reflective-surface);
}

.reflective__section--connected {
    background: var(--reflective-bg);
}

.reflective__section--editable {
    background: var(--reflective-surface);
}

.reflective__section-header {
    margin-bottom: 1.25rem;
}

.reflective__section-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--reflective-text);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Grid layouts */
.reflective__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.reflective__grid-item {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem;
    background: var(--reflective-bg);
    border-radius: 0.75rem;
    border: 1px solid var(--reflective-border-light);
    transition: var(--reflective-transition);
}

    .reflective__grid-item:hover {
        border-color: var(--reflective-primary);
        transform: translateY(-2px);
        box-shadow: var(--reflective-shadow-sm);
    }

.reflective__grid-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--reflective-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.reflective__grid-value-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.reflective__grid-value {
    font-size: 1rem;
    font-weight: 600;
    color: var(--reflective-text);
    word-break: break-word;
}

.reflective__grid-copy {
    color: var(--reflective-text-secondary);
    transition: var(--reflective-transition);
}

    .reflective__grid-copy:hover {
        color: var(--reflective-primary);
    }

/* Info grid */
.reflective__info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 1rem;
}

.reflective__info-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.5rem;
    border-radius: 0.5rem;
    transition: var(--reflective-transition);
}

    .reflective__info-item:hover {
        background: var(--reflective-surface-hover);
    }

.reflective__info-label {
    font-size: 0.75rem;
    color: var(--reflective-text-secondary);
}

.reflective__info-value {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--reflective-text);
}

/* Connected users */
.reflective__connected-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.reflective__connected-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.reflective__connected-group-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--reflective-text);
}

.reflective__connected-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.reflective__connected-badge {
    padding: 0.25rem 0.75rem;
    background: var(--reflective-primary);
    color: white;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 9999px;
    transition: var(--reflective-transition);
}

    .reflective__connected-badge:hover {
        transform: scale(1.05);
        filter: brightness(1.1);
    }

.reflective__empty-state {
    padding: 2rem;
    text-align: center;
    color: var(--reflective-text-secondary);
    font-style: italic;
    background: var(--reflective-surface-hover);
    border-radius: 0.75rem;
}

/* Settings cards */
.reflective__settings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}

.reflective__settings-card {
    background: var(--reflective-bg);
    border-radius: 0.75rem;
    border: 1px solid var(--reflective-border);
    overflow: hidden;
    transition: var(--reflective-transition);
}

    .reflective__settings-card:hover {
        border-color: var(--reflective-primary);
        box-shadow: var(--reflective-shadow-sm);
    }

.reflective__settings-card-header {
    padding: 0.75rem 1rem;
    background: var(--reflective-surface);
    border-bottom: 1px solid var(--reflective-border);
}

.reflective__settings-card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--reflective-text);
    margin: 0;
}

.reflective__settings-card-content {
    padding: 1rem;
}

.reflective__settings-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--reflective-border-light);
}

    .reflective__settings-item:last-child {
        border-bottom: none;
    }

.reflective__settings-item-label {
    font-size: 0.875rem;
    color: var(--reflective-text-secondary);
}

.reflective__settings-item-value {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--reflective-text);
}

.reflective__settings-badge {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 0.375rem;
}

    .reflective__settings-badge.active {
        background: rgba(16, 185, 129, 0.1);
        color: var(--reflective-success);
    }

    .reflective__settings-badge.inactive {
        background: rgba(239, 68, 68, 0.1);
        color: var(--reflective-error);
    }

.reflective__settings-switch {
    margin: 0;
}

.reflective__settings-card-footer {
    padding: 1rem;
    background: var(--reflective-surface);
    border-top: 1px solid var(--reflective-border);
}

/* Editable section */
.reflective__editable-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.reflective__editable-item {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.reflective__editable-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--reflective-text);
}

/* Actions */
.reflective__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    background: var(--reflective-surface);
    border-top: 1px solid var(--reflective-border);
}

.reflective__action-btn {
    flex: 1;
    max-width: 200px;
}

/* Modal content */
.reflective__modal-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0.5rem 0;
    max-height: 70vh;
    overflow-y: auto;
}

.reflective__modal-field {
    width: 100%;
}

.reflective__partner-info {
    margin-top: 0.5rem;
    padding: 0.5rem;
    font-size: 0.875rem;
    color: var(--reflective-success);
    background: rgba(16, 185, 129, 0.1);
    border-radius: 0.375rem;
}

/* Scrollbar */
.reflective__modal-content::-webkit-scrollbar {
    width: 4px;
}

.reflective__modal-content::-webkit-scrollbar-track {
    background: var(--reflective-border-light);
}

.reflective__modal-content::-webkit-scrollbar-thumb {
    background: var(--reflective-text-muted);
    border-radius: 4px;
}

    .reflective__modal-content::-webkit-scrollbar-thumb:hover {
        background: var(--reflective-text-secondary);
    }

/* Responsive */
@media (max-width: 640px) {
    .reflective__header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .reflective__grid {
        grid-template-columns: 1fr;
    }

    .reflective__info-grid {
        grid-template-columns: 1fr;
    }

    .reflective__settings-grid {
        grid-template-columns: 1fr;
    }

    .reflective__actions {
        flex-direction: column;
    }

    .reflective__action-btn {
        max-width: none;
        width: 100%;
    }
}

/* Animations */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.reflective__section {
    animation: slideIn 0.3s ease forwards;
}

    .reflective__section:nth-child(1) {
        animation-delay: 0.05s;
    }

    .reflective__section:nth-child(2) {
        animation-delay: 0.1s;
    }

    .reflective__section:nth-child(3) {
        animation-delay: 0.15s;
    }

    .reflective__section:nth-child(4) {
        animation-delay: 0.2s;
    }

    .reflective__section:nth-child(5) {
        animation-delay: 0.25s;
    }

/* Glass effect for dark theme */
.mud-dark-theme .reflective__settings-card {
    background: rgba(26, 26, 26, 0.8);
    backdrop-filter: blur(10px);
}

/* Hover effects */
.reflective__settings-card {
    position: relative;
    overflow: hidden;
}

    .reflective__settings-card::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(45deg, transparent, rgba(99, 102, 241, 0.1), transparent);
        transform: translateX(-100%);
        transition: transform 0.6s;
    }

    .reflective__settings-card:hover::after {
        transform: translateX(100%);
    }

/* Status pulse animation */
.reflective__status-indicator.active {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(16, 185, 129, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
    }
}

/* Кастомный скролл */
.finance-stats__content {
    max-height: 100%;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--fs-border) transparent;
}

    .finance-stats__content::-webkit-scrollbar {
        width: 4px;
    }

    .finance-stats__content::-webkit-scrollbar-track {
        background: transparent;
    }

    .finance-stats__content::-webkit-scrollbar-thumb {
        background: var(--fs-border);
        border-radius: 4px;
    }

        .finance-stats__content::-webkit-scrollbar-thumb:hover {
            background: var(--fs-text-secondary);
        }

/* Адаптивность */
@media (max-width: 640px) {
    .finance-stats__header {
        padding: 1rem 1.25rem;
    }

    .finance-stats__item {
        padding: 0.75rem 1.25rem;
    }

    .finance-stats__item-value {
        font-size: 1rem;
    }

    .finance-stats--dense .finance-stats__item {
        padding: 0.5rem 1.25rem;
    }
}

/* Hover эффекты для интерактивных элементов */
.finance-stats__item[role="button"]:active {
    transform: scale(0.98);
}

/* Специальные стили для разных типов данных */
.finance-stats__item-value.positive {
    color: #10b981;
}

.finance-stats__item-value.negative {
    color: #ef4444;
}

.mud-dark-theme .finance-stats__item-value.positive {
    color: #34d399;
}

.mud-dark-theme .finance-stats__item-value.negative {
    color: #f87171;
}

/* Разделитель между секциями */
.finance-stats__section--top + .finance-stats__section--bottom {
    border-top: 2px solid var(--fs-border);
    margin-top: 0.5rem;
    padding-top: 0.5rem;
}

/* Эффект пульсации при клике */
.finance-stats__item[role="button"]:focus-visible {
    outline: 2px solid var(--fs-text-secondary);
    outline-offset: -2px;
}

.finance-card {
    transition: all 0.2s ease;
}

    .finance-card:hover {
        transform: translateY(-2px);
    }

.profit-card {
    --fs-gradient: linear-gradient(145deg, #2d3a4f 0%, #253241 100%);
}

.profit-net-card {
    border-left: 4px solid #10b981;
}

.invoices-card {
    opacity: 0.9;
}

.success-card {
    border-left: 4px solid #3b82f6;
}

.payout-card {
    border-left: 4px solid #8b5cf6;
}

.partner-card {
    background: linear-gradient(145deg, #f8fafc 0%, #f1f5f9 100%);
}

.mud-dark-theme .partner-card {
    background: linear-gradient(145deg, #2d3a4f 0%, #1e293b 100%);
}

.global-card {
    border: 2px solid var(--fs-border);
}

.cost-card {
    border-left: 4px solid #ef4444;
}

.platform-profit-card {
    border-left: 4px solid #f59e0b;
}

.details-card {
    background: transparent;
}

/* Минимальная высота для пустого состояния */
.finance-stats:empty::before {
    content: "No data available";
    display: block;
    padding: 2rem;
    text-align: center;
    color: var(--fs-text-secondary);
    font-style: italic;
}

/* Users.razor.css */
.users {
    padding: 20px !important;
    margin: 0 auto !important;
}

.users-header {
    display: flex !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
    align-items: center !important;
    flex-wrap: wrap !important;
}

.margin-input {
    flex: 1 !important;
    min-width: 250px !important;
}

.users-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.user-item {
    display: flex !important;
    align-items: center !important;
    padding: 16px !important;
    background-color: var(--mud-palette-surface) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    border: 1px solid transparent !important;
}

    .user-item:hover {
        transform: translateY(-2px) !important;
        box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
        border-color: var(--mud-palette-primary) !important;
    }

/* Стили для темной темы */
.mud-dark-theme .user-item {
    background-color: #1e1e1e !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3) !important;
}

    .mud-dark-theme .user-item:hover {
        background-color: #2d2d2d !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
    }

.user-info-grid {
    flex: 1 !important;
    margin-left: 16px !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 8px !important;
}

.user-info-item {
    display: flex !important;
    flex-direction: column !important;
}

.user-info-label {
    font-size: 12px !important;
    color: var(--mud-palette-text-secondary) !important;
    margin-bottom: 4px !important;
}

.mud-dark-theme .user-info-label {
    color: #aaa !important;
}

.user-info-value {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--mud-palette-text-primary) !important;
}

.mud-dark-theme .user-info-value {
    color: #fff !important;
}

/* Модальное окно */
.user-detail-dialog {
    position: relative !important;
}

.dialog-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
    z-index: 9998 !important;
    animation: fadeIn 0.2s ease !important;
}

.dialog-content {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    background-color: var(--mud-palette-surface) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    width: 90% !important;
    max-width: 600px !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    z-index: 9999 !important;
    animation: slideIn555 0.2s ease !important;
}

.mud-dark-theme .dialog-content {
    background-color: #1e1e1e !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

.dialog-header {
    padding: 20px !important;
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    position: sticky !important;
    top: 0 !important;
    background-color: var(--mud-palette-surface) !important;
    z-index: 10 !important;
    border-radius: 12px 12px 0 0 !important;
}

.mud-dark-theme .dialog-header {
    background-color: #1e1e1e !important;
    border-bottom-color: #333 !important;
}

.dialog-header h3 {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--mud-palette-text-primary) !important;
}

.mud-dark-theme .dialog-header h3 {
    color: #fff !important;
}

.close-button {
    background: none !important;
    border: none !important;
    font-size: 24px !important;
    cursor: pointer !important;
    color: var(--mud-palette-text-secondary) !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    transition: all 0.2s ease !important;
}

    .close-button:hover {
        background-color: var(--mud-palette-action-default-hover) !important;
        color: var(--mud-palette-text-primary) !important;
    }

.mud-dark-theme .close-button {
    color: #aaa !important;
}

    .mud-dark-theme .close-button:hover {
        background-color: #333 !important;
        color: #fff !important;
    }

.dialog-body {
    padding: 20px !important;
}

.info-section {
    margin-bottom: 24px !important;
}

.info-section-title {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--mud-palette-text-primary) !important;
    margin-bottom: 12px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
}

.mud-dark-theme .info-section-title {
    color: #fff !important;
    border-bottom-color: #333 !important;
}

.info-row {
    display: flex !important;
    margin-bottom: 8px !important;
    padding: 4px 0 !important;
}

.info-label {
    width: 140px !important;
    font-size: 14px !important;
    color: var(--mud-palette-text-secondary) !important;
    flex-shrink: 0 !important;
}

.mud-dark-theme .info-label {
    color: #aaa !important;
}

.info-value {
    flex: 1 !important;
    font-size: 14px !important;
    color: var(--mud-palette-text-primary) !important;
    font-weight: 500 !important;
    padding: 10px;
    border-radius: 10px;
}

.mud-dark-theme .info-value {
    color: #fff !important;
}

.info-value .badge {
    display: inline-block !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.badge-success {
    background-color: #4caf50 !important;
    color: white !important;
}

.badge-warning {
    background-color: #ff9800 !important;
    color: white !important;
}

.badge-error {
    background-color: #f44336 !important;
    color: white !important;
}

.badge-info {
    background-color: var(--mud-palette-primary) !important;
    color: white !important;
}

.mud-dark-theme .badge-info {
    background-color: var(--mud-palette-primary-darken) !important;
}

.rates-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    margin-top: 12px !important;
}

.rates-column {
    background-color: var(--mud-palette-background-gray) !important;
    padding: 12px !important;
    border-radius: 8px !important;
}

.mud-dark-theme .rates-column {
    background-color: #2d2d2d !important;
}

.rates-column h4 {
    margin: 0 0 12px 0 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--mud-palette-text-primary) !important;
}

.mud-dark-theme .rates-column h4 {
    color: #fff !important;
}

.rate-item {
    display: flex !important;
    justify-content: space-between !important;
    margin-bottom: 6px !important;
    font-size: 13px !important;
}

.rate-label {
    color: var(--mud-palette-text-secondary) !important;
}

.mud-dark-theme .rate-label {
    color: #aaa !important;
}

.rate-value {
    font-weight: 500 !important;
    color: var(--mud-palette-text-primary) !important;
}

.mud-dark-theme .rate-value {
    color: #fff !important;
}

.dialog-footer {
    padding: 20px !important;
    border-top: 1px solid var(--mud-palette-lines-default) !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    position: sticky !important;
    bottom: 0 !important;
    background-color: var(--mud-palette-surface) !important;
    border-radius: 0 0 12px 12px !important;
}

.mud-dark-theme .dialog-footer {
    background-color: #1e1e1e !important;
    border-top-color: #333 !important;
}

/* Анимации */
@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideIn555 {
    from {
        transform: translate(-50%, -60%);
        opacity: 0;
    }

    to {
        transform: translate(-50%, -50%);
        opacity: 1;
    }
}

/* Scrollbar styles */
.dialog-content::-webkit-scrollbar {
    display: none;
}

.dialog-content::-webkit-scrollbar-track {
    background: var(--mud-palette-background-gray) !important;
    border-radius: 4px !important;
}

.mud-dark-theme .dialog-content::-webkit-scrollbar-track {
    background: #2d2d2d !important;
}

.dialog-content::-webkit-scrollbar-thumb {
    background: var(--mud-palette-text-secondary) !important;
    border-radius: 4px !important;
}

.mud-dark-theme .dialog-content::-webkit-scrollbar-thumb {
    background: #666 !important;
}

.dialog-content::-webkit-scrollbar-thumb:hover {
    background: var(--mud-palette-primary) !important;
}

/* Адаптивность */
@media (max-width: 768px) {
    .user-item {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .user-info-grid {
        margin-left: 0 !important;
        margin-top: 12px !important;
        width: 100% !important;
    }

    .dialog-content {
        width: 95% !important;
        max-height: 95vh !important;
    }

    .info-row {
        flex-direction: column !important;
    }

    .info-label {
        width: 100% !important;
        margin-bottom: 4px !important;
    }

    .rates-grid {
        grid-template-columns: 1fr !important;
    }
}



/* Добавьте в ваш основной CSS файл */

/* Таблицы */
.table-container {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.data-table {
    width: 100%;
    border-collapse: collapse;
}

    .data-table th {
        background: var(--mud-palette-table-header);
        color: var(--mud-palette-text-primary);
        font-weight: 600;
        padding: 12px;
        text-align: left;
        border-bottom: 1px solid var(--mud-palette-table-lines);
    }

    .data-table td {
        padding: 12px;
        border-bottom: 1px solid var(--mud-palette-table-lines);
        color: var(--mud-palette-text-primary);
    }

/* Badges */
.badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.badge-success {
    background: #2e7d32;
    color: white;
}

.badge-error {
    background: #d32f2f;
    color: white;
}

.badge-warning {
    background: #ed6c02;
    color: white;
}

.badge-info {
    background: #1976d2;
    color: white;
}

.badge-secondary {
    background: #9c27b0;
    color: white;
}

/* Tabs */
.tabs-header {
    display: flex;
    gap: 2px;
    background: var(--mud-palette-surface);
    border-bottom: 1px solid var(--mud-palette-table-lines);
}

:root {
    /* Base colors */
    --mud-palette-black: rgba(39,44,52,1);
    --mud-palette-white: rgba(255,255,255,1);
    /* Primary */
    --mud-palette-primary: #E2552C;
    --mud-palette-primary-text: rgba(255,255,255,1);
    /* Secondary */
    --mud-palette-secondary: rgba(255,64,129,1);
    --mud-palette-secondary-text: rgba(255,255,255,1);
    /* Tertiary */
    --mud-palette-tertiary: rgba(30,200,165,1);
    --mud-palette-tertiary-text: rgba(255,255,255,1);
    /* Info */
    --mud-palette-info: rgba(33,150,243,1);
    --mud-palette-info-text: rgba(255,255,255,1);
    /* Success */
    --mud-palette-success: rgba(0,200,83,1);
    --mud-palette-success-text: rgba(255,255,255,1);
    /* Warning */
    --mud-palette-warning: rgba(255,152,0,1);
    --mud-palette-warning-text: rgba(255,255,255,1);
    /* Error */
    --mud-palette-error: rgba(244,67,54,1);
    --mud-palette-error-text: rgba(255,255,255,1);
    /* Dark */
    --mud-palette-dark: rgba(66,66,66,1);
    --mud-palette-dark-text: rgba(255,255,255,1);
    /* Text colors */
    --mud-palette-text-primary: rgba(66,66,66,1);
    --mud-palette-text-secondary: rgba(0,0,0,0.5372549019607843);
    --mud-palette-text-disabled: rgba(0,0,0,0.3764705882352941);
    /* Action colors */
    --mud-palette-action-default: rgba(0,0,0,0.5372549019607843);
    --mud-palette-action-disabled: rgba(0,0,0,0.25882352941176473);
    --mud-palette-action-disabled-background: rgba(0,0,0,0.11764705882352941);
    /* Background */
    --mud-palette-background: rgba(255,255,255,1);
    --mud-palette-background-gray: rgba(245,245,245,1);
    --mud-palette-surface: rgba(255,255,255,1);
    --mud-palette-drawer-background: rgba(255,255,255,1);
    --mud-palette-drawer-text: rgba(66,66,66,1);
    --mud-palette-drawer-icon: rgba(97,97,97,1);
    /* Appbar */
    --mud-palette-appbar-background: rgba(89,74,226,1);
    --mud-palette-appbar-text: rgba(255,255,255,1);
    /* Lines */
    --mud-palette-lines-default: rgba(0,0,0,0.11764705882352941);
    --mud-palette-lines-inputs: rgba(189,189,189,1);
    --mud-palette-table-lines: rgba(224,224,224,1);
    --mud-palette-table-striped: rgba(0,0,0,0.0196078431372549);
    --mud-palette-table-hover: rgba(0,0,0,0.0392156862745098);
    /* Dividers */
    --mud-palette-divider: rgba(224,224,224,1);
    --mud-palette-divider-light: rgba(0,0,0,0.8);
    /* Skeleton */
    --mud-palette-skeleton: rgba(0,0,0,0.10980392156862745);
    /* Primary variations */
    --mud-palette-primary-darken: rgb(62,44,221);
    --mud-palette-primary-lighten: rgb(118,106,231);
    /* Secondary variations */
    --mud-palette-secondary-darken: rgb(255,31,105);
    --mud-palette-secondary-lighten: rgb(255,102,153);
    /* Tertiary variations */
    --mud-palette-tertiary-darken: rgb(25,169,140);
    --mud-palette-tertiary-lighten: rgb(42,223,187);
    /* Info variations */
    --mud-palette-info-darken: rgb(12,128,223);
    --mud-palette-info-lighten: rgb(71,167,245);
    /* Success variations */
    --mud-palette-success-darken: rgb(0,163,68);
    --mud-palette-success-lighten: rgb(0,235,98);
    /* Warning variations */
    --mud-palette-warning-darken: rgb(214,129,0);
    --mud-palette-warning-lighten: rgb(255,167,36);
    /* Error variations */
    --mud-palette-error-darken: rgb(242,28,13);
    --mud-palette-error-lighten: rgb(246,96,85);
    /* Dark variations */
    --mud-palette-dark-darken: rgb(46,46,46);
    --mud-palette-dark-lighten: rgb(87,87,87);
    /* Opacity */
    --mud-palette-border-opacity: 1;
    --mud-palette-hover-opacity: 0.06;
    --mud-palette-ripple-opacity: 0.1;
    --mud-palette-ripple-opacity-secondary: 0.2;
    /* Grays */
    --mud-palette-gray-default: #9E9E9E;
    --mud-palette-gray-light: #BDBDBD;
    --mud-palette-gray-lighter: #E0E0E0;
    --mud-palette-gray-dark: #757575;
    --mud-palette-gray-darker: #616161;
    /* Overlays */
    --mud-palette-overlay-dark: rgba(33,33,33,0.4980392156862745);
    --mud-palette-overlay-light: rgba(255,255,255,0.4980392156862745);
}

.withdraw-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(5px);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.withdraw-modal-container {
    background: white;
    border-radius: 20px;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.mud-dark-theme .withdraw-modal-container {
    background: #1e1e1e;
    color: white;
}

.withdraw-modal-header {
    padding: 20px 24px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.mud-dark-theme .withdraw-modal-header {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

.withdraw-modal-header h2 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    flex: 1;
}

.withdraw-icon {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

.close-btn {
    background: none;
    border: none;
    font-size: 28px;
    cursor: pointer;
    color: #999;
    padding: 0 8px;
    line-height: 1;
}

    .close-btn:hover {
        color: #333;
    }

.mud-dark-theme .close-btn:hover {
    color: white;
}

.withdraw-modal-content {
    padding: 24px;
}

.withdraw-section {
    margin-bottom: 24px;
}

.section-label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: #666;
    margin-bottom: 8px;
    letter-spacing: 0.5px;
}

.mud-dark-theme .section-label {
    color: #aaa;
}

.label-icon {
    margin-right: 6px;
}

.balance-selector,
.method-selector {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.balance-option,
.method-option {
    flex: 1;
    min-width: 120px;
    padding: 16px;
    border: 2px solid #e0e0e0;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
    background: #f8f9fa;
}

.mud-dark-theme .balance-option,
.mud-dark-theme .method-option {
    border-color: #444;
    background: #2d2d2d;
}

.balance-option.selected,
.method-option.selected {
    border-color: #4caf50;
    background: #e8f5e9;
}

.mud-dark-theme .balance-option.selected,
.mud-dark-theme .method-option.selected {
    border-color: #4caf50;
    background: #1e3a2a;
}

.balance-icon,
.method-icon {
    font-size: 24px;
    margin-bottom: 8px;
}

.balance-name,
.method-name {
    font-weight: 600;
    margin-bottom: 4px;
}

.balance-amount {
    color: #4caf50;
    font-weight: 700;
}

.checkmark {
    position: absolute;
    top: 8px;
    right: 8px;
    color: #4caf50;
    font-weight: bold;
}

.amount-input-container {
    display: flex;
    align-items: center;
    gap: 8px;
}

.amount-input {
    flex: 1;
    padding: 14px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 1.1rem;
    background: #f8f9fa;
}

.mud-dark-theme .amount-input {
    border-color: #444;
    background: #2d2d2d;
    color: white;
}

.currency-label {
    font-size: 1.1rem;
    font-weight: 600;
    min-width: 40px;
}

.amount-slider {
    width: 100%;
    margin-top: 12px;
}

.amount-hint {
    font-size: 0.9rem;
    color: #666;
    margin-top: 4px;
}

.mud-dark-theme .amount-hint {
    color: #aaa;
}

.wallet-input-container {
    margin-top: 12px;
}

    .wallet-input-container label {
        display: block;
        font-size: 0.9rem;
        color: #666;
        margin-bottom: 6px;
    }

.mud-dark-theme .wallet-input-container label {
    color: #aaa;
}

.wallet-input {
    width: 100%;
    padding: 14px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 0.95rem;
    background: #f8f9fa;
}

.mud-dark-theme .wallet-input {
    border-color: #444;
    background: #2d2d2d;
    color: white;
}

.summary {
    background: #f8f9fa;
    padding: 16px;
    border-radius: 12px;
    margin-top: 24px;
}

.mud-dark-theme .summary {
    background: #2d2d2d;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    color: #666;
}

.mud-dark-theme .summary-row {
    color: #aaa;
}

.summary-row.total {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #ddd;
    color: #333;
    font-weight: 600;
}

.mud-dark-theme .summary-row.total {
    border-top-color: #444;
    color: white;
}

.summary-value.total {
    color: #4caf50;
    font-size: 1.2rem;
}

.success-check {
    margin-top: 12px;
    color: #4caf50;
    font-size: 0.9rem;
}

.withdraw-modal-actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
}

.action-btn {
    flex: 1;
    padding: 14px;
    border: none;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

    .action-btn.primary {
        background: #4caf50;
        color: white;
    }

        .action-btn.primary:hover {
            background: #45a049;
        }

    .action-btn.secondary {
        background: #f5f5f5;
        color: #666;
    }

.mud-dark-theme .action-btn.secondary {
    background: #333;
    color: white;
}

.action-btn.secondary:hover {
    background: #e0e0e0;
}

.mud-dark-theme .action-btn.secondary:hover {
    background: #444;
}

/* Стили для вложений */
.attachments-section {
    margin-top: 20px;
    padding: 10px;
    border-top: 1px solid #eee;
}

.media-filters {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

.media-filter {
    padding: 5px 15px;
    border: 1px solid #ddd;
    border-radius: 20px;
    background: white;
    cursor: pointer;
    font-size: 12px;
}

    .media-filter.active {
        background: #1976d2;
        color: white;
        border-color: #1976d2;
    }

.attachments-container {
    max-height: 300px;
    overflow-y: auto;
}

.attachment-item {
    display: flex;
    align-items: center;
    padding: 8px;
    margin-bottom: 5px;
    background: #f8f9fa;
    border-radius: 4px;
    border: 1px solid #e9ecef;
}

.attachment-icon {
    width: 30px;
    text-align: center;
    font-size: 20px;
}

.attachment-info {
    flex: 1;
    margin: 0 10px;
    min-width: 0;
}

.attachment-name {
    font-weight: 500;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.attachment-meta {
    font-size: 11px;
    color: #6c757d;
}

.attachment-actions {
    display: flex;
    gap: 5px;
}

.attachment-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 16px;
    padding: 4px 8px;
    border-radius: 4px;
    opacity: 0.7;
}

    .attachment-btn:hover {
        opacity: 1;
        background: rgba(0,0,0,0.05);
    }

    .attachment-btn.delete:hover {
        color: #dc3545;
    }

    .attachment-btn.view:hover {
        color: #1976d2;
    }

    .attachment-btn.download:hover {
        color: #28a745;
    }

.attachments-section label {
    line-height: 1.5rem;
    margin-right: 1rem;
}

.preview-image {
    max-width: 100%;
    max-height: 200px;
    object-fit: contain;
}

.video-preview-placeholder,
.file-preview-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    background: #f8f9fa;
    font-size: 24px;
    color: #6c757d;
}

.tab-button {
    padding: 10px 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--mud-palette-text-primary);
    font-size: 14px;
    transition: all 0.3s;
}

    .tab-button.active {
        border-bottom: 2px solid #1976d2;
        color: #1976d2;
        font-weight: 500;
    }

/* Filters */
.filters-container {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    padding: 16px;
    background: var(--mud-palette-surface);
    border-radius: 8px;
}

.search-box input {
    padding: 8px 12px;
    border: 1px solid var(--mud-palette-table-lines);
    border-radius: 4px;
    width: 300px;
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
}

.date-range {
    display: flex;
    gap: 8px;
    align-items: center;
}

    .date-range input {
        padding: 8px;
        border: 1px solid var(--mud-palette-table-lines);
        border-radius: 4px;
        background: var(--mud-palette-surface);
        color: var(--mud-palette-text-primary);
    }

.refresh-btn {
    padding: 8px 16px;
    background: #1976d2;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

    .refresh-btn:hover {
        background: #1565c0;
    }

/* Pagination */
.pagination {
    display: flex;
    gap: 8px;
    justify-content: center;
    padding: 20px;
}

.page-btn {
    padding: 6px 12px;
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-table-lines);
    border-radius: 4px;
    cursor: pointer;
    color: var(--mud-palette-text-primary);
}

    .page-btn.active {
        background: #1976d2;
        color: white;
        border-color: #1976d2;
    }

/* Icons */
.icon-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 18px;
    padding: 4px 8px;
    border-radius: 4px;
    color: var(--mud-palette-text-primary);
}

    .icon-btn:hover {
        background: var(--mud-palette-action-default-hover);
    }

    .icon-btn.success:hover {
        background: #2e7d32;
        color: white;
    }

/* Dialogs */
.dialog-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(3px);
    z-index: 9998;
}

.dialog-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--mud-palette-surface);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    z-index: 9999;
    max-width: 90vw;
    max-height: 90vh;
    overflow-y: auto;
}

.failed-invoice-details {
    width: 800px;
    max-width: 90vw;
}

.dialog-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    border-bottom: 1px solid var(--mud-palette-table-lines);
}

    .dialog-header h3 {
        margin: 0;
        color: var(--mud-palette-text-primary);
    }

.close-btn {
    background: transparent;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: var(--mud-palette-text-primary);
    padding: 0 8px;
}

    .close-btn:hover {
        opacity: 0.7;
    }

.dialog-body {
    padding: 24px;
}

.dialog-footer {
    padding: 16px 24px;
    border-top: 1px solid var(--mud-palette-table-lines);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}

/* Detail sections */
.details-section {
    margin-bottom: 24px;
}

    .details-section h4 {
        margin: 0 0 12px 0;
        color: var(--mud-palette-text-primary);
    }

.detail-row {
    display: flex;
    padding: 8px 0;
    border-bottom: 1px dashed var(--mud-palette-table-lines);
}

.detail-label {
    width: 150px;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
}

.detail-value {
    flex: 1;
    color: var(--mud-palette-text-primary);
    word-break: break-word;
}

/* JSON view */
.json-view {
    background: #1e1e1e;
    color: #d4d4d4;
    padding: 12px;
    border-radius: 4px;
    overflow-x: auto;
    font-family: monospace;
    font-size: 13px;
    margin: 0;
}

/* Provider logs table */
.provider-logs-table {
    width: 100%;
    border-collapse: collapse;
}

    .provider-logs-table th,
    .provider-logs-table td {
        padding: 8px;
        text-align: left;
        border-bottom: 1px solid var(--mud-palette-table-lines);
    }

/* Buttons */
.btn {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}

.btn-secondary {
    background: transparent;
    border: 1px solid var(--mud-palette-table-lines);
    color: var(--mud-palette-text-primary);
}

.btn-success {
    background: #2e7d32;
    color: white;
}

    .btn-success:hover {
        background: #1b5e20;
    }

/* Stats */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
}

.kpi-card {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.kpi-icon {
    font-size: 32px;
}

.kpi-title {
    font-size: 14px;
    color: var(--mud-palette-text-secondary);
}

.kpi-value {
    font-size: 24px;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
}

.charts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.chart-card {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

    .chart-card h4 {
        margin: 0 0 16px 0;
        color: var(--mud-palette-text-primary);
    }

/* Progress bar */
.progress-bar {
    background: #1976d2;
    color: white;
    padding: 2px 4px;
    border-radius: 2px;
    font-size: 11px;
    text-align: center;
    min-width: 40px;
}

/* Для прогресс-бара */
.progress-bar-container {
    width: 100px;
    background-color: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
    height: 20px;
}

.mud-dark-theme .progress-bar-container {
    background-color: #333;
}

.progress-bar {
    height: 20px;
    background-color: #1976d2;
    color: white;
    font-size: 11px;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
    border-radius: 4px;
}

/* Для сообщений об отсутствии данных */
.no-data, .no-chart-data {
    padding: 40px;
    text-align: center;
    color: #666;
    background: #f9f9f9;
    border-radius: 8px;
}

.mud-dark-theme .no-data,
.mud-dark-theme .no-chart-data {
    background: #2d2d2d;
    color: #999;
}

.stats-table-container {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-top: 20px;
}

.stats-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

    .stats-table th {
        text-align: left;
        padding: 12px;
        background: #f5f5f5;
        color: #333;
        font-weight: 600;
        border-bottom: 2px solid #ddd;
    }

    .stats-table td {
        padding: 10px 12px;
        border-bottom: 1px solid #eee;
        color: #333;
    }

    .stats-table tbody tr:hover {
        background: #f9f9f9;
    }

/* Темная тема */
.mud-dark-theme .stats-table-container {
    background: #1e1e1e;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.mud-dark-theme .stats-table th {
    background: #2d2d2d;
    color: #fff;
    border-bottom-color: #404040;
}

.mud-dark-theme .stats-table td {
    color: #fff;
    border-bottom-color: #333;
}

.mud-dark-theme .stats-table tbody tr:hover {
    background: #2a2a2a;
}

/* Badges */
.badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.badge-success {
    background: #2e7d32;
    color: white;
}

.badge-error {
    background: #d32f2f;
    color: white;
}

.badge-warning {
    background: #ed6c02;
    color: white;
}

.badge-info {
    background: #1976d2;
    color: white;
}

.badge-secondary {
    background: #9c27b0;
    color: white;
}

/* KPI Cards */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.kpi-card {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.mud-dark-theme .kpi-card {
    background: #1e1e1e;
}

.kpi-icon {
    font-size: 32px;
}

.kpi-title {
    font-size: 14px;
    color: #666;
    margin-bottom: 4px;
}

.mud-dark-theme .kpi-title {
    color: #999;
}

.kpi-value {
    font-size: 24px;
    font-weight: 600;
    color: #333;
}

.mud-dark-theme .kpi-value {
    color: #fff;
}

/* Charts */
.charts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}

.chart-card {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.mud-dark-theme .chart-card {
    background: #1e1e1e;
}

.chart-card h4 {
    margin: 0 0 16px 0;
    color: #333;
    font-size: 16px;
}

.mud-dark-theme .chart-card h4 {
    color: #fff;
}

/* Горизонтальные бары для графика */
.chart.horizontal {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bar-container {
    display: flex;
    align-items: center;
    gap: 8px;
}

.bar-label {
    width: 50px;
    font-size: 12px;
    color: #666;
}

.mud-dark-theme .bar-label {
    color: #999;
}

.bar {
    height: 24px;
    background: #1976d2;
    color: white;
    font-size: 12px;
    line-height: 24px;
    padding: 0 8px;
    border-radius: 4px;
    min-width: 40px;
    text-align: right;
}

/* Легенда для круговой диаграммы */
.legend-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #333;
}

.mud-dark-theme .legend-item {
    color: #fff;
}

.legend-color {
    width: 16px;
    height: 16px;
    border-radius: 4px;
}

    .legend-color.color-card {
        background: #1976d2;
    }

    .legend-color.color-sbp {
        background: #2e7d32;
    }

    .legend-color.color-bill {
        background: #ed6c02;
    }

    .legend-color.color-default {
        background: #9c27b0;
    }

/* Progress bar */
.progress-bar-container {
    width: 100px;
    background: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
    height: 20px;
}

.mud-dark-theme .progress-bar-container {
    background: #333;
}

.progress-bar {
    height: 20px;
    background: #1976d2;
    color: white;
    font-size: 11px;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
    border-radius: 4px;
}

/* Filters */
.stats-filters {
    display: flex;
    gap: 16px;
    align-items: center;
    background: #fff;
    padding: 16px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.mud-dark-theme .stats-filters {
    background: #1e1e1e;
}

.date-filter {
    display: flex;
    align-items: center;
    gap: 8px;
}

    .date-filter label {
        font-size: 14px;
        color: #666;
    }

.mud-dark-theme .date-filter label {
    color: #999;
}

.date-filter input {
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    color: #333;
}

.mud-dark-theme .date-filter input {
    background: #2d2d2d;
    border-color: #404040;
    color: #fff;
}

/* Loading и No data */
.loading {
    text-align: center;
    padding: 40px;
    color: #666;
    font-size: 16px;
}

.no-data, .no-chart-data {
    text-align: center;
    padding: 40px;
    color: #666;
    background: #f9f9f9;
    border-radius: 8px;
    font-size: 14px;
}

.mud-dark-theme .no-data,
.mud-dark-theme .no-chart-data {
    background: #2d2d2d;
    color: #999;
}

/* attachments-info-footer */
.attachment-info-footer {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 12px;
    padding: 16px;
    margin-top: 12px;
    color: white;
    box-shadow: 0 8px 20px rgba(102, 126, 234, 0.3);
    transition: transform 0.2s;
}

    .attachment-info-footer:hover {
        transform: translateY(-2px);
    }

    .attachment-info-footer small {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        opacity: 0.95;
    }

    .attachment-info-footer i {
        font-size: 20px;
    }

/* attachment-selector */
.attachment-selector {
    margin-bottom: 16px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

    .attachment-selector .mud-select {
        width: 100%;
    }

/* preview-image */
.preview-image {
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    max-height: 400px;
    object-fit: contain;
    width: 100%;
    background: #f8f9fa;
    padding: 8px;
}

    .preview-image:hover {
        transform: scale(1.02);
        box-shadow: 0 15px 35px rgba(102, 126, 234, 0.2);
    }

/* videoプレビュー */
.preview-video {
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    max-height: 400px;
    width: 100%;
    background: #1a1a1a;
}

/* fileプレビュー placeholder */
.file-preview-placeholder {
    background: linear-gradient(135deg, #f5f7fa 0%, #e9ecef 100%);
    border-radius: 16px;
    padding: 40px 20px;
    text-align: center;
    border: 2px dashed #dee2e6;
    transition: all 0.3s ease;
}

    .file-preview-placeholder:hover {
        border-color: #667eea;
        background: linear-gradient(135deg, #f8f9fa 0%, #f1f3f5 100%);
    }

    .file-preview-placeholder label {
        font-size: 18px;
        color: #495057;
        font-weight: 500;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

        .file-preview-placeholder label::before {
            content: "📎";
            font-size: 32px;
        }

/* not-found-base64 */
.not-found-base64 {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 16px;
    padding: 40px 20px;
    text-align: center;
    border: 2px dashed #ced4da;
}

    .not-found-base64 label {
        font-size: 18px;
        color: #6c757d;
        font-weight: 500;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

        .not-found-base64 label::before {
            content: "🖼️";
            font-size: 32px;
        }

/* attachment-actions */
.attachment-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
}

.attachment-btn {
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    .attachment-btn.view {
        background: #667eea;
        color: white;
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
    }

        .attachment-btn.view:hover {
            background: #5a6fd6;
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        }

    .attachment-btn.download {
        background: #28a745;
        color: white;
        box-shadow: 0 4px 12px rgba(40, 167, 69, 0.3);
    }

        .attachment-btn.download:hover {
            background: #218838;
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(40, 167, 69, 0.4);
        }

    .attachment-btn.delete {
        background: #dc3545;
        color: white;
        box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
    }

        .attachment-btn.delete:hover {
            background: #c82333;
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(220, 53, 69, 0.4);
        }

/* media-filters */
.media-filters {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.media-filter {
    padding: 8px 20px;
    border: 1px solid #e0e0e0;
    border-radius: 25px;
    background: white;
    color: #4a5568;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 2px 6px rgba(0,0,0,0.02);
}

    .media-filter:hover {
        border-color: #667eea;
        color: #667eea;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
    }

    .media-filter.active {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        color: white;
        border-color: transparent;
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
    }

/* attachments-container */
.attachments-container {
    max-height: 300px;
    overflow-y: auto;
    padding: 4px 4px 4px 0;
    margin-bottom: 20px;
}

/* attachment-item */
.attachment-item {
    display: flex;
    align-items: center;
    padding: 12px;
    background: white;
    border: 1px solid #edf2f7;
    border-radius: 12px;
    margin-bottom: 8px;
    transition: all 0.2s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
}

    .attachment-item:hover {
        border-color: #cbd5e0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        transform: translateX(2px);
    }

.attachment-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    background: #f7fafc;
    border-radius: 10px;
    margin-right: 12px;
}

.attachment-info {
    flex: 1;
    min-width: 0;
}

.attachment-name {
    font-weight: 600;
    font-size: 14px;
    color: #2d3748;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.attachment-meta {
    font-size: 12px;
    color: #718096;
    display: flex;
    gap: 12px;
}

    .attachment-meta span {
        display: flex;
        align-items: center;
        gap: 4px;
    }

/* Стили для кнопки просмотра PDF */
button.attachment-btn.view {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    padding: 12px 24px;
    font-size: 14px;
    border-radius: 30px;
    font-weight: 600;
    letter-spacing: 0.3px;
    box-shadow: 0 8px 20px rgba(102, 126, 234, 0.3);
    transition: all 0.3s;
}

    button.attachment-btn.view:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 28px rgba(102, 126, 234, 0.4);
    }

/* responsive */
@media (max-width: 768px) {
    .attachment-item {
        padding: 10px;
    }

    .attachment-icon {
        width: 32px;
        height: 32px;
        font-size: 20px;
    }

    .attachment-name {
        font-size: 13px;
    }

    .attachment-meta {
        font-size: 11px;
        gap: 8px;
    }

    .media-filter {
        padding: 6px 16px;
        font-size: 12px;
    }
}

.mud-button:hover {
    opacity: .7
}