/* Plan tree for /sql-explain-plan-visualizer only. Tokens from backlink-maker / icloud-tools. */
#sepApp .sep-tree, #sepApp .sep-tree ul { list-style: none; margin: 0; padding: 0; }
#sepApp .sep-tree ul { margin-left: 14px; padding-left: 10px; border-left: 2px solid var(--bm-line-2); }
#sepApp .sep-node { margin: 6px 0; padding: 8px 10px; border: 1px solid var(--bm-line); border-radius: 10px; background: var(--bm-surface); display: grid; gap: 4px; }
#sepApp .sep-node.is-hot { border-color: var(--ic-warn); box-shadow: inset 4px 0 0 var(--ic-warn); }
#sepApp .sep-node.is-never { opacity: .7; }
#sepApp .sep-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
#sepApp .sep-head strong { color: var(--bm-ink); }
#sepApp .sep-meta { font-size: .82rem; color: var(--bm-ink-2); display: flex; flex-wrap: wrap; gap: 2px 12px; font-variant-numeric: tabular-nums; }
#sepApp .sep-bar { height: 6px; border-radius: 999px; background: var(--bm-line-2); overflow: hidden; }
#sepApp .sep-bar > span { display: block; height: 100%; background: var(--bm-accent); }
#sepApp .sep-node.is-hot .sep-bar > span { background: var(--ic-warn); }
#sepApp .sep-node details { font-size: .82rem; }
#sepApp .sep-node summary { cursor: pointer; color: var(--bm-ink-3); }
#sepApp .sep-node dl { margin: 4px 0 0; }
@media (max-width: 480px) { #sepApp .sep-tree ul { margin-left: 4px; padding-left: 6px; } }
