@view-transition {
    navigation: auto;
}

:root {
    --basic-bg: #ffffff;
    --basic-surface: #ffffff;
    --basic-surface-soft: #f5f5f5;
    --basic-surface-muted: #fafafa;
    --basic-border: #d4d4d4;
    --basic-border-strong: #a3a3a3;
    --basic-text: #111111;
    --basic-text-muted: #525252;
    --basic-text-soft: #737373;
    --basic-inverse: #111111;
    --basic-inverse-text: #ffffff;
    --basic-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
    --basic-shadow-hover: 0 14px 36px rgba(0, 0, 0, 0.1);
    --basic-cut-double-size: 18px;
    --basic-cut-single-size: 7px;
    --basic-cut-border-width: 1px;
    --basic-cut-diagonal-offset: calc(var(--basic-cut-border-width) * 0.41421356);
    --basic-clip-frame: polygon(
        var(--basic-cut-double-size) 0,
        calc(100% - var(--basic-cut-single-size)) 0,
        100% var(--basic-cut-single-size),
        100% calc(100% - var(--basic-cut-double-size)),
        calc(100% - var(--basic-cut-double-size)) 100%,
        var(--basic-cut-single-size) 100%,
        0 calc(100% - var(--basic-cut-single-size)),
        0 var(--basic-cut-double-size)
    );
    --basic-clip-frame-inner: polygon(
        calc(var(--basic-cut-double-size) + var(--basic-cut-diagonal-offset)) var(--basic-cut-border-width),
        calc(100% - var(--basic-cut-single-size) - var(--basic-cut-diagonal-offset)) var(--basic-cut-border-width),
        calc(100% - var(--basic-cut-border-width)) calc(var(--basic-cut-single-size) + var(--basic-cut-diagonal-offset)),
        calc(100% - var(--basic-cut-border-width)) calc(100% - var(--basic-cut-double-size) - var(--basic-cut-diagonal-offset)),
        calc(100% - var(--basic-cut-double-size) - var(--basic-cut-diagonal-offset)) calc(100% - var(--basic-cut-border-width)),
        calc(var(--basic-cut-single-size) + var(--basic-cut-diagonal-offset)) calc(100% - var(--basic-cut-border-width)),
        var(--basic-cut-border-width) calc(100% - var(--basic-cut-single-size) - var(--basic-cut-diagonal-offset)),
        var(--basic-cut-border-width) calc(var(--basic-cut-double-size) + var(--basic-cut-diagonal-offset))
    );
}

html,
body {
    background: var(--basic-bg) !important;
    color: var(--basic-text) !important;
}

::view-transition-old(root),
::view-transition-new(root) {
    animation-duration: 0.18s;
    animation-timing-function: ease-out;
}

body,
body button,
body input,
body textarea,
body select,
body .btn,
body .card,
body .dropdown-item,
body .form-control,
body .form-select,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p,
body span,
body a,
body label,
body small {
    font-family: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body .text-muted,
body .text-secondary,
body .text-main,
body .section-subtitle,
body .video-author,
body .bank-meta,
body .bank-owner,
body .brand-subtitle,
body .brand-description,
body .copyright,
body .credits,
body .empty-description,
body .note-text,
body .website-provide,
body .social-stats,
body .tf-card .small,
body .appleid-card .small,
body .ta-account .time,
body .user-role {
    color: var(--basic-text-muted) !important;
}

body .page-title {
    color: var(--basic-text) !important;
    background: transparent !important;
    border-left: none !important;
    border-bottom: 2px solid var(--basic-text) !important;
    border-radius: 0 !important;
    width: fit-content !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 0 6px !important;
    letter-spacing: 0 !important;
}

body .modern-nav {
    background: var(--basic-bg) !important;
    border-bottom: 1px solid var(--basic-border) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

body .logo-wrapper {
    background: var(--basic-inverse) !important;
    background-image: none !important;
    color: var(--basic-inverse-text) !important;
    box-shadow: none !important;
}

body .logo-hover:hover .logo-wrapper,
body .brand-logo:hover {
    transform: none !important;
    box-shadow: none !important;
}

body .logo-text,
body .name,
body .brand-name,
body .page-title,
body .empty-title,
body .error-title,
body .typing-text {
    font-family: "Merriweather", "Times New Roman", serif !important;
    color: var(--basic-text) !important;
    letter-spacing: 0.01em !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

body .user-name,
body .section-title,
body .social-name,
body .website-domain,
body .bank-name,
body .note-title,
body .account-number,
body .ta-account .description,
body .ta-account .seller .name,
body .card-title.text-danger {
    font-family: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-weight: 700 !important;
}

body .image-shell {
    position: relative;
    display: inline-block;
    max-width: 100%;
    line-height: 0;
    vertical-align: middle;
    isolation: isolate;
}

body .image-shell--fluid {
    display: block;
    width: 100%;
}

body .image-shell--fluid > img {
    width: 100% !important;
}

body .image-shell--cut {
    border-radius: 0 !important;
    clip-path: var(--basic-clip-frame);
    overflow: hidden;
}

body .image-shell--circle {
    border-radius: 50% !important;
    clip-path: none !important;
    overflow: hidden;
}

body .image-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
    background: linear-gradient(110deg, #f3f3f3 8%, #e6e6e6 18%, #f3f3f3 33%);
    background-size: 220% 100%;
}

body .image-shell.is-pending::after,
body .image-shell.is-failed::after {
    opacity: 1;
}

body .image-shell.is-pending::after {
    animation: imageWaitingShimmer 1.15s linear infinite;
}

body .image-shell.is-failed::after {
    animation: none;
    background: repeating-linear-gradient(
        135deg,
        #efefef,
        #efefef 10px,
        #e4e4e4 10px,
        #e4e4e4 20px
    );
}

body :is(
    .section-header,
    .note-header,
    .transfer-note,
    .card-section,
    .bank-card,
    .note-card,
    .social-card-inner,
    .website-card-inner,
    .ta-account,
    .appleid-card,
    .tf-card,
    .card,
    .empty-state,
    .error-container,
    .modal-content,
    .alert,
    .loader-wrapper
) {
    --basic-cut-border-color: var(--basic-border);
    --basic-cut-fill: var(--basic-surface);
    position: relative;
    z-index: 0;
    isolation: isolate;
    border-radius: 0 !important;
    background: var(--basic-cut-border-color) !important;
    background-image: none !important;
    clip-path: var(--basic-clip-frame);
    overflow: hidden;
}

body :is(
    .section-header,
    .note-header,
    .transfer-note,
    .card-section,
    .bank-card,
    .note-card,
    .social-card-inner,
    .website-card-inner,
    .ta-account,
    .appleid-card,
    .tf-card,
    .card,
    .empty-state,
    .error-container,
    .modal-content,
    .alert,
    .loader-wrapper
)::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    clip-path: var(--basic-clip-frame-inner);
    background: var(--basic-cut-fill);
}

body :is(
    .section-header,
    .note-header,
    .transfer-note,
    .card-section,
    .bank-card,
    .note-card,
    .social-card-inner,
    .website-card-inner,
    .ta-account,
    .appleid-card,
    .tf-card,
    .card,
    .empty-state,
    .error-container,
    .modal-content,
    .alert,
    .loader-wrapper
) > * {
    position: relative;
    z-index: 1;
}

body :is(
    .avatar-dropdown,
    .modern-dropdown,
    .dropdown-header,
    .shop-profile .shop-navigation .profile-navigation,
    .social-icon,
    .btn,
    .social-btn,
    .website-btn,
    .download-btn,
    .transfer-link,
    .copy-btn,
    .copy-content-btn,
    .btn-back-home,
    .btn-home,
    .btn-primary,
    .btn-info,
    .btn-success,
    .btn-warning,
    .btn-danger,
    .btn-outline-primary,
    .btn-outline-info,
    .btn-outline-secondary,
    .btn-outline-success,
    .btn-outline-warning,
    #copyLinkBtn,
    #tfNewBtn,
    .form-control,
    .form-select,
    .page-link,
    .suggestion-link,
    .account-number,
    .json-scroll,
    .fps-history-wrap,
    .usage-count,
    #valuationResult,
    #nglSpamResult,
    #shortenResult,
    #lovePreviewCard,
    .bank-empty,
    .modern-item,
    .social-logo,
    .website-logo,
    .supported-logos .logo-icon,
    .bank-logo,
    .tf-card img.tf-icon
) {
    border-radius: 0 !important;
    clip-path: none !important;
}

body :is(
    .thumb-preview,
    .fps-demo-img,
    #resultImage,
    #loveDemoImg,
    #appleIdGuideImg,
    #swapResultImg,
    .ta-account .thumbnail,
    .ta-account .thumbnail img
) {
    border-radius: 0 !important;
    clip-path: var(--basic-clip-frame);
    overflow: hidden;
}

body img {
    transition:
        opacity 0.28s ease,
        filter 0.28s ease,
        transform 0.28s ease !important;
    display: block;
}

body img.image-pending {
    opacity: 0 !important;
    filter: none !important;
    animation: none !important;
}

body img.image-ready {
    opacity: 1 !important;
    filter: none !important;
    animation: none !important;
}

body img.image-failed {
    opacity: 0 !important;
    filter: none !important;
    animation: none !important;
}

@keyframes imageWaitingShimmer {
    to {
        background-position-x: -220%;
    }
}

body #page-transition {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(16px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}

body #page-transition::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 22%, rgba(17, 17, 17, 0.06), transparent 34%),
        radial-gradient(circle at 82% 78%, rgba(17, 17, 17, 0.08), transparent 40%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(245, 245, 245, 0.94));
}

body .page-transition-line {
    position: relative;
    z-index: 1;
    width: min(280px, 56vw);
    height: 4px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(17, 17, 17, 0.1);
    box-shadow: 0 0 0 1px rgba(17, 17, 17, 0.05);
}

body .page-transition-line::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #111111 0%, #4b5563 50%, #111111 100%);
    box-shadow: 0 0 20px rgba(17, 17, 17, 0.16);
    transform: translateX(-105%);
}

html.page-entering #page-transition,
html.page-transitioning #page-transition {
    opacity: 1;
    visibility: visible;
}

html.page-entering .page-transition-line::after {
    animation: pageLineReveal 0.44s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

html.page-transitioning .page-transition-line::after {
    animation: pageLineCover 0.18s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes pageLineReveal {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(105%);
    }
}

@keyframes pageLineCover {
    0% {
        transform: translateX(-105%);
    }
    100% {
        transform: translateX(0%);
    }
}

body :is(
    .modern-nav,
    .shop-header,
    .username,
    .social,
    .bio,
    .page-title,
    .shop-navigation,
    .shop-navigation .profile-navigation,
    .modern-footer,
    .section-header,
    .card-section,
    .bank-card,
    .note-card,
    .social-card,
    .social-card-inner,
    .website-card,
    .website-card-inner,
    .ta-account,
    .empty-state,
    .error-container,
    .bank-empty,
    .footer-brand,
    .footer-links,
    .footer-social,
    .footer-bottom,
    .alert,
    .custom-alert,
    .modal-dialog
) {
    opacity: 1;
    filter: none;
    transform: none;
    transition:
        opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.42s ease,
        background-color 0.16s ease,
        border-color 0.16s ease,
        box-shadow 0.16s ease !important;
    will-change: opacity, transform, filter;
}

body .shop-header > :nth-child(1) {
    transition-delay: 0.04s;
}

body .shop-header > :nth-child(2) {
    transition-delay: 0.08s;
}

body .shop-header > :nth-child(3) {
    transition-delay: 0.12s;
}

body .shop-header > :nth-child(4) {
    transition-delay: 0.16s;
}

body .shop-navigation .profile-navigation:nth-child(1) {
    transition-delay: 0.08s;
}

body .shop-navigation .profile-navigation:nth-child(2) {
    transition-delay: 0.12s;
}

body .shop-navigation .profile-navigation:nth-child(3) {
    transition-delay: 0.16s;
}

body .shop-navigation .profile-navigation:nth-child(4) {
    transition-delay: 0.2s;
}

body .footer-content > :nth-child(1) {
    transition-delay: 0.06s;
}

body .footer-content > :nth-child(2) {
    transition-delay: 0.1s;
}

body .footer-content > :nth-child(3) {
    transition-delay: 0.14s;
}

html.page-loading body :is(
    .modern-nav,
    .shop-header,
    .username,
    .social,
    .bio,
    .page-title,
    .shop-navigation,
    .shop-navigation .profile-navigation,
    .modern-footer,
    .section-header,
    .card-section,
    .bank-card,
    .note-card,
    .social-card,
    .social-card-inner,
    .website-card,
    .website-card-inner,
    .ta-account,
    .empty-state,
    .error-container,
    .bank-empty,
    .footer-brand,
    .footer-links,
    .footer-social,
    .footer-bottom,
    .alert,
    .custom-alert,
    .modal-dialog
),
html.page-entering body :is(
    .modern-nav,
    .shop-header,
    .username,
    .social,
    .bio,
    .page-title,
    .shop-navigation,
    .shop-navigation .profile-navigation,
    .modern-footer,
    .section-header,
    .card-section,
    .bank-card,
    .note-card,
    .social-card,
    .social-card-inner,
    .website-card,
    .website-card-inner,
    .ta-account,
    .empty-state,
    .error-container,
    .bank-empty,
    .footer-brand,
    .footer-links,
    .footer-social,
    .footer-bottom,
    .alert,
    .custom-alert,
    .modal-dialog
) {
    opacity: 0;
    filter: blur(8px);
    transform: translate3d(0, 18px, 0) scale(0.985);
    pointer-events: none;
}

html.page-loading body .modern-nav,
html.page-entering body .modern-nav {
    transform: translate3d(0, -18px, 0);
}

html.page-loading body .modern-footer,
html.page-entering body .modern-footer,
html.page-loading body .footer-bottom,
html.page-entering body .footer-bottom {
    transform: translate3d(0, 24px, 0);
}

html.page-transitioning body :is(
    .modern-nav,
    .shop-header,
    .username,
    .social,
    .bio,
    .page-title,
    .shop-navigation,
    .shop-navigation .profile-navigation,
    .modern-footer,
    .section-header,
    .card-section,
    .bank-card,
    .note-card,
    .social-card,
    .social-card-inner,
    .website-card,
    .website-card-inner,
    .ta-account,
    .empty-state,
    .error-container,
    .bank-empty,
    .footer-brand,
    .footer-links,
    .footer-social,
    .footer-bottom,
    .alert,
    .custom-alert,
    .modal-dialog
) {
    opacity: 0;
    filter: blur(7px);
    transform: translate3d(0, -14px, 0) scale(0.985);
    transition-duration: 0.22s !important;
    transition-delay: 0s !important;
    pointer-events: none;
}

body .avatar-dropdown,
body .modern-dropdown,
body .dropdown-header,
body .usage-count,
body #lovePreviewCard,
body .fps-history-wrap,
body .json-scroll,
body #valuationResult,
body #nglSpamResult,
body #shortenResult,
body .suggestion-link,
body .page-link,
body .account-number,
body .bank-empty {
    background: var(--basic-surface-soft) !important;
    background-image: none !important;
    border: 1px solid var(--basic-border) !important;
    box-shadow: none !important;
    color: var(--basic-text) !important;
}

body .section-header,
body .note-header,
body .transfer-note,
body .empty-state,
body .modal-content,
body .alert {
    --basic-cut-fill: var(--basic-surface-soft);
    background: var(--basic-cut-border-color) !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--basic-text) !important;
}

body .error-container {
    --basic-cut-fill: var(--basic-surface-soft);
    background: var(--basic-cut-border-color) !important;
    border: 0 !important;
    box-shadow: var(--basic-shadow) !important;
    color: var(--basic-text) !important;
}

body .alert-danger,
body .alert-warning,
body .alert-info,
body .alert-success {
    background: var(--basic-surface-soft) !important;
    border-color: var(--basic-border) !important;
    color: var(--basic-text) !important;
}

body .avatar-dropdown:hover {
    background: var(--basic-surface-soft) !important;
    box-shadow: none !important;
    transform: translateY(-1px) !important;
}

body .avatar-img,
body .dropdown-avatar {
    border: 1px solid var(--basic-inverse) !important;
    box-shadow: none !important;
}

body .avatar-status {
    background: var(--basic-inverse) !important;
    border-color: var(--basic-bg) !important;
}

body .modern-item {
    color: var(--basic-text) !important;
}

body .modern-item:hover {
    background: var(--basic-inverse) !important;
    color: var(--basic-inverse-text) !important;
    transform: translateX(2px) !important;
}

body .modern-item:hover i {
    color: var(--basic-inverse-text) !important;
}

body .modern-item i {
    color: #667eea !important;
}

body .avatar-dropdown i.bi-chevron-down {
    color: #6b7280 !important;
}

body .shop-profile .shop-navigation .profile-navigation {
    background: var(--basic-surface) !important;
    border: 1px solid var(--basic-border) !important;
    box-shadow: none !important;
}

body .shop-profile .shop-navigation .profile-navigation::before,
body .modern-footer::before,
body .btn-back-home::before,
body .btn-home::before {
    content: none !important;
    display: none !important;
}

body .shop-profile .shop-navigation .profile-navigation:hover {
    transform: translateY(-1px) !important;
    border-color: var(--basic-border-strong) !important;
    box-shadow: none !important;
}

body .shop-profile .shop-navigation .profile-navigation a,
body .shop-profile .shop-navigation .profile-navigation a:hover,
body .shop-profile .shop-navigation .profile-navigation a:focus {
    color: var(--basic-text) !important;
}

body .shop-profile .shop-navigation .profile-navigation.active,
body .shop-profile .shop-navigation .profile-navigation.active.home,
body .shop-profile .shop-navigation .profile-navigation.active.review,
body .shop-profile .shop-navigation .profile-navigation.active.utility,
body .shop-profile .shop-navigation .profile-navigation.active.community {
    background: var(--basic-inverse) !important;
    border-color: var(--basic-inverse) !important;
    box-shadow: none !important;
}

body .shop-profile .shop-navigation .profile-navigation.active a,
body .shop-profile .shop-navigation .profile-navigation.active a:hover,
body .shop-profile .shop-navigation .profile-navigation.active a:focus,
body .shop-profile .shop-navigation .profile-navigation.active i {
    color: var(--basic-inverse-text) !important;
}

body .shop-profile .shop-navigation .profile-navigation.active.community {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    border-color: transparent !important;
    box-shadow: 0 4px 16px rgba(79, 172, 254, 0.3) !important;
}

body .card-section,
body .bank-card,
body .note-card,
body .social-card-inner,
body .website-card-inner,
body .ta-account,
body .appleid-card,
body .tf-card,
body .card {
    --basic-cut-fill: var(--basic-surface);
    background: var(--basic-cut-border-color) !important;
    border: 0 !important;
    box-shadow: var(--basic-shadow) !important;
    color: var(--basic-text) !important;
}

body .card-section:hover,
body .bank-card:hover,
body .note-card:hover,
body .social-card-inner:hover,
body .website-card-inner:hover,
body .ta-account:hover,
body .social-card:hover,
body .website-card:hover,
body .error-container:hover {
    --basic-cut-border-color: var(--basic-border-strong);
    border-color: transparent !important;
    box-shadow: var(--basic-shadow-hover) !important;
}

body .ta-account:hover {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    color: var(--basic-text) !important;
    font-size: inherit !important;
    transform: translateY(-2px) !important;
}

body .social-card:hover,
body .website-card:hover {
    transform: translateY(-2px) !important;
}

body .social-card:hover .social-logo,
body .website-card:hover .website-logo,
body .social-icon:hover {
    transform: none !important;
}

body .social-logo,
body .website-logo,
body .supported-logos .logo-icon,
body .bank-logo,
body .tf-card img.tf-icon {
    border: 1px solid var(--basic-border) !important;
    box-shadow: none !important;
    background: var(--basic-surface) !important;
}

body .social-logo,
body .website-logo {
    clip-path: var(--basic-clip-frame) !important;
    overflow: hidden !important;
}

body .social-logo img,
body .website-logo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

body .window-controls .dot.red {
    background: #ff5f57 !important;
    box-shadow: 0 0 0 1px #e0443e !important;
}

body .window-controls .dot.yellow {
    background: #ffbd2e !important;
    box-shadow: 0 0 0 1px #dfa123 !important;
}

body .window-controls .dot.green {
    background: #28c840 !important;
    box-shadow: 0 0 0 1px #1fa932 !important;
}

body .social-btn,
body .website-btn,
body .download-btn,
body .transfer-link,
body .copy-btn,
body .copy-content-btn,
body .btn-back-home,
body .btn-home,
body .btn-primary,
body .btn-info,
body .btn-success,
body .btn-warning,
body .btn-danger {
    background: var(--basic-inverse) !important;
    background-image: none !important;
    border: 1px solid var(--basic-inverse) !important;
    box-shadow: none !important;
    color: var(--basic-inverse-text) !important;
}

body .social-btn,
body .website-btn {
    border-radius: 0 !important;
    clip-path: var(--basic-clip-frame) !important;
    overflow: hidden !important;
}

body .social-btn:hover,
body .website-btn:hover,
body .download-btn:hover,
body .transfer-link:hover,
body .copy-btn:hover,
body .copy-content-btn:hover,
body .btn-back-home:hover,
body .btn-home:hover,
body .btn-primary:hover,
body .btn-info:hover,
body .btn-success:hover,
body .btn-warning:hover,
body .btn-danger:hover {
    background: #000000 !important;
    border-color: #000000 !important;
    color: var(--basic-inverse-text) !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

body .btn-outline-primary,
body .btn-outline-info,
body .btn-outline-secondary,
body .btn-outline-success,
body .btn-outline-warning,
body .page-link,
body .seller-contact .btn,
body #copyLinkBtn,
body #tfNewBtn {
    background: var(--basic-surface) !important;
    border: 1px solid var(--basic-border) !important;
    color: var(--basic-text) !important;
    box-shadow: none !important;
}

body .btn-outline-primary:hover,
body .btn-outline-info:hover,
body .btn-outline-secondary:hover,
body .btn-outline-success:hover,
body .btn-outline-warning:hover,
body .page-link:hover,
body .seller-contact .btn:hover,
body #copyLinkBtn:hover,
body #tfNewBtn:hover {
    background: var(--basic-inverse) !important;
    border-color: var(--basic-inverse) !important;
    color: var(--basic-inverse-text) !important;
}

body .btn-outline-primary i {
    color: var(--bs-primary) !important;
}

body .btn-outline-info i {
    color: var(--bs-info) !important;
}

body .btn-outline-secondary i {
    color: var(--bs-secondary) !important;
}

body .btn-outline-success i {
    color: var(--bs-success) !important;
}

body .btn-outline-warning i {
    color: var(--bs-warning) !important;
}

body .form-control,
body .form-select,
body .form-range,
body .pagination .page-item.disabled .page-link {
    background: var(--basic-surface) !important;
    border-color: var(--basic-border) !important;
    color: var(--basic-text) !important;
    box-shadow: none !important;
}

body .form-control:focus,
body .form-select:focus {
    border-color: var(--basic-inverse) !important;
    box-shadow: 0 0 0 0.2rem rgba(17, 17, 17, 0.12) !important;
}

body .spinner-border,
body .spinner-border.text-dark {
    color: var(--basic-inverse) !important;
}

body .spinner-border.text-primary {
    color: var(--bs-primary) !important;
}

body .spinner-border.text-info {
    color: var(--bs-info) !important;
}

body .spinner-border.text-success {
    color: var(--bs-success) !important;
}

body .spinner-border.text-warning {
    color: var(--bs-warning) !important;
}

body .spinner-border.text-danger {
    color: var(--bs-danger) !important;
}

body .ta-account .thumbnail,
body .ta-account .description,
body .ta-account .info,
body .note-body,
body .fps-history-item {
    background: var(--basic-surface) !important;
    color: var(--basic-text) !important;
}

body .thumbnail-btn a {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent) !important;
    color: #ffffff !important;
}

body .thumbnail-btn a:hover {
    background: linear-gradient(to top, rgba(99, 102, 241, 0.9), transparent) !important;
    color: #ffffff !important;
}

body .thumbnail-btn a i {
    color: inherit !important;
}

body .avatar-dropdown,
body .modern-item,
body .shop-profile .shop-navigation .profile-navigation,
body .shop-profile .shop-navigation .profile-navigation a,
body .card-section,
body .bank-card,
body .note-card,
body .social-card-inner,
body .website-card-inner,
body .ta-account,
body .btn,
body .social-btn,
body .website-btn,
body .download-btn {
    transition:
        background-color 0.16s ease,
        border-color 0.16s ease,
        color 0.16s ease,
        transform 0.16s ease,
        box-shadow 0.16s ease !important;
}

body .card-section,
body .bank-card,
body .note-card,
body .social-card-inner,
body .website-card-inner,
body .ta-account,
body .avatar-dropdown,
body .shop-profile .shop-navigation .profile-navigation {
    will-change: transform;
}

body .ta-account-id {
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid var(--basic-border) !important;
    box-shadow: none !important;
    color: var(--basic-text) !important;
}

body .error-code,
body .empty-title,
body .error-title {
    color: var(--basic-text) !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
}

body .empty-icon i {
    color: #ffffff !important;
    -webkit-text-fill-color: currentColor !important;
}

body .suggestion-link:hover {
    background: var(--basic-inverse) !important;
    color: var(--basic-inverse-text) !important;
}

body .suggestions {
    border-top-color: var(--basic-border) !important;
}

body .modern-footer {
    background: var(--basic-bg) !important;
    color: var(--basic-text) !important;
    border-top: 1px solid var(--basic-border) !important;
}

body .footer-content {
    border-bottom-color: var(--basic-border) !important;
}

body .links-list a,
body .footer-heading,
body .copyright strong {
    color: var(--basic-text) !important;
}

body .footer-heading i {
    color: #60a5fa !important;
}

body .links-list a:hover {
    background: var(--basic-surface-soft) !important;
    color: var(--basic-text) !important;
}

body .links-list a i {
    color: #60a5fa !important;
}

body .social-icon {
    background: var(--basic-surface) !important;
    border: 1px solid var(--basic-border) !important;
    box-shadow: none !important;
}

body .social-icon:hover {
    border-color: var(--basic-border-strong) !important;
    box-shadow: none !important;
}

body .view-trigger,
body .view-trigger i {
    color: var(--bs-primary) !important;
}

body .usage-count {
    background: #eef4ff !important;
    border-color: #d7e5ff !important;
    color: #516173 !important;
}

body .usage-count::before {
    color: #3b82f6 !important;
}

body .usage-count span {
    color: #1d4ed8 !important;
}

body #loading-screen {
    background:
        radial-gradient(circle at 18% 20%, rgba(17, 17, 17, 0.06), transparent 34%),
        radial-gradient(circle at 80% 80%, rgba(17, 17, 17, 0.09), transparent 40%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 245, 245, 0.94)) !important;
    backdrop-filter: blur(18px) !important;
}

body .loader-wrapper {
    --basic-cut-border-color: rgba(17, 17, 17, 0.09);
    --basic-cut-fill: rgba(255, 255, 255, 0.9);
    background: var(--basic-cut-border-color) !important;
    border: 0 !important;
    box-shadow: 0 28px 80px rgba(17, 17, 17, 0.1) !important;
}

body .loader-avatar {
    border: 1px solid var(--basic-inverse) !important;
    box-shadow: none !important;
}

body .loader-spinner {
    border-color: var(--basic-border) !important;
    border-top-color: var(--basic-inverse) !important;
    border-right-color: var(--basic-inverse) !important;
}

body .loader-text,
body .typing-text {
    color: var(--basic-text) !important;
    border-right-color: var(--basic-text) !important;
}

body .loader-subtext {
    color: var(--basic-text-soft) !important;
}

body .loader-progress {
    background: rgba(17, 17, 17, 0.08) !important;
}

body .loader-progress > span {
    background: linear-gradient(90deg, rgba(17, 17, 17, 0.08), rgba(17, 17, 17, 0.86), rgba(17, 17, 17, 0.08)) !important;
}

body .loader-orbit {
    border-color: rgba(17, 17, 17, 0.1) !important;
}

body .loader-orbit::after {
    background: var(--basic-inverse) !important;
    box-shadow: 0 0 0 8px rgba(17, 17, 17, 0.05) !important;
}

body .loading-grid {
    opacity: 0.22 !important;
}

body .loading-glow--left {
    background: rgba(163, 163, 163, 0.24) !important;
}

body .loading-glow--right {
    background: rgba(17, 17, 17, 0.16) !important;
}

html.soft-loader body #loading-screen {
    background: rgba(255, 255, 255, 0.76) !important;
}

html.soft-loader body .loader-wrapper {
    box-shadow: 0 20px 46px rgba(17, 17, 17, 0.08) !important;
}

body .typing-text {
    font-size: clamp(1.4rem, 3vw, 1.95rem) !important;
    letter-spacing: 0.015em !important;
}

@media (prefers-reduced-motion: reduce) {
    body #page-transition,
    body .page-transition-line::after,
    body :is(
        .modern-nav,
        .shop-header,
        .username,
        .social,
        .bio,
        .page-title,
        .shop-navigation,
        .shop-navigation .profile-navigation,
        .modern-footer,
        .section-header,
        .card-section,
        .bank-card,
        .note-card,
        .social-card,
        .social-card-inner,
        .website-card,
        .website-card-inner,
        .ta-account,
        .empty-state,
        .error-container,
        .bank-empty,
        .footer-brand,
        .footer-links,
        .footer-social,
        .footer-bottom,
        .alert,
        .custom-alert,
        .modal-dialog
    ) {
        animation: none !important;
        transition: none !important;
    }

    body .loading-grid,
    body .loading-glow,
    body .loader-orbit,
    body .loader-orbit::after,
    body .loader-progress > span {
        animation: none !important;
    }
}

body #copyAlert,
body .custom-alert {
    background: var(--basic-inverse) !important;
    color: var(--basic-inverse-text) !important;
    box-shadow: var(--basic-shadow) !important;
}
