/* Phylogenetic profile: species rows with their tree, gene columns. Colours from site.css tokens only. */
.pp-head{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;margin-bottom:12px}
.pp-head h2{margin:0}
.pp-foot{display:flex;align-items:center;justify-content:space-between;gap:6px 18px;flex-wrap:wrap;margin-top:8px}
.pp-foot .legend{margin:0}
.pp-scroll{overflow:auto;max-height:78vh;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overscroll-behavior:contain}
.pp-scroll.one{width:fit-content;max-width:100%}
.pp-grid{display:grid;width:max-content;font-size:12px;position:relative}
/* sticky frame */
.pp-corner,.pp-gh,.pp-bh{position:sticky;top:0;z-index:3;background:var(--surface);border-bottom:1px solid var(--line)}
.pp-corner{grid-row:1;grid-column:1/3;left:0;z-index:5;display:flex;align-items:flex-end;padding:0 10px 6px;color:var(--ink-3);font-size:11.5px}
.pp-tree{grid-row:2/-1;grid-column:1;position:sticky;left:0;z-index:2;background:var(--surface)}
.pp-tree svg{display:block;overflow:visible}
.pp-b,.pp-bh{position:sticky;right:0;z-index:2}
.pp-bh{z-index:4}
.pp-b.r2,.pp-bh.r2{right:var(--bw)}
/* species labels */
.pp-sp{all:unset;box-sizing:border-box;position:sticky;left:var(--tw);z-index:2;background:var(--surface);padding:0 10px 0 6px;line-height:var(--rh);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink-2);font:500 12.5px/var(--rh) var(--font-b);cursor:pointer;border-right:1px solid var(--line)}
.pp-sp.sci{font-style:italic}
.pp-sp.human{color:var(--brand);font-weight:700}
.pp-sp:hover,.pp-sp.hl{color:var(--ink);background:color-mix(in srgb,var(--accent) 9%,var(--surface))}
.pp-sp.human.hl{color:var(--brand)}
/* gene headers: rotated, read bottom-up */
.pp-gh{all:unset;box-sizing:border-box;position:sticky;top:0;z-index:3;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;cursor:pointer;overflow:hidden}
.pp-gh span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;font:600 11.5px/1 var(--font-b);color:var(--ink-2);letter-spacing:.01em}
.pp-gh small{font:500 9.5px var(--font-m);color:var(--ink-3);margin-top:3px}
.pp-gh .chip{font-size:0;width:6px;height:6px;padding:0!important;margin:5px 0 0;border-radius:50%;background:var(--hot)}
.pp-gh.none span{color:var(--ink-3);font-weight:400}
.pp-gh:hover span,.pp-gh.hl span{color:var(--accent)}
.pp-gh.hl{box-shadow:inset 0 -2px var(--accent)}
.pp-bh{all:unset;box-sizing:border-box;position:sticky;top:0;right:0;z-index:4;background:var(--surface);border-bottom:1px solid var(--line);border-left:1px solid var(--line);display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;cursor:pointer}
.pp-bh.r2{right:var(--bw)}
.pp-bh span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;font:600 11px/1 var(--font-b);color:var(--hot)}
.pp-bh.pp-vincze span{color:color-mix(in srgb,var(--hot) 70%,var(--ink-3))}
/* cells */
.pp-c{box-sizing:border-box;border:1px solid var(--surface);border-radius:3px;background-clip:padding-box;display:grid;place-items:center;font:500 9.5px/1 var(--font-m);cursor:pointer;overflow:hidden;outline-offset:-1px}
.pp-c.c0{background-color:var(--c0);background-image:var(--hatch)}
.pp-c.c1{background:var(--c1);background-clip:padding-box;color:var(--ink)}
.pp-c.c2{background:var(--c2);background-clip:padding-box;color:#fff}
.pp-c.c3{background:var(--c3);background-clip:padding-box;color:var(--on-c3)}
.pp-c.lowq{opacity:.38}
.pp-c.na{color:var(--ink-3)}
.pp-c:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}
.pp-c:focus-visible{outline:2px solid var(--brand)}
.one .pp-c{font-size:11.5px;font-weight:600}
/* malignancy bars */
.pp-b{box-sizing:border-box;background:var(--surface);border-left:1px solid var(--line);display:flex;align-items:center;padding:0 6px;cursor:pointer}
.pp-b i{display:block;height:7px;border-radius:0 2px 2px 0;background:var(--hot)}
.pp-b.pp-vincze i{background:color-mix(in srgb,var(--hot) 45%,transparent);box-shadow:inset 0 0 0 1px var(--hot)}
.pp-b:hover{background:color-mix(in srgb,var(--hot) 7%,var(--surface))}
/* tree */
.pp-tree .br{fill:none;stroke:var(--ink-3);stroke-width:1;stroke-linecap:square;opacity:.75}
.pp-tree .lab text{font:600 9.5px var(--font-b);fill:var(--ink-2);paint-order:stroke;stroke:var(--surface);stroke-width:3px;stroke-linejoin:round;letter-spacing:.01em}
.pp-node{cursor:pointer;outline:none}
.pp-node .hit{fill:transparent}
.pp-node .dot{fill:var(--ink-3);transition:r .12s}
.pp-node:hover .dot,.pp-node:focus-visible .dot{fill:var(--brand);r:4px}
.pp-node:focus-visible .hit{stroke:var(--brand);stroke-width:1.5}
/* legend */
.pp-sw{display:inline-block;width:14px;height:14px;border-radius:3px;vertical-align:-3px;margin-right:4px}
.pp-sw.c0{background-color:var(--c0);background-image:var(--hatch)}
.pp-sw.c1{background:var(--c1)}.pp-sw.c2{background:var(--c2)}.pp-sw.c3{background:var(--c3)}
.pp-sw.lowq{opacity:.38}
.pp-sw.bar{height:7px;width:18px;vertical-align:1px;background:var(--hot);border-radius:0 2px 2px 0}
.pp-sw.bar.v{background:color-mix(in srgb,var(--hot) 45%,transparent);box-shadow:inset 0 0 0 1px var(--hot)}
.pp-lb{margin-left:6px}
/* popover body */
.pp-pop{max-width:320px;min-width:180px}
.pp-pop b{font-weight:700}
.pp-pop i{opacity:.8}
.pp-pop dl{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:7px 0 4px;font-size:12.5px}
.pp-pop dt{opacity:.62}
.pp-pop dd{margin:0}
.pp-pop a{color:inherit;text-decoration:underline;text-underline-offset:2px;text-decoration-color:color-mix(in srgb,var(--paper) 50%,transparent)}
.pp-pop .mono{font-size:11.5px}
.pp-pop .pp-src{opacity:.6;font-size:11px}
.pp-also{opacity:.65;font-size:12px;margin-top:2px}
.pp-head .seg{max-width:100%;overflow-x:auto;scrollbar-width:none}
.pp-head .seg button{white-space:nowrap;flex:none}
@media (max-width:640px){.pp-b{position:static}.pp-bh{right:auto}.pp-sp{font-size:11.5px;padding:0 6px 0 4px}.pp-scroll{max-height:70vh}}
/* custom species set */
.pk{border:1px solid var(--line);border-radius:var(--r);background:var(--sunk);padding:10px 12px;margin:-4px 0 12px}
.pk-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pk-in{position:relative;flex:1 1 260px}
.pk-in input{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:15px var(--font-b);padding:7px 14px}
.pk-in .qs{top:calc(100% + 4px);left:0;right:0;z-index:20}
.pk button.pk-go,.pk button.pk-x,.dl{border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink-2);font:600 13px var(--font-b);padding:6px 14px;cursor:pointer}
.pk button.pk-go{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pk-chips{margin-top:8px}
.pk-chips button.chip{border:0;cursor:pointer;font:inherit;font-size:13px}
.pk-chips .chip.clade{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}
.pk-chips .chip small{opacity:.75}
.pk-h{color:var(--brand)}
.pk-sum{margin-top:4px}
.dl{padding:2px 10px;font-size:12px;margin-left:10px}
.dl:hover,.pk button:hover{color:var(--ink)}