@media (min-width: 801px) {
  .chat-shell > .sidebar.shuowen-sidebar-resizable {
    box-sizing: border-box;
    flex-basis: var(--shuowen-sidebar-width, 264px) !important;
    width: var(--shuowen-sidebar-width, 264px);
    min-width: 220px;
    max-width: 480px;
  }
}

.shuowen-sidebar-resizer {
  position: absolute;
  z-index: 30;
  top: 0;
  right: -6px;
  bottom: 0;
  width: 12px;
  cursor: col-resize;
  touch-action: none;
  outline: none;
}

.shuowen-sidebar-resizer::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 5px;
  width: 2px;
  content: "";
  background: transparent;
  transition: background-color 120ms ease;
}

.shuowen-sidebar-resizer:hover::after,
.shuowen-sidebar-resizer:focus-visible::after,
.shuowen-sidebar-dragging .shuowen-sidebar-resizer::after {
  background: var(--accent, #ad4b39);
}

.shuowen-sidebar-resizer:focus-visible {
  outline: 2px solid var(--accent, #ad4b39);
  outline-offset: -3px;
}

.shuowen-sidebar-resizer[hidden] { display: none !important; }

.shuowen-sidebar-dragging,
.shuowen-sidebar-dragging * {
  cursor: col-resize !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

@media (max-width: 800px) {
  .shuowen-sidebar-resizer { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .shuowen-sidebar-resizer::after { transition: none; }
}