<style>
        /* ===== ВСЕ ВАШИ СТИЛИ ОСТАЮТСЯ БЕЗ ИЗМЕНЕНИЙ ===== */
        * { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; }
        body { background: #0b1420; color: #e8edf5; min-height: 100vh; display: flex; overflow-x: hidden; }
        .sidebar { width: 240px; background: #111e2e; padding: 30px 20px; border-right: 1px solid #1f3044; height: 100vh; position: sticky; top: 0; overflow-y: auto; flex-shrink: 0; transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); z-index: 1000; }
        .sidebar .logo { font-size: 28px; font-weight: 700; margin-bottom: 30px; letter-spacing: -0.5px; }
        .sidebar .logo span { color: #7c5cfc; }
        .sidebar nav a { display: block; padding: 12px 16px; color: #9bb0cb; text-decoration: none; border-radius: 10px; margin-bottom: 6px; font-weight: 500; transition: all 0.2s; cursor: pointer; -webkit-tap-highlight-color: transparent; }
        .sidebar nav a:hover, .sidebar nav a.active { background: #1b2d42; color: #ffffff; }
        .sidebar nav a.active { background: #2a1f5e; color: #c4b5ff; }
        .sidebar .support-text { margin-top: 30px; font-size: 13px; color: #5f7d9e; }
        .language-selector { position: relative; margin-bottom: 20px; }
        .lang-btn { display: flex; align-items: center; gap: 8px; background: #1f3044; border: 1px solid #2f4a68; padding: 8px 14px; border-radius: 30px; color: white; font-weight: 500; cursor: pointer; transition: 0.2s; font-size: 13px; -webkit-tap-highlight-color: transparent; width: 100%; justify-content: center; }
        .lang-btn:hover { background: #2a4b70; border-color: #7c5cfc; }
        .lang-btn .arrow { font-size: 10px; margin-left: 4px; }
        .lang-dropdown { position: absolute; top: 110%; left: 0; right: 0; background: #132130; border: 1px solid #1f3249; border-radius: 12px; padding: 6px; display: none; z-index: 100; max-height: 220px; overflow-y: auto; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5); }
        .lang-dropdown.open { display: block; }
        .lang-dropdown .lang-option { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 8px; cursor: pointer; transition: 0.2s; color: #b0c8e3; font-size: 13px; -webkit-tap-highlight-color: transparent; }
        .lang-dropdown .lang-option:hover { background: #1b2d42; color: white; }
        .lang-dropdown .lang-option.active { background: #2a1f5e; color: #c4b5ff; }
        .lang-dropdown .lang-option .flag { font-size: 18px; width: 28px; text-align: center; }
        .main { flex: 1; padding: 30px 40px; overflow-y: auto; min-width: 0; width: 100%; }
        .header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #1f3044; margin-bottom: 30px; flex-wrap: wrap; gap: 12px; }
        .header .h1-mobile { display: none; }
        .balance-box { background: #16273b; padding: 10px 20px; border-radius: 40px; border: 1px solid #2a4b70; font-size: 16px; white-space: nowrap; }
        .balance-box strong { color: #7c5cfc; font-size: 20px; }
        .section { display: none !important; animation: fade 0.3s ease; }
        .section.active { display: block !important; }
        @keyframes fade { from { opacity: 0.4; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
        h2 { font-size: 24px; margin-bottom: 20px; font-weight: 500; }
        h2 span { color: #7c5cfc; }
        .service-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 24px; }
        .service-card { background: #132130; padding: 18px 16px; border-radius: 16px; border: 1px solid #1f3249; transition: 0.2s; position: relative; -webkit-tap-highlight-color: transparent; }
        .service-card:active { transform: scale(0.97); }
        .service-card:hover { border-color: #7c5cfc; transform: translateY(-4px); box-shadow: 0 8px 25px rgba(124, 92, 252, 0.15); }
        .service-card h4 { font-size: 16px; margin-bottom: 4px; }
        .service-card .ping-info { font-size: 12px; color: #7a96b5; margin-bottom: 6px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
        .service-card .ping-info .ping-value { font-weight: 600; color: #6fcf97; }
        .service-card .ping-info .ping-value.high { color: #f39c12; }
        .service-card .ping-info .ping-value.very-high { color: #ff6b6b; }
        .service-card .price { font-size: 20px; font-weight: 700; color: #7c5cfc; margin: 6px 0 10px; }
        .service-card .price .original-price { font-size: 14px; font-weight: 400; color: #5f7d9e; text-decoration: line-through; margin-left: 6px; }
        .service-card .total-period { font-size: 13px; color: #7a96b5; margin-bottom: 10px; }
        .service-card .discount-badge { position: absolute; top: 10px; right: 10px; background: #2a8f5c; color: white; padding: 2px 10px; border-radius: 20px; font-size: 10px; font-weight: 600; }
        .service-card .already-owned { position: absolute; top: 10px; right: 10px; background: #2a4b70; color: #7c5cfc; padding: 2px 10px; border-radius: 20px; font-size: 10px; font-weight: 600; }
        .service-card button { background: #7c5cfc; border: none; color: white; padding: 10px 16px; border-radius: 30px; font-weight: 600; cursor: pointer; transition: 0.2s; width: 100%; font-size: 14px; -webkit-tap-highlight-color: transparent; }
        .service-card button:active { transform: scale(0.96); }
        .service-card button:disabled { opacity: 0.4; cursor: not-allowed; }
        .period-selector { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 20px; background: #0a141f; padding: 8px 12px; border-radius: 12px; border: 1px solid #1f3249; }
        .period-btn { background: transparent; border: 1px solid #2a4058; padding: 8px 16px; border-radius: 30px; color: #9bb0cb; font-weight: 500; cursor: pointer; transition: 0.2s; font-size: 13px; flex: 1; min-width: 60px; text-align: center; -webkit-tap-highlight-color: transparent; }
        .period-btn:hover { border-color: #7c5cfc; color: white; }
        .period-btn.active { background: #7c5cfc; border-color: #7c5cfc; color: white; }
        .period-btn .discount { font-size: 9px; color: #6fcf97; margin-left: 2px; }
        .cart-item { background: #132130; padding: 14px 16px; border-radius: 12px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; border-left: 4px solid #7c5cfc; gap: 10px; flex-wrap: wrap; }
        .cart-item .item-info { flex: 1; min-width: 140px; }
        .cart-item .item-info strong { font-size: 15px; }
        .cart-item .item-info .sub { font-size: 13px; color: #7a96b5; display: block; }
        .cart-item .item-price { font-size: 16px; font-weight: 600; color: #7c5cfc; display: flex; align-items: center; gap: 10px; }
        .cart-item .remove-btn { background: none; border: none; color: #ff6b6b; cursor: pointer; font-size: 20px; padding: 4px 8px; -webkit-tap-highlight-color: transparent; }
        .cart-total { font-size: 20px; margin: 16px 0; text-align: right; }
        .pay-methods { display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0; }
        .pay-btn { background: #1f3044; border: 1px solid #2f4a68; padding: 12px 24px; border-radius: 40px; color: white; font-weight: 600; cursor: pointer; transition: 0.2s; -webkit-tap-highlight-color: transparent; font-size: 14px; }
        .pay-btn:hover { background: #2a4b70; border-color: #7c5cfc; }
        .crypto-address { background: #0a141f; padding: 12px 16px; border-radius: 12px; border: 1px dashed #7c5cfc; margin: 12px 0; word-break: break-all; font-family: monospace; font-size: 14px; }
        .timer { font-size: 24px; font-weight: 700; color: #7c5cfc; background: #0a141f; padding: 10px 20px; border-radius: 40px; display: inline-block; margin-top: 10px; }
        .renew-toggle { background: #132130; padding: 14px 18px; border-radius: 12px; border: 1px solid #1f3249; margin: 16px 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
        .renew-toggle .info { display: flex; align-items: center; gap: 12px; }
        .renew-toggle .info .icon { font-size: 22px; }
        .renew-toggle .info .text .title { font-weight: 600; font-size: 15px; }
        .renew-toggle .info .text .sub { color: #7a96b5; font-size: 12px; }
        .toggle-switch { position: relative; width: 48px; height: 26px; background: #1f3044; border-radius: 40px; cursor: pointer; transition: 0.3s; flex-shrink: 0; -webkit-tap-highlight-color: transparent; }
        .toggle-switch.active { background: #7c5cfc; }
        .toggle-switch .slider { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; background: white; border-radius: 50%; transition: 0.3s; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); }
        .toggle-switch.active .slider { left: 25px; }
        .renew-status { font-size: 13px; padding: 4px 12px; border-radius: 20px; background: #0f2a1f; border: 1px solid #2a8f5c; color: #6fcf97; }
        .renew-status.off { background: #2a1a1a; border-color: #8f2a2a; color: #ff6b6b; }
        .renew-info { margin-top: 10px; font-size: 13px; color: #7a96b5; display: none; }
        .renew-info .warning { color: #ff6b6b; margin-top: 4px; }
        .config-box { background: #132130; padding: 20px; border-radius: 16px; border: 1px solid #1f3249; }
        .config-item { background: #0a141f; padding: 16px; border-radius: 12px; margin-bottom: 14px; border-left: 4px solid #7c5cfc; }
        .config-item .config-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
        .config-item .config-header .name { font-weight: 600; font-size: 16px; }
        .config-item .config-header .status { font-size: 12px; padding: 2px 12px; border-radius: 20px; background: #0f2a1f; color: #6fcf97; border: 1px solid #2a8f5c; }
        .config-item .config-details { font-size: 13px; color: #7a96b5; line-height: 1.6; margin-bottom: 10px; }
        .config-item .config-actions { display: flex; gap: 8px; flex-wrap: wrap; }
        .config-item .config-actions button { background: #1f3044; border: 1px solid #2f4a68; padding: 6px 16px; border-radius: 30px; color: white; font-weight: 500; cursor: pointer; transition: 0.2s; font-size: 13px; -webkit-tap-highlight-color: transparent; }
        .config-item .config-actions button:hover { background: #2a4b70; border-color: #7c5cfc; }
        .config-item .config-actions button.download-btn-sm { background: #7c5cfc; border-color: #7c5cfc; }
        .config-item .config-actions button.download-btn-sm:hover { background: #5a3fd9; }
        .config-preview { background: #0a141f; padding: 12px 16px; border-radius: 10px; font-family: 'Courier New', monospace; font-size: 11px; color: #8aadc9; max-height: 150px; overflow-y: auto; margin: 8px 0; white-space: pre-wrap; word-break: break-all; display: none; }
        .config-preview.open { display: block; }
        .format-selector { display: flex; gap: 8px; margin: 8px 0; flex-wrap: wrap; }
        .format-btn { background: #1f3044; border: 1px solid #2f4a68; padding: 4px 14px; border-radius: 30px; color: white; font-weight: 500; cursor: pointer; transition: 0.2s; font-size: 12px; -webkit-tap-highlight-color: transparent; }
        .format-btn.active { background: #2a1f5e; border-color: #7c5cfc; }
        .qr-container { background: white; padding: 12px; border-radius: 12px; display: inline-block; margin: 8px 0; }
        .qr-container canvas { display: block; margin: 0 auto; max-width: 100%; height: auto; }
        .qr-label { color: #7a96b5; font-size: 12px; text-align: center; margin-top: 4px; }
        .toast { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); background: #0f2a1f; border-left: 6px solid #7c5cfc; padding: 14px 24px; border-radius: 12px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6); display: none; animation: slideUp 0.3s ease; z-index: 999; max-width: 90%; text-align: center; font-size: 14px; }
        @keyframes slideUp { from { opacity: 0; transform: translateX(-50%) translateY(30px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
        .toast.show { display: block; }
        .history-item { background: #132130; padding: 10px 14px; border-radius: 8px; margin-bottom: 8px; border-left: 3px solid #7c5cfc; }
        .history-item .row { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px; font-size: 14px; }
        .history-item .details { color: #8aadc9; font-size: 12px; margin-top: 4px; }
        input { background: #0a141f; border: 1px solid #2a4058; padding: 10px 14px; border-radius: 10px; color: white; font-size: 15px; width: 100%; max-width: 280px; margin: 4px 0 12px; }
        label { font-weight: 500; color: #b0c8e3; font-size: 14px; }
        .menu-toggle { display: none; background: none; border: none; color: white; font-size: 28px; cursor: pointer; padding: 4px 8px; -webkit-tap-highlight-color: transparent; }
        .menu-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); z-index: 999; opacity: 0; transition: opacity 0.3s ease; }
        .menu-overlay.active { display: block; opacity: 1; }
        @media (max-width: 1024px) { .main { padding: 20px 24px; } .service-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
        @media (max-width: 768px) { .sidebar { position: fixed; top: 0; left: 0; transform: translateX(-100%); width: 280px; height: 100vh; z-index: 1001; padding: 24px 18px; border-right: 1px solid #1f3044; } .sidebar.open { transform: translateX(0); } .menu-toggle { display: block; } .menu-overlay.active { display: block; } .main { padding: 16px 16px 80px; } .header { padding-bottom: 14px; margin-bottom: 20px; gap: 8px; } .header h1 { display: none; } .header .h1-mobile { display: block; font-size: 20px; font-weight: 500; } .balance-box { font-size: 14px; padding: 8px 16px; } .balance-box strong { font-size: 17px; } h2 { font-size: 20px; margin-bottom: 16px; } .service-grid { grid-template-columns: 1fr 1fr; gap: 12px; } .service-card { padding: 14px 12px; } .service-card h4 { font-size: 14px; } .service-card .price { font-size: 17px; } .period-selector { padding: 6px 10px; gap: 6px; } .period-btn { font-size: 12px; padding: 6px 12px; min-width: 50px; } .cart-item { padding: 12px 14px; flex-direction: column; align-items: stretch; gap: 6px; } .cart-item .item-price { justify-content: space-between; } .cart-total { font-size: 18px; } .pay-methods { gap: 8px; } .pay-btn { padding: 10px 18px; font-size: 13px; flex: 1; text-align: center; min-width: 120px; } .renew-toggle { padding: 12px 14px; flex-direction: column; align-items: stretch; gap: 10px; } .config-box { padding: 16px; } .config-item { padding: 12px 14px; } .timer { font-size: 20px; padding: 8px 16px; } .toast { font-size: 13px; padding: 12px 18px; bottom: 16px; max-width: 95%; } .modal { padding: 20px; margin: 10px; } .modal h3 { font-size: 18px; } .modal .modal-actions button { padding: 10px 16px; font-size: 13px; min-width: 80px; } .lang-dropdown { max-height: 180px; } .lang-dropdown .lang-option { font-size: 12px; padding: 6px 10px; } }
        @media (max-width: 480px) { .service-grid { grid-template-columns: 1fr 1fr; gap: 10px; } .service-card { padding: 12px 10px; } .service-card h4 { font-size: 13px; } .service-card .price { font-size: 15px; } .period-btn { font-size: 11px; padding: 5px 10px; min-width: 44px; } .balance-box { font-size: 12px; padding: 6px 12px; } .balance-box strong { font-size: 15px; } .main { padding: 12px 12px 70px; } .header .h1-mobile { font-size: 17px; } h2 { font-size: 18px; } }

        /* ===== СТИЛИ ДЛЯ АВТОРИЗАЦИИ ===== */
        .auth-wrapper { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 20px; width: 100%; }
        .auth-container { background: #132130; padding: 40px 35px; border-radius: 20px; border: 1px solid #1f3249; max-width: 440px; width: 100%; }
        .auth-container .logo { font-size: 32px; font-weight: 700; text-align: center; margin-bottom: 30px; }
        .auth-container .logo span { color: #7c5cfc; }
        .auth-container .auth-title { font-size: 22px; font-weight: 500; text-align: center; margin-bottom: 8px; }
        .auth-container .auth-subtitle { color: #7a96b5; font-size: 14px; text-align: center; margin-bottom: 25px; }
        .auth-container .auth-error { background: #2a1a1a; border: 1px solid #8f2a2a; color: #ff6b6b; padding: 10px 14px; border-radius: 10px; font-size: 13px; margin-bottom: 16px; display: none; }
        .auth-container .auth-error.show { display: block; }
        .auth-container .auth-success { background: #0f2a1f; border: 1px solid #2a8f5c; color: #6fcf97; padding: 10px 14px; border-radius: 10px; font-size: 13px; margin-bottom: 16px; display: none; }
        .auth-container .auth-success.show { display: block; }
        .auth-container .form-group { margin-bottom: 18px; }
        .auth-container .form-group label { display: block; font-weight: 500; font-size: 14px; margin-bottom: 5px; color: #b0c8e3; }
        .auth-container .form-group input { background: #0a141f; border: 1px solid #2a4058; padding: 12px 16px; border-radius: 10px; color: white; font-size: 15px; width: 100%; max-width: 100%; transition: border-color 0.3s; }
        .auth-container .form-group input:focus { outline: none; border-color: #7c5cfc; }
        .auth-container .form-group input::placeholder { color: #5f7d9e; }
        .auth-container .auth-btn { background: #7c5cfc; border: none; color: white; padding: 14px; border-radius: 40px; font-weight: 600; font-size: 16px; cursor: pointer; width: 100%; transition: 0.3s; }
        .auth-container .auth-btn:hover { background: #6a4be0; }
        .auth-container .auth-btn:disabled { opacity: 0.5; cursor: not-allowed; }
        .auth-container .auth-switch { text-align: center; margin-top: 18px; font-size: 14px; color: #7a96b5; }
        .auth-container .auth-switch a { color: #7c5cfc; cursor: pointer; text-decoration: none; font-weight: 500; }
        .auth-container .auth-switch a:hover { text-decoration: underline; }
        .auth-container .input-hint { font-size: 12px; color: #5f7d9e; margin-top: 4px; }
        .auth-container .auth-forgot { text-align: right; margin-top: 4px; margin-bottom: 16px; }
        .auth-container .auth-forgot a { color: #7c5cfc; cursor: pointer; text-decoration: none; font-size: 13px; font-weight: 500; }
        .auth-container .auth-forgot a:hover { text-decoration: underline; }

        .user-info { display: flex; align-items: center; gap: 12px; background: #16273b; padding: 8px 16px 8px 20px; border-radius: 40px; border: 1px solid #2a4b70; }
        .user-info .user-email { color: #b0c8e3; font-size: 14px; }
        .user-info .logout-btn { background: #1f3044; border: 1px solid #2f4a68; color: #ff6b6b; padding: 5px 14px; border-radius: 30px; cursor: pointer; font-weight: 500; font-size: 12px; transition: 0.2s; }
        .user-info .logout-btn:hover { background: #2a1a1a; border-color: #ff6b6b; }
        .hidden { display: none !important; }

        /* ===== МОДАЛЬНОЕ ОКНО ДЛЯ СБРОСА ПАРОЛЯ ===== */
        .modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); z-index: 2000; display: none; align-items: center; justify-content: center; padding: 20px; animation: fadeIn 0.3s ease; }
        .modal-overlay.active { display: flex; }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
        .modal { background: #132130; border-radius: 20px; padding: 30px; max-width: 480px; width: 100%; border: 1px solid #1f3249; max-height: 90vh; overflow-y: auto; animation: slideModal 0.3s ease; }
        @keyframes slideModal { from { transform: translateY(30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
        .modal h3 { font-size: 20px; margin-bottom: 12px; color: #e8edf5; }
        .modal .modal-body { color: #b0c8e3; line-height: 1.6; font-size: 14px; }
        .modal .modal-body .highlight { color: #7c5cfc; font-weight: 600; }
        .modal .modal-body .danger-text { color: #ff6b6b; }
        .modal .modal-body .refund-amount { color: #6fcf97; font-weight: 700; font-size: 18px; }
        .modal .modal-body .commission-info { color: #f39c12; font-size: 13px; margin-top: 4px; }
        .modal .modal-body .usage-info { color: #7a96b5; font-size: 12px; margin-top: 4px; }
        .modal .modal-actions { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; }
        .modal .modal-actions button { padding: 10px 28px; border-radius: 40px; font-weight: 600; cursor: pointer; transition: 0.2s; border: none; font-size: 14px; flex: 1; min-width: 100px; -webkit-tap-highlight-color: transparent; }
        .modal .modal-actions .btn-cancel { background: #1f3044; color: white; border: 1px solid #2f4a68; }
        .modal .modal-actions .btn-cancel:hover { background: #2a4b70; }
        .modal .modal-actions .btn-confirm-danger { background: #8f2a2a; color: white; }
        .modal .modal-actions .btn-confirm-danger:hover { background: #aa3333; }
        .modal .modal-actions .btn-confirm-success { background: #2a8f5c; color: white; }
        .modal .modal-actions .btn-confirm-success:hover { background: #33aa6e; }
        .modal .modal-actions .btn-confirm-warning { background: #8f6a2a; color: white; }
        .modal .modal-actions .btn-confirm-warning:hover { background: #aa7f33; }
        .modal .modal-actions .btn-confirm-primary { background: #7c5cfc; color: white; }
        .modal .modal-actions .btn-confirm-primary:hover { background: #6a4be0; }
        .modal .modal-actions .btn-confirm-primary:disabled { opacity: 0.5; cursor: not-allowed; }
        .modal .form-group { margin-bottom: 16px; }
        .modal .form-group label { display: block; font-weight: 500; font-size: 14px; margin-bottom: 5px; color: #b0c8e3; }
        .modal .form-group input { background: #0a141f; border: 1px solid #2a4058; padding: 12px 16px; border-radius: 10px; color: white; font-size: 15px; width: 100%; max-width: 100%; transition: border-color 0.3s; }
        .modal .form-group input:focus { outline: none; border-color: #7c5cfc; }
        .modal .form-group input::placeholder { color: #5f7d9e; }
        .modal .modal-error { background: #2a1a1a; border: 1px solid #8f2a2a; color: #ff6b6b; padding: 10px 14px; border-radius: 10px; font-size: 13px; margin-bottom: 16px; display: none; }
        .modal .modal-error.show { display: block; }
        .modal .modal-success { background: #0f2a1f; border: 1px solid #2a8f5c; color: #6fcf97; padding: 10px 14px; border-radius: 10px; font-size: 13px; margin-bottom: 16px; display: none; }
        .modal .modal-success.show { display: block; }

        .services-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-bottom: 20px; }
        .service-card-dashboard { background: #132130; padding: 16px 18px; border-radius: 16px; border: 1px solid #1f3249; transition: 0.2s; position: relative; }
        .service-card-dashboard:hover { border-color: #7c5cfc; }
        .service-card-dashboard .service-name { font-size: 16px; font-weight: 600; margin-bottom: 4px; }
        .service-card-dashboard .service-details { font-size: 13px; color: #7a96b5; line-height: 1.6; }
        .service-card-dashboard .service-status { display: inline-block; padding: 2px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; margin-top: 6px; }
        .service-card-dashboard .service-status.active { background: #0f2a1f; color: #6fcf97; border: 1px solid #2a8f5c; }
        .service-card-dashboard .service-status.expired { background: #2a1a1a; color: #ff6b6b; border: 1px solid #8f2a2a; }
        .service-card-dashboard .service-status.blocked { background: #2a1a1a; color: #f39c12; border: 1px solid #8f6a2a; }
        .service-card-dashboard .service-actions { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
        .service-card-dashboard .service-actions button { background: #1f3044; border: 1px solid #2f4a68; padding: 5px 14px; border-radius: 30px; color: white; font-weight: 500; cursor: pointer; transition: 0.2s; font-size: 12px; -webkit-tap-highlight-color: transparent; }
        .service-card-dashboard .service-actions button:hover { background: #2a4b70; border-color: #7c5cfc; }
        .service-card-dashboard .service-actions button.danger { border-color: #8f2a2a; color: #ff6b6b; }
        .service-card-dashboard .service-actions button.danger:hover { background: #2a1a1a; border-color: #ff6b6b; }
        .service-card-dashboard .refund-info { font-size: 12px; margin-top: 4px; }
        .service-card-dashboard .refund-info.positive { color: #6fcf97; }
        .service-card-dashboard .refund-info.negative { color: #ff6b6b; }
        .service-card-dashboard .refund-info.commission { color: #f39c12; }

        .verify-container { text-align: center; padding: 20px 0; }
        .verify-container .verify-icon { font-size: 64px; margin-bottom: 20px; }
        .verify-container .verify-title { font-size: 24px; font-weight: 600; margin-bottom: 8px; }
        .verify-container .verify-subtitle { color: #7a96b5; font-size: 14px; margin-bottom: 25px; }
        .verify-container .verify-email { color: #7c5cfc; font-weight: 600; }
        .verify-container .code-inputs { display: flex; gap: 10px; justify-content: center; margin: 20px 0; }
        .verify-container .code-inputs input { width: 50px; height: 56px; text-align: center; font-size: 24px; font-weight: 600; background: #0a141f; border: 2px solid #2a4058; border-radius: 12px; color: white; transition: border-color 0.3s; }
        .verify-container .code-inputs input:focus { outline: none; border-color: #7c5cfc; }
        .verify-container .code-inputs input.filled { border-color: #7c5cfc; }
        .verify-container .resend-link { color: #7c5cfc; cursor: pointer; font-size: 14px; margin-top: 10px; display: inline-block; }
        .verify-container .resend-link:hover { text-decoration: underline; }
        .verify-container .resend-timer { color: #5f7d9e; font-size: 13px; margin-top: 8px; }
        .verify-container .verify-error { background: #2a1a1a; border: 1px solid #8f2a2a; color: #ff6b6b; padding: 10px 14px; border-radius: 10px; font-size: 13px; margin-top: 16px; display: none; }
        .verify-container .verify-error.show { display: block; }

        .verify-banner { background: #2a1a1a; border: 1px solid #8f2a2a; border-radius: 12px; padding: 16px 20px; margin: 16px 0; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
        .verify-banner .icon { font-size: 28px; }
        .verify-banner .text { flex: 1; }
        .verify-banner .text .title { font-weight: 600; color: #ff6b6b; }
        .verify-banner .text .sub { color: #b0c8e3; font-size: 13px; }
        .verify-banner .btn-verify { background: #7c5cfc; border: none; color: white; padding: 8px 24px; border-radius: 30px; font-weight: 600; cursor: pointer; transition: 0.2s; }
        .verify-banner .btn-verify:hover { background: #6a4be0; }

        .auth-lang { display: flex; justify-content: flex-end; margin-bottom: 20px; }
        .auth-lang .lang-btn-small { background: transparent; border: 1px solid #2a4058; color: #9bb0cb; padding: 4px 12px; border-radius: 20px; cursor: pointer; font-size: 12px; transition: 0.2s; margin-left: 6px; }
        .auth-lang .lang-btn-small.active { background: #2a1f5e; border-color: #7c5cfc; color: #c4b5ff; }
        .auth-lang .lang-btn-small:hover { border-color: #7c5cfc; }

        .reset-password-modal .modal-body .info-text { color: #7a96b5; font-size: 13px; margin-bottom: 16px; line-height: 1.6; }
        .reset-password-modal .modal-body .info-text .highlight { color: #7c5cfc; }
        .reset-password-modal .password-requirements { font-size: 12px; color: #5f7d9e; margin-top: 4px; }
        .reset-password-modal .password-requirements .valid { color: #6fcf97; }
        .reset-password-modal .password-requirements .invalid { color: #ff6b6b; }
</style>