/* ========================================
   Light Theme - 亮色主题
   ======================================== */
body.theme-light {
    background: #f1f5f9 !important;
    color: #1e293b !important;
}

body.theme-light .app-container {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

body.theme-light .header {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .app-title {
    color: #1e293b !important;
    font-weight: 600 !important;
}

body.theme-light .section-title {
    color: #475569 !important;
    font-weight: 600 !important;
}

body.theme-light .filter-label {
    color: #475569 !important;
    font-weight: 500 !important;
}

body.theme-light .filter-select {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .summary-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .summary-label {
    color: #64748b !important;
    font-weight: 500 !important;
}

body.theme-light .summary-card.expense .summary-value {
    color: #ef4444 !important;
    font-weight: 700 !important;
}

body.theme-light .summary-card.income .summary-value {
    color: #22c55e !important;
    font-weight: 700 !important;
}

body.theme-light .summary-card.balance .summary-value {
    color: #3b82f6 !important;
    font-weight: 700 !important;
}

body.theme-light .transaction-item {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .transaction-item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

body.theme-light .transaction-remark {
    color: #1e293b !important;
    font-weight: 500 !important;
}

body.theme-light .transaction-meta {
    color: #64748b !important;
    font-weight: 400 !important;
}

body.theme-light .stat-label {
    color: #64748b !important;
    font-weight: 500 !important;
}

body.theme-light .stat-value {
    color: #1e293b !important;
    font-weight: 600 !important;
}

body.theme-light .user-name {
    color: #1e293b !important;
    font-weight: 600 !important;
}

body.theme-light .user-bio {
    color: #64748b !important;
    font-weight: 400 !important;
}

body.theme-light .menu-item {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .menu-item:hover {
    background: #f8fafc !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

body.theme-light .menu-text {
    color: #1e293b !important;
    font-weight: 500 !important;
}

body.theme-light .menu-arrow {
    color: #94a3b8 !important;
    font-weight: 600 !important;
}

body.theme-light .action-btn {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .action-btn:hover {
    background: #f8fafc !important;
}

body.theme-light .action-btn.logout {
    background: #fef2f2 !important;
    color: #ef4444 !important;
    border: 1px solid #fecaca !important;
    font-weight: 500 !important;
}

body.theme-light .action-btn.logout:hover {
    background: #fee2e2 !important;
}

body.theme-light .nav-item {
    color: #64748b !important;
    font-weight: 500 !important;
}

body.theme-light .nav-item.active {
    color: #3b82f6 !important;
    font-weight: 600 !important;
}

body.theme-light .date-header {
    color: #475569 !important;
    font-weight: 600 !important;
}

body.theme-light .empty-text {
    color: #94a3b8 !important;
    font-weight: 500 !important;
}

body.theme-light .category-name {
    color: #1e293b !important;
    font-weight: 500 !important;
}

body.theme-light .category-percent {
    color: #64748b !important;
    font-weight: 500 !important;
}

body.theme-light .time-btn {
    background: #ffffff !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
    font-weight: 500 !important;
}

body.theme-light .time-btn:hover {
    background: #f8fafc !important;
}

body.theme-light .time-btn.active {
    background: #3b82f6 !important;
    color: #ffffff !important;
    border: 1px solid #3b82f6 !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
}

body.theme-light .back-btn {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    font-weight: 600 !important;
}

body.theme-light .back-btn:hover {
    background: #e2e8f0 !important;
}

body.theme-light .form-input {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    font-weight: 500 !important;
}

body.theme-light .form-input:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

body.theme-light .register-btn {
    background: #3b82f6 !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
    font-weight: 600 !important;
}

body.theme-light .register-btn:hover {
    background: #2563eb !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4) !important;
}

body.theme-light .login-btn {
    background: #3b82f6 !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
    font-weight: 600 !important;
}

body.theme-light .login-btn:hover {
    background: #2563eb !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4) !important;
}

body.theme-light .category-item {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .avatar {
    border: 3px solid #cbd5e1 !important;
}

body.theme-light .card-front,
body.theme-light .card-back {
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1),
                0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}

body.theme-light .card-user-section {
    border: 1px solid #cbd5e1 !important;
}

body.theme-light .card-balance-section {
    border: 1px solid #cbd5e1 !important;
}

body.theme-light .card-avatar {
    border: 2px solid #cbd5e1 !important;
}

body.theme-light .profile-section {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .stat-item {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .stats-grid .stat-item {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .transactions-section .transaction-list {
    border: 1px solid #cbd5e1 !important;
}

body.theme-light .info-value.amount {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

body.theme-light .transaction-type {
    background: rgba(148, 163, 184, 0.15) !important;
}

body.theme-light .transaction-type.income {
    color: #22c55e !important;
    background: rgba(34, 197, 94, 0.1) !important;
}

body.theme-light .transaction-type.expense {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.1) !important;
}

body.theme-light .app-title {
    background: none !important;
    -webkit-text-fill-color: #1e293b !important;
}

body.theme-light .card-number {
    color: #1e293b !important;
    text-shadow: none !important;
}

body.theme-light .card-username {
    color: #1e293b !important;
}

body.theme-light .card-nickname {
    color: #64748b !important;
}

body.theme-light .card-balance-value {
    color: #1e293b !important;
}

body.theme-light .card-balance-label {
    color: #64748b !important;
}

body.theme-light .receipt-modal {
    background: #ffffff !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15) !important;
}

body.theme-light .receipt-header {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.08) 0%, rgba(37, 99, 235, 0.08) 100%) !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

body.theme-light .receipt-title {
    color: #1e293b !important;
}

body.theme-light .receipt-username {
    color: #3b82f6 !important;
}

body.theme-light .receipt-close {
    background: #f1f5f9 !important;
    color: #64748b !important;
}

body.theme-light .receipt-close:hover {
    background: #e2e8f0 !important;
}

body.theme-light .receipt-item {
    border-bottom: 1px dashed #e2e8f0 !important;
}

body.theme-light .receipt-item-name {
    color: #1e293b !important;
}

body.theme-light .receipt-item-category {
    color: #94a3b8 !important;
}

body.theme-light .receipt-info-date {
    color: #94a3b8 !important;
}

body.theme-light .receipt-info-remark {
    color: #1e293b !important;
}

body.theme-light .receipt-account-label {
    color: #64748b !important;
}

body.theme-light .receipt-account-card {
    color: #3b82f6 !important;
}

body.theme-light .receipt-total-label {
    color: #94a3b8 !important;
}

body.theme-light .receipt-total-amount {
    color: #1e293b !important;
}

body.theme-light .bottom-nav {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(20px);
    border-top: 1px solid #e2e8f0 !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .nav-item.add-btn {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    box-shadow: 0 8px 25px rgba(59, 130, 246, 0.35) !important;
}

body.theme-light .stats-grid .stat-item {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}

body.theme-light .info-value {
    color: #1e293b !important;
}

body.theme-light .info-label {
    color: #94a3b8 !important;
}

/* ========================================
   Add Page Theme - 记一笔页面
   ======================================== */
body.theme-light .smart-input {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    color: #1e293b !important;
}

body.theme-light .smart-input::placeholder {
    color: #94a3b8 !important;
}

body.theme-light .type-switch-wrapper {
    background: #f1f5f9 !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .type-switch-btn {
    color: #64748b !important;
}

body.theme-light .type-switch-btn:first-child.active {
    color: #ffffff !important;
}

body.theme-light .type-switch-btn:last-child.active {
    color: #ffffff !important;
}

body.theme-light .date-wrapper {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .date-label {
    color: #475569 !important;
}

body.theme-light .date-input {
    color: #1e293b !important;
}

body.theme-light .account-wrapper {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .account-label {
    color: #475569 !important;
}

body.theme-light .account-select {
    color: #1e293b !important;
}

body.theme-light .account-select option {
    background: #ffffff !important;
    color: #1e293b !important;
}

body.theme-light .remark-input {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    color: #1e293b !important;
}

body.theme-light .remark-input::placeholder {
    color: #94a3b8 !important;
}

body.theme-light .save-section {
    background: #ffffff !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08) !important;
}

body.theme-light .batch-results-section {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .batch-title {
    color: #1e293b !important;
}

body.theme-light .clear-batch-btn {
    color: #64748b !important;
    border: 1px solid #cbd5e1 !important;
}

body.theme-light .batch-item {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
}

body.theme-light .batch-remark {
    color: #1e293b !important;
}

body.theme-light .batch-category {
    color: #94a3b8 !important;
}

body.theme-light .batch-category-select {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #1e293b !important;
}

body.theme-light .batch-category-select option {
    background: #ffffff !important;
    color: #1e293b !important;
}

body.theme-light .amount-input-wrapper {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .amount-input {
    color: #1e293b !important;
}

body.theme-light .amount-input::placeholder {
    color: #94a3b8 !important;
}

body.theme-light .type-tabs {
    background: #f1f5f9 !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

body.theme-light .type-tab {
    color: #64748b !important;
}

body.theme-light .type-tab.active {
    color: #3b82f6 !important;
}

body.theme-light .type-tab.expense.active {
    color: #ef4444 !important;
}

body.theme-light .type-tab.income.active {
    color: #22c55e !important;
}

body.theme-light .batch-amount.expense {
    color: #ef4444 !important;
}

body.theme-light .batch-amount.income {
    color: #22c55e !important;
}

body.theme-light .batch-remove-btn {
    color: #94a3b8 !important;
}

/* ========================================
   Green Theme - 清新主题
   ======================================== */
body.theme-green {
    background: #ecfdf5 !important;
    color: #1e293b !important;
}

body.theme-green .app-container {
    background: linear-gradient(180deg, #ffffff 0%, #f0fdf4 100%) !important;
}

body.theme-green .header {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(20px);
    border-bottom: 2px solid #86efac !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.08) !important;
}

body.theme-green .app-title {
    color: #166534 !important;
    font-weight: 600 !important;
}

body.theme-green .section-title {
    color: #15803d !important;
    font-weight: 600 !important;
}

body.theme-green .filter-label {
    color: #15803d !important;
    font-weight: 500 !important;
}

body.theme-green .filter-select {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .summary-card {
    background: #ffffff !important;
    border: 1px solid #dcfce7 !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .summary-label {
    color: #166534 !important;
    font-weight: 500 !important;
}

body.theme-green .summary-card.expense .summary-value {
    color: #ef4444 !important;
    font-weight: 700 !important;
}

body.theme-green .summary-card.income .summary-value {
    color: #22c55e !important;
    font-weight: 700 !important;
}

body.theme-green .summary-card.balance .summary-value {
    color: #16a34a !important;
    font-weight: 700 !important;
}

body.theme-green .transaction-item {
    background: #ffffff !important;
    border: 1px solid #dcfce7 !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 1px 4px rgba(34, 197, 94, 0.04) !important;
}

body.theme-green .transaction-item:hover {
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.1) !important;
}

body.theme-green .transaction-remark {
    color: #1e293b !important;
    font-weight: 500 !important;
}

body.theme-green .transaction-meta {
    color: #6b7280 !important;
    font-weight: 400 !important;
}

body.theme-green .stat-label {
    color: #166534 !important;
    font-weight: 500 !important;
}

body.theme-green .stat-value {
    color: #1e293b !important;
    font-weight: 600 !important;
}

body.theme-green .user-name {
    color: #166534 !important;
    font-weight: 600 !important;
}

body.theme-green .user-bio {
    color: #6b7280 !important;
    font-weight: 400 !important;
}

body.theme-green .menu-item {
    background: #ffffff !important;
    border: 1px solid #dcfce7 !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 1px 4px rgba(34, 197, 94, 0.04) !important;
}

body.theme-green .menu-item:hover {
    background: #f0fdf4 !important;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.1) !important;
}

body.theme-green .menu-text {
    color: #1e293b !important;
    font-weight: 500 !important;
}

body.theme-green .menu-arrow {
    color: #9ca3af !important;
    font-weight: 600 !important;
}

body.theme-green .action-btn {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .action-btn:hover {
    background: #f0fdf4 !important;
}

body.theme-green .action-btn.logout {
    background: #fef2f2 !important;
    color: #ef4444 !important;
    border: 1px solid #fecaca !important;
    font-weight: 500 !important;
}

body.theme-green .action-btn.logout:hover {
    background: #fee2e2 !important;
}

body.theme-green .nav-item {
    color: #6b7280 !important;
    font-weight: 500 !important;
}

body.theme-green .nav-item.active {
    color: #22c55e !important;
    font-weight: 600 !important;
}

body.theme-green .date-header {
    color: #166534 !important;
    font-weight: 600 !important;
}

body.theme-green .empty-text {
    color: #9ca3af !important;
    font-weight: 500 !important;
}

body.theme-green .category-name {
    color: #1e293b !important;
    font-weight: 500 !important;
}

body.theme-green .category-percent {
    color: #6b7280 !important;
    font-weight: 500 !important;
}

body.theme-green .time-btn {
    background: #ffffff !important;
    color: #166534 !important;
    border: 1px solid #bbf7d0 !important;
    font-weight: 500 !important;
}

body.theme-green .time-btn:hover {
    background: #f0fdf4 !important;
}

body.theme-green .time-btn.active {
    background: #22c55e !important;
    color: #ffffff !important;
    border: 1px solid #22c55e !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.3) !important;
}

body.theme-green .back-btn {
    background: #f0fdf4 !important;
    color: #166534 !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
    font-weight: 600 !important;
}

body.theme-green .back-btn:hover {
    background: #dcfce7 !important;
}

body.theme-green .form-input {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
    font-weight: 500 !important;
}

body.theme-green .form-input:focus {
    border-color: #22c55e !important;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.1) !important;
}

body.theme-green .register-btn {
    background: #22c55e !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.3) !important;
    font-weight: 600 !important;
}

body.theme-green .register-btn:hover {
    background: #16a34a !important;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.4) !important;
}

body.theme-green .login-btn {
    background: #22c55e !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.3) !important;
    font-weight: 600 !important;
}

body.theme-green .login-btn:hover {
    background: #16a34a !important;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.4) !important;
}

body.theme-green .category-item {
    background: #ffffff !important;
    border: 1px solid #dcfce7 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 4px rgba(34, 197, 94, 0.04) !important;
}

body.theme-green .avatar {
    border: 3px solid #bbf7d0 !important;
}

body.theme-green .profile-section {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .stat-item {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 4px rgba(34, 197, 94, 0.04) !important;
}

body.theme-green .card-front,
body.theme-green .card-back {
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 20px 60px rgba(34, 197, 94, 0.1),
                0 0 0 1px rgba(34, 197, 94, 0.08) !important;
}

body.theme-green .card-user-section {
    border: 1px solid #bbf7d0 !important;
}

body.theme-green .card-balance-section {
    border: 1px solid #bbf7d0 !important;
}

body.theme-green .card-avatar {
    border: 2px solid #bbf7d0 !important;
}

body.theme-green .stats-grid .stat-item {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 4px rgba(34, 197, 94, 0.04) !important;
}

body.theme-green .transactions-section .transaction-list {
    border: 1px solid #bbf7d0 !important;
}

body.theme-green .info-value.amount {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

body.theme-green .transaction-type {
    background: rgba(156, 163, 175, 0.15) !important;
}

body.theme-green .transaction-type.income {
    color: #22c55e !important;
    background: rgba(34, 197, 94, 0.1) !important;
}

body.theme-green .transaction-type.expense {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.1) !important;
}

body.theme-green .app-title {
    background: none !important;
    -webkit-text-fill-color: #166534 !important;
}

body.theme-green .card-number {
    color: #166534 !important;
    text-shadow: none !important;
}

body.theme-green .card-username {
    color: #166534 !important;
}

body.theme-green .card-nickname {
    color: #15803d !important;
}

body.theme-green .card-balance-value {
    color: #166534 !important;
}

body.theme-green .card-balance-label {
    color: #15803d !important;
}

body.theme-green .receipt-modal {
    background: #ffffff !important;
    box-shadow: 0 20px 60px rgba(34, 197, 94, 0.15) !important;
}

body.theme-green .receipt-header {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.08) 0%, rgba(22, 163, 74, 0.08) 100%) !important;
    border-bottom: 1px solid #dcfce7 !important;
}

body.theme-green .receipt-title {
    color: #166534 !important;
}

body.theme-green .receipt-username {
    color: #22c55e !important;
}

body.theme-green .receipt-close {
    background: #f0fdf4 !important;
    color: #6b7280 !important;
}

body.theme-green .receipt-close:hover {
    background: #dcfce7 !important;
}

body.theme-green .receipt-item {
    border-bottom: 1px dashed #dcfce7 !important;
}

body.theme-green .receipt-item-name {
    color: #1e293b !important;
}

body.theme-green .receipt-item-category {
    color: #9ca3af !important;
}

body.theme-green .receipt-info-date {
    color: #9ca3af !important;
}

body.theme-green .receipt-info-remark {
    color: #166534 !important;
}

body.theme-green .receipt-account-label {
    color: #6b7280 !important;
}

body.theme-green .receipt-account-card {
    color: #22c55e !important;
}

body.theme-green .receipt-total-label {
    color: #9ca3af !important;
}

body.theme-green .receipt-total-amount {
    color: #166534 !important;
}

body.theme-green .bottom-nav {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(20px);
    border-top: 1px solid #dcfce7 !important;
    box-shadow: 0 -2px 8px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .nav-item.add-btn {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
    box-shadow: 0 8px 25px rgba(34, 197, 94, 0.35) !important;
}

body.theme-green .stats-grid .stat-item {
    background: #ffffff !important;
    border: 1px solid #dcfce7 !important;
    box-shadow: 0 1px 4px rgba(34, 197, 94, 0.04) !important;
}

body.theme-green .info-value {
    color: #1e293b !important;
}

body.theme-green .info-label {
    color: #9ca3af !important;
}

/* ========================================
   Green Add Page Theme - 绿色记一笔页面
   ======================================== */
body.theme-green .smart-input {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
    color: #1e293b !important;
}

body.theme-green .smart-input::placeholder {
    color: #9ca3af !important;
}

body.theme-green .type-switch-wrapper {
    background: #f0fdf4 !important;
    box-shadow: inset 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .type-switch-btn {
    color: #6b7280 !important;
}

body.theme-green .type-switch-btn:first-child.active {
    color: #ffffff !important;
}

body.theme-green .type-switch-btn:last-child.active {
    color: #ffffff !important;
}

body.theme-green .date-wrapper {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .date-label {
    color: #15803d !important;
}

body.theme-green .date-input {
    color: #1e293b !important;
}

body.theme-green .account-wrapper {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .account-label {
    color: #15803d !important;
}

body.theme-green .account-select {
    color: #1e293b !important;
}

body.theme-green .account-select option {
    background: #ffffff !important;
    color: #1e293b !important;
}

body.theme-green .remark-input {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
    color: #1e293b !important;
}

body.theme-green .remark-input::placeholder {
    color: #9ca3af !important;
}

body.theme-green .save-section {
    background: #ffffff !important;
    box-shadow: 0 -4px 20px rgba(34, 197, 94, 0.08) !important;
}

body.theme-green .batch-results-section {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .batch-title {
    color: #1e293b !important;
}

body.theme-green .clear-batch-btn {
    color: #6b7280 !important;
    border: 1px solid #bbf7d0 !important;
}

body.theme-green .batch-item {
    background: #f0fdf4 !important;
    border: 1px solid #dcfce7 !important;
}

body.theme-green .batch-remark {
    color: #1e293b !important;
}

body.theme-green .batch-category {
    color: #9ca3af !important;
}

body.theme-green .batch-category-select {
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #1e293b !important;
}

body.theme-green .batch-category-select option {
    background: #ffffff !important;
    color: #1e293b !important;
}

body.theme-green .amount-input-wrapper {
    background: #ffffff !important;
    border: 1px solid #bbf7d0 !important;
    box-shadow: 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .amount-input {
    color: #1e293b !important;
}

body.theme-green .amount-input::placeholder {
    color: #9ca3af !important;
}

body.theme-green .type-tabs {
    background: #f0fdf4 !important;
    box-shadow: inset 0 1px 3px rgba(34, 197, 94, 0.06) !important;
}

body.theme-green .type-tab {
    color: #6b7280 !important;
}

body.theme-green .type-tab.active {
    color: #22c55e !important;
}

body.theme-green .type-tab.expense.active {
    color: #ef4444 !important;
}

body.theme-green .type-tab.income.active {
    color: #22c55e !important;
}

body.theme-green .batch-amount.expense {
    color: #ef4444 !important;
}

body.theme-green .batch-amount.income {
    color: #22c55e !important;
}

body.theme-green .batch-remove-btn {
    color: #9ca3af !important;
}

body.theme-green .app-title {
    background: none !important;
    -webkit-text-fill-color: #166534 !important;
}

body.theme-green .currency-symbol {
    color: #22c55e !important;
}

/* ========================================
   Sci-Fi Theme - 科幻玻璃主题
   HUD空间数据面板风格，透明玻璃质感
   ======================================== */

/* --- Base Colors --- */
body.theme-scifi {
    background: #0a1628 !important;
    color: #c8e6f0 !important;
}

/* --- App Container --- */
body.theme-scifi .app-container {
    background: linear-gradient(180deg, #0d1b2a 0%, #0a1628 50%, #070d1a 100%) !important;
    /* Subtle grid overlay pattern */
    background-image:
        linear-gradient(rgba(0, 212, 170, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 170, 0.03) 1px, transparent 1px),
        linear-gradient(180deg, #0d1b2a 0%, #0a1628 50%, #070d1a 100%) !important;
    background-size: 40px 40px, 40px 40px, 100% 100% !important;
}

/* --- Header --- */
body.theme-scifi .header {
    background: rgba(10, 22, 40, 0.85) !important;
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
    border-bottom: 1px solid rgba(0, 212, 170, 0.15) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3),
                0 1px 0 rgba(0, 212, 170, 0.1) inset !important;
}

body.theme-scifi .app-title {
    color: #c8e6f0 !important;
    font-weight: 600 !important;
    background: none !important;
    -webkit-text-fill-color: #c8e6f0 !important;
    text-shadow: 0 0 20px rgba(0, 212, 170, 0.3) !important;
}

/* --- Section Title --- */
body.theme-scifi .section-title {
    color: #00d4aa !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 13px !important;
}

/* --- Filter Section --- */
body.theme-scifi .filter-label {
    color: #5a7a8a !important;
    font-weight: 500 !important;
}

body.theme-scifi .filter-select {
    background: rgba(13, 27, 42, 0.8) !important;
    color: #c8e6f0 !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .filter-select:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.1) inset,
                0 0 10px rgba(0, 212, 170, 0.1) !important;
}

body.theme-scifi .filter-select option {
    background: #0d1b2a !important;
    color: #c8e6f0 !important;
}

/* --- Summary Cards --- */
body.theme-scifi .summary-card {
    background: rgba(13, 27, 42, 0.6) !important;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.3) inset !important;
}

body.theme-scifi .summary-label {
    color: #5a7a8a !important;
    font-weight: 500 !important;
}

body.theme-scifi .summary-card.expense .summary-value {
    color: #ff5252 !important;
    font-weight: 700 !important;
    text-shadow: 0 0 15px rgba(255, 82, 82, 0.4) !important;
}

body.theme-scifi .summary-card.income .summary-value {
    color: #00e676 !important;
    font-weight: 700 !important;
    text-shadow: 0 0 15px rgba(0, 230, 118, 0.4) !important;
}

body.theme-scifi .summary-card.balance .summary-value {
    color: #00d4aa !important;
    font-weight: 700 !important;
    text-shadow: 0 0 15px rgba(0, 212, 170, 0.4) !important;
}

body.theme-scifi .summary-card.expense {
    border-color: rgba(255, 82, 82, 0.2) !important;
}

body.theme-scifi .summary-card.income {
    border-color: rgba(0, 230, 118, 0.2) !important;
}

body.theme-scifi .summary-card.balance {
    border-color: rgba(0, 212, 170, 0.2) !important;
}

/* --- Time Selector Buttons --- */
body.theme-scifi .time-btn {
    background: rgba(13, 27, 42, 0.5) !important;
    color: #5a7a8a !important;
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    font-weight: 500 !important;
    border-radius: 10px !important;
}

body.theme-scifi .time-btn:hover {
    background: rgba(0, 212, 170, 0.08) !important;
    color: #00d4aa !important;
}

body.theme-scifi .time-btn.active {
    background: rgba(0, 212, 170, 0.15) !important;
    color: #00d4aa !important;
    border: 1px solid rgba(0, 212, 170, 0.4) !important;
    font-weight: 600 !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.15),
                0 0 1px rgba(0, 212, 170, 0.5) inset !important;
}

/* --- Transaction Items --- */
body.theme-scifi .transaction-item {
    background: rgba(13, 27, 42, 0.5) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    border-radius: 14px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease !important;
}

body.theme-scifi .transaction-item:hover {
    background: rgba(13, 27, 42, 0.7) !important;
    border-color: rgba(0, 212, 170, 0.25) !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.3) inset !important;
    transform: translateX(3px) !important;
}

body.theme-scifi .transaction-remark {
    color: #c8e6f0 !important;
    font-weight: 500 !important;
}

body.theme-scifi .transaction-meta {
    color: #5a7a8a !important;
    font-weight: 400 !important;
}

body.theme-scifi .transaction-time {
    color: #5a7a8a !important;
}

body.theme-scifi .transaction-category {
    color: #5a7a8a !important;
    background: rgba(0, 212, 170, 0.08) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
}

/* --- Category Icon Wrapper --- */
body.theme-scifi .category-icon-wrapper {
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    box-shadow: 0 0 10px rgba(0, 212, 170, 0.1) !important;
}

body.theme-scifi .transaction-item.expense .category-icon-wrapper {
    background: rgba(255, 82, 82, 0.1) !important;
    border-color: rgba(255, 82, 82, 0.2) !important;
}

body.theme-scifi .transaction-item.income .category-icon-wrapper {
    background: rgba(0, 230, 118, 0.1) !important;
    border-color: rgba(0, 230, 118, 0.2) !important;
}

/* --- Transaction Type Badge --- */
body.theme-scifi .transaction-type {
    background: rgba(0, 212, 170, 0.08) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
}

body.theme-scifi .transaction-type.income {
    color: #00e676 !important;
    background: rgba(0, 230, 118, 0.1) !important;
    border-color: rgba(0, 230, 118, 0.2) !important;
}

body.theme-scifi .transaction-type.expense {
    color: #ff5252 !important;
    background: rgba(255, 82, 82, 0.1) !important;
    border-color: rgba(255, 82, 82, 0.2) !important;
}

/* --- Transaction Amount --- */
body.theme-scifi .transaction-amount.income {
    color: #00e676 !important;
    text-shadow: 0 0 10px rgba(0, 230, 118, 0.3) !important;
}

body.theme-scifi .transaction-amount.expense {
    color: #ff5252 !important;
    text-shadow: 0 0 10px rgba(255, 82, 82, 0.3) !important;
}

/* --- Date Header --- */
body.theme-scifi .date-header {
    color: #00d4aa !important;
    font-weight: 600 !important;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.3) !important;
}

/* --- Empty State --- */
body.theme-scifi .empty-text {
    color: #5a7a8a !important;
    font-weight: 500 !important;
}

body.theme-scifi .empty-icon {
    opacity: 0.4 !important;
}

/* --- Stat Labels & Values --- */
body.theme-scifi .stat-label {
    color: #5a7a8a !important;
    font-weight: 500 !important;
}

body.theme-scifi .stat-value {
    color: #c8e6f0 !important;
    font-weight: 600 !important;
}

body.theme-scifi .stat-item {
    background: rgba(13, 27, 42, 0.5) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15) !important;
}

body.theme-scifi .stat-item.income .stat-value {
    color: #00e676 !important;
    text-shadow: 0 0 10px rgba(0, 230, 118, 0.3) !important;
}

body.theme-scifi .stat-item.expense .stat-value {
    color: #ff5252 !important;
    text-shadow: 0 0 10px rgba(255, 82, 82, 0.3) !important;
}

/* --- Stats Grid --- */
body.theme-scifi .stats-grid .stat-item {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15) !important;
}

/* --- User Profile --- */
body.theme-scifi .user-name {
    color: #c8e6f0 !important;
    font-weight: 600 !important;
}

body.theme-scifi .user-bio {
    color: #5a7a8a !important;
    font-weight: 400 !important;
}

/* --- Menu Items --- */
body.theme-scifi .menu-item {
    background: rgba(13, 27, 42, 0.5) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    border-radius: 14px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease !important;
}

body.theme-scifi .menu-item:hover {
    background: rgba(0, 212, 170, 0.08) !important;
    border-color: rgba(0, 212, 170, 0.25) !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.3) inset !important;
}

body.theme-scifi .menu-text {
    color: #c8e6f0 !important;
    font-weight: 500 !important;
}

body.theme-scifi .menu-arrow {
    color: #5a7a8a !important;
    font-weight: 600 !important;
}

/* --- Action Buttons --- */
body.theme-scifi .action-btn {
    background: rgba(13, 27, 42, 0.6) !important;
    color: #c8e6f0 !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .action-btn:hover {
    background: rgba(0, 212, 170, 0.1) !important;
    border-color: rgba(0, 212, 170, 0.35) !important;
}

body.theme-scifi .action-btn.logout {
    background: rgba(255, 82, 82, 0.1) !important;
    color: #ff5252 !important;
    border: 1px solid rgba(255, 82, 82, 0.25) !important;
    font-weight: 500 !important;
}

body.theme-scifi .action-btn.logout:hover {
    background: rgba(255, 82, 82, 0.2) !important;
    border-color: rgba(255, 82, 82, 0.4) !important;
}

/* --- Bottom Navigation --- */
body.theme-scifi .bottom-nav {
    background: rgba(10, 22, 40, 0.9) !important;
    backdrop-filter: blur(25px) saturate(1.5);
    -webkit-backdrop-filter: blur(25px) saturate(1.5);
    border-top: 1px solid rgba(0, 212, 170, 0.15) !important;
    box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.3),
                0 -1px 0 rgba(0, 212, 170, 0.1) inset !important;
}

body.theme-scifi .nav-item {
    color: #5a7a8a !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

body.theme-scifi .nav-item:hover {
    background: rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .nav-item.active {
    color: #00d4aa !important;
    font-weight: 600 !important;
}

body.theme-scifi .nav-item.add-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    box-shadow: 0 8px 30px rgba(0, 212, 170, 0.35),
                0 0 15px rgba(0, 212, 170, 0.2) !important;
    border: 1px solid rgba(0, 212, 170, 0.4) !important;
}

body.theme-scifi .nav-item.add-btn:hover {
    box-shadow: 0 10px 35px rgba(0, 212, 170, 0.45),
                0 0 20px rgba(0, 212, 170, 0.3) !important;
}

/* --- Category Items --- */
body.theme-scifi .category-item {
    background: rgba(13, 27, 42, 0.5) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease !important;
}

body.theme-scifi .category-item:hover {
    background: rgba(0, 212, 170, 0.08) !important;
    border-color: rgba(0, 212, 170, 0.25) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.3) inset !important;
}

body.theme-scifi .category-item.active {
    background: rgba(0, 212, 170, 0.12) !important;
    border-color: rgba(0, 212, 170, 0.4) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.15),
                0 0 1px rgba(0, 212, 170, 0.5) inset !important;
}

body.theme-scifi .category-item.expense.active {
    background: rgba(255, 82, 82, 0.12) !important;
    border-color: rgba(255, 82, 82, 0.4) !important;
    box-shadow: 0 0 20px rgba(255, 82, 82, 0.15) !important;
}

body.theme-scifi .category-item.income.active {
    background: rgba(0, 230, 118, 0.12) !important;
    border-color: rgba(0, 230, 118, 0.4) !important;
    box-shadow: 0 0 20px rgba(0, 230, 118, 0.15) !important;
}

body.theme-scifi .category-name {
    color: #c8e6f0 !important;
    font-weight: 500 !important;
}

body.theme-scifi .category-percent {
    color: #5a7a8a !important;
    font-weight: 500 !important;
}

body.theme-scifi .category-amount {
    color: #ff5252 !important;
    text-shadow: 0 0 10px rgba(255, 82, 82, 0.3) !important;
}

body.theme-scifi .category-icon {
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
}

/* --- Back Button --- */
body.theme-scifi .back-btn {
    background: rgba(13, 27, 42, 0.6) !important;
    color: #c8e6f0 !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
    font-weight: 600 !important;
    border-radius: 12px !important;
}

body.theme-scifi .back-btn:hover {
    background: rgba(0, 212, 170, 0.12) !important;
    border-color: rgba(0, 212, 170, 0.35) !important;
}

/* --- Form Inputs --- */
body.theme-scifi .form-input {
    background: rgba(13, 27, 42, 0.7) !important;
    color: #c8e6f0 !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 12px !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
    font-weight: 500 !important;
    backdrop-filter: blur(10px);
}

body.theme-scifi .form-input:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.1) inset,
                0 0 10px rgba(0, 212, 170, 0.1) !important;
    outline: none !important;
}

body.theme-scifi .form-input::placeholder {
    color: #3a5a6a !important;
}

/* --- Login & Register Buttons --- */
body.theme-scifi .login-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(0, 212, 170, 0.35),
                0 0 1px rgba(0, 212, 170, 0.5) inset !important;
    font-weight: 600 !important;
    border-radius: 12px !important;
}

body.theme-scifi .login-btn:hover {
    box-shadow: 0 6px 30px rgba(0, 212, 170, 0.5),
                0 0 20px rgba(0, 212, 170, 0.2) inset !important;
    transform: translateY(-2px) !important;
}

body.theme-scifi .register-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(0, 212, 170, 0.35),
                0 0 1px rgba(0, 212, 170, 0.5) inset !important;
    font-weight: 600 !important;
    border-radius: 12px !important;
}

body.theme-scifi .register-btn:hover {
    box-shadow: 0 6px 30px rgba(0, 212, 170, 0.5),
                0 0 20px rgba(0, 212, 170, 0.2) inset !important;
    transform: translateY(-2px) !important;
}

/* --- Avatar --- */
body.theme-scifi .avatar {
    border: 3px solid rgba(0, 212, 170, 0.4) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.2) !important;
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
}

/* --- Profile Section --- */
body.theme-scifi .profile-section {
    background: rgba(13, 27, 42, 0.5) !important;
    backdrop-filter: blur(15px);
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 20px !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.3) inset !important;
}

/* --- Card (Front/Back) --- */
body.theme-scifi .card-front,
body.theme-scifi .card-back {
    background: rgba(13, 27, 42, 0.6) !important;
    backdrop-filter: blur(15px);
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3),
                0 0 1px rgba(0, 212, 170, 0.3) inset,
                0 0 30px rgba(0, 212, 170, 0.05) !important;
}

body.theme-scifi .card-user-section {
    background: rgba(0, 212, 170, 0.05) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    backdrop-filter: blur(10px);
}

body.theme-scifi .card-balance-section {
    background: rgba(0, 212, 170, 0.05) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    backdrop-filter: blur(10px);
}

body.theme-scifi .card-avatar {
    border: 2px solid rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .card-number {
    color: #c8e6f0 !important;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.4) !important;
}

body.theme-scifi .card-username {
    color: #00d4aa !important;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .card-nickname {
    color: #5a7a8a !important;
}

body.theme-scifi .card-balance-value {
    color: #00d4aa !important;
    text-shadow: 0 0 15px rgba(0, 212, 170, 0.4) !important;
}

body.theme-scifi .card-balance-label {
    color: #5a7a8a !important;
}

/* --- Info Values --- */
body.theme-scifi .info-value {
    color: #c8e6f0 !important;
}

body.theme-scifi .info-label {
    color: #5a7a8a !important;
}

body.theme-scifi .info-value.amount {
    background: linear-gradient(135deg, #00e676 0%, #00d4aa 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 0 8px rgba(0, 212, 170, 0.4)) !important;
}

/* --- Transaction List Section --- */
body.theme-scifi .transactions-section .transaction-list {
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    background: rgba(13, 27, 42, 0.3) !important;
}

/* --- Receipt Modal --- */
body.theme-scifi .receipt-modal {
    background: rgba(10, 22, 40, 0.95) !important;
    backdrop-filter: blur(30px);
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
                0 0 1px rgba(0, 212, 170, 0.4) inset,
                0 0 40px rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .receipt-header {
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.08) 0%, rgba(0, 180, 216, 0.08) 100%) !important;
    border-bottom: 1px solid rgba(0, 212, 170, 0.15) !important;
}

body.theme-scifi .receipt-title {
    color: #c8e6f0 !important;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .receipt-username {
    color: #00d4aa !important;
}

body.theme-scifi .receipt-close {
    background: rgba(0, 212, 170, 0.1) !important;
    color: #c8e6f0 !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .receipt-close:hover {
    background: rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .receipt-item {
    border-bottom: 1px dashed rgba(0, 212, 170, 0.12) !important;
}

body.theme-scifi .receipt-item-name {
    color: #c8e6f0 !important;
}

body.theme-scifi .receipt-item-category {
    color: #5a7a8a !important;
}

body.theme-scifi .receipt-item-icon {
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .receipt-item-amount.expense {
    color: #ff5252 !important;
}

body.theme-scifi .receipt-item-amount.income {
    color: #00e676 !important;
}

body.theme-scifi .receipt-info-date {
    color: #5a7a8a !important;
}

body.theme-scifi .receipt-info-remark {
    color: #c8e6f0 !important;
}

body.theme-scifi .receipt-account-label {
    color: #5a7a8a !important;
}

body.theme-scifi .receipt-account-card {
    color: #00d4aa !important;
    text-shadow: 0 0 8px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .receipt-total-label {
    color: #5a7a8a !important;
}

body.theme-scifi .receipt-total-amount {
    color: #c8e6f0 !important;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .receipt-total-amount.expense {
    color: #ff5252 !important;
}

body.theme-scifi .receipt-total-amount.income {
    color: #00e676 !important;
}

/* ========================================
   Sci-Fi Add Page Theme - 科幻记一笔页面
   ======================================== */

/* --- Smart Input --- */
body.theme-scifi .smart-input {
    background: rgba(13, 27, 42, 0.7) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 16px !important;
    color: #c8e6f0 !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
    backdrop-filter: blur(10px);
}

body.theme-scifi .smart-input::placeholder {
    color: #3a5a6a !important;
}

body.theme-scifi .smart-input:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.1) inset,
                0 0 10px rgba(0, 212, 170, 0.1) !important;
}

/* --- Type Switch --- */
body.theme-scifi .type-switch-wrapper {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .type-switch-btn {
    color: #5a7a8a !important;
    border-radius: 10px !important;
}

body.theme-scifi .type-switch-btn:first-child.active {
    background: linear-gradient(135deg, #ff5252 0%, #ff8a65 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 0 15px rgba(255, 82, 82, 0.3) !important;
}

body.theme-scifi .type-switch-btn:last-child.active {
    background: linear-gradient(135deg, #00e676 0%, #00d4aa 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 0 15px rgba(0, 230, 118, 0.3) !important;
}

/* --- Type Tabs --- */
body.theme-scifi .type-tabs {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .type-tab {
    color: #5a7a8a !important;
    border-radius: 10px !important;
}

body.theme-scifi .type-tab.active {
    background: rgba(0, 212, 170, 0.12) !important;
    color: #00d4aa !important;
    border: 1px solid rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .type-tab.expense.active {
    background: rgba(255, 82, 82, 0.12) !important;
    color: #ff5252 !important;
    border-color: rgba(255, 82, 82, 0.3) !important;
}

body.theme-scifi .type-tab.income.active {
    background: rgba(0, 230, 118, 0.12) !important;
    color: #00e676 !important;
    border-color: rgba(0, 230, 118, 0.3) !important;
}

/* --- Date Wrapper --- */
body.theme-scifi .date-wrapper {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
    border-radius: 14px !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .date-label {
    color: #5a7a8a !important;
}

body.theme-scifi .date-input {
    color: #c8e6f0 !important;
}

/* --- Account Wrapper --- */
body.theme-scifi .account-wrapper {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
    border-radius: 14px !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .account-label {
    color: #5a7a8a !important;
}

body.theme-scifi .account-select {
    color: #c8e6f0 !important;
}

body.theme-scifi .account-select option {
    background: #0d1b2a !important;
    color: #c8e6f0 !important;
}

/* --- Remark Input --- */
body.theme-scifi .remark-input {
    background: rgba(13, 27, 42, 0.7) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 14px !important;
    color: #c8e6f0 !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .remark-input::placeholder {
    color: #3a5a6a !important;
}

body.theme-scifi .remark-input:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.1) inset,
                0 0 10px rgba(0, 212, 170, 0.1) !important;
}

/* --- Save Section --- */
body.theme-scifi .save-section {
    background: rgba(10, 22, 40, 0.95) !important;
    backdrop-filter: blur(20px);
    box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.4),
                0 -1px 0 rgba(0, 212, 170, 0.1) inset !important;
}

/* --- Batch Results --- */
body.theme-scifi .batch-results-section {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2) !important;
    backdrop-filter: blur(10px);
}

body.theme-scifi .batch-title {
    color: #c8e6f0 !important;
}

body.theme-scifi .clear-batch-btn {
    color: #5a7a8a !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 8px !important;
}

body.theme-scifi .clear-batch-btn:hover {
    color: #ff5252 !important;
    border-color: rgba(255, 82, 82, 0.4) !important;
}

body.theme-scifi .batch-item {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(10px);
}

body.theme-scifi .batch-remark {
    color: #c8e6f0 !important;
}

body.theme-scifi .batch-category {
    color: #5a7a8a !important;
}

body.theme-scifi .batch-category-select {
    background: rgba(0, 212, 170, 0.08) !important;
    border: 1px solid rgba(0, 212, 170, 0.25) !important;
    border-radius: 8px !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .batch-category-select option {
    background: #0d1b2a !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .batch-amount.expense {
    color: #ff5252 !important;
}

body.theme-scifi .batch-amount.income {
    color: #00e676 !important;
}

body.theme-scifi .batch-remove-btn {
    color: #5a7a8a !important;
}

body.theme-scifi .batch-remove-btn:hover {
    color: #ff5252 !important;
}

/* --- Amount Input Wrapper --- */
body.theme-scifi .amount-input-wrapper {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
    border-radius: 16px !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .amount-input {
    color: #c8e6f0 !important;
}

body.theme-scifi .amount-input::placeholder {
    color: #3a5a6a !important;
}

body.theme-scifi .currency-symbol {
    color: #00d4aa !important;
    text-shadow: 0 0 15px rgba(0, 212, 170, 0.4) !important;
}

/* --- Save Button --- */
body.theme-scifi .save-btn,
body.theme-scifi .batch-save-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(0, 212, 170, 0.35),
                0 0 1px rgba(0, 212, 170, 0.5) inset !important;
    border-radius: 12px !important;
}

body.theme-scifi .save-btn:hover,
body.theme-scifi .batch-save-btn:hover {
    box-shadow: 0 6px 30px rgba(0, 212, 170, 0.5),
                0 0 20px rgba(0, 212, 170, 0.2) inset !important;
    transform: translateY(-2px) !important;
}

/* ========================================
   Sci-Fi Login & Register Page - 科幻登录注册页面
   ======================================== */

/* --- Login Wrapper --- */
body.theme-scifi .login-wrapper {
    background: rgba(13, 27, 42, 0.7) !important;
    backdrop-filter: blur(30px) saturate(1.5);
    -webkit-backdrop-filter: blur(30px) saturate(1.5);
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4),
                0 0 1px rgba(0, 212, 170, 0.4) inset,
                0 0 40px rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .login-title {
    color: #c8e6f0 !important;
    text-shadow: 0 0 20px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .login-logo {
    box-shadow: 0 8px 30px rgba(0, 212, 170, 0.3),
                0 0 15px rgba(0, 212, 170, 0.2) !important;
    border: 2px solid rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .login-form .form-label {
    color: #5a7a8a !important;
}

body.theme-scifi .login-form .form-input {
    background: rgba(13, 27, 42, 0.8) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    color: #c8e6f0 !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .login-form .form-input:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.1) inset,
                0 0 10px rgba(0, 212, 170, 0.1) !important;
    background: rgba(13, 27, 42, 0.9) !important;
}

body.theme-scifi .login-footer {
    color: #5a7a8a !important;
}

body.theme-scifi .register-link {
    color: #00d4aa !important;
}

body.theme-scifi .register-link:hover {
    color: #00e5ff !important;
}

/* --- Register Wrapper --- */
body.theme-scifi .register-wrapper {
    background: rgba(13, 27, 42, 0.7) !important;
    backdrop-filter: blur(30px) saturate(1.5);
    -webkit-backdrop-filter: blur(30px) saturate(1.5);
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4),
                0 0 1px rgba(0, 212, 170, 0.4) inset,
                0 0 40px rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .register-title {
    color: #c8e6f0 !important;
    text-shadow: 0 0 20px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .register-logo {
    box-shadow: 0 8px 30px rgba(0, 212, 170, 0.3),
                0 0 15px rgba(0, 212, 170, 0.2) !important;
    border: 2px solid rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .register-form .form-label {
    color: #5a7a8a !important;
}

body.theme-scifi .register-form .form-input {
    background: rgba(13, 27, 42, 0.8) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    color: #c8e6f0 !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .register-form .form-input:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    box-shadow: 0 0 20px rgba(0, 212, 170, 0.1) inset,
                0 0 10px rgba(0, 212, 170, 0.1) !important;
    background: rgba(13, 27, 42, 0.9) !important;
}

body.theme-scifi .register-footer {
    color: #5a7a8a !important;
}

body.theme-scifi .login-link {
    color: #00d4aa !important;
}

body.theme-scifi .login-link:hover {
    color: #00e5ff !important;
}

/* --- Purchase Link --- */
body.theme-scifi .purchase-link {
    color: #00d4aa !important;
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .purchase-link:hover {
    background: rgba(0, 212, 170, 0.2) !important;
    border-color: rgba(0, 212, 170, 0.5) !important;
}

/* ========================================
   Sci-Fi Accounts Page - 科幻账户页面
   ======================================== */

body.theme-scifi .account-card {
    background: rgba(13, 27, 42, 0.5) !important;
    backdrop-filter: blur(15px);
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.2) inset !important;
}

body.theme-scifi .account-card:hover {
    background: rgba(13, 27, 42, 0.7) !important;
    border-color: rgba(0, 212, 170, 0.25) !important;
    box-shadow: 0 8px 35px rgba(0, 0, 0, 0.25),
                0 0 1px rgba(0, 212, 170, 0.3) inset !important;
}

body.theme-scifi .account-card.active {
    border-color: rgba(0, 212, 170, 0.4) !important;
    background: rgba(0, 212, 170, 0.08) !important;
    box-shadow: 0 0 25px rgba(0, 212, 170, 0.15),
                0 0 1px rgba(0, 212, 170, 0.5) inset !important;
}

body.theme-scifi .account-name {
    color: #c8e6f0 !important;
}

body.theme-scifi .account-type {
    color: #5a7a8a !important;
    background: rgba(0, 212, 170, 0.08) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
}

body.theme-scifi .account-number {
    color: #5a7a8a !important;
}

body.theme-scifi .balance-label {
    color: #5a7a8a !important;
}

body.theme-scifi .balance-value.positive {
    color: #00e676 !important;
    text-shadow: 0 0 10px rgba(0, 230, 118, 0.3) !important;
}

body.theme-scifi .balance-value.negative {
    color: #ff5252 !important;
    text-shadow: 0 0 10px rgba(255, 82, 82, 0.3) !important;
}

body.theme-scifi .set-default-btn {
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid rgba(0, 212, 170, 0.25) !important;
    color: #00d4aa !important;
}

body.theme-scifi .set-default-btn:hover {
    background: rgba(0, 212, 170, 0.2) !important;
    border-color: rgba(0, 212, 170, 0.4) !important;
}

body.theme-scifi .set-default-btn.active {
    background: rgba(0, 212, 170, 0.25) !important;
    color: #c8e6f0 !important;
    border-color: rgba(0, 212, 170, 0.5) !important;
}

/* ========================================
   Sci-Fi Categories Page - 科幻分类页面
   ======================================== */

body.theme-scifi .category-details .category-name {
    color: #c8e6f0 !important;
}

body.theme-scifi .category-keywords {
    color: #5a7a8a !important;
}

body.theme-scifi .action-btn.edit {
    background: rgba(0, 212, 170, 0.15) !important;
    color: #00d4aa !important;
}

body.theme-scifi .action-btn.edit:hover {
    background: rgba(0, 212, 170, 0.25) !important;
}

body.theme-scifi .action-btn.delete {
    background: rgba(255, 82, 82, 0.15) !important;
    color: #ff5252 !important;
}

body.theme-scifi .action-btn.delete:hover {
    background: rgba(255, 82, 82, 0.25) !important;
}

body.theme-scifi .fab-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    box-shadow: 0 4px 20px rgba(0, 212, 170, 0.35),
                0 0 15px rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .fab-btn:hover {
    box-shadow: 0 6px 30px rgba(0, 212, 170, 0.5),
                0 0 20px rgba(0, 212, 170, 0.3) !important;
}

/* ========================================
   Sci-Fi Modal/Alert Styles - 科幻弹窗样式
   ======================================== */

/* --- Custom Alert --- */
body.theme-scifi .custom-alert-overlay {
    background: rgba(0, 0, 0, 0.85) !important;
}

body.theme-scifi .custom-alert-modal {
    background: rgba(10, 22, 40, 0.95) !important;
    backdrop-filter: blur(30px);
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
                0 0 1px rgba(0, 212, 170, 0.4) inset,
                0 0 40px rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .custom-alert-title {
    color: #c8e6f0 !important;
}

body.theme-scifi .custom-alert-message {
    color: #5a7a8a !important;
}

body.theme-scifi .custom-alert-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
    box-shadow: 0 4px 20px rgba(0, 212, 170, 0.35) !important;
}

body.theme-scifi .custom-alert-btn:hover {
    box-shadow: 0 6px 30px rgba(0, 212, 170, 0.5) !important;
}

/* --- Me Page Modal --- */
body.theme-scifi .modal-overlay {
    background: rgba(0, 0, 0, 0.85) !important;
}

body.theme-scifi .modal-container {
    background: rgba(10, 22, 40, 0.95) !important;
    backdrop-filter: blur(20px);
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
                0 0 1px rgba(0, 212, 170, 0.4) inset !important;
}

body.theme-scifi .modal-header {
    border-bottom: 1px solid rgba(0, 212, 170, 0.12) !important;
}

body.theme-scifi .modal-title {
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-close {
    color: #5a7a8a !important;
}

body.theme-scifi .modal-close:hover {
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-body .form-label {
    color: #5a7a8a !important;
}

body.theme-scifi .modal-body .form-input {
    background: rgba(13, 27, 42, 0.7) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-body .form-input:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
}

body.theme-scifi .modal-footer {
    border-top: 1px solid rgba(0, 212, 170, 0.12) !important;
}

body.theme-scifi .modal-btn-cancel {
    background: rgba(13, 27, 42, 0.6) !important;
    color: #5a7a8a !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
}

body.theme-scifi .modal-btn-cancel:hover {
    background: rgba(13, 27, 42, 0.8) !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-btn-confirm {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
}

/* --- Recharge Modal --- */
body.theme-scifi .recharge-tips {
    background: rgba(0, 212, 170, 0.08) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .recharge-tips p {
    color: #00d4aa !important;
}

body.theme-scifi .recharge-tips li {
    color: #5a7a8a !important;
}

body.theme-scifi .purchase-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
}

body.theme-scifi .recharge-btn {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
}

body.theme-scifi .recharge-btn:hover {
    box-shadow: 0 4px 20px rgba(0, 212, 170, 0.4) !important;
}

body.theme-scifi .diamonds-icon {
    filter: drop-shadow(0 0 8px rgba(0, 212, 170, 0.4)) !important;
}

body.theme-scifi .diamonds-text {
    color: #5a7a8a !important;
}

body.theme-scifi .diamonds-value {
    color: #00d4aa !important;
    text-shadow: 0 0 15px rgba(0, 212, 170, 0.4) !important;
}

/* --- Categories Modal --- */
body.theme-scifi .modal-content {
    background: rgba(10, 22, 40, 0.95) !important;
    backdrop-filter: blur(20px);
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
                0 0 1px rgba(0, 212, 170, 0.4) inset !important;
}

body.theme-scifi .modal-body .form-label {
    color: #5a7a8a !important;
}

body.theme-scifi .modal-body .form-input,
body.theme-scifi .modal-body .form-textarea {
    background: rgba(13, 27, 42, 0.7) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-body .form-input:focus,
body.theme-scifi .modal-body .form-textarea:focus {
    border-color: rgba(0, 212, 170, 0.5) !important;
    background: rgba(13, 27, 42, 0.85) !important;
}

body.theme-scifi .modal-body .form-input::placeholder,
body.theme-scifi .modal-body .form-textarea::placeholder {
    color: #3a5a6a !important;
}

body.theme-scifi .icon-preview {
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .btn-secondary {
    background: rgba(13, 27, 42, 0.6) !important;
    color: #c8e6f0 !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
}

body.theme-scifi .btn-secondary:hover {
    background: rgba(0, 212, 170, 0.1) !important;
}

body.theme-scifi .btn-primary {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
}

/* --- Accounts Modal --- */
body.theme-scifi .form-select {
    background: rgba(13, 27, 42, 0.7) !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .form-select option {
    background: #0d1b2a !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-btn.cancel {
    background: rgba(13, 27, 42, 0.6) !important;
    color: #c8e6f0 !important;
}

body.theme-scifi .modal-btn.confirm {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%) !important;
    color: #0a1628 !important;
}

/* ========================================
   Sci-Fi Chart & Filter Wrappers - 科幻图表和筛选
   ======================================== */

body.theme-scifi .filter-wrapper {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.15) !important;
    border-radius: 14px !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

body.theme-scifi .chart-wrapper {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2),
                0 0 1px rgba(0, 212, 170, 0.2) inset !important;
}

body.theme-scifi .chart-placeholder {
    color: #3a5a6a !important;
}

/* --- Time Selector (stats page) --- */
body.theme-scifi .time-selector {
    background: rgba(13, 27, 42, 0.6) !important;
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.05) inset !important;
}

/* --- Category Section (stats) --- */
body.theme-scifi .category-list .category-item {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.1) !important;
}

body.theme-scifi .category-list .category-item:hover {
    background: rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .category-list .category-name {
    color: #c8e6f0 !important;
}

body.theme-scifi .category-list .category-percent {
    color: #5a7a8a !important;
}

body.theme-scifi .category-list .category-amount {
    color: #ff5252 !important;
}

/* --- Menu Section (me page) --- */
body.theme-scifi .menu-section {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
    border-radius: 18px !important;
    overflow: hidden !important;
}

body.theme-scifi .menu-item {
    border-bottom: 1px solid rgba(0, 212, 170, 0.08) !important;
}

body.theme-scifi .menu-item:last-child {
    border-bottom: none !important;
}

/* --- Stats Summary (me page) --- */
body.theme-scifi .stats-summary .stat-item {
    background: rgba(13, 27, 42, 0.5) !important;
    border: 1px solid rgba(0, 212, 170, 0.12) !important;
}

body.theme-scifi .stats-summary .stat-value {
    color: #00d4aa !important;
    text-shadow: 0 0 10px rgba(0, 212, 170, 0.3) !important;
}

body.theme-scifi .stats-summary .stat-label {
    color: #5a7a8a !important;
}

/* ========================================
   Sci-Fi Global Glow Animations
   ======================================== */

/* Subtle pulsing glow for active elements */
body.theme-scifi .nav-item.active,
body.theme-scifi .time-btn.active,
body.theme-scifi .category-item.active {
    animation: scifi-glow-pulse 3s ease-in-out infinite;
}

@keyframes scifi-glow-pulse {
    0%, 100% {
        box-shadow: 0 0 15px rgba(0, 212, 170, 0.15);
    }
    50% {
        box-shadow: 0 0 25px rgba(0, 212, 170, 0.25);
    }
}

/* Add subtle scanline effect to cards on hover */
body.theme-scifi .transaction-item:hover::after,
body.theme-scifi .menu-item:hover::after,
body.theme-scifi .category-item:hover::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg,
        transparent,
        rgba(0, 212, 170, 0.5),
        transparent
    );
    animation: scifi-scanline 2s ease-in-out infinite;
}

@keyframes scifi-scanline {
    0% {
        transform: translateY(0);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: translateY(100%);
        opacity: 0;
    }
}