"""Redraw the Salter-Harris figure so the physis and the fracture are told apart.

The old drawing had a 9px amber physis and a 3.5px red fracture line running
inside it, so on type I — where the fracture follows the physis — the line
vanished into the band it was supposed to be distinguishable from. The user:
"The physis looks indistinguishable from growth plate."

Three changes carry the fix. The physis becomes a wide pale band with an
outline, so it reads as an anatomical layer rather than as a mark. The
fracture becomes a bold red line drawn twice — a white halo underneath, the
red on top — so it stays visible against the band it runs along as well as
against the bone it crosses. And the first schematic is labelled with the
three layers, so the reader learns what they are looking at before being asked
to tell five versions of it apart.
"""
W, H = 760, 300
COL_W, GAP, LEFT = 92, 30, 168
TOP = 34

EPI_H, PHYS_H, META_H = 48, 26, 92
PHYS_Y = EPI_H + 4
META_Y = PHYS_Y + PHYS_H + 4
BOTTOM = META_Y + META_H

TYPES = [
    ("I", "through the physis"),
    ("II", "+ metaphyseal corner"),
    ("III", "into the joint"),
    ("IV", "across all three"),
    ("V", "crush"),
]


def column_x(index: int) -> int:
    return LEFT + index * (COL_W + GAP)


def fracture(path: str) -> str:
    """The line, twice: a white halo so it survives the band it runs along."""
    return (f'<path class="sh-halo" d="{path}"/>'
            f'<path class="sh-break" d="{path}"/>')


mid = PHYS_Y + PHYS_H / 2          # the middle of the physis band
out = []
out.append(
    f'<?xml version="1.0" encoding="UTF-8"?>\n'
    f'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 {W} {H}" role="img" '
    f'aria-label="The five Salter-Harris fracture types, with the epiphysis, '
    f'physis and metaphysis labelled">')
out.append(f'  <rect data-ground="paper" x="0" y="0" width="{W}" height="{H}" fill="#ffffff"/>')
out.append('''  <defs>
    <marker id="sh-crush" viewBox="0 0 10 10" refX="8" refY="5"
            markerWidth="5.5" markerHeight="5.5" orient="auto">
      <path d="M0 0 L10 5 L0 10 z" fill="#c0263f"/>
    </marker>
  </defs>
  <style>
    .sh-epi   { fill: #dbe6f6; stroke: #7f8ea3; stroke-width: 1.8; }
    .sh-meta  { fill: #e8eaf0; stroke: #7f8ea3; stroke-width: 1.8; }
    /* Pale and outlined: a layer of anatomy, not a mark on the bone. The old
       band was a saturated amber the same weight as the fracture line. */
    .sh-phys  { fill: #fdeacb; stroke: #d99b3f; stroke-width: 1.8; }
    /* Drawn under the red so the line survives the band it runs along. */
    .sh-halo  { stroke: #ffffff; stroke-width: 9; fill: none; stroke-linecap: round;
                stroke-linejoin: round; }
    .sh-break { stroke: #c0263f; stroke-width: 4.2; fill: none; stroke-linecap: round;
                stroke-linejoin: round; }
    .sh-cap   { font: 700 14px system-ui, sans-serif; fill: #1e293b; text-anchor: middle; }
    /* Ink, not grey. These are the words that say what each type is. */
    .sh-sub   { font: 12px system-ui, sans-serif; fill: #334155; text-anchor: middle; }
    .sh-anat  { font: 600 11.5px system-ui, sans-serif; fill: #1e293b; text-anchor: end; }
    .sh-lead  { stroke: #7f8ea3; stroke-width: 1.2; fill: none; }
    .sh-key   { font: 12px system-ui, sans-serif; fill: #334155; }
  </style>''')

# ── The three layers, named once, against the first column ──────────────────
first = column_x(0)
out.append(f'  <g transform="translate(0,{TOP})">')
for label, y in (("epiphysis", EPI_H / 2), ("physis", mid), ("metaphysis", META_Y + 34)):
    out.append(f'    <text class="sh-anat" x="{first - 22}" y="{y + 4:.0f}">{label}</text>')
    out.append(f'    <path class="sh-lead" d="M{first - 18} {y:.0f} H {first - 4}"/>')
out.append('  </g>')

for index, (name, note) in enumerate(TYPES):
    x = column_x(index)
    crush = name == "V"
    # Type V is a crush: the band is compressed, so it is drawn thinner and the
    # metaphysis rises to meet it. Everything else keeps the same anatomy.
    band_h = 11 if crush else PHYS_H
    band_y = mid - band_h / 2
    meta_y = band_y + band_h + 4
    meta_h = META_H + (META_Y - meta_y) if crush else META_H
    out.append(f'  <g transform="translate({x},{TOP})">')
    out.append(f'    <rect class="sh-epi" x="0" y="0" width="{COL_W}" height="{EPI_H}" rx="6"/>')
    out.append(f'    <rect class="sh-phys" x="0" y="{band_y:.0f}" width="{COL_W}" '
               f'height="{band_h}"/>')
    out.append(f'    <rect class="sh-meta" x="0" y="{meta_y:.0f}" width="{COL_W}" '
               f'height="{meta_h:.0f}" rx="6"/>')

    if name == "I":
        # Along the physis, and nowhere else.
        out.append("    " + fracture(f"M-8 {mid:.0f} H {COL_W + 8}"))
    elif name == "II":
        # Along the physis, then out through a corner of the metaphysis.
        out.append("    " + fracture(
            f"M-8 {mid:.0f} H {COL_W * 0.55:.0f} L {COL_W + 4:.0f} {meta_y + 34:.0f}"))
    elif name == "III":
        # Along the physis, then up through the epiphysis into the joint.
        out.append("    " + fracture(
            f"M{COL_W + 8} {mid:.0f} H {COL_W * 0.5:.0f} V -8"))
    elif name == "IV":
        # One line across all three.
        out.append("    " + fracture(f"M{COL_W * 0.52:.0f} -8 V {meta_y + meta_h - 10:.0f}"))
    else:
        # Force onto the plate rather than a line through it.
        for at in (0.22, 0.5, 0.78):
            out.append(f'    <path class="sh-break" d="M{COL_W * at:.0f} 8 V {band_y - 7:.0f}" '
                       f'marker-end="url(#sh-crush)"/>')

    out.append(f'    <text class="sh-cap" x="{COL_W / 2:.0f}" y="{BOTTOM + 30}">Type {name}</text>')
    out.append(f'    <text class="sh-sub" x="{COL_W / 2:.0f}" y="{BOTTOM + 48}">{note}</text>')
    out.append('  </g>')

# Below the type labels, not on top of them: the first attempt put the key at
# the foot of the canvas and it landed across "through the physis".
key_y = H - 16
out.append(f'  <g transform="translate({LEFT},{key_y})">')
out.append(f'    <rect class="sh-phys" x="0" y="-9" width="26" height="11"/>')
out.append(f'    <text class="sh-key" x="34" y="0">the physis</text>')
out.append(f'    <path class="sh-halo" d="M124 -4 H 150"/>')
out.append(f'    <path class="sh-break" d="M124 -4 H 150"/>')
out.append(f'    <text class="sh-key" x="158" y="0">the fracture line</text>')
out.append('  </g>')
out.append('</svg>')

svg = "\n".join(out) + "\n"
open('/tmp/claude-0/-home-danvics-docker-quiz/c1e0577a-e42c-4a3d-b1ea-3edd61103a4e/'
     'scratchpad/salter-harris.svg', 'w').write(svg)
print(len(svg), "bytes")