*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px}.page-container,body{min-height:100vh;display:flex;align-items:center;justify-content:center}.page-container{width:100%}.card-container{background:#fff;border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.3);overflow:hidden;max-width:1000px;width:100%;display:flex;min-height:500px}.image-section{flex:0 0 40%;background:#f8f9fa;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.image-section img{width:100%;height:100%;object-fit:cover}.content-section{flex:1 1;padding:40px;display:flex;flex-direction:column;justify-content:center}.logo{max-height:50px;width:auto;max-width:250px;margin:0 auto 30px;display:block;object-fit:contain}h1{font-size:28px;color:#333;margin-bottom:15px;font-weight:600}.subtitle{color:#666;font-size:16px;line-height:1.6;margin-bottom:30px}.queue-status{background:#f8f9fa;border-radius:15px;padding:25px;text-align:center;margin-bottom:25px}.queue-status.success-state{background:#d4edda}.position-label{color:#999;font-size:14px;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}.position-number{font-size:48px;font-weight:700;color:#667eea;line-height:1;margin-bottom:0}.position-number.success-check{color:#28a745;font-size:60px}.loader-container{display:flex;justify-content:center;margin:20px 0}.loader{width:60px;height:60px;border:4px solid #f3f3f3;border-top-color:#667eea;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.warning{background:#fff3cd;color:#856404;padding:15px;border-radius:10px;font-size:14px;display:flex;align-items:flex-start;gap:10px;margin-bottom:15px}.warning-icon{font-size:20px;flex-shrink:0}.status-indicator{display:flex;align-items:center;gap:10px;font-size:14px;color:#666;margin-top:15px}.status-dot{width:10px;height:10px;border-radius:50%;background:#28a745}.status-dot.connected{background:#28a745;animation:blink 2s infinite}.status-dot.disconnected{background:#dc3545;animation:blink-error 1s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes blink-error{0%,to{opacity:1}50%{opacity:.2}}.error-state{background:#f8d7da;color:#721c24;padding:15px;border-radius:10px;margin-top:20px;font-size:14px}@media (max-width:768px){.card-container{flex-direction:column}.image-section{flex:none;height:200px}.content-section{padding:30px 20px}h1{font-size:24px}.position-number{font-size:36px}.logo{max-height:40px;max-width:200px}}