@mixin group() { ... }@mixin group() { 
  @include kib-foundations.card;

  display: flex;
  flex-direction: row;
  overflow: hidden;
  min-width: settings.$min-width;
 }

@mixin group-small() { ... }@mixin group-small() { 
  flex-direction: column;
 }

@mixin main() { ... }@mixin main() { 
  display: flex;
  flex: 1 0;
  flex-flow: column;
  box-sizing: content-box;
 }

@mixin header() { ... }@mixin header() { 
  flex: 0 1;
  padding: spacing.get('s4', 's4', 's2');

  & > * {
    margin-bottom: 0;
  }
 }

@mixin heading() { ... }@mixin heading() { 
  @include section-heading.heading;
  @include section-heading.heading-small;
 }

@mixin subheading() { ... }@mixin subheading() { 
  @include section-heading.subheading;
 }

@mixin cards() { ... }@mixin cards() { 
  display: flex;
  flex-direction: column;
  flex: 1 0;

  & > * {
    flex: 1 1 auto;

    &:not(:last-child) {
      border-bottom: unit.rem(1px) solid settings.$separator-color;
    }
  }

  #{$card-selector} {
    border-radius: 0;

    #{$card-selector}__canvas {
      border-radius: 0;
    }
  }
 }

@mixin controls() { ... }@mixin controls() { 
  flex: 0 0 settings.$controls-width;
  padding: spacing.get('s4');
 }

$min-width: unit.rem(300px) !default;

$controls-width: 25% !default;

$separator-color: color.get('ui-bg', '04') !default;