sl-logo{position:relative;display:flex}sl-logo:after{content:"β";font-size:1.6rem;color:var(--secondary-color-2);position:absolute;top:-1rem;right:-1rem;font-weight:600}sl-logo svg{height:4rem}sl-search{width:100%;max-width:60rem;position:relative}sl-search input{width:100%;height:4rem;font-size:1.8rem;padding-left:1.4rem;border:2px solid var(--border-color);border-radius:.8rem;color:var(--text-color);background-color:var(--bg-color);outline:none;transition:all .3s ease;font-weight:450}@container body (width <= 700px){sl-search input{border-radius:0;border:none;padding:0 2rem;height:5rem;font-size:2rem}}sl-search button{cursor:pointer;position:absolute;right:0;background:transparent;border:none;width:4rem;height:4rem;display:flex;justify-content:center;align-items:center;padding:0;top:0;transition:all .3s ease}sl-search button sl-icon{height:1.8rem;width:1.8rem;--fill-color: var(--text-color)}@container body (width <= 700px){sl-search button{height:5rem;width:5rem}}sl-search:focus-within input{transition:all .3s ease;transform:translate(-.2rem,-.2rem);box-shadow:var(--shadow-2)}@container body (width <= 700px){sl-search:focus-within input{box-shadow:none;transform:none}}sl-search:focus-within button{transition:all .3s ease;transform:translate(-.2rem,-.2rem)}@container body (width <= 700px){sl-search:focus-within button{box-shadow:none;transform:none}}top-nav{display:flex;background-color:var(--bg-color);border-bottom:2px solid var(--border-color);position:fixed;top:0;padding:1.6rem;justify-content:space-between;align-items:center;width:100%;left:0;z-index:1000;box-shadow:0 4px 0 0 var(--secondary-color-1);height:8rem}top-nav button.avatar{margin-right:1rem;margin-left:5rem;padding:0;background:transparent;border:none;cursor:pointer}top-nav button.avatar sl-avatar{text-align:right;display:flex;justify-content:flex-end;pointer-events:none}top-nav sl-menu{max-height:30rem}top-nav sl-menu-item{font-size:2.4rem!important;height:auto!important;padding:1.6rem 5rem 1.6rem 1.6rem!important}top-nav .back{display:none}@container body (width <= 700px){top-nav{z-index:10000;height:6rem;justify-content:center;box-shadow:0 2px 0 0 var(--secondary-color-1)}top-nav button.avatar{margin:0!important}top-nav sl-menu-trigger{position:absolute;right:1rem;height:4.2rem;width:4.2rem}top-nav sl-menu-trigger sl-avatar{height:4.2rem;width:4.2rem}top-nav sl-search{display:none}top-nav .back{display:flex;position:absolute;left:0;height:6rem;width:6rem;align-items:center;justify-content:center;border:none;background:transparent}top-nav .back sl-icon{height:2.4rem;width:2.4rem}}side-bar{position:sticky;top:12rem;display:flex}side-bar ul{list-style:none;display:flex;flex-direction:column;gap:2rem;margin:0;padding:0}side-bar ul li{font-size:2.4rem;display:flex}side-bar ul li a{display:flex;padding:1rem 2rem;color:var(--text-color);text-decoration:none;transition:all .3s ease;border-radius:4rem;border:2px solid transparent;box-shadow:var(--shadow-0);font-weight:450;gap:1.6rem;align-items:center}side-bar ul li a sl-icon{width:2.4rem;height:2.4rem}side-bar ul li a span{margin-top:.2rem}side-bar ul li a.active{border:2px solid var(--border-color)}@container body (width > 700px){side-bar ul li a:hover{border:2px solid var(--border-color);box-shadow:var(--shadow);transform:translate(-.4rem,-.4rem)}}@container body (width < 1280px){side-bar ul li a{padding:1rem}side-bar ul li a span{display:none}}@container body (width <= 700px){side-bar{position:fixed;bottom:0;background:var(--secondary-color-5);left:0;width:100vw;top:unset;z-index:10000;border-top:2px solid var(--border-color);border-bottom:2px solid var(--border-color)}side-bar ul{flex-direction:row;width:100vw;justify-content:space-between;padding:1rem 2rem}side-bar ul li a:hover{border:2px solid var(--border-color);box-shadow:none;transform:none}side-bar .help{display:none}}sl-highlights{position:sticky;top:12rem;display:flex;flex-direction:column;gap:3rem}sl-highlights .highlights-card{border-radius:1rem;border:2px solid var(--border-color);width:100%;box-shadow:var(--shadow);padding:1.2rem;background:var(--bg-color)}sl-highlights .highlights-card h2{font-weight:500;margin:0;padding:0;margin-bottom:2rem}sl-highlights .highlights-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1rem;margin-top:1rem}sl-highlights .highlights-card ul li.link a{display:block;padding:1rem 2rem;color:var(--text-color);text-decoration:none;transition:all .3s ease;border-radius:4rem;border:1px solid transparent;box-shadow:var(--shadow-0)}sl-highlights .highlights-card ul li.link a span{font-weight:500}sl-highlights .highlights-card ul li.link a:hover{border:1px solid var(--border-color);box-shadow:var(--shadow);transform:translate(-.4rem,-.4rem)}sl-highlights .highlights-card ul li.user{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;margin-bottom:1rem}sl-highlights .highlights-card ul li.user>div{height:100%;display:flex;flex-direction:column;justify-content:center;gap:.4rem}sl-highlights .highlights-card ul li.user>div a:first-child{text-decoration:none;color:var(--text-color);font-weight:500;font-size:1.8rem}sl-highlights .highlights-card ul li.user>div a:last-child{text-decoration:none;color:var(--text-color-2);font-size:1.4rem}sl-highlights .users{border-radius:1rem;width:100%;box-shadow:var(--shadow);background:var(--bg-color);border:2px solid var(--border-color)}sl-highlights .users sl-loader{margin:1rem;width:calc(100% - 2rem)}sl-highlights .users sl-user-list{margin:-2px}@container body (width < 1024px){sl-highlights{display:none}}root-layout{margin:0 auto;max-width:max-content;display:flex;flex-direction:column;padding-top:12rem;padding-bottom:4rem}root-layout .layout{display:grid;align-items:flex-start;grid-template-columns:28rem 60rem 30rem;height:100%;gap:4rem}root-layout .layout main{width:60rem;flex:1 1 100%;display:flex;flex-direction:column;gap:3rem}root-layout .layout main h1{font-size:3rem;font-weight:500;margin:0;padding:0;margin-bottom:3rem;line-height:1}@container body (width < 700px){root-layout .layout main h1{margin:3rem 2rem}}@container body (width < 1280px){root-layout .layout{gap:3rem;grid-template-columns:4.8rem 1fr 28rem}}@container body (width < 1024px){root-layout .layout{grid-template-columns:4.8rem 1fr}}@container body (width <= 700px){root-layout{padding-top:6rem}root-layout .layout{grid-template-columns:1fr}root-layout .layout main{width:100vw;padding-bottom:8rem}}sl-loader{pointer-events:none;cursor:not-allowed;height:1rem;flex:0 0 1rem;position:relative;width:100%;margin:0 auto;display:flex}sl-loader:before{content:"";position:absolute;height:100%;width:100%;background:repeating-linear-gradient(-45deg,transparent 0 20px,var(--primary-color) 20px 40px);background-size:1000% 100%;z-index:1;animation:loadinganim 300s infinite linear}@keyframes loadinganim{0%{background-position:-995% 0}to{background-position:995% 0}}sl-editor{position:relative}sl-editor:after{content:attr(data-length);float:right;margin-top:.4rem;opacity:0;transition:all .3s ease}sl-editor.error .editor{border:2px solid var(--secondary-color-4)}sl-editor.error:after{color:var(--secondary-color-4);opacity:1;transition:all .3s ease}sl-editor:focus-within:after{opacity:1;transition:all .3s ease}sl-editor .editor{border:2px solid var(--border-color);border-radius:.8rem;overflow:hidden;width:100%}sl-editor .editor .cm-editor{font-size:1.6rem}sl-editor .editor .cm-editor .cm-content{font-family:Menlo,Monaco,Consolas,monospace;font-size:1.6rem;font-weight:450}sl-editor .editor .cm-editor .cm-gutters{background:var(--bg-color);border-right:1px solid var(--border-color)}sl-editor .editor .cm-editor .cm-activeLineGutter{background:var(--bg-color)}sl-editor .editor .cm-editor .cm-gutterElement{color:var(--text-color);display:flex;align-items:center;justify-content:flex-end;font-size:1.6rem}sl-editor .editor .cm-content,sl-editor .editor .cm-gutter{min-height:150px}sl-newsnippet{display:flex;border:2px solid var(--border-color);border-radius:.8rem;padding:2rem;transition:all .3s ease;flex-direction:column;background:var(--bg-color)}@container body (width <= 700px){sl-newsnippet{border-radius:0;border:none;border-top:2px solid var(--border-color);border-bottom:2px solid var(--border-color)}}sl-newsnippet:focus-within{box-shadow:var(--shadow);transition:all .3s ease;transform:translate(-.4rem,-.4rem)}sl-newsnippet.active .new-snippet{display:flex;flex-direction:column}sl-newsnippet.active .actions span{visibility:hidden}sl-newsnippet .new-snippet{display:none;flex:1 1 100%;gap:1.6rem;margin-bottom:2rem}sl-newsnippet .new-snippet .title{font-size:1.8rem;font-weight:450;border:2px solid var(--border-color);border-radius:.8rem;padding:.75rem 1rem;field-sizing:content;resize:vertical;font-family:var(--font-family);min-height:4.2rem}sl-newsnippet .new-snippet sl-select{width:25rem}sl-newsnippet .actions{display:grid;grid-template-columns:1fr auto;align-items:center}sl-newsnippet .actions span{font-size:1.8rem;font-weight:450;color:var(--text-color);cursor:text}sl-home-page{display:flex;flex-direction:column;gap:3rem}@container body (width <= 700px){sl-home-page{gap:2rem}sl-home-page sl-tabs{justify-content:center}}sl-onboard dialog{width:100%;max-width:60rem;padding:0;border-radius:1rem;border:2px solid var(--border-color);box-shadow:var(--shadow);background:var(--secondary-color-5);max-height:90vh;display:flex;flex-direction:column}sl-onboard dialog .slides{padding:2rem;overflow-y:auto}sl-onboard dialog .slides .slide{display:none;font-size:2rem}sl-onboard dialog .slides .slide.active{display:block}sl-onboard dialog .slides .slide .languages{display:flex;gap:1rem;flex-wrap:wrap;font-size:1.6rem}sl-onboard dialog .slides .slide .languages .language{display:inline-flex;padding:1rem 1.6rem;border:1px solid var(--border-color);box-shadow:var(--shadow-2);align-items:center;justify-content:center;gap:1rem;border-radius:.8rem;cursor:pointer;accent-color:var(--secondary-color-1);background:var(--bg-color);font-weight:450}sl-onboard dialog .slides .slide .languages .language:active{transform:scale(.9)}sl-onboard dialog .slides .slide .languages .language input{height:1.6rem;width:1.6rem;margin:0;padding:0;margin-top:-.3rem}sl-onboard dialog .slides .slide.username input{width:100%;padding:1rem;border:2px solid var(--border-color);border-radius:.8rem;font-size:2rem;font-weight:450;background:var(--bg-color)}sl-onboard dialog .slides .slide.username .status{font-size:1.6rem}sl-onboard dialog .actions{display:flex;justify-content:space-between;padding:2rem;border-top:2px solid var(--border-color)}sl-notification-list{display:flex;flex-direction:column;border:2px solid var(--border-color);border-radius:1rem;background:var(--border-color);box-shadow:var(--shadow)}@container body (width <= 700px){sl-notification-list{border-radius:0;box-shadow:none;border-right:none;border-left:none}}sl-notification-list.empty{border:none;box-shadow:none;background:transparent}sl-notification-list sl-notification-item{display:grid;grid-template-columns:auto 1fr;padding:1rem;font-size:1.8rem;align-items:center;gap:1rem;background:var(--bg-color);border:2px solid transparent;border-bottom:2px solid var(--border-color);cursor:pointer}sl-notification-list sl-notification-item a{color:var(--text-color);font-weight:500;text-decoration:none}sl-notification-list sl-notification-item a:hover{text-decoration:underline}sl-notification-list sl-notification-item:first-child{border-top-left-radius:.8rem;border-top-right-radius:.8rem}@container body (width <= 700px){sl-notification-list sl-notification-item:first-child{border-top-left-radius:0;border-top-right-radius:0}}sl-notification-list sl-notification-item:last-child{border-bottom:none;border-bottom-left-radius:.8rem;border-bottom-right-radius:.8rem}@container body (width <= 700px){sl-notification-list sl-notification-item:last-child{border-bottom-left-radius:0;border-bottom-right-radius:0}}sl-notifications-page{display:flex;flex-direction:column}sl-menu-trigger{position:relative}sl-menu-trigger .menu{position:fixed;border:2px solid var(--border-color);box-shadow:var(--shadow);border-radius:1rem;padding:0;margin:0}sl-menu-trigger .menu:popover-open{display:flex}sl-menu{margin:0;padding:0;list-style:none;max-height:24rem;overflow-y:auto;scrollbar-width:thin;display:flex;flex-direction:column}sl-menu sl-menu-item{padding:1rem 4rem 1rem 1rem;cursor:pointer;background:var(--bg-color);transition:background-color .3s ease,color .3s ease;font-size:1.8rem;font-weight:450;height:4rem}sl-menu sl-menu-item:hover{background-color:var(--secondary-color-1);color:var(--text-color)}sl-menu sl-menu-item.hide{display:none}sl-menu sl-menu-item.seperator{border-bottom:2px solid var(--border-color)}sl-image-cropper sl-dialog #cropperCanvas{border-radius:100%}sl-image-cropper sl-dialog .crop-content{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2rem}sl-image-cropper sl-dialog .crop-content span{font-size:2rem}sl-profile-page .profile{margin-bottom:3rem}@container body (width <= 700px){sl-profile-page .profile{padding:2rem;margin-bottom:0}}sl-profile-page .profile .header{display:flex;justify-content:space-between;align-items:center}sl-profile-page .profile .header>.avatar{width:15rem;height:15rem}@container body (width <= 700px){sl-profile-page .profile .header>.avatar{width:12rem;height:12rem}}sl-profile-page .profile .header>.avatar sl-avatar{width:15rem;height:15rem}@container body (width <= 700px){sl-profile-page .profile .header>.avatar sl-avatar{width:12rem;height:12rem}}sl-profile-page .profile .header .actions{display:flex;align-items:center;gap:1rem}sl-profile-page .profile .header .actions .unfollow:hover{background:var(--secondary-color-4)}sl-profile-page .profile .header .edit-profile-form dialog{width:100%;max-width:60rem}sl-profile-page .profile .info{margin-top:2rem}sl-profile-page .profile .info .name{font-size:4rem;font-weight:500;line-height:1}@container body (width <= 700px){sl-profile-page .profile .info .name{font-size:3.2rem}}sl-profile-page .profile .info .username{font-size:2rem;line-height:1;margin-top:1rem}sl-profile-page .profile .info .bio{margin-top:2rem;font-size:2rem}sl-profile-page .profile .info .links{padding:0;list-style:none}sl-profile-page .profile .info .links li{display:flex;align-items:center;margin-bottom:.5rem}sl-profile-page .profile .info .links li sl-icon{margin-right:.5rem;height:1rem}sl-profile-page .profile .info .followcount{display:flex;gap:2rem}sl-profile-page .profile .info .followcount strong{font-weight:600}sl-profile-page .profile .info .followcount a{color:var(--text-color);text-decoration:none}sl-profile-page .profile .info .followcount a:hover{text-decoration:underline}sl-profile-page .profile .info .tags{margin-top:2rem;display:flex;gap:1rem;list-style:none;padding:0;margin:0;margin-bottom:1rem;flex-wrap:wrap}sl-profile-page .profile .info .tags li a{color:var(--secondary-color-2)}sl-edit-profile sl-avatar{width:15rem;height:15rem}@container body (width <= 700px){sl-edit-profile sl-avatar{width:12rem;height:12rem}}sl-edit-profile sl-dialog .avatar{display:flex;margin-bottom:2rem;align-items:center;width:100%;gap:4rem}sl-edit-profile sl-dialog .edit-profile{display:flex;flex-direction:column;gap:2rem}sl-edit-profile .change-avatar input{display:none}sl-followers-page .header{display:flex;justify-content:flex-start;align-items:flex-start;margin-bottom:2rem}sl-followers-page .header button{background:transparent;border:none;font-size:2rem;font-weight:500;width:3.2rem;height:3.2rem;display:flex;align-items:center;justify-content:center;margin-right:1.6rem;cursor:pointer}sl-followers-page .header button sl-icon{height:2.4rem;width:2.4rem}@container body (width <= 700px){sl-followers-page .header button{display:none}}sl-followers-page .header h1{margin-bottom:0!important}@container body (width <= 700px){sl-followers-page .header span{margin-left:2rem}}sl-followers-page .content{display:flex;flex-direction:column}sl-followers-page .content sl-tabs{margin-bottom:2rem}@container body (width <= 700px){sl-followers-page .content sl-tabs{margin-left:2rem}}sl-comment-input{display:flex;gap:1rem;box-shadow:var(--shadow-2);border-radius:1rem;border:2px solid var(--border-color);padding:1.6rem;outline:none;justify-content:flex-start;align-items:center;width:calc(100% - 2rem);margin:0 auto;margin-top:1rem;transition:all .3s ease;background:var(--bg-color)}@container body (width <= 700px){sl-comment-input{margin:0}}sl-comment-input:after{content:attr(data-length);font-size:1.6rem;color:var(--text-color);font-weight:500;position:absolute;bottom:3rem;left:2rem}sl-comment-input textarea{border:none;outline:none;flex:1 1 100%;font-size:2rem;resize:none;height:30px;field-sizing:content;font-weight:450;background:transparent}sl-comment-input.active{flex-direction:column;align-items:flex-end;transform:translate(-.2rem,-.2rem);box-shadow:var(--shadow)}sl-comment-input.active textarea{width:100%}@container body (width <= 700px){sl-comment-input{box-shadow:none;width:100%;border-radius:0;border:none;border-top:2px solid var(--border-color)}}sl-comment-list{display:flex;flex-direction:column;gap:1rem;padding:0 1rem}@container body (width <= 700px){sl-comment-list{padding:0}}sl-comment-item{border:1px solid var(--border-color);box-shadow:var(--shadow-2);display:flex;border-radius:1rem;padding:1rem 1.2rem;flex-direction:column;gap:1.2rem;position:relative;background:var(--bg-color)}@container body (width <= 700px){sl-comment-item{border-radius:0;border:none;border-top:1px solid var(--border-color);width:100%;box-shadow:none}}sl-comment-item:last-child{border-bottom:1px solid var(--border-color)}sl-comment-item .more{gap:1rem;cursor:pointer;position:absolute;top:1rem;right:0}sl-comment-item .more button{display:flex;align-items:center;justify-content:center;background:transparent;border:none;height:3rem;width:4rem;padding:0;margin:0;cursor:pointer}sl-comment-item .more sl-icon{width:2rem;height:2rem;--fill-color: var(--text-color)}sl-comment-item .more span{font-size:1.6rem;color:var(--text-color);font-weight:500}sl-comment-item .more:hover sl-icon{--fill-color: var(--secondary-color-1)}sl-comment-item .more:hover span{color:var(--secondary-color-1)}sl-comment-item .content{line-height:1.2}sl-post-page{display:flex;flex-direction:column;gap:2rem}@container body (width <= 700px){sl-post-page{gap:0}}sl-search-page sl-search{display:none;margin:0}@container body (width <= 700px){sl-search-page sl-search{display:block}}@container body (width <= 700px){sl-search-page h1{display:none}}sl-user-list{display:flex;flex-direction:column}sl-user-list sl-user{width:100%;display:flex;gap:1rem;border:2px solid var(--border-color);border-bottom:none;padding:1.2rem}sl-user-list sl-user:last-child{border-bottom:2px solid var(--border-color);border-bottom-right-radius:1rem;border-bottom-left-radius:1rem}@container body (width <= 700px){sl-user-list sl-user:last-child{border-bottom-right-radius:0;border-bottom-left-radius:0}}sl-user-list sl-user:first-child{border-top-right-radius:1rem;border-top-left-radius:1rem}@container body (width <= 700px){sl-user-list sl-user:first-child{border-top-right-radius:0;border-top-left-radius:0}}sl-user-list sl-user sl-avatar{height:4rem;width:4rem}@container body (width <= 700px){sl-user-list sl-user{border-left:none;border-right:none}}sl-user-list sl-user .details{flex:1 1 100%}sl-user-list sl-user .details .info{display:flex;justify-content:space-between;align-items:center}sl-user-list sl-user .details .info>div{display:flex;flex-direction:column}sl-user-list sl-user .details .info>div a{text-decoration:none;color:var(--text-color)}sl-user-list sl-user .details .info>div a.name{font-size:1.8rem;font-weight:450}sl-user-list sl-user .details .info>div a.username{font-size:1.4rem}sl-user-list sl-user .details .bio{font-weight:450;font-size:2rem;margin-top:1rem;-webkit-line-clamp:2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}sl-settings-page .container{border:2px solid var(--border-color);box-shadow:var(--shadow);border-radius:1rem;padding:1.6rem;margin-bottom:3rem}sl-settings-page .container h2{font-weight:500;margin:0;padding:0;margin-bottom:2rem}@container body (width <= 700px){sl-settings-page .container{margin:3rem 1.6rem}}
