/* Company › People tree (people-tree.js). Desktop: top-down tree. Below 900 px: indented tree. */
.pt-scroll{overflow-x:auto;overflow-y:visible;margin:0 -8px;padding:8px 8px 4px;-webkit-overflow-scrolling:touch}
.pt-tree{position:relative;width:max-content;min-width:100%;padding-top:6px}
.pt-roots,.pt-kids{list-style:none;margin:0;padding:0;display:flex;justify-content:center}
.pt-roots{gap:28px;align-items:flex-start}
.pt-roots>li,.pt-kids>li{display:flex;flex-direction:column;align-items:center;position:relative}

/* Lines: down from a person, across their people, down into each one */
.pt-kids{position:relative;padding-top:26px}
.pt-kids::before{content:"";position:absolute;top:0;left:50%;height:26px;border-left:2px solid var(--hair-2)}
.pt-kids>li{padding:26px 10px 0}
.pt-kids>li::before,.pt-kids>li::after{content:"";position:absolute;top:0;right:50%;width:50%;height:26px;border-top:2px solid var(--hair-2)}
.pt-kids>li::after{right:auto;left:50%;border-left:2px solid var(--hair-2)}
.pt-kids>li:only-child{padding-top:0}
.pt-kids>li:only-child::before,.pt-kids>li:only-child::after{display:none}
.pt-kids>li:first-child::before,.pt-kids>li:last-child::after{border:0}
.pt-kids>li:last-child:not(:only-child)::before{border-right:2px solid var(--hair-2);border-radius:0 14px 0 0}
.pt-kids>li:first-child:not(:only-child)::after{border-radius:14px 0 0 0}

/* A person */
.pt-node{position:relative;width:224px;border-radius:26px;padding:18px 14px 14px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;transition:transform .35s var(--spring),box-shadow .2s,opacity .2s}
.pt-node[draggable="true"]{cursor:grab}
.pt-node[draggable="true"]:active{cursor:grabbing}
.pt-open{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;border-radius:16px;padding:2px 4px;color:inherit}
.pt-open .av-lg{margin-bottom:4px}
.pt-id{display:flex;flex-direction:column;min-width:0;max-width:100%}
.pt-name{font-family:var(--display);font-size:17px;font-weight:700;letter-spacing:-.02em;overflow-wrap:anywhere}
.pt-role{font-size:12.5px;color:var(--ink-2);font-weight:600;overflow-wrap:anywhere}
.pt-edit{position:absolute;top:10px;right:10px;z-index:2;opacity:.6;transition:opacity .2s}
.pt-node:hover .pt-edit,.pt-edit:focus-visible{opacity:1}
.pt-now{width:100%;min-height:36px;border-radius:12px;padding:6px 8px;font-size:13px;line-height:1.35;color:var(--ink);text-align:center;transition:background .15s}
.pt-now:hover{background:var(--track)}
.pt-now-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.pt-now.is-empty{color:var(--ink-3)}
.pt-now-in{width:100%;resize:none;font:inherit;font-size:13px;line-height:1.35;border-radius:12px;padding:6px 8px;border:1px solid var(--orange);background:var(--g2);color:var(--ink)}
.pt-now-in:focus{outline:2px solid var(--orange);outline-offset:1px}
.pt-cts{display:flex;gap:8px;justify-content:center}
.pt-ct{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--track);color:var(--ink);transition:background .15s,color .15s}
.pt-ct:hover{background:var(--orange-tint);color:var(--orange-ink)}
.pt-hint{font-size:12.5px;text-align:center;margin:12px 0 0}

/* Dragging */
.pt-top{display:none;align-items:center;justify-content:center;gap:6px;margin:0 auto 18px;max-width:420px;padding:14px 18px;border-radius:18px;font-size:13px;font-weight:600;color:var(--ink-2);border:2px dashed var(--hair-2)}
.pt-up{transform:rotate(90deg)}
.pt-tree.is-dragging .pt-top{display:flex}
.pt-dragged{opacity:.45}
.pt-over{outline:2px solid var(--orange);outline-offset:3px}
.pt-node.pt-over{transform:scale(1.03)}
.pt-top.pt-over{color:var(--orange-ink);border-color:var(--orange)}

/* Phones: an indented list with a line on the left */
@media (max-width:899px){
  .pt-scroll{overflow-x:visible;margin:0;padding:0}
  .pt-tree{width:auto;min-width:0}
  .pt-roots,.pt-kids{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}
  .pt-roots{gap:12px}
  .pt-roots>li,.pt-kids>li{align-items:stretch}
  .pt-kids{padding:10px 0 0 22px;margin-left:24px;gap:10px}
  .pt-kids::before{display:none}
  .pt-kids>li,.pt-kids>li:only-child{padding:0}
  .pt-kids>li::before,.pt-kids>li:only-child::before{display:block;content:"";position:absolute;left:-22px;top:34px;width:16px;height:0;right:auto;border:0;border-top:2px solid var(--hair-2);border-radius:0}
  .pt-kids>li::after,.pt-kids>li:only-child::after{display:block;content:"";position:absolute;left:-24px;top:-10px;bottom:-10px;width:0;height:auto;border:0;border-left:2px solid var(--hair-2);border-radius:0}
  .pt-kids>li:last-child::after{bottom:auto;height:46px}
  .pt-node{width:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;text-align:left;padding:12px 12px 10px;gap:4px 8px;border-radius:22px}
  .pt-open{flex-direction:row;align-items:center;gap:10px;padding:2px;grid-column:1/2}
  .pt-open .av-lg{width:40px;height:40px;font-size:16px;margin:0}
  .pt-id{align-items:flex-start;text-align:left}
  .pt-edit{position:static;opacity:1;grid-column:2/3;grid-row:1}
  .pt-now,.pt-now-in{grid-column:1/-1;text-align:left}
  .pt-cts{grid-column:1/-1;justify-content:flex-start}
  .pt-ct{width:40px;height:40px}
}