@media (max-width: 639px) {
  .canvas-size-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .canvas-size-options > button {
    min-width: 0;
    min-height: 64px;
    padding: 11px 12px;
    gap: 4px;
    border: 1px solid #dedede;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 3px rgb(0 0 0 / 3%);
    touch-action: manipulation;
    transition: background 150ms, color 150ms, border-color 150ms;
  }
  .canvas-size-options > button > span:first-child {
    font-size: 12px;
    line-height: 1.3;
    padding-right: 12px;
  }
  .canvas-size-options > button > span:nth-child(2) {
    font-size: 10px;
    line-height: 1.3;
    color: #777;
  }
  .canvas-size-options > button > span[title="Recommended"] {
    top: auto;
    bottom: 9px;
    right: 8px;
    font-size: 10px;
  }
  .canvas-size-options > button[aria-pressed="true"] {
    background: #242424;
    border-color: #242424;
    color: #fff;
    box-shadow: 0 3px 8px rgb(0 0 0 / 14%);
  }
  .canvas-size-options > button[aria-pressed="true"] > span {
    color: #fff;
  }
  .canvas-size-options > button[aria-pressed="true"]::after {
    content: '\2713';
    position: absolute;
    right: 9px;
    top: 9px;
    font-size: 11px;
  }
  .canvas-size-options > button:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 3px;
  }
}
