html, body {
  margin: 0;
  padding: 0;
  background: #0b1a24;
  min-height: 100%;
}
body.sl-app-shell-page {
  background: #0b1a24;
  color: #eaf7fb;
}
.sl-app-shell-root {
  min-height: 100dvh;
  background: linear-gradient(180deg, rgba(9,24,31,1) 0%, rgba(8,20,27,1) 100%);
}
.sl-app-shell-frame {
  --sl-shell-header-h: 0px;
  --sl-shell-filters-h: 0px;
  min-height: 100dvh;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: env(safe-area-inset-top) 0 calc(86px + env(safe-area-inset-bottom));
  position: relative;
}
.sl-app-shell-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(7, 18, 25, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.sl-app-shell-filters {
  position: sticky;
  top: var(--sl-shell-header-h, 0px);
  z-index: 55;
  background: rgba(11, 26, 36, 0.96);
}
.sl-app-shell-main {
  min-height: 50dvh;
  padding-top: 6px;
}
.sl-app-shell-error {
  padding: 24px 16px;
}
.sl-app-bottom-nav {
  --sl-nav-height: 74px;
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  z-index: 90;
  width: 100%;
  max-width: 1280px;
  padding-bottom: env(safe-area-inset-bottom);
  background: rgba(6, 16, 22, 0.94);
  border-top: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.sl-app-bottom-nav__inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  min-height: var(--sl-nav-height);
  align-items: stretch;
}
.sl-app-bottom-nav__btn {
  min-height: var(--sl-nav-height);
  color: #d9eef5;
  text-decoration: none;
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 8px 10px;
  box-sizing:border-box;
}
.sl-app-bottom-nav__btn--disabled {
  opacity: .4;
}
.sl-app-bottom-nav__btn--active {
  color: #62e8ff;
}
.sl-app-bottom-nav__icon {
  font-size: 14px;
  line-height: 1;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
}
.sl-app-bottom-nav__icon--badge-wrap {
  position: relative;
}
.sl-shell-badge {
  position: absolute;
  top: -2px;
  right: -3px;
  width: 8px;
  height: 8px;
  min-width: 8px;
  border-radius: 999px;
  background: #ff4f6d;
  color: transparent;
  font-size: 0;
  display: inline-block;
  box-shadow: 0 0 0 2px rgba(6,16,22,.94);
  pointer-events:none;
}
.sl-shell-menu-fallback {
  appearance: none;
  border: 0;
  background: rgba(255,255,255,0.08);
  color: #fff;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  font-size: 20px;
}


@media (min-width: 900px){
  .sl-app-shell-frame{padding-left:16px;padding-right:16px;}
  .sl-app-bottom-nav{max-width: 1280px;}
}

@media (max-width: 767px){
  .sl-app-shell-frame{max-width:none;padding-left:0;padding-right:0;}
  .sl-app-bottom-nav{max-width:none;}
}


.sl-app-shell-overlay-root {
  position: fixed;
  inset: 0;
  z-index: 120;
  pointer-events: none;
}
.sl-app-shell-overlay-root > * {
  pointer-events: auto;
}
body.sl-shell-lock-scroll,
html.sl-shell-lock-scroll {
  overflow: hidden !important;
}

.sl-screen-overlay-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.58);
}
.sl-app-shell-overlay-root.is-open{
  pointer-events:auto;
}
.sl-screen-overlay-panel{
  position:absolute;
  inset:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.sl-screen-overlay-panel .pkd-page{
  min-height:100%;
}
#sl-screen-members{display:block;}

.sl-app-bottom-nav__btn{appearance:none;-webkit-appearance:none;border:0;background:transparent;padding:10px 8px;cursor:pointer;}
.sl-app-bottom-nav__btn:focus-visible{outline:2px solid #62e8ff;outline-offset:-2px;}
.sl-app-bottom-nav__label{line-height:1.1;}
.pkd-shell-portal{position:fixed;inset:0;z-index:140;pointer-events:none;}
.pkd-shell-portal > *{pointer-events:auto;}

.sl-app-shell-overlay-root{pointer-events:none;}
.sl-app-shell-overlay-root.is-open{pointer-events:auto;}
.sl-screen-overlay-panel{will-change:transform;}

.sl-screen{display:none;min-height:0;}
.sl-screen.is-active{display:block;}
#sl-screen-chat{min-height:calc(100dvh - var(--sl-shell-header-h,0px) - var(--sl-shell-filters-h,0px) - var(--sl-shell-bottom-h,72px));}
body.sl-shell-chat-visible #sewalok-filters-slot{display:none;}
body.sl-shell-chat-visible .sl-app-shell-main{padding-top:0;}


.sl-app-bottom-nav__icon img{
  width:24px;
  height:24px;
  display:block;
  object-fit:contain;
}

#sl-screen-chat{
  position:fixed;
  left:0;
  right:0;
  z-index:110;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(9,24,31,1) 0%, rgba(8,20,27,1) 100%);
}
body.sl-shell-inbox-visible #sl-app-shell-header,
body.sl-shell-inbox-visible #sewalok-filters-slot,
body.sl-shell-chat-visible #sl-app-shell-header,
body.sl-shell-chat-visible #sewalok-filters-slot{
  display:none !important;
}
body.sl-shell-inbox-visible #sl-screen-chat{
  top:0;
  bottom:calc(var(--sl-shell-bottom-h,72px) + env(safe-area-inset-bottom));
}
body.sl-shell-chat-visible #sl-screen-chat{
  top:0;
  bottom:0;
}
body.sl-shell-chat-visible .sl-app-bottom-nav{
  display:none !important;
}
body.sl-shell-inbox-visible .sl-app-shell-main,
body.sl-shell-chat-visible .sl-app-shell-main{
  padding-top:0;
}
body.sl-shell-inbox-visible #sl-screen-members,
body.sl-shell-chat-visible #sl-screen-members{
  visibility:hidden;
  pointer-events:none;
}
body.sl-shell-chat-visible .sl-app-shell-frame{
  padding-bottom:0;
}
.sl-app-shell-overlay-root.is-open{
  z-index:130;
}
.sl-screen-overlay-panel{
  animation:none;
  transform:translateZ(0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  overscroll-behavior:contain;
}


body.sl-shell-inbox-visible .sl-app-bottom-nav{display:block !important;}
body.sl-shell-inbox-visible .sl-app-bottom-nav__btn{padding-top:10px;padding-bottom:12px;}
.sl-app-bottom-nav__label{display:block;line-height:1.05;}


/* --- FINAL POLISH: reduce flash/jump on shell child screens --- */
.sl-app-shell-overlay-root,
.sl-screen-overlay-panel,
.sl-screen,
.pkd-page,
.pkd-popup-content{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

.sl-screen-overlay-panel,
.sl-app-shell-main,
#sl-screen-members,
#sl-screen-chat{
  contain:layout paint style;
}

.sl-screen-overlay-panel .pkd-page{
  min-height:100%;
  transform:translateZ(0);
}


body.sl-shell-posts-visible .sl-app-shell-header,
body.sl-shell-posts-visible .sl-app-shell-filters{
  position:relative !important;
  top:auto !important;
}
body.sl-shell-posts-visible .sl-app-shell-main{
  padding-top:0 !important;
}

/* --- Premium return polish: hide members/chat jolt during profile restore --- */
body.sl-shell-profile-transition #sl-screen-members,
body.sl-shell-profile-transition #sl-screen-chat{
  visibility:hidden !important;
}
body.sl-shell-profile-transition .sl-app-shell-overlay-root{
  pointer-events:none;
}
.sl-app-shell-overlay-root.is-open .sl-screen-overlay-panel{
  animation:slShellProfileFadeIn 130ms ease-out;
}
@keyframes slShellProfileFadeIn{
  from{opacity:.985; transform:translate3d(0,6px,0);}
  to{opacity:1; transform:translate3d(0,0,0);}
}
@media (prefers-reduced-motion: reduce){
  .sl-app-shell-overlay-root.is-open .sl-screen-overlay-panel{animation:none !important;}
}


.sl-overlay-chat-profile .sl-screen-overlay-backdrop--chat{
  background:rgba(0,0,0,.18);
  animation:sl-shell-fade-in .18s ease-out forwards;
}
.sl-overlay-chat-profile .sl-screen-overlay-panel--from-chat{
  background:linear-gradient(180deg, rgba(9,24,31,1) 0%, rgba(8,20,27,1) 100%);
  border-radius:24px 24px 0 0;
  overflow:hidden;
  box-shadow:0 -8px 30px rgba(0,0,0,.28);
  animation:sl-shell-profile-up .24s cubic-bezier(.22,.8,.2,1) forwards;
}
.sl-screen-overlay-panel--profile-shell{
  background:linear-gradient(180deg, rgba(9,24,31,1) 0%, rgba(8,20,27,1) 100%);
}
.sl-profile-shell-skeleton{
  min-height:100dvh;
  background:linear-gradient(180deg, rgba(9,24,31,1) 0%, rgba(8,20,27,1) 100%);
}
.sl-profile-shell-skeleton__hero{
  height:240px;
  background:linear-gradient(180deg, rgba(17,39,52,1) 0%, rgba(11,27,37,1) 100%);
}
.sl-profile-shell-skeleton__body{
  padding:0 18px 28px;
}
.sl-profile-shell-skeleton__avatar{
  width:112px;
  height:112px;
  border-radius:999px;
  margin-top:-56px;
  border:4px solid rgba(8,20,27,1);
}
.sl-profile-shell-skeleton__line{
  height:14px;
  border-radius:999px;
  margin-top:14px;
}
.sl-profile-shell-skeleton__line--title{ width:58%; height:22px; margin-top:18px; }
.sl-profile-shell-skeleton__line--meta{ width:38%; }
.sl-profile-shell-skeleton__chips{ display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; }
.sl-profile-shell-skeleton__chip{ width:76px; height:30px; border-radius:999px; display:block; }
.sl-profile-shell-skeleton__actions{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:22px; }
.sl-profile-shell-skeleton__action{ height:58px; border-radius:18px; display:block; }
.sl-profile-shell-skeleton__card{ height:140px; border-radius:22px; margin-top:22px; display:block; }
.sl-profile-shell-skeleton__card--short{ height:84px; }
.sl-skel{
  position:relative;
  overflow:hidden;
  background:rgba(255,255,255,.08);
}
.sl-skel::after{
  content:'';
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.08) 45%, rgba(255,255,255,.16) 50%, rgba(255,255,255,.08) 55%, rgba(255,255,255,0) 100%);
  animation:sl-shell-shimmer 1.15s linear infinite;
}
@keyframes sl-shell-shimmer{ to{ transform:translateX(100%); } }
@keyframes sl-shell-fade-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes sl-shell-profile-up{ from{ transform:translate3d(0,100%,0); } to{ transform:translate3d(0,0,0); } }