:root{--container-max:800px}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background-color:#f4f4f4;padding:0;margin:0;padding-top:60px;padding-bottom:50px}.container{max-width:var(--container-max);margin:0 auto}header{position:fixed;top:0;left:0;right:0;z-index:900;text-align:center;padding:12px 14px;padding-top:max(12px,env(safe-area-inset-top));background:linear-gradient(90deg,#3498db,#2c3e50);color:#fff;border-radius:0 0 12px 12px;box-shadow:0 2px 8px rgba(0,0,0,.15);margin:0}header h1{margin:0;font-size:clamp(1rem, 3vw, 1.1rem);font-weight:600;line-height:1}header .subtitle{margin:4px 0 0;font-size:.9rem;opacity:.85}.tree{display:flex;flex-direction:column;align-items:center;position:relative;margin-top:30px}.generation{display:flex;justify-content:center;align-items:flex-start;gap:120px;margin-bottom:80px;position:relative}.person-box{position:relative;text-align:center;opacity:0;transform:translateY(20px)}.person-box.animated{animation:fadeIn 1s forwards}.person{background-color:#fff;padding:12px 18px;border:2px solid #3498db;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.1);text-align:center;width:260px;position:relative;z-index:1;height:auto;box-sizing:border-box}.children-box{background-color:#fdfdfd;padding:15px;border:2px dashed #95a5a6;border-radius:8px;text-align:center;font-style:italic;color:#7f8c8d;min-width:240px;opacity:0;transform:translateY(20px)}.children-box.animated{animation:fadeIn 1s forwards;animation-delay:4s}.children-box strong{display:block;font-style:normal;margin-bottom:5px;color:#2c3e50}.person a.doc-link{display:block;margin-top:6px;color:#27ae60;font-weight:700;text-decoration:none;font-size:.85em;text-align:left}.person a.doc-link.disabled{color:#aaa;cursor:not-allowed;text-decoration:line-through}.highlight{background-color:#fffae6;border-color:#f1c40f}.patriarch{background-color:#eaf4ff}svg.connector-layer{position:absolute;top:0;left:0;width:100%;height:100%;bottom:0;z-index:0;pointer-events:none;overflow:visible}path.connector{stroke:#3498db;stroke-width:2;fill:transparent;stroke-dasharray:1000;stroke-dashoffset:1000;animation:draw 2s forwards}@keyframes draw{to{stroke-dashoffset:0}}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}footer{margin-top:50px;padding:20px;background:#fff;border-top:4px solid #f39c12;border-radius:12px 12px 0 0;max-width:var(--container-max);margin-left:auto;margin-right:auto;font-size:.9em;color:#333;box-shadow:0 -2px 8px rgba(0,0,0,.1);text-align:left}footer h2{font-size:1em;margin-bottom:8px;color:#2c3e50}footer ul{list-style:none;padding:0;margin:0 0 15px 0}footer ul li{margin:5px 0;display:flex;align-items:center;gap:6px}footer ul li::before{content:"📌"}@media (max-width:800px){body{padding:8px;padding-top:70px;padding-bottom:90px}header h1{font-size:1rem}.generation{gap:10px;margin-bottom:40px;flex-wrap:nowrap}.person{width:150px;padding:10px;font-size:.8em}.person strong{font-size:.9em}.children-box{font-size:.8em;min-width:170px;padding:10px}footer{font-size:.8em;padding:14px}}@media print{body{background:#fff!important;padding:8px;padding-top:70px;margin:0}@page{size:A4 portrait;margin:15mm}.tree{transform:scale(.7);transform-origin:top center}.children-box,.person{border:1px solid #000!important;box-shadow:none!important;page-break-inside:avoid}svg.connector-layer path.connector{stroke:#000!important}}.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:0;z-index:9999;animation:fadeBackdrop .18s ease-out}.modal-backdrop.show{display:flex}@keyframes fadeBackdrop{from{opacity:0}to{opacity:1}}.modal{width:100vw!important;height:100dvh!important;height:-webkit-fill-available!important;background:#fff;border-radius:0!important;box-shadow:0 20px 60px rgba(0,0,0,.25);display:flex;flex-direction:column;overflow:hidden;transform:translateY(12px);animation:popIn .18s ease-out forwards}@keyframes popIn{to{transform:translateY(0)}}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;padding-top:max(12px,env(safe-area-inset-top));background:linear-gradient(90deg,#3498db,#2c3e50);color:#fff}.modal-title{margin:0;font-weight:600;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.modal-actions{display:flex;gap:8px;align-items:center}.btn{border:0;padding:8px 10px;border-radius:8px;cursor:pointer;font-weight:600;font-size:.85rem}.btn-outline{background:rgba(255,255,255,.15);color:#fff}.btn-close{background:#fff;color:#2c3e50}.modal-body{position:relative;flex:1;background:#f8fafc;display:block;overflow:auto}.doc-frame{width:100%;height:100%;border:0;display:none;background:#fff}.doc-text{display:none;width:100%;min-height:100%;margin:0;padding:16px;background:#fff;color:#1f2937;font:500 14px/1.5 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;white-space:pre-wrap;word-break:break-word}.modal-footer{padding:10px 14px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:#fff;display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(0,0,0,.06);font-size:.8rem;color:#444;min-height:40px}