.kinship-controls{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:14px;align-items:center;margin:22px 0}.kinship-controls label{display:grid;gap:8px;color:#aebbc4;font-size:12px}.kinship-controls select{width:100%;min-width:0;border:1px solid #344753;border-radius:9px;background:#0d141b;color:var(--text);padding:11px;outline:none}.kinship-controls select:focus{border-color:var(--cyan)}.kinship-swap{margin-top:18px;font-size:24px}.kinship-answer{padding:24px;border:1px solid #3f6860;border-radius:16px;background:linear-gradient(135deg,#132621,#101821)}.kinship-answer h2{margin:10px 0;font-size:24px}.kinship-answer p{color:#9bb2b2;font-size:13px;line-height:1.6}.kinship-answer h3{margin:24px 0 12px;font-size:14px}.kinship-chain{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:10px 0;padding:14px;border:1px solid #2e474b;border-radius:12px;background:#0d171b}.kinship-person{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #365854;border-radius:10px;background:#152824;color:#e1fff8;text-align:left;cursor:pointer;max-width:100%}.kinship-person:hover{border-color:var(--cyan);background:#1b3730}.kinship-person .avatar{flex:none}.kinship-person span{min-width:0;overflow-wrap:anywhere}.kinship-person b{display:block;font-size:13px}.kinship-person small{display:block;color:#8fa9a5;font-size:11px;margin-top:4px}.kinship-arrow{color:#77a59b;font-size:11px;white-space:nowrap}.kinship-children{display:flex;flex-wrap:wrap;gap:10px}@media(max-width:700px){.kinship-controls{grid-template-columns:1fr;gap:10px}.kinship-swap{margin:0;justify-self:center}.kinship-answer{padding:16px}.kinship-answer h2{font-size:20px}.kinship-chain{flex-direction:column;align-items:stretch}.kinship-person{width:100%}.kinship-arrow{align-self:center}}
.kinship-tree{margin:14px 0;padding:22px;border:1px solid #2e474b;border-radius:14px;background:#0c171b}
.kinship-direction{text-align:center;margin-bottom:20px;color:#88aba4;font-size:12px}
.kinship-lineage{display:flex;flex-direction:column;align-items:center}
.kinship-tree .kinship-person{width:min(100%,340px);padding:14px}
.kinship-tree .kinship-person .avatar{width:48px;height:48px}
.kinship-tree .kinship-person b{font-size:16px}
.kinship-role{display:block;margin-bottom:5px;font-style:normal;font-size:11px;color:#afc9c3}
.kinship-chosen{border-color:#66aa98;box-shadow:0 0 0 2px #67c5a912}
.kinship-chosen .kinship-role{color:#91efc9}
.kinship-connector{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;padding:20px 4px 10px;color:#a6c8c0;font-size:12px;text-align:center}
.kinship-connector::before{content:"";position:absolute;top:0;left:50%;height:16px;border-left:2px solid #477e71}
.kinship-connector b{color:#e5f5ee;overflow-wrap:anywhere}
.kinship-connector i{font-style:normal;font-size:25px;line-height:1;color:#65caaa}
.kinship-root{display:flex;justify-content:center}
.kinship-branches{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;margin-top:20px}
.kinship-branch{display:flex;flex-direction:column;align-items:center;border-top:2px solid #477e71;padding-top:12px;min-width:0}
.kinship-branch-title{color:#93bab0;font-size:12px;text-align:center;overflow-wrap:anywhere}
@media(max-width:700px){.kinship-tree{padding:16px 10px}.kinship-branches{gap:10px}.kinship-tree .kinship-person{padding:9px;gap:8px}.kinship-branches .kinship-person{flex-direction:column;text-align:center}.kinship-tree .kinship-person b{font-size:13px}.kinship-connector{font-size:11px}.kinship-direction{font-size:11px}}
.kinship-choice{display:grid;gap:8px;min-width:0;font-size:12px;color:#aebbc4}
.kinship-picker{position:relative;min-width:0}
.kinship-picker input{width:100%;height:44px;padding:0 13px;border:1px solid #344753;border-radius:9px;background:#0d141b;color:var(--text);font:inherit;font-size:14px;outline:none}
.kinship-picker input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px #61d7c410}
.kinship-matches{position:absolute;z-index:10;top:calc(100% + 6px);left:0;right:0;max-height:300px;overflow-y:auto;padding:5px;border:1px solid #41665c;border-radius:10px;background:#101c22;box-shadow:0 15px 40px #0009}
.kinship-matches[hidden]{display:none}
.kinship-matches button{display:flex;align-items:center;gap:10px;width:100%;padding:9px;border:0;border-radius:7px;background:transparent;color:#e1fff8;cursor:pointer;text-align:left;font:inherit;font-size:13px}
.kinship-matches button.active,.kinship-matches button:hover{background:#20372f}
.kinship-matches .avatar{width:28px;height:28px;flex:none}
.kinship-matches button span{overflow-wrap:anywhere}
.kinship-search-note{padding:12px;color:#8aa5a0;font-size:12px}
