.sqfig {
  float: inline-start;
  margin: 2em 1em 1em 0;
  padding: 0;
  border-radius: 21px;
  background: #0000000a;
  box-shadow: 10px 10px 20px hsla(from var(--color-shadow) h s l / .20),
              -10px -10px 20px var(--color-input-back);
}

@media (--gt-content-and-figure) {
  .sqfig {
    margin-inline-start: -17.625rem;
  }
}

.sqfig svg {
  display: block;
  width: 15.625rem;
}

main[data-sensitivity="3"] .sqfig svg {
  opacity: .3;
  filter: blur(8px);
  transform: scale(0.3);
}

.sqfig figcaption {
  padding: .25em;
  text-align: center;
}

.cpfig__img--So {
  /* prevent emoji images from showing overflown content. That's because noto
   * emoji contains off-canvas stuff. */
  overflow: hidden;
}

@media (--lte-mobile) {
  .main aside {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 1rem 0;
  }
}

.cp-toolbox--tools {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

@media (--gt-mobile) {
  .cp-toolbox {
    width: 13.625rem;
    padding: 0 1rem;
    margin: 1em;
  }
  .cp-toolbox--profile {
    float: inline-start;
    clear: inline-start;
  }
  .cp-toolbox--tools {
    float: inline-end;
    clear: inline-end;
  }
}

@media (--gt-content-and-figure) {
  .cp-toolbox--profile {
    margin-inline-start: -17.625rem;
  }
  .cp-toolbox--tools {
    margin-inline-end: -17.625rem;
  }
}

.cp-toolbox dt {
  opacity: var(--dimmed);
  float: inline-start;
  clear: inline-start;
  margin: 0;
  margin-inline-end: .5rem;
  min-width: 3rem;
}
.cp-toolbox dt:after {
  content: ":";
}
.cp-toolbox dd {
  margin: 0;
  margin-block-end: .5rem;
}
.cp-toolbox .btn,
.cp-toolbox button {
  width: 100%;
}

.cp-toolbox .btn svg {
  vertical-align: middle;
}

p .bl .meta,
p .pl .meta {
  display: none;
}

.cpdesc--othersites {
  a {
    display: block;
    padding: .4em .1em;
  }
}

.props {
  margin-left: auto;
  margin-right: auto;
}

.props th:first-child {
  text-align: right;
}

.props .x {
  color: var(--color-neutral);
}

.props .y {
  color: var(--color-success);
}

.props .n {
  color: var(--color-danger);
}

.props a {
  display: block;
}

.props td > a {
  margin: -0.2em -0.5em;
  padding: 0.2em 0.5em;
}
