:root{--bg-primary:#36393f;--bg-secondary:#2f3136;--bg-tertiary:#202225;--bg-input:#40444b;--text-normal:#dcddde;--text-muted:#a3a6aa;--text-heading:#fff;--text-link:#00aff4;--interactive-normal:#b9bbbe;--interactive-hover:#dcddde;--interactive-active:#fff;--interactive-muted:#4f545c;--accent-primary:#5865f2;--accent-secondary:#4752c4;--accent-tertiary:#3c45a5;--danger:#f04747;--success:#43b581;--warning:#faa61a;--border-radius-sm:3px;--border-radius:5px;--border-radius-lg:8px;--shadow-sm:0 1px 2px rgba(0,0,0,.15);--shadow-md:0 4px 6px rgba(0,0,0,.1);--shadow-lg:0 10px 15px rgba(0,0,0,.2);--transition-short:all 0.15s ease;--transition-medium:all 0.25s ease;--font-primary:"Whitney","Helvetica Neue",Helvetica,Arial,sans-serif}@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");body{margin:0;padding:0;font-family:"Inter",var(--font-primary);background-color:var(--bg-primary);color:var(--text-normal);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{min-height:100vh;display:flex;flex-direction:column;position:relative;overflow-x:hidden}.main{flex:1 1;display:flex;flex-direction:column;align-items:center;padding:2rem 2rem 3rem;width:100%;box-sizing:border-box;animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.title{margin:0;line-height:1.15;font-size:3rem;font-weight:700;color:var(--text-heading);text-align:center;animation:titlePop .5s ease-out}@keyframes titlePop{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.brand{color:var(--accent-primary);position:relative;display:inline-block}.brand:after{content:"";position:absolute;bottom:-2px;left:0;width:100%;height:2px;background-color:var(--accent-primary);transform:scaleX(0);transition:transform .3s ease}.brand:hover:after{transform:scaleX(1)}.description{line-height:1.6;font-size:1.2rem;margin:1.5rem 0;text-align:center;color:var(--text-muted);max-width:700px}.actionButtons{display:flex;gap:1rem;margin:1.5rem 0;justify-content:center;flex-wrap:wrap}.card{background-color:var(--bg-secondary);border-radius:var(--border-radius-lg);padding:2rem;margin:1.5rem 0;width:100%;max-width:650px;box-shadow:var(--shadow-md);transition:var(--transition-medium);border:1px solid hsla(0,0%,100%,.05)}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.serverForm{display:flex;flex-direction:column;gap:1.2rem;margin-bottom:1.8rem}.serverForm label{font-weight:600;color:var(--text-heading);font-size:1.1rem;margin-bottom:.3rem;display:block}.serverForm input{padding:.8rem 1rem;border-radius:var(--border-radius);border:1px solid hsla(0,0%,100%,.1);background-color:var(--bg-input);color:var(--text-normal);font-size:1rem;transition:var(--transition-short);width:100%;box-sizing:border-box}.serverForm input:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 2px rgba(88,101,242,.3)}.serverForm input::-moz-placeholder{color:var(--interactive-muted)}.serverForm input:-ms-input-placeholder{color:var(--interactive-muted)}.serverForm input::placeholder{color:var(--interactive-muted)}.formHelper{font-size:.9rem;color:var(--text-muted);margin-top:.5rem;text-align:left}.inputWrapper{position:relative;width:100%}.serverForm button{background-color:var(--accent-primary);color:#fff;border:none;padding:.8rem 1.2rem;border-radius:var(--border-radius);cursor:pointer;font-weight:600;font-size:1rem;transition:var(--transition-short);display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.serverForm button:hover{background-color:var(--accent-secondary);transform:translateY(-1px)}.serverForm button:active{transform:translateY(0)}.serverInfo{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%}.serverIcon{width:128px;height:128px;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:4px solid var(--accent-primary);box-shadow:0 0 0 4px rgba(88,101,242,.2);transition:var(--transition-medium)}.serverIcon:hover{transform:scale(1.05)}.serverIconPlaceholder{width:128px;height:128px;border-radius:50%;display:flex;font-size:3rem;font-weight:700;border:4px solid hsla(0,0%,100%,.1);box-shadow:var(--shadow-md)}.inviteButton,.serverIconPlaceholder{background-color:var(--accent-primary);align-items:center;justify-content:center;color:#fff}.inviteButton{border:none;padding:.9rem 1.8rem;border-radius:var(--border-radius);cursor:pointer;font-weight:600;font-size:1rem;margin:1rem 0;text-decoration:none;display:inline-flex;gap:.5rem;transition:all .2s ease;box-shadow:0 2px 4px rgba(0,0,0,.2);position:relative;overflow:hidden}.inviteButton:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);transition:.5s}.inviteButton:hover{background-color:var(--accent-secondary);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.3)}.inviteButton:hover:before{left:100%}.inviteButton:active{transform:translateY(0);box-shadow:0 2px 4px rgba(0,0,0,.2)}.inviteButton:disabled{background-color:var(--interactive-muted);cursor:not-allowed;transform:none;box-shadow:none}.inviteButton:disabled:before{display:none}.shareSection{width:100%;margin-top:2rem;padding:1.5rem;background-color:var(--bg-tertiary);border-radius:var(--border-radius);border:1px solid hsla(0,0%,100%,.05)}.shareSection h3{color:var(--text-heading);margin-top:0;margin-bottom:1rem;font-size:1.2rem;font-weight:600;border-bottom:1px solid hsla(0,0%,100%,.1);padding-bottom:.5rem}.shareInput{padding:.8rem 1rem;margin:.5rem 0 1rem}.codeBlock,.shareInput{width:100%;border-radius:var(--border-radius);border:1px solid hsla(0,0%,100%,.1);background-color:var(--bg-input);color:var(--text-normal);font-family:monospace;font-size:.9rem;box-sizing:border-box}.codeBlock{min-height:100px;padding:1rem;resize:vertical;line-height:1.5}.error{color:var(--danger);text-align:center;padding:.8rem;background-color:rgba(240,71,71,.1);border-radius:var(--border-radius);margin:1rem 0;font-weight:500;animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(2px)}30%,50%,70%{transform:translateX(-3px)}40%,60%{transform:translateX(3px)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loadingIcon{animation:spin 1.5s linear infinite;margin-right:8px}.footer-divider{color:var(--interactive-muted);margin:0 .5rem}.footer-links{display:flex;gap:.5rem;justify-content:center;align-items:center;margin-bottom:1rem;flex-wrap:wrap}.footer{width:100%;text-align:center;padding:2rem 0;border-top:1px solid hsla(0,0%,100%,.05);margin-top:3rem;background-color:var(--bg-tertiary)}.footer a{color:var(--accent-primary);text-decoration:none;font-weight:500;transition:var(--transition-short);padding:.5rem 1rem;border-radius:var(--border-radius);background-color:rgba(88,101,242,.1)}.footer a:hover{background-color:rgba(88,101,242,.2);color:var(--text-heading)}.autoJoinContainer{background-color:var(--bg-secondary);padding:1.5rem;border-radius:var(--border-radius);margin:1.5rem 0;text-align:center;border:1px solid var(--accent-primary);animation:pulse 2s infinite}@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(88,101,242,.4)}70%{box-shadow:0 0 0 10px rgba(88,101,242,0)}to{box-shadow:0 0 0 0 rgba(88,101,242,0)}}.autoJoinContainer p{font-size:1.2rem;margin:0;color:var(--accent-primary);font-weight:600}nav{width:100%;padding:1rem 2rem;background-color:var(--bg-secondary);border-bottom:1px solid hsla(0,0%,100%,.05);justify-content:space-between;box-sizing:border-box;position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}nav,nav a.logo{display:flex;align-items:center}nav a.logo{color:var(--accent-primary);text-decoration:none;font-weight:700;font-size:1.5rem;gap:.5rem;transition:var(--transition-short)}nav a.logo:hover{color:var(--text-heading)}nav .nav-links{display:flex;gap:1rem;align-items:center}nav .nav-link{color:var(--interactive-normal);text-decoration:none;padding:.5rem 1rem;border-radius:var(--border-radius);transition:var(--transition-short);font-weight:500}nav .nav-link:hover{color:var(--interactive-hover);background-color:hsla(0,0%,100%,.05)}.card section{margin-bottom:2rem}.card h2{color:var(--accent-primary);border-bottom:1px solid hsla(0,0%,100%,.1);padding-bottom:.8rem;margin-top:0;font-size:1.5rem;font-weight:600}.card h3{color:var(--text-heading);margin-top:1.8rem;margin-bottom:1rem;font-size:1.2rem;font-weight:600}.card ul{padding-left:1.5rem;color:var(--text-normal)}.card li{margin-bottom:.8rem}@media (max-width:768px){.main{padding:1rem 1.5rem 2rem}nav{padding:.8rem 1.5rem}.title{font-size:2.5rem}.card{padding:1.5rem}}@media (max-width:576px){.main{padding:.8rem 1rem 1.5rem}nav{padding:.8rem 1rem;flex-direction:column;gap:.8rem}nav .nav-links{width:100%;justify-content:center}.title{font-size:2rem}.description{font-size:1rem}.card{padding:1.2rem}.serverForm{gap:1rem}.inviteButton{padding:.8rem 1.5rem;width:100%}.shareSection{padding:1rem}}@media (max-width:480px){.title{font-size:1.8rem}.nav-links{flex-direction:column;width:100%}.nav-link{width:100%;text-align:center}.serverIcon,.serverIconPlaceholder{width:100px;height:100px}}