:root{--fraiha-sidebar-width:286px;--fraiha-topbar-height:90px}
html,body,#app{overflow:hidden!important;overscroll-behavior:none!important}
@media (min-width:761px){
  .sidebar{width:var(--fraiha-sidebar-width)!important;transform:translateX(0)!important;transition:transform .18s ease,box-shadow .18s ease!important}
  .main{left:var(--fraiha-sidebar-width)!important;transition:left .18s ease!important}
  .sidebarHidden .sidebar{transform:translateX(calc(-1 * var(--fraiha-sidebar-width)))!important;pointer-events:none!important;box-shadow:none!important}
  .sidebarHidden .main{left:0!important}
  .sidebarCollapsed .sidebar{width:var(--fraiha-sidebar-width)!important;transform:translateX(calc(-1 * var(--fraiha-sidebar-width)))!important;pointer-events:none!important}
  .sidebarCollapsed .main{left:0!important}
}
@media (max-width:760px){
  :root{--fraiha-topbar-height:70px}
  .sidebar,.sidebarCollapsed .sidebar,.sidebarHidden .sidebar{
    position:fixed!important;top:0!important;bottom:0!important;left:0!important;width:min(88vw,320px)!important;height:100dvh!important;
    transform:translateX(-105%)!important;transition:transform .2s ease!important;pointer-events:auto!important;box-shadow:none!important;z-index:120!important}
  .mobileSidebarOpen .sidebar{transform:translateX(0)!important;box-shadow:26px 0 70px rgba(0,0,0,.48)!important}
  .main,.sidebarCollapsed .main,.sidebarHidden .main{left:0!important;right:0!important;width:100%!important}
  .mobileSidebarClose{display:grid!important}
  .topbar{padding:0 10px!important;gap:7px!important;min-width:0!important}
  .modelSelect{min-width:0!important;width:min(52vw,220px)!important;max-width:220px!important;text-overflow:ellipsis!important}
  .topbar>.spacer{min-width:0!important}
  .composerDock{width:calc(100% - 16px)!important;padding-bottom:max(8px,env(safe-area-inset-bottom))!important}
  .messages{padding-left:12px!important;padding-right:12px!important}
  .quickGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:480px){
  .quickGrid{grid-template-columns:1fr!important}
  .welcome{margin-top:5vh!important}
  .welcome h1{font-size:clamp(27px,9.5vw,40px)!important}
  .modelSelect{width:min(55vw,190px)!important}
  .topbar .memberOnly{display:none!important}
}
#fraihaSidebarBackdrop{position:fixed;inset:0;display:none;background:rgba(3,5,9,.62);backdrop-filter:blur(2px);z-index:110}
@media (max-width:760px){.mobileSidebarOpen #fraihaSidebarBackdrop{display:block}}
.mobileSidebarClose{display:none;position:absolute;right:10px;top:10px;width:38px;height:38px;place-items:center;border:1px solid rgba(255,255,255,.10);border-radius:11px;background:#151720;color:#fff;z-index:140}
.sidebar{contain:layout paint!important}
.sidebar .chatList{overflow-y:auto!important;overscroll-behavior:contain!important;min-height:0!important}
.main .messages{overflow-y:auto!important;overscroll-behavior:contain!important;min-height:0!important}
.msg{content-visibility:auto;contain-intrinsic-size:80px 500px}
.body,.bubble,.msg{min-width:0!important}
.body pre,.codeWrap,.body table{max-width:100%!important;overflow-x:auto!important}
.iconBtn,.composerBtn,.sendBtn,.newChat,.navItem{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #00FFA3!important;outline-offset:2px!important}