.status-badge{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:50px;font-size:.875rem;font-weight:500;transition:all .3s ease}.status-dot{width:10px;height:10px;border-radius:50%;animation:pulse 2s infinite}.status-connected{background:#3fb95026;color:var(--success)}.status-connected .status-dot{background:var(--success);box-shadow:0 0 10px var(--success)}.status-disconnected{background:#f8514926;color:var(--error)}.status-disconnected .status-dot{background:var(--error);box-shadow:0 0 10px var(--error)}.status-pending{background:#d2992226;color:var(--warning)}.status-pending .status-dot{background:var(--warning);box-shadow:0 0 10px var(--warning)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.message-status{display:inline-block;padding:.25rem .75rem;border-radius:50px;font-size:.75rem;font-weight:500;text-transform:capitalize}.message-status.success{background:#3fb95026;color:var(--success)}.message-status.error{background:#f8514926;color:var(--error)}.qr-section{display:flex;flex-direction:column;align-items:center;text-align:center}.qr-container{width:100%;min-height:280px;display:flex;align-items:center;justify-content:center;flex-direction:column}.qr-image{max-width:256px;border-radius:12px;padding:1rem;background:#fff;box-shadow:0 4px 20px #25d36633}.loading{display:flex;flex-direction:column;align-items:center;gap:1rem;color:var(--text-secondary)}.spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.authenticated-message{display:flex;flex-direction:column;align-items:center;gap:1rem}.success-icon{width:80px;height:80px;background:var(--success);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;color:#fff;animation:bounceIn .5s ease}@keyframes bounceIn{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.history-section{display:flex;flex-direction:column}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.section-header h2{margin-bottom:0}.btn-refresh{background:transparent;border:1px solid var(--border-color);color:var(--text-primary);padding:.5rem 1rem;border-radius:8px;cursor:pointer;font-size:.875rem;font-weight:500;transition:all .2s ease}.btn-refresh:hover{background:var(--bg-card-hover);border-color:var(--primary)}.btn-refresh:disabled{opacity:.5;cursor:not-allowed}.table-container{flex:1;overflow-x:auto}.history-table{width:100%;border-collapse:collapse}.history-table th,.history-table td{padding:.875rem 1rem;text-align:left;border-bottom:1px solid var(--border-color)}.history-table th{background:#0003;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary)}.history-table tbody tr{transition:background .2s ease}.history-table tbody tr:hover{background:var(--bg-card-hover)}.message-cell{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty-row td{text-align:center;color:var(--text-secondary);padding:2rem}.app-container{width:100%;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #25D366;--primary-dark: #128C7E;--bg-dark: #0d1117;--bg-card: #161b22;--bg-card-hover: #1c2128;--text-primary: #f0f6fc;--text-secondary: #8b949e;--border-color: #30363d;--success: #3fb950;--error: #f85149;--warning: #d29922}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;line-height:1.6}.container{max-width:1200px;margin:0 auto;padding:2rem;min-height:100vh;display:flex;flex-direction:column}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--border-color)}header h1{font-size:1.75rem;font-weight:600;background:linear-gradient(135deg,var(--primary),var(--primary-dark));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}main{flex:1;display:grid;grid-template-columns:350px 1fr;gap:2rem}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card h2{font-size:1.125rem;font-weight:600;margin-bottom:1.5rem;color:var(--text-primary)}footer{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--border-color);text-align:center;color:var(--text-secondary);font-size:.875rem}@media (max-width: 900px){main{grid-template-columns:1fr}.qr-section{order:-1}}@media (max-width: 600px){.container{padding:1rem}header{flex-direction:column;gap:1rem;text-align:center}header h1{font-size:1.5rem}}