:root{--paper:#fff9ef;--ink:#2b2323;--muted:#725f58;--rasp:#b83d6a;--aqua:#168f9b;--gold:#efad27;--leaf:#629a58;--coral:#e86f52;--plum:#765c96;--line:#ead9bf;--memorial:#4b5563;--cream:#fffdf7}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Avenir Next",Aptos,Inter,"Segoe UI",Arial,sans-serif}h1,h2,h3,.node .name,.card .name{font-family:Georgia,"Times New Roman",serif;letter-spacing:0}button,input,select{font:inherit}button{border:1px solid var(--line);background:#fffdf7;color:var(--ink);border-radius:10px;padding:10px 13px;cursor:pointer}button:hover{border-color:var(--rasp)}button.primary{background:var(--rasp);color:white;border-color:var(--rasp);font-weight:800}input,select{border:1px solid var(--line);border-radius:10px;background:white;padding:10px 12px;color:var(--ink)}header{position:sticky;top:0;z-index:10;background:rgba(255,249,239,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:14px 20px}.topbar{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;max-width:1500px;margin:0 auto}h1{margin:0;font-size:30px;line-height:1.05;color:#78364d}.tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.tab.active{background:#ffe6ee;border-color:var(--rasp);color:var(--rasp);font-weight:800}main{max-width:1500px;margin:0 auto;padding:18px 20px 32px}.view{display:none}.view.active{display:block}.panel{background:#fffdf7;border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 10px 28px rgba(101,72,43,.08)}.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}.toolbar input{min-width:220px}.toolgroup{display:flex;align-items:center;gap:8px;background:#fff3d8;border:1px solid #f1d49a;border-radius:12px;padding:7px}.zoom-tools{margin-left:auto}.zoom-tools input[type=range]{width:150px;padding:0;accent-color:var(--rasp)}#zoomLabel{min-width:48px;text-align:center;font-weight:800;color:#78364d}.tree-scroller{overflow:auto;max-height:calc(100vh - 202px);min-height:620px;scroll-behavior:smooth}.tree-stage{transition:width .15s ease,height .15s ease}.tree-board{position:relative;transform-origin:top left;transition:transform .15s ease;background:radial-gradient(circle at 9% 16%,#ffe6ee,transparent 24%),radial-gradient(circle at 94% 18%,#d8fbff,transparent 22%),#fffdf7;border-radius:22px;border:1px solid var(--line)}.tree-board svg{position:absolute;inset:0;pointer-events:none;overflow:visible}.generation-band{position:absolute;left:0;right:0;height:118px;border-top:1px solid #f0dfc6;border-bottom:1px solid #f8ead3;background:rgba(255,255,255,.32)}.generation-label{position:absolute;left:22px;width:70px;text-align:center;font-family:Georgia,"Times New Roman",serif;font-weight:900;font-size:22px;color:#8b3a5b}.node{position:absolute;width:164px;min-height:102px;border:2px solid var(--rasp);background:white;border-radius:16px;padding:10px;text-align:center;box-shadow:0 8px 18px rgba(66,40,30,.08);cursor:pointer}.node img{width:52px;height:52px;object-fit:cover;border-radius:50%;display:block;margin:0 auto 6px}.node .name{font-weight:900;font-size:18px;line-height:1.05}.node .mini{font-size:12px;color:var(--muted);margin-top:3px}.node.memory{border:5px double var(--memorial);filter:grayscale(1)}.node.highlight{outline:8px solid #ffd166;outline-offset:5px;box-shadow:0 0 0 12px rgba(255,209,102,.28),0 12px 26px rgba(66,40,30,.2);z-index:5}.branch-label{position:absolute;height:54px;border:2px solid var(--gold);background:#fff6dd;border-radius:16px;padding:10px 14px;text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:18px;font-weight:900;color:#9b6700}.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--muted);margin-top:10px}.legend span{display:inline-flex;align-items:center;gap:6px}.swatch{width:22px;height:5px;border-radius:4px;display:inline-block}.swatch.parent{background:#6c9b8a}.swatch.married{background:#b83d6a}.swatch.partner{background:repeating-linear-gradient(90deg,#b83d6a 0 8px,transparent 8px 14px)}.swatch.branch{background:#e86f52}.profile{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:24px;align-items:start}.profile img{width:100%;max-height:520px;object-fit:cover;border-radius:22px;border:1px solid var(--line)}.profile .memory-photo{border:6px double var(--memorial);padding:5px;background:#f3f4f6;filter:grayscale(1)}.memorial-note{display:inline-block;margin:12px 0 0;padding:9px 12px;border-radius:999px;border:1px solid #c9cdd3;color:var(--memorial);background:#f7f7f8;font-weight:800}.facts{display:grid;gap:12px;margin-top:14px}.fact{display:grid;grid-template-columns:170px 1fr;gap:14px;padding:14px 16px;background:white;border:1px solid var(--line);border-radius:14px}.fact strong{color:var(--rasp)}.directory{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}.card{background:white;border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer;box-shadow:0 10px 20px rgba(66,40,30,.06)}.card img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}.card.memory img{filter:grayscale(1)}.card.memory{border:5px double var(--memorial)}.card .body{padding:12px}.meta,.hint{color:var(--muted)}.quiz-layout{display:grid;grid-template-columns:minmax(280px,430px) 1fr;gap:26px;align-items:start}.quiz-layout img{width:100%;max-height:520px;object-fit:cover;border-radius:22px;border:1px solid var(--line);background:#f4e8da}.quiz-actions{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.progress{height:14px;border-radius:999px;background:#f1dfc3;overflow:hidden;margin:10px 0 16px}.progress div{height:100%;width:0;background:linear-gradient(90deg,var(--aqua),var(--rasp));transition:width .2s ease}#quizResult{font-size:20px;font-weight:800;min-height:30px}.review-list{display:grid;gap:10px;margin-top:12px}.review-item{padding:12px;border:1px solid var(--line);border-radius:14px;background:white}.maintain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.maintain article{background:white;border:1px solid var(--line);border-radius:14px;padding:14px}@media(max-width:900px){.topbar,.profile,.quiz-layout{display:block}.tabs,.zoom-tools{justify-content:flex-start;margin-left:0}.fact{grid-template-columns:1fr}.tree-scroller{max-height:68vh}}