.cosmos-shell {
  --cosmos-sidebar-width: 320px
}
.cosmos-shell .cosmos-shell__sidebar.ecosystem-sidebar {
  inset: 8px auto 8px 8px;
  width: calc(var(--cosmos-sidebar-width) - 16px);
  height: calc(100dvh - 16px)
}
.ecosystem-sidebar {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #2b3b52;
  border-radius: 16px;
  color: #f0f5ff;
  background: radial-gradient(ellipse at 0 10%,#25334633,transparent 55%),linear-gradient(115deg,#111a26,#090f17 78%);
  box-shadow: inset 1px 0 #ffffff06,0 16px 50px #00000024;
  font-family: Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  isolation: isolate
}
.ecosystem-sidebar * {
  box-sizing: border-box
}
.ecosystem-sidebar :is(button,input,a) {
  font-family: inherit
}
.ecosystem-sidebar :is(button,a,input):focus-visible {
  outline: 2px solid #45baff;
  outline-offset: 3px
}
.ecosystem-sidebar .ecosystem-sidebar__header {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 104px;
  margin: 0;
  padding: 16px 13px 20px;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid #2a3a51;
  background: linear-gradient(135deg,#1d283a85,#060d15 65%,#0b1b37);
  isolation: isolate
}
.ecosystem-sidebar__header::before {
  content: '';
  position: absolute;
  z-index: -1;
  width: 320px;
  height: 75px;
  top: 3px;
  left: -70px;
  border: 1px solid #095fff;
  border-left-color: transparent;
  border-radius: 50%;
  transform: rotate(14deg);
  pointer-events: none
}
.ecosystem-sidebar__header::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(12deg,#1e4ba24d 11%,transparent 11.5%),linear-gradient(44deg,transparent 75%,#173b7833 75.2%)
}
.ecosystem-sidebar .ecosystem-sidebar__brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  text-decoration: none
}
.ecosystem-sidebar .ecosystem-sidebar__logo:has(> .cosmos-brand-logo) {
  display: block;
  width: 62px;
  height: 62px;
  flex: 0 0 62px;
  border: 0;
  padding: 0;
  background: 0 0;
  box-shadow: none
}
.ecosystem-sidebar__logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 5px 6px #0008)
}
.ecosystem-sidebar .ecosystem-sidebar__brand-copy {
  display: grid;
  gap: 1px;
  min-width: 0
}
.ecosystem-sidebar .ecosystem-sidebar__brand-copy strong {
  color: #f4f7fc;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.2
}
.ecosystem-sidebar .ecosystem-sidebar__brand-copy small {
  color: #98aac6;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0
}
.ecosystem-sidebar .ecosystem-sidebar__collapse {
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  width: 30px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 1px solid #2b3f5f;
  border-radius: 9px;
  background: #19263d80;
  color: #aebed7;
  font-size: 26px;
  cursor: pointer
}
.ecosystem-sidebar__tools {
  flex: 0 0 auto;
  display: grid;
  gap: 10px;
  padding: 12px 14px 8px
}
.ecosystem-sidebar__search {
  display: flex;
  align-items: center;
  min-width: 0;
  height: 38px;
  gap: 10px;
  padding: 0 10px;
  border: 1px solid #2b3c53;
  border-radius: 9px;
  background: linear-gradient(110deg,#1c2735,#141e2a)
}
.ecosystem-sidebar__search > svg {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  color: #b0c2dc
}
.ecosystem-sidebar__search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  padding: 5px 0;
  background: 0 0;
  color: #edf5ff;
  font-size: 12px
}
.ecosystem-sidebar__search input::placeholder {
  color: #a5b5ce;
  opacity: 1
}
.ecosystem-sidebar__shortcut {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 3px;
  color: #9aacc8
}
.ecosystem-sidebar__shortcut kbd {
  font-family: inherit;
  font-size: 9px;
  line-height: 1.2;
  padding: 3px;
  border: 1px solid #344761;
  border-radius: 4px
}
.ecosystem-sidebar__new {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 44px;
  padding: 0 13px;
  color: #fff;
  text-decoration: none;
  border: 1px solid #2eb5ff;
  border-radius: 8px;
  background: linear-gradient(132deg,transparent 72%,#002c9e88 72.3%),linear-gradient(115deg,#18b6f6 -20%,#0658ed 45%,#0042d6);
  box-shadow: inset 0 1px 6px #ffffff26,0 5px 18px #004cff18;
  font-size: 14px;
  font-weight: 700
}
.ecosystem-sidebar__new svg {
  width: 22px;
  height: 22px;
  flex-shrink: 0
}
.ecosystem-sidebar__new svg:last-child {
  margin-left: auto;
  width: 17px;
  height: 17px;
  color: #b8d8ff
}
.ecosystem-sidebar__new:hover {
  filter: brightness(1.12)
}
.ecosystem-sidebar__banner[aria-disabled=true],
.ecosystem-sidebar__new[aria-disabled=true] {
  opacity: .45;
  cursor: not-allowed
}
.ecosystem-sidebar .ecosystem-sidebar__navigation {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 14px;
  min-height: 100px;
  margin: 0;
  padding: 12px 10px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #334258 transparent
}
.ecosystem-sidebar [data-sidebar-group] {
  display: grid;
  gap: 3px
}
.ecosystem-sidebar [data-sidebar-group] > :is(h2,h3) {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 3px 6px 6px;
  color: #7e91b1;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: .1em;
  text-transform: uppercase
}
.ecosystem-sidebar [data-sidebar-group] > :is(h2,h3)::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #34455d
}
.ecosystem-sidebar [data-sidebar-item] {
  position: relative;
  display: grid;
  grid-template-columns: 27px minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
  min-height: 39px;
  width: 100%;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #e2eaf6;
  background: 0 0;
  text-decoration: none;
  isolation: isolate
}
.ecosystem-sidebar [data-sidebar-item] :is(.cosmos-shell__nav-text,.cosmos-editor-drawer__item-label) {
  color: inherit;
  font-size: 14px;
  font-weight: 450;
  letter-spacing: -.01em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}
.ecosystem-sidebar [data-sidebar-item][href]:hover {
  background: #1a2d494d;
  color: #fff
}
.ecosystem-sidebar [data-sidebar-item][aria-current=page] {
  border-color: #1767ff;
  background: linear-gradient(125deg,transparent 62%,#074dd044 62.2%,transparent 79%),linear-gradient(100deg,#0638ac,#0437a6a8);
  box-shadow: inset 0 1px 8px #0569ff4d;
  color: #fff
}
.ecosystem-sidebar [data-sidebar-item][aria-current=page]::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 -1px;
  width: 3px;
  border-radius: 4px;
  background: #12bfff;
  box-shadow: 0 0 9px #12bfff66
}
.ecosystem-sidebar [data-sidebar-item][aria-current=page]::after {
  content: '›';
  position: absolute;
  right: 10px;
  color: #b9d9ff;
  font-size: 22px
}
.ecosystem-sidebar [data-sidebar-item][aria-current=page] :is(.cosmos-shell__nav-text,.cosmos-editor-drawer__item-label) {
  font-weight: 700;
  padding-right: 12px
}
.ecosystem-sidebar [data-sidebar-item][aria-disabled=true] {
  opacity: .48
}
.ecosystem-sidebar [data-sidebar-item] .ecosystem-sidebar__item-icon {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border: 0;
  border-radius: 0;
  color: #e6efff;
  background: 0 0;
  box-shadow: none
}
.ecosystem-sidebar__item-icon svg {
  width: 24px;
  height: 24px;
  filter: drop-shadow(0 1px 1px #000c)
}
.ecosystem-sidebar__item-icon .icon-accent {
  stroke: #149dff
}
.ecosystem-sidebar [aria-current=page] .icon-accent {
  stroke: #4cdaff
}
.ecosystem-sidebar :is(.cosmos-shell__nav-status,.cosmos-editor-drawer__item-status) {
  font-size: 8px;
  color: #8ca2c4
}
.ecosystem-sidebar [aria-current=page] :is(.cosmos-shell__nav-status,.cosmos-editor-drawer__item-status) {
  display: none
}
.ecosystem-sidebar [data-sidebar-group][hidden],
.ecosystem-sidebar [data-sidebar-item][hidden] {
  display: none
}
.ecosystem-sidebar__empty {
  margin: 12px;
  color: #99adc9;
  font-size: 12px;
  line-height: 1.5
}
.ecosystem-sidebar__bottom {
  flex: 0 0 auto;
  padding: 0 10px 8px
}
.ecosystem-sidebar__banner {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 88px;
  padding: 12px 16px;
  overflow: hidden;
  border: 1px solid #243e65;
  border-radius: 8px;
  text-decoration: none;
  color: #fff;
  background: linear-gradient(90deg,#050a14 0,#050a14e6 34%,#050a1433 70%),url('/assets/home/magic-fabric-hero-v1.jpg') right 42%/cover no-repeat
}
.ecosystem-sidebar__banner span {
  position: relative;
  font-size: 16px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -.025em
}
.ecosystem-sidebar__banner em {
  font-style: normal;
  color: #24b9ff
}
.ecosystem-sidebar .ecosystem-sidebar__account {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 27px;
  align-items: center;
  gap: 10px;
  margin: 10px 0 0;
  padding: 12px 6px 3px;
  border-top: 1px solid #2c3c52
}
.ecosystem-sidebar .ecosystem-sidebar__avatar {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid #2877ff;
  border-radius: 50%;
  background: linear-gradient(140deg,#0b81ff,#003add);
  color: #fff;
  font-size: 14px;
  font-weight: 700
}
.ecosystem-sidebar__account-copy {
  display: grid;
  min-width: 0;
  gap: 2px
}
.ecosystem-sidebar .ecosystem-sidebar__account-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  color: #f2f5fc;
  font-weight: 650
}
.ecosystem-sidebar .ecosystem-sidebar__account-copy small {
  font-size: 11px;
  color: #9aadc8;
  text-transform: capitalize
}
.ecosystem-sidebar__settings {
  display: grid;
  place-items: center;
  padding: 0;
  width: 27px;
  height: 30px;
  border: 0;
  color: #a6bddf;
  background: 0 0;
  cursor: pointer
}
.ecosystem-sidebar__settings svg {
  width: 23px;
  height: 23px
}
.ecosystem-sidebar__account-details {
  grid-column: 1/-1;
  padding: 8px;
  background: #1a273b;
  border-radius: 6px;
  font-size: 11px;
  color: #b8c9e3;
  overflow-wrap: anywhere
}
.cosmos-editor-drawer.ecosystem-sidebar {
  width: min(320px,94vw);
  height: calc(100dvh - 16px);
  margin: 8px
}
.cosmos-shell[data-sidebar-collapsed=true] .cosmos-shell__sidebar {
  width: 72px;
  padding: 0
}
.cosmos-shell[data-sidebar-collapsed=true] .cosmos-shell__workspace {
  margin-left: 88px
}
.cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__header {
  flex-direction: column;
  gap: 6px;
  padding: 12px 5px
}
.cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__brand {
  justify-content: center
}
.cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__logo:has(> .cosmos-brand-logo) {
  width: 44px;
  height: 44px;
  flex-basis: 44px
}
.cosmos-shell[data-sidebar-collapsed=true] :is(.ecosystem-sidebar__brand-copy,.ecosystem-sidebar__tools,.ecosystem-sidebar__banner,.ecosystem-sidebar__settings,.ecosystem-sidebar__account-details) {
  display: none
}
.cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__navigation {
  padding-inline: 7px;
  margin: 0
}
.cosmos-shell[data-sidebar-collapsed=true] [data-sidebar-item] {
  grid-template-columns: 27px;
  justify-content: center;
  padding-inline: 8px
}
.cosmos-shell[data-sidebar-collapsed=true] [data-sidebar-item]::after {
  display: none
}
.cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__account {
  grid-template-columns: 38px;
  justify-content: center;
  padding-inline: 0
}
@media (max-height:780px) {
  .ecosystem-sidebar__banner {
    min-height: 68px
  }
  .ecosystem-sidebar__banner span {
    font-size: 14px
  }
  .ecosystem-sidebar .ecosystem-sidebar__header {
    min-height: 90px;
    padding-block: 12px
  }
}
@media (max-width:600px) {
  .cosmos-shell .cosmos-shell__sidebar.ecosystem-sidebar {
    width: min(320px,calc(100vw - 16px))
  }
  .cosmos-shell[data-sidebar-collapsed=true] .cosmos-shell__workspace {
    margin-left: 0
  }
  .ecosystem-sidebar .cosmos-shell__collapse-toggle {
    display: none
  }
  .cosmos-shell__sidebar-close {
    z-index: 3;
    top: 12px;
    right: 12px
  }
  .cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__header {
    flex-direction: row;
    padding: 16px 13px 20px
  }
  .cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__logo:has(> .cosmos-brand-logo) {
    width: 62px;
    height: 62px;
    flex-basis: 62px
  }
  .cosmos-shell[data-sidebar-collapsed=true] :is(.ecosystem-sidebar__brand-copy,.ecosystem-sidebar__tools,.ecosystem-sidebar__settings) {
    display: grid
  }
  .cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__banner {
    display: flex
  }
  .cosmos-shell[data-sidebar-collapsed=true] [data-sidebar-item] {
    grid-template-columns: 27px minmax(0,1fr) auto;
    padding-inline: 10px
  }
  .cosmos-shell[data-sidebar-collapsed=true] .ecosystem-sidebar__account {
    grid-template-columns: 38px minmax(0,1fr) 27px;
    padding-inline: 6px
  }
}