/* Stellar AI home shell — Settings-matched gold lighting v1 */

:root{
  --stellar-home-bg:#090a11;
  --stellar-home-panel:#11121b;
  --stellar-home-panel-2:#151622;
  --stellar-home-gold:#d4af37;
  --stellar-home-gold-soft:#f4d676;
  --stellar-home-border:rgba(212,175,55,.18);
  --stellar-home-text:#f5f5fa;
  --stellar-home-muted:#9294a5;
}

html body:not(.light){
  background:#06070c!important;
}

html body:not(.light) .stellar-app-shell{
  background:#070810!important;
}

html body:not(.light) .stellar-app-shell #main-col{
  position:relative!important;
  isolation:isolate!important;
  background:
    radial-gradient(circle at 58% 18%,rgba(104,62,210,.13),transparent 25rem),
    radial-gradient(circle at 72% 78%,rgba(74,44,160,.10),transparent 30rem),
    linear-gradient(155deg,#0b0c14 0%,#090a11 46%,#070810 100%)!important;
}

html body:not(.light) .stellar-app-shell #main-col::before{
  content:""!important;
  position:fixed!important;
  inset:52px 0 0 260px!important;
  z-index:-1!important;
  pointer-events:none!important;
  background:
    radial-gradient(ellipse at 50% 43%,rgba(212,175,55,.085),transparent 31rem),
    radial-gradient(ellipse at 76% 90%,rgba(91,56,190,.06),transparent 34rem)!important;
  filter:blur(.2px)!important;
}

html body:not(.light).stellar-empty-home .stellar-app-shell #main-col{
  background:
    radial-gradient(circle at 58% 46%,rgba(212,175,55,.14),transparent 22rem),
    radial-gradient(circle at 58% 52%,rgba(212,175,55,.055),transparent 36rem),
    linear-gradient(160deg,#0b0c14 0%,#090a11 52%,#070810 100%)!important;
}

html body:not(.light) #chat{
  background:transparent!important;
}

/* Sidebar: same deep charcoal / gold language as Settings */
html body:not(.light) .stellar-app-shell #sidebar{
  background:
    radial-gradient(circle at 20% 0%,rgba(120,73,218,.10),transparent 19rem),
    linear-gradient(180deg,#11121a 0%,#0e0f17 58%,#0b0c13 100%)!important;
  border-right:1px solid rgba(212,175,55,.12)!important;
  box-shadow:10px 0 38px rgba(0,0,0,.16)!important;
}

html body:not(.light) #sidebar .brand-title,
html body:not(.light) #sidebar .brand-grad{
  color:#f6f5fb!important;
}

html body:not(.light) #sidebar .brand-star{
  color:#f4d676!important;
  filter:drop-shadow(0 0 8px rgba(212,175,55,.48))!important;
}

html body:not(.light) #sidebar .side-new{
  min-height:44px!important;
  border:1px solid rgba(212,175,55,.10)!important;
  background:linear-gradient(145deg,rgba(212,175,55,.08),rgba(255,255,255,.018))!important;
  color:#f0eef8!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

html body:not(.light) #sidebar .side-new:hover,
html body:not(.light) #sidebar .side-new:focus-visible{
  border-color:rgba(212,175,55,.22)!important;
  background:linear-gradient(145deg,rgba(212,175,55,.16),rgba(255,255,255,.025))!important;
  box-shadow:0 0 22px rgba(212,175,55,.10)!important;
}

html body:not(.light) #sidebar #search{
  min-height:42px!important;
  border:1px solid rgba(255,255,255,.065)!important;
  background:rgba(4,5,10,.36)!important;
  color:#f0eff5!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
}

html body:not(.light) #sidebar #search:focus{
  border-color:rgba(212,175,55,.34)!important;
  box-shadow:0 0 0 3px rgba(212,175,55,.08)!important;
}

html body:not(.light) #sidebar #search::placeholder{
  color:#747786!important;
}

html body:not(.light) #sidebar .stellar-sidebar-nav{
  border-color:rgba(212,175,55,.075)!important;
  background:rgba(255,255,255,.018)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.016)!important;
}

html body:not(.light) #sidebar .stellar-sidebar-nav button{
  color:#b9bbc7!important;
}

html body:not(.light) #sidebar .stellar-sidebar-nav button:hover,
html body:not(.light) #sidebar .stellar-sidebar-nav button:focus-visible{
  background:rgba(212,175,55,.10)!important;
  color:#fff!important;
}

html body:not(.light) #sidebar .stellar-sidebar-nav .nav-ico{
  background:rgba(212,175,55,.075)!important;
  color:#a99bd9!important;
}

html body:not(.light) #sidebar .chats-label,
html body:not(.light) #sidebar #chats-heading{
  color:#696c7a!important;
}

html body:not(.light) #sidebar .sidebar-item{
  border:1px solid transparent!important;
  color:#b7b9c5!important;
}

html body:not(.light) #sidebar .sidebar-item:hover,
html body:not(.light) #sidebar .sidebar-item.active{
  border-color:rgba(212,175,55,.09)!important;
  background:rgba(212,175,55,.08)!important;
  color:#fff!important;
}

html body:not(.light) #sidebar .acct-box,
html body:not(.light) #sidebar .side-foot{
  border-color:rgba(212,175,55,.09)!important;
}

html body:not(.light) #sidebar .acct-signin-btn,
html body:not(.light) #sidebar .stellar-upgrade{
  border-color:rgba(212,175,55,.22)!important;
  background:linear-gradient(135deg,rgba(212,175,55,.18),rgba(212,175,55,.10))!important;
  color:#f5f1ff!important;
  box-shadow:0 0 20px rgba(212,175,55,.08)!important;
}

html body:not(.light) #sidebar .side-act:hover{
  background:rgba(212,175,55,.09)!important;
  color:#f3f1fb!important;
}

/* Top shell */
html body:not(.light) .topbar.glass{
  border-bottom:1px solid rgba(212,175,55,.18)!important;
  background:
    linear-gradient(180deg,rgba(17,18,27,.96),rgba(12,13,21,.90))!important;
  backdrop-filter:blur(18px) saturate(118%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(118%)!important;
  box-shadow:
    0 1px 0 rgba(212,175,55,.07),
    0 10px 32px rgba(0,0,0,.12),
    0 8px 28px rgba(92,55,184,.045)!important;
}

html body:not(.light) .topbar #chat-title{
  color:#efeff5!important;
}

/* Fresh home ambient focus */
html body:not(.light).stellar-empty-home .input-area.glass{
  background:transparent!important;
}

html body:not(.light) .input-area.glass{
  background:linear-gradient(180deg,rgba(9,10,17,0),rgba(9,10,17,.88) 27%,#090a11 64%)!important;
}

html body:not(.light) .input-area>.flex{
  border:1px solid rgba(212,175,55,.26)!important;
  background:
    radial-gradient(circle at 50% 0%,rgba(212,175,55,.09),transparent 18rem),
    linear-gradient(145deg,rgba(24,24,36,.97),rgba(15,16,25,.98))!important;
  box-shadow:
    0 18px 54px rgba(0,0,0,.38),
    0 0 34px rgba(108,69,205,.12),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
}

html body:not(.light) .input-area>.flex:focus-within{
  border-color:rgba(177,150,255,.52)!important;
  box-shadow:
    0 22px 62px rgba(0,0,0,.42),
    0 0 0 3px rgba(212,175,55,.08),
    0 0 38px rgba(212,175,55,.18),
    inset 0 1px 0 rgba(255,255,255,.045)!important;
}

html body:not(.light) #txt{
  color:#f7f6fb!important;
  caret-color:#c4b5fd!important;
}

html body:not(.light) #txt::placeholder{
  color:#8b8d9b!important;
}

html body:not(.light) .composer-mode-dock #composer-model-trigger,
html body:not(.light) .ws-toggle,
html body:not(.light) .model-pill,
html body:not(.light) .credits-btn{
  border:1px solid rgba(212,175,55,.10)!important;
  background:rgba(19,19,30,.72)!important;
  color:#b7b2c8!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}

html body:not(.light) .composer-mode-dock #composer-model-trigger:hover,
html body:not(.light) .composer-mode-dock #composer-model-trigger:focus-visible,
html body:not(.light) .ws-toggle:hover,
html body:not(.light) .model-pill:hover,
html body:not(.light) .credits-btn:hover{
  border-color:rgba(212,175,55,.22)!important;
  background:rgba(212,175,55,.12)!important;
  color:#f7f4ff!important;
  box-shadow:0 0 18px rgba(212,175,55,.08)!important;
}

html body:not(.light) .input-area #send-btn{
  border:1px solid rgba(216,201,255,.30)!important;
  background:linear-gradient(145deg,#f4d676 0%,#d4af37 46%,#8f6b1e 100%)!important;
  color:#fff!important;
  box-shadow:
    0 8px 22px rgba(109,40,217,.28),
    0 0 22px rgba(212,175,55,.20),
    inset 0 1px 0 rgba(255,255,255,.20)!important;
}

html body:not(.light) .input-area #send-btn::after{
  color:#fff!important;
}

html body:not(.light) .input-area #send-btn:hover,
html body:not(.light) .input-area #send-btn:focus-visible{
  background:linear-gradient(145deg,#f4d676,#d4af37 48%,#d4af37)!important;
  box-shadow:
    0 10px 26px rgba(109,40,217,.34),
    0 0 28px rgba(212,175,55,.26)!important;
}

html body:not(.light) .mic-btn,
html body:not(.light) .image-attach-btn{
  color:#a9a5b7!important;
}

html body:not(.light) .mic-btn:hover,
html body:not(.light) .image-attach-btn:hover{
  background:rgba(212,175,55,.09)!important;
  color:#e8e0ff!important;
}

/* Conversation surfaces */
html body:not(.light) #chat .message.msg-user .msg-content{
  border:1px solid rgba(212,175,55,.14)!important;
  background:linear-gradient(145deg,rgba(89,54,155,.22),rgba(35,29,53,.62))!important;
  color:#f5f3fa!important;
  box-shadow:0 8px 28px rgba(0,0,0,.10)!important;
}

html body:not(.light) #chat .message:not(.msg-user) .msg-content{
  color:#e7e7ed!important;
}

html body:not(.light) .code-block,
html body:not(.light) .code-card{
  border-color:rgba(212,175,55,.14)!important;
  background:#0c0d15!important;
  box-shadow:0 12px 34px rgba(0,0,0,.14)!important;
}

/* Menus and floating UI inherit the same glass tone */
html body:not(.light) #model-menu,
html body:not(.light) .model-menu,
html body:not(.light) .popover,
html body:not(.light) #chat-menu{
  border-color:rgba(212,175,55,.16)!important;
  background:rgba(15,16,25,.97)!important;
  box-shadow:
    0 22px 62px rgba(0,0,0,.48),
    0 0 28px rgba(93,57,184,.10)!important;
  backdrop-filter:blur(18px) saturate(120%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(120%)!important;
}

html body:not(.light) *{
  scrollbar-color:rgba(212,175,55,.24) transparent;
}

@media(max-width:980px){
  html body:not(.light) .stellar-app-shell #main-col::before{
    inset:52px 0 0 244px!important;
  }
}

@media(max-width:767px){
  html body:not(.light) .stellar-app-shell #main-col::before{
    inset:52px 0 0 0!important;
    background:
      radial-gradient(ellipse at 50% 42%,rgba(212,175,55,.10),transparent 21rem),
      radial-gradient(ellipse at 70% 92%,rgba(91,56,190,.055),transparent 25rem)!important;
  }
  html body:not(.light) .stellar-app-shell #sidebar{
    box-shadow:18px 0 58px rgba(0,0,0,.40),0 0 30px rgba(92,55,184,.08)!important;
  }
  html body:not(.light) .input-area>.flex{
    border-color:rgba(212,175,55,.22)!important;
    box-shadow:
      0 12px 38px rgba(0,0,0,.34),
      0 0 24px rgba(108,69,205,.10),
      inset 0 1px 0 rgba(255,255,255,.028)!important;
  }
}


/* Collapsible icon rail + gold LED pass v2 */
/* Stronger ambient LED lighting without adding visual clutter. */
html body:not(.light) .stellar-app-shell #main-col::before{
  background:
    radial-gradient(ellipse at 52% 42%,rgba(212,175,55,.16),transparent 25rem),
    radial-gradient(ellipse at 75% 82%,rgba(110,61,224,.09),transparent 32rem),
    radial-gradient(ellipse at 34% 92%,rgba(84,46,178,.055),transparent 28rem)!important;
}

html body:not(.light).stellar-empty-home .stellar-app-shell #main-col::before{
  background:
    radial-gradient(ellipse at 50% 50%,rgba(145,83,255,.20),transparent 21rem),
    radial-gradient(ellipse at 50% 52%,rgba(212,175,55,.09),transparent 35rem),
    radial-gradient(ellipse at 78% 80%,rgba(96,54,200,.07),transparent 29rem)!important;
}

html body:not(.light) .stellar-app-shell #sidebar{
  position:fixed!important;
}
html body:not(.light) .stellar-app-shell #sidebar::after{
  content:""!important;
  position:absolute!important;
  top:70px!important;
  right:-1px!important;
  bottom:70px!important;
  width:2px!important;
  border-radius:999px!important;
  background:linear-gradient(
    180deg,
    transparent,
    rgba(212,175,55,.16) 12%,
    rgba(168,85,247,.72) 48%,
    rgba(212,175,55,.22) 86%,
    transparent
  )!important;
  box-shadow:
    0 0 12px rgba(212,175,55,.42),
    0 0 30px rgba(109,40,217,.16)!important;
  opacity:.84!important;
  pointer-events:none!important;
}

html body:not(.light) .topbar.glass{
  box-shadow:
    0 1px 0 rgba(212,175,55,.13),
    0 0 24px rgba(212,175,55,.045),
    0 10px 32px rgba(0,0,0,.14)!important;
}

html body:not(.light) .input-area>.flex{
  border-color:rgba(178,145,255,.34)!important;
  box-shadow:
    0 18px 56px rgba(0,0,0,.40),
    0 0 32px rgba(212,175,55,.18),
    0 0 76px rgba(106,52,210,.075),
    inset 0 1px 0 rgba(255,255,255,.04)!important;
}
html body:not(.light) .input-area>.flex:focus-within{
  border-color:rgba(196,181,253,.64)!important;
  box-shadow:
    0 22px 68px rgba(0,0,0,.44),
    0 0 0 3px rgba(212,175,55,.10),
    0 0 42px rgba(212,175,55,.27),
    0 0 92px rgba(99,51,190,.11),
    inset 0 1px 0 rgba(255,255,255,.05)!important;
}

/* Proper sidebar close/collapse control. */
#sidebar .sidebar-close{
  display:grid!important;
  place-items:center!important;
  flex:0 0 40px!important;
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  min-height:40px!important;
  padding:0!important;
  border:1px solid rgba(212,175,55,.14)!important;
  border-radius:12px!important;
  background:rgba(212,175,55,.075)!important;
  color:#bbb1da!important;
  font-size:0!important;
  line-height:1!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 0 18px rgba(212,175,55,.055)!important;
  cursor:pointer!important;
  transition:
    background .16s ease,
    border-color .16s ease,
    color .16s ease,
    box-shadow .16s ease,
    transform .16s ease!important;
}
#sidebar .sidebar-close::before{
  content:"‹"!important;
  display:block!important;
  font-size:27px!important;
  font-weight:500!important;
  transform:translateY(-1px)!important;
}
#sidebar .sidebar-close:hover,
#sidebar .sidebar-close:focus-visible{
  border-color:rgba(192,132,252,.34)!important;
  background:rgba(212,175,55,.16)!important;
  color:#fff!important;
  box-shadow:
    0 0 20px rgba(212,175,55,.15),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
  outline:none!important;
}
#sidebar .sidebar-close:active{
  transform:scale(.95)!important;
}

#mobile-menu-toggle{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0!important;
  border:1px solid rgba(212,175,55,.13)!important;
  border-radius:12px!important;
  background:rgba(212,175,55,.065)!important;
  color:#bdb4d8!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}
#mobile-menu-toggle:hover,
#mobile-menu-toggle:focus-visible{
  border-color:rgba(192,132,252,.32)!important;
  background:rgba(212,175,55,.14)!important;
  color:#fff!important;
  box-shadow:0 0 20px rgba(212,175,55,.12)!important;
  outline:none!important;
}
#mobile-menu-toggle:active{
  transform:scale(.95)!important;
}

/* Desktop collapsed state becomes a useful icon rail rather than disappearing. */
@media(min-width:1101px){
  .stellar-app-shell #sidebar{
    width:260px!important;
    min-width:260px!important;
    margin-left:0!important;
    padding:10px 10px 12px!important;
    transform:none!important;
    transition:
      width .24s cubic-bezier(.22,1,.36,1),
      min-width .24s cubic-bezier(.22,1,.36,1),
      padding .24s cubic-bezier(.22,1,.36,1),
      box-shadow .24s ease!important;
  }
  .stellar-app-shell #main-col{
    margin-left:260px!important;
    transition:margin-left .24s cubic-bezier(.22,1,.36,1)!important;
  }
  .input-area.glass{
    left:260px!important;
    transition:left .24s cubic-bezier(.22,1,.36,1)!important;
  }

  #sidebar.collapsed{
    width:76px!important;
    min-width:76px!important;
    margin-left:0!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  #sidebar.collapsed ~ #main-col{
    margin-left:76px!important;
  }
  #sidebar.collapsed ~ #main-col .input-area.glass{
    left:76px!important;
  }
  #sidebar.collapsed ~ #main-col::before{
    inset-left:76px!important;
  }

  #sidebar.collapsed .sidebar-brand-row{
    justify-content:center!important;
    margin-inline:0!important;
    padding-inline:0!important;
  }
  #sidebar.collapsed .brand-title{
    display:none!important;
  }
  #sidebar.collapsed .sidebar-close{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  #sidebar.collapsed .sidebar-close::before{
    content:"›"!important;
  }

  #sidebar.collapsed .side-new{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    margin:0 auto 10px!important;
    padding:0!important;
    justify-content:center!important;
    font-size:0!important;
    border-color:rgba(212,175,55,.13)!important;
    border-radius:12px!important;
    background:rgba(212,175,55,.08)!important;
  }
  #sidebar.collapsed .side-new>span{
    margin:0!important;
    font-size:21px!important;
    line-height:1!important;
    color:#c4b5fd!important;
  }

  #sidebar.collapsed #search,
  #sidebar.collapsed #chats-heading,
  #sidebar.collapsed #chats-list,
  #sidebar.collapsed #account-box,
  #sidebar.collapsed .sidebar-utility-links,
  #sidebar.collapsed .side-foot{
    display:none!important;
  }

  #sidebar.collapsed .stellar-sidebar-nav{
    width:52px!important;
    margin:0 auto!important;
    padding:4px!important;
    gap:5px!important;
    border-color:rgba(212,175,55,.08)!important;
    border-radius:14px!important;
    background:rgba(212,175,55,.035)!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    justify-content:center!important;
    gap:0!important;
    border-radius:11px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button>span:last-child{
    display:none!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav .nav-ico{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    margin:0!important;
    border:1px solid rgba(212,175,55,.075)!important;
    border-radius:9px!important;
    background:rgba(212,175,55,.08)!important;
    color:#b6a8e4!important;
    font-size:15px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button:hover .nav-ico,
  #sidebar.collapsed .stellar-sidebar-nav button:focus-visible .nav-ico{
    border-color:rgba(192,132,252,.26)!important;
    background:rgba(212,175,55,.18)!important;
    color:#fff!important;
    box-shadow:0 0 18px rgba(212,175,55,.12)!important;
  }

  #sidebar.collapsed::after{
    top:62px!important;
    bottom:62px!important;
    opacity:1!important;
    box-shadow:
      0 0 14px rgba(212,175,55,.52),
      0 0 36px rgba(109,40,217,.20)!important;
  }
}

/* Mobile/tablet remains a true drawer with a clear X close icon. */
@media(max-width:1100px){
  #sidebar .sidebar-close::before{
    content:"×"!important;
    font-size:22px!important;
    transform:none!important;
  }
  #sidebar .sidebar-close{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  #mobile-menu-toggle{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
}


/* Sidebar rail responsive repair v3 */
/* Never render the legacy pseudo + beside the real New build icon. */
#sidebar .side-new::before{
  content:none!important;
  display:none!important;
}
#sidebar .side-new>span[aria-hidden="true"]{
  display:inline-grid!important;
  place-items:center!important;
  flex:0 0 28px!important;
  width:28px!important;
  height:28px!important;
  margin:0 8px 0 0!important;
  border:1px solid rgba(212,175,55,.13)!important;
  border-radius:8px!important;
  background:rgba(212,175,55,.08)!important;
  color:#c4b5fd!important;
  font-size:17px!important;
  line-height:1!important;
}

/* Full sidebar rows: one visual language, aligned icons, no cramped buttons. */
#sidebar .stellar-sidebar-nav{
  padding:6px!important;
  gap:4px!important;
  border-radius:14px!important;
}
#sidebar .stellar-sidebar-nav button{
  min-height:46px!important;
  padding:0 10px!important;
  gap:10px!important;
  border:1px solid transparent!important;
  border-radius:11px!important;
}
#sidebar .stellar-sidebar-nav .nav-ico{
  display:grid!important;
  place-items:center!important;
  flex:0 0 30px!important;
  width:30px!important;
  min-width:30px!important;
  height:30px!important;
  border:1px solid rgba(212,175,55,.07)!important;
  border-radius:9px!important;
  background:rgba(212,175,55,.065)!important;
  color:#b9abe6!important;
  font-size:14px!important;
  line-height:1!important;
}
#sidebar .stellar-sidebar-nav button:hover .nav-ico,
#sidebar .stellar-sidebar-nav button:focus-visible .nav-ico{
  border-color:rgba(192,132,252,.22)!important;
  background:rgba(212,175,55,.14)!important;
  color:#fff!important;
  box-shadow:0 0 16px rgba(212,175,55,.10)!important;
}

/* Desktop icon rail: genuinely narrow, centred and balanced. */
@media(min-width:1101px){
  #sidebar.collapsed{
    width:68px!important;
    min-width:68px!important;
    max-width:68px!important;
    padding:10px 8px 12px!important;
    overflow:hidden!important;
  }
  #sidebar.collapsed ~ #main-col{
    margin-left:68px!important;
  }
  #sidebar.collapsed ~ #main-col .input-area.glass{
    left:68px!important;
  }
  #sidebar.collapsed .sidebar-brand-row{
    width:52px!important;
    min-height:52px!important;
    margin:0 auto 8px!important;
    padding:0!important;
    justify-content:center!important;
  }
  #sidebar.collapsed .sidebar-close{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    border-radius:12px!important;
  }
  #sidebar.collapsed .side-new{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    margin:0 auto 8px!important;
    padding:0!important;
  }
  #sidebar.collapsed .side-new>span[aria-hidden="true"]{
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    font-size:20px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav{
    width:52px!important;
    margin:0 auto!important;
    padding:4px!important;
    gap:4px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    justify-content:center!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav .nav-ico{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    margin:0!important;
  }
}

/* Phone/tablet must never inherit the desktop icon-only state.
   Drawer is either fully open with labels or completely off-canvas. */
@media(max-width:1100px){
  .stellar-app-shell #sidebar{
    width:min(86vw,286px)!important;
    max-width:286px!important;
    min-width:0!important;
    margin-left:0!important;
    padding:12px 10px calc(12px + env(safe-area-inset-bottom))!important;
    transform:translate3d(-105%,0,0)!important;
    overflow-y:auto!important;
  }
  .stellar-app-shell #sidebar.open{
    transform:translate3d(0,0,0)!important;
  }
  .stellar-app-shell #sidebar.collapsed:not(.open){
    width:min(86vw,286px)!important;
    max-width:286px!important;
    transform:translate3d(-105%,0,0)!important;
  }
  #sidebar.collapsed .brand-title,
  #sidebar.collapsed #search,
  #sidebar.collapsed #chats-heading,
  #sidebar.collapsed #chats-list,
  #sidebar.collapsed #account-box,
  #sidebar.collapsed .sidebar-utility-links{
    display:initial!important;
  }
  #sidebar.collapsed .brand-title{
    display:flex!important;
  }
  #sidebar.collapsed #search{
    display:block!important;
  }
  #sidebar.collapsed #chats-heading{
    display:block!important;
  }
  #sidebar.collapsed #chats-list{
    display:block!important;
  }
  #sidebar.collapsed #account-box{
    display:block!important;
  }
  #sidebar.collapsed .sidebar-utility-links{
    display:flex!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav{
    width:auto!important;
    margin:0 0 8px!important;
    padding:6px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button{
    width:100%!important;
    min-height:46px!important;
    height:auto!important;
    padding:0 10px!important;
    justify-content:flex-start!important;
    gap:10px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button>span:last-child{
    display:inline!important;
  }
  #sidebar.collapsed .side-new{
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:46px!important;
    margin:0 0 8px!important;
    padding:0 10px!important;
    justify-content:flex-start!important;
    font-size:13px!important;
  }
  #sidebar.collapsed .side-new>span[aria-hidden="true"]{
    display:inline-grid!important;
    width:28px!important;
    min-width:28px!important;
    height:28px!important;
    margin-right:8px!important;
    border:1px solid rgba(212,175,55,.13)!important;
    background:rgba(212,175,55,.08)!important;
    font-size:17px!important;
  }
  #sidebar .sidebar-brand-row{
    min-height:50px!important;
    margin:0 2px 10px!important;
    padding:0 2px!important;
  }
  #sidebar .sidebar-close{
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    min-height:42px!important;
  }
}


/* Premium collapsed sidebar rail v4 */
@media(min-width:1101px){
  #sidebar.collapsed{
    width:74px!important;
    min-width:74px!important;
    max-width:74px!important;
    padding:10px 9px 14px!important;
    overflow:visible!important;
    border-right:1px solid rgba(168,85,247,.20)!important;
    background:
      radial-gradient(circle at 50% 8%,rgba(212,175,55,.16),transparent 190px),
      linear-gradient(180deg,rgba(18,18,31,.98),rgba(11,12,21,.98))!important;
    box-shadow:
      12px 0 34px rgba(0,0,0,.22),
      1px 0 0 rgba(196,181,253,.035) inset!important;
  }
  #sidebar.collapsed ~ #main-col{
    margin-left:74px!important;
  }
  #sidebar.collapsed ~ #main-col .input-area.glass{
    left:74px!important;
  }

  #sidebar.collapsed::before{
    content:""!important;
    position:absolute!important;
    inset:4px 7px 10px!important;
    z-index:-1!important;
    border:1px solid rgba(196,181,253,.075)!important;
    border-radius:18px!important;
    background:
      linear-gradient(180deg,rgba(212,175,55,.045),rgba(255,255,255,.012) 26%,rgba(255,255,255,.008))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.022),
      0 18px 38px rgba(0,0,0,.14)!important;
    pointer-events:none!important;
  }
  #sidebar.collapsed::after{
    top:28px!important;
    right:-1px!important;
    bottom:28px!important;
    width:1px!important;
    opacity:1!important;
    background:linear-gradient(
      180deg,
      transparent 0%,
      rgba(212,175,55,.22) 12%,
      rgba(168,85,247,.78) 48%,
      rgba(212,175,55,.25) 86%,
      transparent 100%
    )!important;
    box-shadow:
      0 0 10px rgba(168,85,247,.58),
      0 0 26px rgba(212,175,55,.24)!important;
  }

  #sidebar.collapsed .sidebar-brand-row{
    width:54px!important;
    min-height:54px!important;
    margin:0 auto 9px!important;
    padding:0!important;
    border:0!important;
  }
  #sidebar.collapsed .sidebar-close{
    position:relative!important;
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    border:1px solid rgba(192,132,252,.38)!important;
    border-radius:15px!important;
    background:
      radial-gradient(circle at 50% 22%,rgba(192,132,252,.22),transparent 70%),
      linear-gradient(145deg,rgba(99,48,184,.62),rgba(47,29,91,.72))!important;
    color:#fff!important;
    box-shadow:
      0 0 0 1px rgba(255,255,255,.025) inset,
      0 10px 24px rgba(62,25,125,.28),
      0 0 22px rgba(212,175,55,.24)!important;
  }
  #sidebar.collapsed .sidebar-close::before{
    content:"›"!important;
    font-size:28px!important;
    font-weight:560!important;
    transform:translate(1px,-1px)!important;
    text-shadow:0 0 12px rgba(255,255,255,.22)!important;
  }
  #sidebar.collapsed .sidebar-close:hover,
  #sidebar.collapsed .sidebar-close:focus-visible{
    border-color:rgba(216,180,254,.62)!important;
    background:
      radial-gradient(circle at 50% 22%,rgba(216,180,254,.27),transparent 72%),
      linear-gradient(145deg,rgba(116,56,207,.72),rgba(59,31,113,.78))!important;
    box-shadow:
      0 0 0 1px rgba(255,255,255,.035) inset,
      0 12px 28px rgba(62,25,125,.32),
      0 0 28px rgba(168,85,247,.34)!important;
  }

  #sidebar.collapsed .side-new{
    display:grid!important;
    place-items:center!important;
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    margin:0 auto 14px!important;
    padding:0!important;
    border:1px solid rgba(212,175,55,.14)!important;
    border-radius:14px!important;
    background:linear-gradient(145deg,rgba(34,30,54,.88),rgba(21,21,35,.92))!important;
    color:#d9ccff!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 9px 22px rgba(0,0,0,.13)!important;
  }
  #sidebar.collapsed .side-new:hover,
  #sidebar.collapsed .side-new:focus-visible{
    border-color:rgba(192,132,252,.34)!important;
    background:linear-gradient(145deg,rgba(78,46,133,.56),rgba(35,25,65,.78))!important;
    color:#fff!important;
    box-shadow:
      0 0 20px rgba(212,175,55,.16),
      inset 0 1px 0 rgba(255,255,255,.035)!important;
  }
  #sidebar.collapsed .side-new>span[aria-hidden="true"]{
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    color:currentColor!important;
    font-size:22px!important;
    font-weight:500!important;
    line-height:1!important;
  }

  #sidebar.collapsed .stellar-sidebar-nav{
    position:relative!important;
    width:54px!important;
    margin:0 auto!important;
    padding:14px 3px 3px!important;
    gap:6px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav::before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:9px!important;
    right:9px!important;
    height:1px!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,transparent,rgba(212,175,55,.28),transparent)!important;
  }

  #sidebar.collapsed .stellar-sidebar-nav button{
    position:relative!important;
    display:grid!important;
    place-items:center!important;
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    margin:0 auto!important;
    padding:0!important;
    border:1px solid rgba(212,175,55,.075)!important;
    border-radius:14px!important;
    background:linear-gradient(145deg,rgba(26,26,43,.82),rgba(17,18,31,.90))!important;
    color:#a99bd4!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018),
      0 8px 18px rgba(0,0,0,.10)!important;
    transition:
      background .15s ease,
      border-color .15s ease,
      color .15s ease,
      box-shadow .15s ease,
      transform .15s ease!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button:hover,
  #sidebar.collapsed .stellar-sidebar-nav button:focus-visible{
    border-color:rgba(192,132,252,.28)!important;
    background:
      radial-gradient(circle at 50% 20%,rgba(168,85,247,.14),transparent 72%),
      linear-gradient(145deg,rgba(48,32,78,.86),rgba(24,22,42,.94))!important;
    color:#f5efff!important;
    box-shadow:
      0 0 0 1px rgba(255,255,255,.018) inset,
      0 0 20px rgba(212,175,55,.13),
      0 9px 22px rgba(0,0,0,.14)!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button:active{
    transform:scale(.95)!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button>span:last-child{
    display:none!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav .nav-ico{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    margin:0!important;
    border:1px solid rgba(196,181,253,.09)!important;
    border-radius:10px!important;
    background:rgba(212,175,55,.075)!important;
    color:#c4b5fd!important;
    font-size:15px!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button:hover .nav-ico,
  #sidebar.collapsed .stellar-sidebar-nav button:focus-visible .nav-ico{
    border-color:rgba(216,180,254,.30)!important;
    background:rgba(212,175,55,.18)!important;
    color:#fff!important;
    box-shadow:0 0 16px rgba(168,85,247,.16)!important;
  }

  /* Give Settings its own quiet lower dock, matching the mockup. */
  #sidebar.collapsed .stellar-sidebar-nav button:last-child{
    margin-top:15px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button:last-child::before{
    content:""!important;
    position:absolute!important;
    top:-9px!important;
    left:8px!important;
    right:8px!important;
    height:1px!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,transparent,rgba(212,175,55,.24),transparent)!important;
  }

  #sidebar.collapsed .stellar-sidebar-nav button:focus-visible,
  #sidebar.collapsed .side-new:focus-visible,
  #sidebar.collapsed .sidebar-close:focus-visible{
    outline:2px solid rgba(196,181,253,.72)!important;
    outline-offset:2px!important;
  }
}


/* Collapsed rail leak + fresh composer repair v5 */
@media(min-width:1101px){
  /* The compact rail must never expose full-sidebar text/content. */
  #sidebar.collapsed{
    overflow:hidden!important;
  }
  #sidebar.collapsed .brand-title,
  #sidebar.collapsed #search,
  #sidebar.collapsed #chats-heading,
  #sidebar.collapsed #chats-list,
  #sidebar.collapsed #account-box,
  #sidebar.collapsed .sidebar-utility-links,
  #sidebar.collapsed .side-foot{
    display:none!important;
  }
  #sidebar.collapsed .side-new{
    font-size:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  #sidebar.collapsed .side-new>span[aria-hidden="true"]{
    display:grid!important;
    place-items:center!important;
    font-size:22px!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button{
    overflow:hidden!important;
  }
  #sidebar.collapsed .stellar-sidebar-nav button>span:last-child{
    display:none!important;
  }

  /* Fresh-home composer remains centered in the viewport when the rail collapses. */
  body.stellar-empty-home.stellar-start-state #sidebar.collapsed ~ #main-col>.input-area.glass,
  body.stellar-empty-home.stellar-start-state #sidebar.collapsed ~ #main-col .input-area.glass{
    position:fixed!important;
    top:50dvh!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    width:min(820px,calc(100vw - 32px))!important;
    max-width:820px!important;
    padding:0!important;
    transform:translate(-50%,-50%)!important;
    background:transparent!important;
    z-index:60!important;
  }
  body.stellar-empty-home.stellar-start-state #sidebar.collapsed ~ #main-col .input-area>.flex,
  body.stellar-empty-home.stellar-start-state #sidebar.collapsed ~ #main-col .composer-foot{
    width:min(100%,768px)!important;
    max-width:768px!important;
    margin-inline:auto!important;
  }
}
/* Stellar exact business palette final layer */
:root{--stellar-black:#050505;--stellar-bg:#050505;--stellar-panel:#101010;--stellar-text:#F7F3EA;--stellar-muted:#B8B0A0;--stellar-gold:#D4AF37;--stellar-gold-2:#F2D675;--stellar-line:rgba(212,175,55,.28);--accent:#D4AF37;--accent-rgb:212,175,55;color-scheme:dark;}
body{background:#050505!important;color:#F7F3EA!important;}
h1,h2,h3,.brand span,.hero h1 span,.greet-hi,.greet-hi-accent{color:#D4AF37!important;-webkit-text-fill-color:#D4AF37!important;background:none!important;text-shadow:none!important;}
p,li,small,.muted,.hero-lead,.welcome-sub{color:#B8B0A0!important;}
button,.btn,.cta-btn,.nav-cta,.side-new,.primary,.primary-btn{background:#D4AF37!important;color:#050505!important;border-color:rgba(212,175,55,.32)!important;box-shadow:none!important;}
.card,.panel,.glass,.modal,.plan-card,.plugin-card,.support-card,.set-card,#sidebar,.topbar,.input-area>.flex{background:#101010!important;color:#F7F3EA!important;border-color:rgba(212,175,55,.28)!important;box-shadow:none!important;}
/* End Stellar exact business palette final layer */
