.login-title {
    margin: .533rem .533rem .32rem;
    --loader-color: #273852;
    background-image: linear-gradient(90deg,var(--loader-color) 0,var(--loader-color) 33.33%,transparent 44.44%,transparent 55.55%,var(--loader-color) 66.66%,var(--loader-color) 100%);
    animation: cLMtGC-7d17aafa 2s infinite;
    background-size: 300% 100%;
    background-position: 100% 0;
    -webkit-user-select: none;
    user-select: none;
    opacity: .05;
    position: relative;
    overflow: hidden;
    min-height: 4.533rem;
    border-radius: .107rem
}

@keyframes cLMtGC-7d17aafa {
    to {
        background-position: 0 0
    }
}

.profile-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: .027rem solid rgba(184,154,92,.1);
    padding-bottom: .267rem;
    margin-bottom: .267rem
}

.profile-name {
    font-size: .453rem;
    font-weight: 700;
    letter-spacing: .013rem;
    color: var(--secondary)!important;
    font-family: sans-serif
}

.profile-id {
    background-color: #ffffff26;
    padding: .107rem .213rem;
    border-radius: .053rem;
    font-size: .373rem
}

.balance-card {
    margin: .267rem .533rem .533rem;
    background: linear-gradient(135deg,var(--primary),#1a3a66);
    color: var(--white);
    padding: .533rem .427rem;
    border-radius: .107rem;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden
}

.balance-card:before {
    content: "";
    position: absolute;
    top: -50%;
    right: -50%;
    width: 100%;
    height: 200%;
    background: radial-gradient(circle,#ffffff1a,#fff0 70%);
    transform: rotate(30deg);
    pointer-events: none
}

.balance-info h3 {
    font-size: .533rem;
    opacity: .9;
    margin-bottom: .213rem;
    letter-spacing: .013rem;
    color: var(--white)
}

.balance-amount {
    font-size: .64rem;
    font-weight: 700;
    margin-bottom: .533rem;
    display: block
}

.balance-actions {
    display: flex;
    gap: .4rem
}

.btn {
    padding: .213rem .267rem;
    border-radius: var(--radius);
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: .213rem;
    font-size: .427rem;
    width: 100%;
    justify-content: center
}

.btn-primary {
    background-color: var(--secondary);
    color: var(--primary);
    border: none
}

.btn-primary:hover {
    background-color: #d4b87a;
    transform: translateY(-.053rem)
}

.btn-outline {
    background-color: transparent;
    color: var(--white);
    border: .053rem solid rgba(255,255,255,.3)
}

.btn-outline:hover {
    background-color: #ffffff1a;
    border-color: var(--secondary)
}

.menu-list {
    margin: .533rem;
    background-color: var(--white);
    border-radius: .107rem;
    box-shadow: var(--shadow);
    overflow: hidden;
    border: .027rem solid rgba(0,0,0,.05)
}

.menu-item {
    padding: .48rem .667rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: .027rem solid rgba(0,0,0,.05);
    transition: var(--transition);
    cursor: pointer
}

.menu-item-content {
    display: flex;
    align-items: center;
    gap: .4rem
}

.menu-item-icon {
    width: .64rem;
    height: .64rem;
    color: var(--secondary)
}

.menu-item-text {
    font-weight: 500;
    font-size: .427rem;
    color: var(--primary)
}

.menu-item .i-icon {
    height: .64rem;
    display: flex;
    justify-content: center;
    align-items: center
}

.box .form-group {
    padding: .427rem;
    font-family: Segoe UI,Tahoma,Geneva,Verdana,sans-serif
}

.box .form-group label {
    display: block;
    margin-bottom: .267rem;
    font-weight: 500;
    color: var(--primary);
    font-size: .4rem
}

.box .form-group .card-item {
    display: flex;
    align-items: center;
    padding: .427rem;
    border: .027rem solid var(--secondary);
    border-radius: .16rem;
    margin-bottom: .32rem;
    cursor: pointer;
    transition: all .3s ease;
    border-color: var(--secondary);
    background-color: var(--light);
    box-shadow: 0 .133rem .4rem #0a1f3a1a
}

.box .form-group .card-icon {
    width: 1.12rem;
    height: 1.12rem;
    margin-right: .427rem;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #0a1f3a0d
}

.box .form-group .card-icon svg {
    width: .64rem;
    height: .64rem
}

.box .form-group .card-info {
    flex: 1
}

.card-name {
    font-weight: 600;
    margin-bottom: .133rem;
    color: var(--primary);
    font-size: .4rem
}

.card-number {
    color: var(--gray);
    font-size: .373rem;
    letter-spacing: .013rem
}

.no-card {
    text-align: center;
    padding: .667rem;
    color: var(--gray);
    font-size: .4rem;
    border: .027rem dashed var(--light-gray);
    border-radius: .16rem
}

.amount-container {
    display: flex;
    flex-direction: column;
    gap: .32rem
}

.amount-input {
    position: relative
}

.box input {
    width: 100%;
    padding: .373rem;
    border: .027rem solid var(--light-gray);
    border-radius: .16rem;
    font-size: .4rem;
    transition: all .3s ease;
    background-color: var(--white)
}

.currency-symbol {
    position: absolute;
    right: .373rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gray);
    font-size: .4rem;
    font-weight: 500
}

.full-amount {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .373rem;
    border: .027rem solid var(--light-gray);
    border-radius: .16rem;
    cursor: pointer;
    transition: all .3s ease;
    background-color: var(--white)
}

.full-amount-label {
    font-weight: 500;
    color: var(--primary);
    font-size: .4rem
}

.full-amount-value {
    color: var(--secondary);
    font-weight: 600;
    font-size: .4rem
}