*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;background:#f4f1e9;color:#2b241b}.top{height:68px;background:#211b16;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 28px;box-shadow:0 5px 25px #0002}.brand{font-size:21px;font-weight:800}.brand small{opacity:.55;font-size:12px}.top nav{display:flex;gap:18px}.top a{color:#ddd;text-decoration:none}.top a:hover{color:#fff}.page{max-width:1180px;margin:34px auto;padding:0 20px}.narrow{max-width:700px}.pagehead{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.muted{color:#766e63}.card{background:#fff;border:1px solid #e6ded2;border-radius:18px;box-shadow:0 12px 35px #5d422018}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}.person{padding:24px;text-align:center}.avatar{width:70px;height:70px;margin:auto;border-radius:50%;display:grid;place-items:center;background:#eee7dc;font-size:30px}.form{padding:30px}.form label{display:block;font-weight:700;margin:15px 0}.form input,.form select,.form textarea,.login input{width:100%;padding:12px 14px;margin-top:7px;border:1px solid #d8cec0;border-radius:10px;font-size:15px;background:#fff}.form textarea{min-height:100px}.btn,button{border:0;border-radius:10px;background:#6c4f31;color:white;padding:11px 17px;text-decoration:none;cursor:pointer;font-weight:700;display:inline-block}.btn:hover{filter:brightness(1.08)}.btn.small,.danger.small{padding:7px 10px;font-size:13px}.danger{background:#a64235;color:#fff;border:0;border-radius:9px;cursor:pointer}.wide{width:100%;margin-top:15px}.success,.error,.notice{padding:13px;border-radius:10px;margin:12px 0}.success{background:#e8f5e9}.error{background:#fdecea;color:#8b241b}.notice{background:#f0eadf}.center{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#fff,#e9e1d4)}.login{width:380px;padding:42px}.login h1{text-align:center}.logo{text-align:center;font-size:54px}table{width:100%;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid #eee;text-align:left}.install{max-width:650px;padding:35px}pre{white-space:pre-wrap;word-break:break-word}hr{border:0;border-top:1px solid #eee;margin:28px 0}
#treeViewport{height:calc(100vh - 68px);overflow:hidden;position:relative;background:radial-gradient(circle at center,#fffdf8,#e8dfd2)}#treeCanvas{position:absolute;left:0;top:0;width:1px;height:1px;transform-origin:0 0}.node{position:absolute;width:180px;min-height:86px;background:#fff;border:1px solid #d9cdbd;border-radius:16px;padding:12px 14px;text-align:center;box-shadow:0 12px 28px #49331c20;z-index:2}.node .n{font-weight:800;font-size:17px}.node .sub{font-size:11px;color:#897d70;margin-top:5px}.node.male{border-top:4px solid #6d8da6}.node.female{border-top:4px solid #b27c89}.node .photo{width:38px;height:38px;border-radius:50%;object-fit:cover;float:left;margin-right:8px}.edge{position:absolute;z-index:1;overflow:visible;pointer-events:none}.edge line,.edge path{fill:none;stroke:#987e5c;stroke-width:2.2}.edge .spouse{stroke:#b55d61;stroke-dasharray:5 4}.edge text{font-size:11px;fill:#78634b}.family-dot{position:absolute;width:8px;height:8px;background:#987e5c;border-radius:50%;z-index:3}
.toolbar{height:54px;position:absolute;z-index:20;top:78px;left:22px;display:flex;gap:8px;align-items:center}.toolbar button{background:#fff;color:#4d4033;border:1px solid #d8cdbd;box-shadow:0 4px 12px #0001}.toolbar span{background:#fff;padding:9px 12px;border-radius:9px;border:1px solid #ddd;color:#777;font-size:12px}
@media(max-width:700px){.top{padding:0 14px}.top nav{gap:9px;font-size:12px}.pagehead{display:block}.pagehead .btn{margin-top:10px}}