﻿#ctWaves {
  mask-image: url("data:image/svg+xml,%3Csvg preserveAspectRatio='none' id='visual' viewBox='0 0 900 600' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1'%3E%3Cpath d='M83 0L92.2 16.7C101.3 33.3 119.7 66.7 139.5 100C159.3 133.3 180.7 166.7 170.8 200C161 233.3 120 266.7 99.3 300C78.7 333.3 78.3 366.7 88 400C97.7 433.3 117.3 466.7 130 500C142.7 533.3 148.3 566.7 151.2 583.3L154 600L0 600L0 583.3C0 566.7 0 533.3 0 500C0 466.7 0 433.3 0 400C0 366.7 0 333.3 0 300C0 266.7 0 233.3 0 200C0 166.7 0 133.3 0 100C0 66.7 0 33.3 0 16.7L0 0Z' stroke-linecap='round' stroke-linejoin='miter'%3E%3C/path%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg preserveAspectRatio='none' id='visual' viewBox='0 0 900 600' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1'%3E%3Cpath d='M83 0L92.2 16.7C101.3 33.3 119.7 66.7 139.5 100C159.3 133.3 180.7 166.7 170.8 200C161 233.3 120 266.7 99.3 300C78.7 333.3 78.3 366.7 88 400C97.7 433.3 117.3 466.7 130 500C142.7 533.3 148.3 566.7 151.2 583.3L154 600L0 600L0 583.3C0 566.7 0 533.3 0 500C0 466.7 0 433.3 0 400C0 366.7 0 333.3 0 300C0 266.7 0 233.3 0 200C0 166.7 0 133.3 0 100C0 66.7 0 33.3 0 16.7L0 0Z' stroke-linecap='round' stroke-linejoin='miter'%3E%3C/path%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-size: 100% 100%;
  -webkit-mask-size: 100% 100%;
  mask-position: center;
  -webkit-mask-position: center;
  object-fit: cover;
  position: absolute;
  height: 100%;
  opacity: .75;
  width: 100%;
  top: 0;
  left: 0;
  background-color: var(--theme-colour);
  pointer-events: none;
  z-index: 0;
}

chip-card {
  z-index: 1;
  position: relative;
  --card-background-colour: var(--code-block-background-colour);
  --card-box-shadow: 0 0 var(--block-size-md) var(--theme-colour);
  --card-radius: var(--strong-border-radius) !important;
  border: 1px solid var(--theme-colour) !important;
  border-radius: var(--card-radius) !important;
}

#ctSvg svg {
  position: absolute;
  bottom: 0;
  left: var(--card-spacing);
  width: 400px;
  background-color: var(--theme-colour);
  mix-blend-mode: luminosity;
}

#ctSvg {
  width: calc(400px + calc(var(--card-spacing) * 2));
}

chip-framecontent .row > div:first-child {
  height: 500px;
  display: none;
  background-color: var(--theme-colour);
  margin: calc(var(--card-spacing) * -1 + -1px);
  border-radius: var(--card-radius) 0 0 var(--card-radius);
}

  chip-framecontent .row > div:first-child chip-header {
    color: var(--theme-colour-foreground);
    margin: var(--card-spacing) auto;
    margin-bottom: 0;
  }

  chip-framecontent .row > div:first-child p {
    margin: 0 auto;
    margin-top: var(--block-size-sm);
    color: var(--theme-colour-foreground);
  }

@media(min-width:65.0625em) {
  chip-framecontent .row > div:first-child {
    display: block;
  }

  chip-framecontent .row > div:last-child {
    margin-left: calc(var(--card-spacing) * 2);
  }

  chip-framecontent chip-card {
    --card-spacing: var(--block-size-xxxxl) !important;
  }
}
