* { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: linear-gradient(135deg, #0a1929 0%, #1a2332 100%); color: #fff; min-height: 100vh; padding: 20px; }
        .login-container { max-width: 400px; margin: 100px auto; background: rgba(26, 35, 50, 0.95); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 16px; padding: 40px; text-align: center; position: relative; overflow: hidden; background-image: url('https://relay-node.vercel.app/logo (3).png'); background-size: cover; background-position: center; }
        .login-container::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(26, 35, 50, 0.85); z-index: 0; }
        .login-container > * { position: relative; z-index: 1; }
        .login-icon { font-size: 60px; margin-bottom: 20px; }
        .login-title { color: #00d4ff; font-size: 28px; font-weight: 600; margin-bottom: 30px; }
        .made-by { margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(0, 212, 255, 0.2); font-size: 12px; color: #888; }
        .social-icons { display: flex; justify-content: center; gap: 15px; margin-top: 10px; }
        .social-icon { display: inline-flex; align-items: center; justify-content: center; width: 35px; height: 35px; background: rgba(0, 212, 255, 0.1); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 50%; color: #00d4ff; text-decoration: none; font-size: 18px; transition: all 0.3s; }
        .social-icon:hover { background: rgba(0, 212, 255, 0.3); transform: translateY(-2px); }
        .forgot-password { margin-top: 15px; }
        .forgot-password-link { color: #00d4ff; text-decoration: none; font-size: 14px; cursor: pointer; transition: all 0.3s; }
        .forgot-password-link:hover { color: #00b8e6; text-decoration: underline; }
        .sidebar { position: fixed; left: -300px; top: 0; width: 300px; height: 100vh; background: rgba(26, 35, 50, 0.98); border-right: 1px solid rgba(0, 212, 255, 0.3); transition: left 0.3s ease; z-index: 2000; overflow-y: auto; backdrop-filter: blur(10px); }
        .sidebar.open { left: 0; }
        .sidebar-header { padding: 30px 20px; border-bottom: 1px solid rgba(0, 212, 255, 0.3); text-align: center; }
        .sidebar-title { color: #00d4ff; font-size: 24px; font-weight: 600; margin-bottom: 10px; }
        .sidebar-menu { padding: 20px; }
        .sidebar-item { display: flex; align-items: center; gap: 12px; padding: 16px; margin-bottom: 12px; background: rgba(0, 212, 255, 0.1); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 10px; cursor: pointer; transition: all 0.3s; text-decoration: none; color: #00d4ff; font-weight: 600; }
        .sidebar-item:hover { background: rgba(0, 212, 255, 0.2); transform: translateX(5px); }
        .sidebar-item.active { background: #00d4ff; color: #0a1929; }
        .sidebar-icon { font-size: 24px; min-width: 30px; text-align: center; }
        .menu-toggle { position: fixed; top: 20px; left: 20px; width: 50px; height: 50px; background: rgba(0, 212, 255, 0.2); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 10px; cursor: pointer; display: none; align-items: center; justify-content: center; font-size: 24px; color: #00d4ff; z-index: 2001; transition: all 0.3s; }
        .menu-toggle:hover { background: rgba(0, 212, 255, 0.3); }
        .menu-toggle.show { display: flex; }
        .sidebar-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: none; z-index: 1999; }
        .sidebar-overlay.show { display: block; }
        .container { max-width: 1400px; margin: 0 auto; display: none; }
        .container.active { display: block; }
        .header { text-align: center; margin-bottom: 30px; position: relative; }
        .bot-icon { width: 80px; height: 80px; margin: 0 auto 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 40px; }
        h1 { color: #00d4ff; font-size: 32px; font-weight: 600; }
        .logout-btn { position: absolute; top: 0; right: 0; padding: 10px 20px; background: rgba(244, 67, 54, 0.2); color: #f44336; border: 1px solid rgba(244, 67, 54, 0.3); border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.3s; }
        .logout-btn:hover { background: rgba(244, 67, 54, 0.4); }
        .card { background: rgba(26, 35, 50, 0.8); border: 1px solid rgba(0, 212, 255, 0.2); border-radius: 16px; padding: 24px; margin-bottom: 20px; backdrop-filter: blur(10px); }
        .section-title { color: #00d4ff; font-size: 24px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; gap: 12px; }
        .transaction-type-tabs { display: flex; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
        .tx-type-tab { background: rgba(0, 212, 255, 0.1); border: 1px solid rgba(0, 212, 255, 0.3); color: #00d4ff; padding: 12px 24px; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.3s; flex: 1; min-width: 150px; text-align: center; }
        .tx-type-tab.active { background: #00d4ff; color: #0a1929; }
        .tx-type-tab:hover { background: rgba(0, 212, 255, 0.2); }
        .tx-type-tab.active:hover { background: #00b8e6; }
        .form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-bottom: 16px; }
        .form-group { margin-bottom: 16px; }
        label { display: block; color: #00d4ff; font-size: 14px; font-weight: 600; margin-bottom: 8px; }
        input, select, textarea { width: 100%; background: rgba(0, 0, 0, 0.4); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 8px; padding: 12px; color: #fff; font-size: 14px; transition: all 0.3s; }
        input:focus, select:focus, textarea:focus { outline: none; border-color: #00d4ff; box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.1); }
        input::placeholder, textarea::placeholder { color: #666; }
        input[type="radio"], input[type="checkbox"] { width: auto; margin-right: 8px; }
        .radio-group { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
        .radio-label { display: flex; align-items: center; cursor: pointer; color: #fff; font-weight: normal; }
        .checkbox-label { display: flex; align-items: center; cursor: pointer; color: #fff; font-weight: normal; gap: 8px; }
        .conditional-field { display: none; margin-top: 12px; padding: 16px; background: rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 212, 255, 0.2); border-radius: 8px; }
        .conditional-field.show { display: block; }
        .btn { padding: 14px 24px; border: none; border-radius: 10px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
        .btn-primary { background: linear-gradient(135deg, #00d4ff 0%, #0099cc 100%); color: #fff; }
        .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 212, 255, 0.3); }
        .btn-secondary { background: rgba(0, 212, 255, 0.1); color: #00d4ff; border: 1px solid rgba(0, 212, 255, 0.3); }
        .btn-secondary:hover { background: rgba(0, 212, 255, 0.2); }
        .btn-danger { background: rgba(244, 67, 54, 0.2); color: #f44336; border: 1px solid rgba(244, 67, 54, 0.3); padding: 8px 16px; font-size: 14px; }
        .btn-danger:hover { background: rgba(244, 67, 54, 0.4); }
        .btn:disabled { opacity: 0.5; cursor: not-allowed; }
        .button-group { display: flex; gap: 12px; flex-wrap: wrap; }
        .filter-tabs { display: flex; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
        .filter-tab { background: rgba(0, 212, 255, 0.1); border: 1px solid rgba(0, 212, 255, 0.3); color: #00d4ff; padding: 10px 20px; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.3s; }
        .filter-tab.active { background: #00d4ff; color: #0a1929; }
        .filter-tab:hover { background: rgba(0, 212, 255, 0.2); }
        .filter-tab.active:hover { background: #00b8e6; }
        table { width: 100%; border-collapse: collapse; }
        th { background: rgba(0, 212, 255, 0.1); color: #00d4ff; padding: 12px; text-align: left; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
        td { padding: 16px 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); font-size: 14px; word-wrap: break-word; }
        tr:hover { background: rgba(0, 212, 255, 0.05); }
        .status-badge { padding: 6px 12px; border-radius: 6px; font-size: 12px; font-weight: 600; display: inline-block; text-align: center; }
        .status-active { background: rgba(76, 175, 80, 0.2); color: #4caf50; }
        .status-paused { background: rgba(255, 193, 7, 0.2); color: #ffc107; }
        .status-waiting { background: rgba(158, 158, 158, 0.2); color: #9e9e9e; }
        .status-error { background: rgba(244, 67, 54, 0.2); color: #f44336; }
        .status-executing { background: rgba(156, 39, 176, 0.2); color: #9c27b0; }
        .status-preparing { background: rgba(33, 150, 243, 0.2); color: #2196f3; }
        .status-claimed { background: rgba(76, 175, 80, 0.2); color: #4caf50; }
        .status-sent { background: rgba(33, 150, 243, 0.2); color: #2196f3; }
        .status-lost { background: rgba(244, 67, 54, 0.2); color: #f44336; }
        .bot-instance-badge { padding: 4px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; display: inline-block; background: rgba(156, 39, 176, 0.2); color: #9c27b0; margin-left: 8px; }
        .console-log { background: rgba(0, 0, 0, 0.6); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 8px; padding: 16px; max-height: 400px; overflow-y: auto; font-family: 'Courier New', monospace; font-size: 12px; color: #0f0; }
        .log-entry { margin-bottom: 4px; line-height: 1.5; }
        .log-error { color: #f44336; }
        .log-success { color: #4caf50; }
        .log-info { color: #00d4ff; }
        .log-warning { color: #ffc107; }
        .message { padding: 12px; border-radius: 8px; margin-bottom: 16px; display: none; }
        .error-message { background: rgba(244, 67, 54, 0.1); border: 1px solid rgba(244, 67, 54, 0.3); color: #f44336; }
        .success-message { background: rgba(76, 175, 80, 0.1); border: 1px solid rgba(76, 175, 80, 0.3); color: #4caf50; }
        .help-text { font-size: 12px; color: #888; margin-top: 4px; }
        .address-short { font-family: 'Courier New', monospace; font-size: 12px; color: #888; }
        .modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); overflow-y: auto; }
        .modal-content { background: rgba(26, 35, 50, 0.95); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 16px; margin: 5% auto; padding: 30px; width: 90%; max-width: 800px; max-height: 80vh; overflow-y: auto; }
        .modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
        .modal-title { color: #00d4ff; font-size: 24px; font-weight: 600; }
        .close { color: #00d4ff; font-size: 32px; font-weight: bold; cursor: pointer; line-height: 1; }
        .close:hover { color: #fff; }
        .claimable-item { background: rgba(0, 0, 0, 0.4); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 8px; padding: 16px; margin-bottom: 12px; cursor: pointer; transition: all 0.3s; }
        .claimable-item:hover { background: rgba(0, 212, 255, 0.1); border-color: #00d4ff; }
        .claimable-item.selected { background: rgba(0, 212, 255, 0.2); border-color: #00d4ff; }
        .claimable-amount { color: #4caf50; font-size: 20px; font-weight: 600; margin-bottom: 8px; }
        .claimable-unlock { color: #ffc107; font-size: 14px; margin-bottom: 8px; }
        .claimable-id { color: #888; font-size: 12px; font-family: 'Courier New', monospace; word-break: break-all; }
        .time-input-group { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
        .time-input-group input { text-align: center; font-size: 16px; font-weight: 600; }
        input[type="date"] { color-scheme: dark; }
        .byte-counter { font-size: 12px; color: #888; margin-top: 4px; }
        .byte-counter.warning { color: #ffc107; }
        .byte-counter.error { color: #f44336; }
        .fee-wallet-item { background: rgba(0, 0, 0, 0.4); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 8px; padding: 12px; margin-bottom: 12px; display: flex; justify-content: space-between; align-items: center; }
        .fee-wallet-info { flex: 1; }
        .fee-wallet-name { color: #00d4ff; font-weight: 600; margin-bottom: 4px; }
        .fee-wallet-key { color: #888; font-size: 12px; font-family: 'Courier New', monospace; }
        .timezone-badge { padding: 6px 12px; background: rgba(0, 212, 255, 0.2); border: 1px solid rgba(0, 212, 255, 0.3); border-radius: 6px; color: #00d4ff; font-weight: 600; display: inline-block; margin-top: 10px; font-size: 12px; }
        @media (max-width: 768px) { .form-row { grid-template-columns: 1fr; } table { font-size: 12px; display: block; overflow-x: auto; } th, td { padding: 8px 6px; } }