l: Left Constant Near {
  direction: right
  near: center-left

  default -> layout -> here
  default: {
    direction: right
    dagre -- elk -- tala: or
  }
  default.* -> layout: runs this

  here: {
    grid-columns: 3

    this -> is

    this: {
      grid-rows: 5
      row 1 -> row 2 -> row 3 -> row 4 -> row 5
    }

    is -> grid: A {style.font-size: 24}

    grid: {
      shape: sequence_diagram

      with -> a -> sequence diagram.x -> you can

      you can: {
        grid-rows: 2
        grid-columns: 2
        grid-gap: 0

        have
        another
        grid: {
          grid-rows: 3
          horizontal-gap: 10
          vertical-gap: 20
          1 -> 2 -> 3
        }

        here and: {
          shape: sequence_diagram
          continue -> nesting
        }
      }
      you can.here and.nesting -> sequence diagram.x: {class: green}
    }
    this.row 2 -> is.child of is.grandchild: {class: green}
    # this.row 2 -> grid.you can
  }
  here.this.row 5 -> default.dagre: straight edge across {class: green}
  here.this.row 1 <- default.tala: straight edge across nested types {class: green}
}

center -> directions: default layout

center: {
  rectangle: {shape: "rectangle"}
  square: {shape: "square"}
  page: {shape: "page"}
  parallelogram: {shape: "parallelogram"}
  document: {shape: "document"}
  cylinder: {shape: "cylinder"}
  queue: {shape: "queue"}
  package: {shape: "package"}
  step: {shape: "step"}
  callout: {shape: "callout"}
  stored_data: {shape: "stored_data"}
  person: {shape: "person"}
  diamond: {shape: "diamond"}
  oval: {shape: "oval"}
  circle: {shape: "circle"}
  hexagon: {shape: "hexagon"}
  cloud: {shape: "cloud"}

  rectangle -> square -> page
  parallelogram -> document -> cylinder
  queue -> package -> step
  callout -> stored_data -> person
  diamond -> oval -> circle
  hexagon -> cloud

  *.style.multiple: true
}

directions: {
  grid-rows: 3

  r: right {
    direction: right
    1 -> 2 -> 3
    2 -> 4
  }
  l: left {
    direction: left
    1 -> 2 -> 3
    2 -> 4
  }
  v: "" {
    grid-columns: 2
    grid-gap: 0
    u: up {
      direction: up
      1 -> 2 -> 3
      2 -> 4
    }
    d: down {
      direction: down
      1 -> 2 -> 3
      2 -> 4
    }
  }
}

# center -> tl
r: Right Constant Near {
  near: center-right

  grid-columns: 5

  is -> constant.n -> and -> also.a -> grid: {class: green}
  constant.n: near
}

center -> seq: default layout

seq: {
  shape: sequence_diagram
  scorer: {
    style.stroke: red
    style.stroke-width: 5
  }

  scorer.abc: {
    style.fill: yellow
    style.stroke-width: 7
  }

  scorer -> itemResponse.a: {
    style.stroke-width: 10
  }
  itemResponse.a -> item.a.b
  item.a.b -> essayRubric.a.b.c
  essayRubric.a.b.c -> concept.a.b.c.d
  item.a -> essayRubric.a.b
  concept.a.b.c.d -> itemOutcome.a.b.c.d.e

  scorer.abc -> item.a

  itemOutcome.a.b.c.d.e -> scorer
  scorer -> itemResponse.c
}

center -> more: default layout

more: {
  grid-rows: 2
  stylish: {
    grid-columns: 2
    horizontal-gap: 100
    x: {
      style: {
        opacity: 0.6
        fill: orange
        stroke: "#53C0D8"
        stroke-width: 5
        shadow: true
      }
    }

    y: {
      style: {
        stroke-dash: 5
        opacity: 0.6
        fill: red
        3d: true
        stroke: black
      }
    }

    x -> y: in style {
      style: {
        stroke: purple
        stroke-width: 2
        stroke-dash: 5
        fill: lavender
      }
    }
  }
  stylish.y -> container.a_sequence: {class: green}

  container: {
    a_shape.shape: circle
    a_sequence: {
      shape: sequence_diagram

      scorer.t -> itemResponse.t: getItem()
      scorer.t <- itemResponse.t: item

      scorer.t -> item.t1: getRubric()
      scorer.t <- item.t1: rubric

      scorer.t -> essayRubric.t: applyTo(essayResp)
      itemResponse -> essayRubric.t.c
      essayRubric.t.c -> concept.t: match(essayResponse)
      scorer <- essayRubric.t: score
    }

    a_shape -> a_sequence
    a_sequence -> sequence
    a_shape -- finally

    finally: {
      shape: queue
      sequence: {
        shape: sequence_diagram
        # items appear in this order
        scorer: {
          style.stroke: red
          style.stroke-dash: 2
        }
        concept: {
          style.stroke-width: 6
        }
        essayRubric
        item
        itemOutcome
        itemResponse
      }
    }
    finally -- sequence

    # full path edges
    finally.sequence.itemResponse.a -> finally.sequence.item.a.b
    finally.sequence.item.a.b -> finally.sequence.essayRubric.a.b.c
    finally.sequence.essayRubric.a.b.c -> finally.sequence.concept.a.b.c.d
    finally.sequence.item.a -> finally.sequence.essayRubric.a.b
    finally.sequence.concept.a.b.c.d -> finally.sequence.itemOutcome.a.b.c.d.e
    finally.sequence.scorer.abc -> finally.sequence.item.a
    finally.sequence.itemOutcome.a.b.c.d.e -> finally.sequence.scorer
    finally.sequence.scorer -> finally.sequence.itemResponse.c
  }
}

more.container.a_sequence -> directions.v.d.4: {class: green}
directions.l.2 -> center.step: {class: green}
center.step -> more.stylish.x: {class: green}
directions.l.1 -> seq.item.a.b: to inside sequence diagram {class: green}
directions.l.1 -> seq.itemResponse.a: to inside sequence diagram {class: green}
directions.v.d.2 -> seq.scorer.abc: to inside sequence diagram {class: green}

center.cloud -> more.stylish: {class: green}
more.container.a_shape -> r.is: to constant near {class: green}
l.here.this.row 5 -> directions.v.u.1: from within constant near {class: green}

bl: Bottom Left Constant Near {
  near: bottom-left
  a.b
}
bl.a.b.from one constant near -> l.default.dagre: to another {class: green}

classes.green.style: {
  stroke: green
  stroke-width: 5
}
