/* Geometry lives in app/components/eleven.php. Direction belongs to each control. */
.eleven { width: 34px; height: 26px; display: block; overflow: visible; flex-shrink: 0; }
.eleven[data-direction="left"] { transform: scaleX(-1); }
.eleven[data-direction="up"] { transform: rotate(-90deg); }
.eleven[data-direction="down"] { transform: rotate(90deg); }
.eleven-stroke { transform: translateX(0); }
.slide-prev .eleven { transform: rotate(180deg); }
.slide-arrow .eleven { width: 27.2px; height: 20.8px; }
.title-toggle .eleven { transition: transform .4s cubic-bezier(.22,1,.36,1); }
.title-toggle[aria-expanded="true"] .eleven { transform: rotate(180deg); }
.comment-toggle .eleven { width: 27px; height: 21px; transition: transform .3s; }
.comment-toggle[aria-expanded="true"] .eleven { transform: rotate(90deg); }
@media (max-width: 700px) {
  .title-toggle .eleven { width: 29px; height: 22px; transform: translateX(-4px); }
  .title-toggle[aria-expanded="true"] .eleven { transform: translateX(-4px) rotate(180deg); }
  .slide-arrow .eleven { width: 24px; height: 18.4px; }
  .comment-toggle .eleven { width: 22px; height: 17px; }
}