.loading-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.4);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center}.spinner{width:64px;height:64px;border:8px solid #f3f3f3;border-top:8px solid #9147ff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-text{color:#fff;font-size:1.3rem;font-weight:500;text-shadow:0 2px 8px rgba(0,0,0,.2)}.popup-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.5);z-index:10000;display:flex;align-items:center;justify-content:center}.popup-box{background:#fff;padding:2rem 3rem;border-radius:12px;box-shadow:0 2px 16px #0003;text-align:center}.popup-box button{margin-top:16px;padding:.5rem 1.5rem;background:#9147ff;color:#fff;border:none;border-radius:6px;font-size:16px;cursor:pointer}.button-disabled{opacity:.5;cursor:not-allowed;transform:none!important}.button-disabled .connected-account{width:100%}.button-disabled .account-info{justify-content:flex-start;word-break:break-word}.button-disabled .change-button{width:100%}.button-disabled:hover{transform:none!important;box-shadow:none!important}.button-disabled:before{display:none}.activation-status{display:flex;align-items:center;gap:10px;margin-top:15px;padding:10px 15px;background:linear-gradient(145deg,#27ae60,#2ecc71);border-radius:6px;color:#fff;font-weight:700;font-size:14px}.status-indicator{font-size:18px;color:#fff}.status-text{font-size:14px}body{margin:0;font-family:Arial,sans-serif;background:linear-gradient(45deg,#000000,#0a0a0a,#050505,#0a0505,#000000);background-size:400% 400%;animation:gradientShift 8s ease infinite;color:#fff;height:100vh;overflow-y:auto}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;width:100%;box-sizing:border-box}.content{width:100%;max-width:900px;text-align:center}.title{font-size:36px;font-weight:700;color:#fff;text-transform:uppercase;margin-bottom:40px;letter-spacing:2px}.pair-section{display:flex;align-items:center;justify-content:center;margin-bottom:20px}.icon{display:inline-block;width:48px;height:48px;background-size:contain;background-repeat:no-repeat;background-position:center}.steam-icon{background-image:url(/assets/steam-icon-bc03d921.png)}.twitch-icon{background-image:url(/assets/twitch-icon-5689e1ac.png)}.connector{width:60px;height:3px;background:#888;margin:0 15px;position:relative}.connector:before{content:"";position:absolute;right:-3px;top:-2px;width:0;height:0;border-left:6px solid #888;border-top:3px solid transparent;border-bottom:3px solid transparent}.pair-text{font-size:20px;color:#fff;margin:20px 0 10px;font-weight:700}.subtitle{font-size:14px;color:#888;margin-bottom:40px;line-height:1.4}.steps-container{text-align:left}.step{background:#2c2c2c;border:2px solid #666;margin-bottom:20px;padding:25px;display:flex;align-items:flex-start;transition:background-color .2s ease}.step-active{opacity:1}.step-disabled{opacity:.4;pointer-events:none;background:#1a1a1a;border-color:#444}.step-disabled .step-number{color:#555}.step-disabled .step-content h2{color:#666}.step-disabled .step-text{color:#555}.step-active:hover{background:#404040}.step-number{font-size:28px;font-weight:700;color:#fff;margin-right:25px;min-width:40px;line-height:1}.step-content{flex:1}.step-content h2{font-size:16px;color:#fff;margin-bottom:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px}.step-text{font-size:14px;color:#bbb;margin-bottom:20px;line-height:1.5}.connected-account{display:flex;flex-direction:column;gap:10px;width:100%}.account-info{display:flex;align-items:center;padding:12px 16px;background:#27ae60;border:2px solid #27ae60;border-radius:4px;color:#fff;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.account-text{flex:1}.change-button{background:#e74c3c;border:2px solid #e74c3c;font-size:12px;padding:8px 16px;text-align:center;text-decoration:none;border-radius:4px}.change-button:hover{background:#c0392b;border-color:#c0392b;transform:translateY(-1px)}.button-container{display:flex;gap:15px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;padding:12px 24px;text-decoration:none;font-size:14px;font-weight:700;color:#fff;transition:all .3s ease;border:2px solid transparent;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;position:relative;overflow:hidden}.button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .5s ease}.button:hover:before{left:100%}.button-icon{width:20px;height:20px;margin-right:8px;background-size:contain;background-repeat:no-repeat;background-position:center}.button-icon.steam-icon{background-image:url(/assets/steam-icon-bc03d921.png)}.button-icon.twitch-icon{background-image:url(/assets/twitch-icon-5689e1ac.png)}.twitch-button{background:#6441a5;border:2px solid #6441a5}.twitch-button:hover{background:#8b5abf;border-color:#8b5abf;transform:translateY(-2px)}.steam-button{background:#333;border:2px solid #333}.steam-button:hover{background:#555;border-color:#555;transform:translateY(-2px)}.button-connected{opacity:.8;cursor:default;background:#666!important;border-color:#666!important}.button-connected:hover{transform:none!important;background:#666!important;border-color:#666!important}.button-connected:before{display:none}.connection-status{display:flex;align-items:center;gap:10px;margin-top:15px;padding:10px 15px;background:linear-gradient(145deg,#27ae60,#2ecc71);border-radius:6px;color:#fff;font-weight:700;font-size:14px}.result{margin-top:30px;padding:20px;background:linear-gradient(145deg,#2c2c54 0%,#40407a 100%);border:1px solid #d4af37;border-radius:8px;font-size:14px;color:#bbb;box-shadow:0 4px 15px #0000004d}.result p{margin:0}@media (max-width: 768px){.content{max-width:100%;padding:0 15px}.title{font-size:28px}.step{padding:20px;flex-direction:column}.step-number{font-size:24px;margin-right:0;margin-bottom:15px;text-align:center}.step-content{width:100%}.button-container{flex-direction:column;width:100%}.button{width:100%;justify-content:center;box-sizing:border-box;word-break:break-word;min-height:48px;padding:12px 16px}.pair-section{flex-direction:column;gap:10px}.connector{width:3px;height:40px;transform:rotate(90deg)}.connector:before{right:-2px;top:-3px;border-left:3px solid #888;border-top:6px solid transparent;border-bottom:6px solid transparent;transform:rotate(90deg)}}