.telekit-join-drawer{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:10000;pointer-events:none;font-family:var(--font-primary,sans-serif)}.telekit-join-drawer.active{pointer-events:auto}.drawer-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(10,10,20,0.45);backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);opacity:0;transition:all 0.45s cubic-bezier(0.4,0,0.2,1);z-index:0}.telekit-join-drawer.active .drawer-backdrop{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:1}.drawer-content{position:absolute;top:0;right:-480px;width:100%;max-width:460px;height:100%;background:rgba(26,26,46,0.93);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border-left:1px solid rgba(0,136,204,0.16);box-shadow:-15px 0 45px rgba(0,0,0,0.6);padding:2.5rem 1.85rem;overflow-y:auto;transition:right 0.45s cubic-bezier(0.4,0,0.2,1);z-index:1;display:flex;flex-direction:column}.telekit-join-drawer.active .drawer-content{right:0}.drawer-close-btn{position:absolute;top:1.5rem;right:1.5rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);width:36px;height:36px;border-radius:50%;color:var(--color-text-secondary,#aaa);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease}.drawer-close-btn:hover{background:rgba(255,74,90,0.12);border-color:rgba(255,74,90,0.25);color:#ff4a5a;transform:rotate(90deg)}.drawer-loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:70vh}.drawer-spinner{width:40px;height:40px;border:3.5px solid rgba(255,255,255,0.08);border-top:3.5px solid #0088cc;border-radius:50%;animation:drawer-spin 0.9s linear infinite;margin-bottom:1rem}@keyframes drawer-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.drawer-header-card{text-align:center;padding-bottom:2rem;border-bottom:1px solid rgba(255,255,255,0.08);margin-bottom:2rem}.drawer-avatar-container{position:relative;display:inline-block;margin-top:1rem;margin-bottom:1.25rem}.drawer-avatar{width:100px;height:100px;border-radius:24px;object-fit:cover;border:2px solid rgba(255,255,255,0.08);box-shadow:0 12px 30px rgba(0,0,0,0.35)}.drawer-type-badge{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:800;text-transform:uppercase;padding:3px 10px;border-radius:50px;letter-spacing:0.5px;box-shadow:0 4px 10px rgba(0,0,0,0.25);background:linear-gradient(135deg,#0088cc,#005588);color:white}.drawer-title{font-family:var(--font-heading,sans-serif);font-size:1.65rem;font-weight:800;color:var(--color-text-primary,#fff);margin-bottom:1.25rem}.drawer-stats-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:1rem}.drawer-stat-item{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.04);padding:0.85rem;border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:4px}.drawer-stat-item i{font-size:1.2rem}.drawer-stat-item span{font-size:1.15rem;font-weight:700;color:var(--color-text-primary,#fff)}.drawer-stat-item small{font-size:10px;color:var(--color-text-secondary,#aaa);text-transform:uppercase;letter-spacing:0.5px}.drawer-section{margin-bottom:2rem}.section-heading{font-family:var(--font-heading,sans-serif);font-size:1rem;font-weight:700;color:var(--color-text-primary,#fff);margin-bottom:0.85rem;display:flex;align-items:center;gap:0.5rem}.drawer-description{font-size:0.95rem;color:var(--color-text-secondary,#ccc);line-height:1.65;background:rgba(255,255,255,0.01);padding:0.85rem;border-radius:12px;border:1px solid rgba(255,255,255,0.02)}.drawer-tags-container{display:flex;flex-wrap:wrap;gap:0.5rem}.drawer-tag{font-size:12px;padding:5px 12px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:8px;color:var(--color-text-secondary,#aaa);transition:all 0.25s ease}.drawer-tag:hover{background:rgba(0,136,204,0.1);border-color:rgba(0,136,204,0.3);color:#0088cc}.drawer-action-section{margin-top:auto;padding-top:1.5rem}.drawer-join-btn{background:var(--grad-primary,linear-gradient(135deg,#0088cc,#20c997));color:white !important;font-family:var(--font-heading,sans-serif);font-size:1.15rem;font-weight:800;padding:1.1rem;border-radius:50px;display:flex;align-items:center;justify-content:center;gap:0.55rem;box-shadow:0 10px 25px rgba(0,136,204,0.35);text-decoration:none;transition:all 0.35s cubic-bezier(0.4,0,0.2,1)}.drawer-join-btn:hover{transform:translateY(-3px);box-shadow:0 14px 35px rgba(0,136,204,0.5);filter:brightness(1.1)}.drawer-join-btn.htmx-request{pointer-events:none;opacity:0.65;cursor:progress}.drawer-join-btn.htmx-request::after{content:"";display:inline-block;width:14px;height:14px;margin-left:8px;border:2px solid rgba(255,255,255,0.35);border-top-color:#fff;border-radius:50%;animation:drawer-spin 0.7s linear infinite;vertical-align:middle}.drawer-comments-box{background:rgba(0,0,0,0.15);border-radius:12px;padding:1rem;max-height:200px;overflow-y:auto}.no-comments-msg{text-align:center;color:var(--color-text-secondary,#777);font-size:13px;margin:1rem 0}@media (max-width:480px){.drawer-content{max-width:100% !important;width:100vw !important;padding:2.2rem 1.25rem 1.5rem 1.25rem !important;border-left:none !important}.drawer-avatar{width:80px !important;height:80px !important}.drawer-title{font-size:1.45rem !important;margin-bottom:1rem !important}.drawer-close-btn{top:1rem !important;right:1rem !important;width:32px !important;height:32px !important}.drawer-stats-row{gap:0.75rem !important}.drawer-stat-item{padding:0.65rem !important}.drawer-stat-item span{font-size:1rem !important}.drawer-join-btn{padding:0.95rem !important;font-size:1.05rem !important}}