@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=JetBrains+Mono:wght@300;400;500&display=swap";@import"https://fonts.googleapis.com/icon?family=Material+Icons+Round";@import"https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}:root{--primary-gradient: linear-gradient(135deg, #8a2be2 0%, #4b0082 100%);--secondary-gradient: linear-gradient(135deg, #ff8a00 0%, #e52e71 100%);--green-gradient: linear-gradient(135deg, rgb(0, 139, 116) 0%, #00d084 100%);--accent-gradient: linear-gradient(135deg, #00c6ff 0%, #0072ff 100%);--dark-bg: #0f0f1a;--card-bg: rgba(26, 26, 46, .8);--card-light: rgba(22, 33, 62, .8);--text-primary: #ffffff;--text-secondary: #b8c2d9;--text-muted: #6b7280;--border-color: rgba(255, 255, 255, .15);--shadow-light: rgba(255, 255, 255, .1);--shadow-dark: rgba(0, 0, 0, .4);--accent-blue: #6a5acd;--accent-purple: #9370db;--accent-pink: #ff69b4;--success-color: #00d084;--warning-color: #ffb347}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif;background:var(--dark-bg);color:var(--text-primary);min-height:100vh;line-height:1.6;overflow-x:hidden}.tab{display:flex;gap:10px;margin:20px 30px}.tab-home{display:inline-block;background:#1a1a2e66;-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-color);box-shadow:0 20px 40px var(--shadow-dark);backdrop-filter:blur(10px);padding:10px 30px;margin-bottom:0;font-size:17px;font-family:Poppins;font-weight:500;color:#fff;border-radius:6px;cursor:pointer;text-decoration:none;z-index:999}.tab-home:hover{color:#e0e0e0;text-shadow:0 0 2px rgba(255,255,255,.3)}.background-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-2;background:linear-gradient(135deg,#000,#001809);overflow:hidden}.background-gradient{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at 20% 20%,rgba(157,0,255,.2) 0%,transparent 50%),radial-gradient(ellipse at 80% 30%,rgba(255,105,180,.2) 0%,transparent 50%),radial-gradient(ellipse at 40% 80%,rgba(106,90,205,.2) 0%,transparent 50%)}.background-pattern{position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.05) 1px,transparent 0);background-size:30px 30px;opacity:.5}#particles-js{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.container{max-width:1200px;margin:0 auto;padding:2rem;padding-top:0;position:relative;z-index:1}.header{text-align:center;margin-bottom:4rem;animation:fadeInUp 1s ease-out;position:relative}@media (max-width: 600px){.header{margin-bottom:2rem}}.status-badge{padding:.4rem 1.2rem;margin:20px auto;font-weight:600;font-size:.95rem;color:#fff;text-align:center;border-radius:999px;box-shadow:0 6px 15px #00000026;transition:all .3s ease;display:inline-block}.status-home{background:linear-gradient(135deg,#0043c8,#0c00b1)}.online{background:linear-gradient(135deg,#00c851,#33b100)}.offline{background:linear-gradient(135deg,#f44,#c00)}.online:hover,.offline:hover{filter:brightness(1.15);transform:scale(1.05)}.logo{width:100px;height:100px;margin:0 auto 1.5rem;background:var(--primary-gradient);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;box-shadow:0 15px 35px #8a2be266;animation:logoFloat 4s ease-in-out infinite;border:3px solid rgba(255,255,255,.1)}.title{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;margin-bottom:1rem;background:linear-gradient(135deg,#fff,#b8c2d9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em;text-shadow:0 4px 20px rgba(138,43,226,.3);position:relative;display:inline-block}.title:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:100px;height:4px;background:var(--primary-gradient);border-radius:2px}.subtitle{font-size:clamp(.9rem,3vw,1.3rem);color:var(--text-secondary);font-family:Bricolage Grotesque,sans-serif;font-weight:400;max-width:700px;margin:1rem auto 0;line-height:1.7;text-shadow:0 2px 10px rgba(0,0,0,.3)}@media (max-width: 800px){.subtitle{max-width:80vw}}.host-section{background:#1a1a2e66;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:25px;padding:2.5rem;margin-bottom:3rem;border:1px solid var(--border-color);box-shadow:0 20px 40px var(--shadow-dark);backdrop-filter:blur(10px);animation:fadeInUp 1s ease-out .2s both}.host-label{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;display:flex;align-items:center;gap:.75rem}.host-label i{color:var(--accent-blue)}.host-textarea{width:100%;height:auto;box-sizing:border-box;font-family:JetBrains Mono,monospace;font-size:.8rem;font-weight:400;padding:.4rem 1rem;border:2px solid var(--border-color);border-radius:16px;background:var(--card-light);color:var(--text-primary);resize:none;transition:all .3s ease;line-height:1.6;white-space:pre;overflow:hidden}.host-textarea:hover{border-color:var(--accent-blue);box-shadow:0 0 0 4px #4f46e51a}.host-textarea:focus{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 4px #4f46e533}.server-grid{display:grid;gap:1rem;margin-top:2rem;grid-template-columns:1fr}.button-grid{display:grid;gap:1rem;margin-top:2rem;grid-template-columns:repeat(4,1fr)}@media (max-width: 1024px){.button-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.button-grid{grid-template-columns:1fr}}.btn{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:.75rem;padding:1rem 1.5rem;border:none;border-radius:16px;font-family:Bricolage Grotesque,sans-serif;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;text-decoration:none;min-height:56px}@media (max-width: 600px){.btn{flex-direction:row}.btn i,.btn img{position:absolute;left:20px}}.btn-primary{background:var(--primary-gradient);color:#fff;box-shadow:0 8px 24px #4f46e54d}.btn-secondary{background:var(--secondary-gradient);color:#fff;box-shadow:0 8px 24px #f5576c4d}.btn-accent{background:var(--accent-gradient);color:#fff;box-shadow:0 8px 24px #4facfe4d}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 8px 24px #10b9814d}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px #00000026}.btn:active{transform:translateY(0)}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shine 2s linear infinite}.btn:hover:before{left:100%}@keyframes shine{0%{left:-100%}to{left:100%}}.instructions{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin-top:4rem}.instruction-card{background:#1a1a2e66;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid rgba(255,255,255,.1);border-radius:24px;padding:2rem;border:1px solid var(--border-color);box-shadow:0 20px 40px var(--shadow-dark);backdrop-filter:blur(10px);transition:all .3s cubic-bezier(.4,0,.2,1);animation:fadeInUp 1s ease-out both}.instruction-card:nth-child(1){animation-delay:.4s}.instruction-card:nth-child(2){animation-delay:.6s}.instruction-card:nth-child(3){animation-delay:.8s}.instruction-card:hover{transform:translateY(-4px);box-shadow:0 24px 48px var(--shadow-dark)}.card-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.card-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#fff}.card-icon.android{background:var(--success-color)}.card-icon.ios{background:var(--text-muted)}.card-icon.windows{background:var(--accent-blue)}.card-title{font-size:1.4rem;font-weight:600;color:var(--text-primary)}.card-steps{list-style:none;counter-reset:step-counter}.card-steps li{counter-increment:step-counter;position:relative;padding-left:3rem;margin-bottom:1rem;color:var(--text-secondary);line-height:1.6}.card-steps li:before{content:counter(step-counter);position:absolute;left:0;top:0;width:2rem;height:2rem;background:var(--primary-gradient);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}.card-steps strong{color:var(--text-primary)}.card-steps code{background:var(--card-light);padding:.25rem .5rem;border-radius:6px;font-family:JetBrains Mono,monospace;font-size:.875rem;color:var(--accent-blue);border:1px solid var(--border-color)}.card-steps kbd{background:var(--card-light);padding:.25rem .5rem;border-radius:6px;font-family:JetBrains Mono,monospace;font-size:.875rem;color:var(--accent-purple);border:1px solid var(--border-color);box-shadow:0 2px 4px #0000001a}.footer{text-align:center;margin-top:2rem;padding:1rem;border-top:1px solid var(--border-color);animation:fadeIn 2s ease-out}.footer-content{color:var(--text-muted);margin-bottom:1rem}.developer-credit{display:inline-flex;align-items:center;gap:.5rem;color:var(--accent-blue);text-decoration:none;font-weight:500;transition:all .3s ease;padding:.5rem 1rem;border-radius:12px;border:1px solid transparent}.developer-credit:hover{color:var(--accent-purple);border-color:var(--border-color);background:var(--card-bg);transform:translateY(-2px)}.discord-floater{position:fixed;bottom:2rem;right:2rem;z-index:1000;width:60px;height:60px;border-radius:50%;background:#5865f2;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;text-decoration:none;box-shadow:0 8px 24px #5865f266;transition:all .3s cubic-bezier(.4,0,.2,1);animation:floatUpDown 3s ease-in-out infinite}.discord-floater:hover{transform:scale(1.1);box-shadow:0 12px 32px #5865f299}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes logoFloat{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-15px) rotate(2deg)}50%{transform:translateY(0) rotate(0)}75%{transform:translateY(-10px) rotate(-2deg)}}@keyframes floatUpDown{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@media (max-width: 768px){.container{padding:1rem}.host-section{padding:1.5rem;margin-bottom:2rem}.button-grid{grid-template-columns:1fr}.instructions{grid-template-columns:1fr;gap:1.5rem;margin-top:2rem}.instruction-card{padding:1.5rem}.discord-floater{bottom:1rem;right:1rem;width:50px;height:50px;font-size:1.25rem}}@media (max-width: 480px){.host-textarea{font-size:.875rem;padding:1rem}.card-steps li{padding-left:2.5rem;font-size:.9rem}.card-steps li:before{width:1.5rem;height:1.5rem;font-size:.75rem}}.success-animation{animation:successPulse .6s ease-out}@keyframes successPulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.title.shine-effect{position:relative;background:linear-gradient(120deg,#b8b8b8 30%,#fff,#fff8f8 70%);background-size:200% auto;color:transparent;background-clip:text;-webkit-background-clip:text;animation:shineText 5s linear infinite}@keyframes shineText{0%{background-position:200% center}to{background-position:-200% center}}.floater-container{position:fixed;bottom:2rem;right:2rem;display:flex;flex-direction:column-reverse;align-items:flex-end;gap:.5rem;z-index:1000}.floater-button{width:60px;height:60px;background:#5865f2;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #0000004d;cursor:pointer;transition:all .3s ease}.floater-hidden{opacity:0;pointer-events:none;transform:translateY(20px)}.floater-visible{opacity:1;pointer-events:auto;transform:translateY(0)}.whatsapp-btn{background:#25d366}.discord-btn{background:#5865f2}.server-item{display:flex;justify-content:space-between;flex-direction:row;align-items:center;padding:1.25rem 2rem;border-radius:20px;background:linear-gradient(135deg,#30284b,#1a1823);box-shadow:0 15px 40px #1f1f1fb3;color:#f0f0f5;font-weight:700;font-size:1.1rem;letter-spacing:.03em;transition:background .4s ease,transform .3s ease,box-shadow .3s ease;cursor:pointer;min-height:60px;border:1px solid rgba(255,255,255,.15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.server-item:before{background:linear-gradient(90deg,transparent,rgba(0,0,0,.2),transparent)}.server-item:hover{box-shadow:0 10px 30px #7c6fc180;transform:translateY(-5px)}.onlineServer{width:90px;font-size:.7rem;background:var(--green-gradient);padding:2px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#e0e0ff;text-shadow:0 0 5px rgba(124,111,193,.7)}.offlineServer{width:90px;font-size:.7rem;background:var(--secondary-gradient);padding:2px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#e0e0ff;text-shadow:0 0 5px rgba(124,111,193,.7)}.server{font-size:1.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#e0e0ff;text-shadow:0 0 5px rgba(124,111,193,.7)}.server-button{background:var(--primary-gradient);border:none;border-radius:7px;padding:.6rem 1.2rem;color:#fff;font-weight:700;font-size:1rem;cursor:pointer;transition:background .4s ease,box-shadow .3s ease;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 6px 18px #881ec166;z-index:99}.server-button:hover{background:var(--accent-gradient);box-shadow:0 10px 28px #4facfe99}.server-button:focus{outline:3px solid var(--accent-blue);outline-offset:3px;box-shadow:0 0 10px var(--accent-blue)}@media (max-width: 600px){.server-item{flex-direction:column;align-items:flex-start;gap:.75rem;padding:1rem 1.5rem}.server-button{width:100%;text-align:center}}.server-info{display:flex;flex-direction:row;justify-content:space-between;width:50%;align-items:center;gap:1rem}@media (max-width: 600px){.server-info{width:100%}}.server-details{flex:1;display:flex;flex-direction:row;gap:1rem}.server-number{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--primary-gradient);border-radius:5px;color:#fff;font-weight:700;font-size:1.2rem}.server-header{display:flex;align-items:center;justify-content:space-between}.server-input{width:50%;max-width:400px;padding:10px 14px;margin-bottom:1rem;font-size:1rem;border-radius:8px;border:1px solid rgba(255,255,255,.15);background-color:var(--accent-gradient);color:#fff;transition:border .2s ease,box-shadow .2s ease,background-color .3s;outline:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.server-input::placeholder{color:#fff9}.server-input:focus{border:1px solid rgb(76,0,109);box-shadow:0 0 0 3px #9500ff59}.server-ping{font-size:.8rem}.host-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.host-language{position:relative;display:flex;align-items:center;gap:60px;background-color:#151515;padding:20px 30px;border-radius:10px;border:.3px solid black}.host-language div{position:absolute;top:50%;transform:translateY(-50%);width:65px;height:50px;z-index:1;cursor:pointer}.host-language div:before{content:"";position:absolute;top:50%;transform:translateY(-50%);width:65px;height:50px;background:linear-gradient(135deg,#ffffff1c,#ffffff0d);border-radius:10px;z-index:1}.host-language div.active:before{background:#000}.host-language img{z-index:2;cursor:pointer}.host-language .active{cursor:default}
