/* packing explorer */
:root {color-scheme:light}
body {background:white;color:black;font:16px/1.4 Georgia,serif;max-width:1200px;margin:24px auto;padding:0 16px}
h1 {font-size:24px} h2 {font-size:16px;text-align:center}
form {display:flex;flex-wrap:wrap;align-items:center;gap:8px}
input {width:140px} button,select,input {font:inherit}
.plots {display:grid;grid-template-columns:1fr 1fr;gap:24px}
section {min-width:0} svg {width:100%;display:block} svg text {font:12px sans-serif;fill:black;text-anchor:middle;dominant-baseline:middle}
#family {display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;margin:16px 0}
.tree {background:white;color:black;border:0;padding:4px;min-width:0;cursor:pointer}
.tree[aria-pressed=true] {outline:1px solid black}
[hidden] {display:none!important}
@media(max-width:650px) {.plots {grid-template-columns:1fr} #family {grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:420px) {#family {grid-template-columns:repeat(3,minmax(0,1fr))}}