@media (min-width: 769px) {
  :root {
    --studio-shared-rail-width: 206px;
  }

  .studio-rail {
    width: var(--studio-shared-rail-width) !important;
    min-width: var(--studio-shared-rail-width) !important;
    flex: 0 0 var(--studio-shared-rail-width) !important;
  }

  .studio-shared-resizer {
    position: absolute;
    z-index: 70;
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    touch-action: none;
    user-select: none;
  }

  .studio-shared-resizer::after {
    content: "";
    position: absolute;
    border-radius: 2px;
    background: transparent;
    transition: background-color 120ms ease, box-shadow 120ms ease;
  }

  .studio-shared-resizer:hover::after,
  .studio-shared-resizer:focus-visible::after,
  html.studio-resizing .studio-shared-resizer::after {
    background: #2563eb;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.12);
  }

  .studio-shared-resizer-rail {
    top: 0;
    right: 0;
    width: 8px;
    height: 100%;
    cursor: col-resize;
  }

  .studio-shared-resizer-rail::after {
    top: 0;
    right: 0;
    bottom: 0;
    width: 2px;
  }

  html.studio-resizing,
  html.studio-resizing * {
    cursor: inherit !important;
    user-select: none !important;
  }
}

@media (max-width: 768px) {
  .studio-shared-resizer {
    display: none !important;
  }
}