.ft{--ft-line:color-mix(in srgb,var(--nav) 35%,transparent)}
.ft *{box-sizing:border-box}
.ft-tools{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.5rem 0 1rem;padding:.6rem .75rem;background:var(--accent-soft);border:1px solid var(--ft-line);border-radius:8px;position:sticky;top:0;z-index:5}
.ft-tools input[type=search]{flex:1 1 200px;font:inherit;padding:.4rem .5rem;border:1px solid var(--ft-line);border-radius:6px;background:var(--paper);color:var(--ink)}
.ft-tools label{font-size:.9rem;display:flex;gap:.3rem;align-items:center}
.ft button{font:inherit;cursor:pointer;border-radius:6px}
.ft-seg{margin:1.25rem 0}
.ft-seg>h2{font-family:var(--display);margin:.2rem 0;font-size:1.25rem}
.ft-src{font-size:.85rem;color:var(--muted);margin:0 0 .6rem}
.ft-src a{color:var(--link)}
.ft-col{display:flex;flex-direction:column;align-items:center}
.ft-node{position:relative;display:flex;flex-direction:column;align-items:center}
.ft-node+.ft-node::before{content:"";display:block;width:2px;height:14px;background:var(--ft-line)}
.ft-card{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center;background:var(--paper);border:1px solid var(--ft-line);border-left:4px solid var(--nav);border-radius:8px;padding:.35rem .7rem;min-width:11rem;max-width:22rem;text-align:center;box-shadow:0 1px 2px rgba(0,0,0,.06);cursor:pointer}
.ft-card:hover,.ft-card:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.ft-card .nm{font-weight:bold;color:var(--ink)}
.ft-card .rf{font-size:.75rem;color:var(--muted)}
.ft-card.diff{border-left-color:var(--accent)}
.ft-card.shared{background:var(--accent-soft)}
.ft-card.key{border:2px solid var(--nav);background:var(--accent-soft)}
.ft-card.hit{outline:3px solid var(--accent)}
.ft-side{display:none;flex-wrap:wrap;gap:.3rem;justify-content:center;margin-top:.25rem}
.ft.show-side .ft-side{display:flex}
.ft-side span{font-size:.75rem;border:1px dashed var(--ft-line);border-radius:12px;padding:.05rem .5rem;color:var(--muted);background:var(--paper)}
.ft-detail{display:none;max-width:30rem;margin:.3rem auto 0;font-size:.9rem;background:var(--accent-soft);border-radius:6px;padding:.5rem .7rem;text-align:left}
.ft-node.open .ft-detail{display:block}
.ft-fork{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
.ft-fork>section{border-top:3px solid var(--nav);padding-top:.5rem}
.ft-fork h3{font-family:var(--display);text-align:center;margin:.2rem 0;font-size:1.05rem}
.ft-tabs{display:none;gap:.4rem;justify-content:center;margin:.5rem 0}
.ft-tabs button{border:1px solid var(--nav);background:var(--paper);color:var(--nav);padding:.35rem .8rem}
.ft-tabs button[aria-pressed=true]{background:var(--nav);color:#fff}
.ft-family{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;align-items:flex-start}
.ft-family .ft-node::before{display:none!important}
.ft-converge{text-align:center;color:var(--muted);font-size:.85rem;margin:.4rem 0}
.ft-notes dt{font-weight:bold;margin-top:.6rem}
.ft-notes dd{margin:.15rem 0 0 0}
.ft-hidden{margin-top:2rem;border:1px dashed var(--nav);border-radius:10px;padding:.75rem 1rem;background:var(--paper)}
.ft-hidden>button{background:var(--nav);color:#fff;border:0;padding:.5rem .9rem}
.ft-hidden .ft-branch{display:none;margin-top:.75rem}
.ft-hidden.open .ft-branch{display:block}
.ft-card.spirit{border-style:dashed;border-left:4px dashed var(--accent)}
.ft-link{width:2px;height:22px;background:repeating-linear-gradient(var(--accent) 0 4px,transparent 4px 8px);margin:0 auto}
.ft-lbl{font-size:.8rem;color:var(--muted);text-align:center;font-style:italic}
@media (max-width:700px){.ft-fork{grid-template-columns:1fr}.ft-tabs{display:flex}.ft-fork>section[hidden]{display:none}.ft-card{min-width:9rem}}
@media (min-width:701px){.ft-fork>section[hidden]{display:block}}

.ft-spirit{display:block!important;margin-top:2rem;border:1px dashed var(--nav);border-radius:10px;padding:.75rem 1rem;background:var(--paper)}
.ft-spirit .ft-branch{display:block!important;margin-top:.75rem}

.ft-side{max-width:34rem;margin-left:auto;margin-right:auto}
.ft-side span{line-height:1.35}
.ft-side span b{color:var(--ink,#222);font-weight:600}
.ft-side span.un{font-style:italic}
.ft-side span a{font-size:.7rem}
@media(max-width:600px){.ft-side{gap:.2rem}.ft-side span{font-size:.7rem;padding:0 .4rem}}