/*
 * CN-11 Split panel / detail layout — app/components/ui/split_panel_component.rb
 *
 * grid-template-columns is set inline per-instance (the fr ratio is
 * caller-configurable), so the stacked-below-breakpoint override uses
 * !important to beat the inline style — the one legitimate case for it.
 */

.ui-split-panel {
  display: grid;
  gap: var(--space-6);
  align-items: start;
}

@media (max-width: 1023px) {
  .ui-split-panel {
    grid-template-columns: 1fr !important;
  }
}