:root{
  --primary:#355f52;
  --primary-strong:#26463d;
  --accent:#d6a85f;
  --bg:#f4f2ec;
  --surface:#ffffff;
  --surface-soft:#faf9f6;
  --text:#1f2a26;
  --muted:#6e7773;
  --border:#e1ded6;
  --danger:#a83b3b;
  --radius:18px;
  --font-scale:1;
  --app-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --shadow:0 12px 34px rgba(31,42,38,.08);
}
*{box-sizing:border-box}
html{font-size:calc(16px * var(--font-scale));scroll-behavior:smooth}
body{margin:0;font-family:var(--app-font);background:radial-gradient(circle at 82% 5%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 28%),var(--bg);color:var(--text)}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.micro{font-size:.78rem;color:var(--muted);line-height:1.45}.muted{color:var(--muted)}
.auth-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,rgba(214,168,95,.2),transparent 30%),linear-gradient(145deg,#eef2ed,#f8f4ea)}
.auth-card{width:min(440px,100%);background:var(--surface);border:1px solid var(--border);border-radius:28px;padding:30px;box-shadow:var(--shadow)}
.brand-lockup{display:flex;gap:14px;align-items:center}.brand-lockup h1{margin:0 0 4px;font-size:1.4rem}.brand-lockup p{margin:0;color:var(--muted)}
.brand-mark,.preview-logo{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:var(--primary);color:#fff;font-weight:800;letter-spacing:.05em;overflow:hidden}.brand-mark img,.preview-logo img{width:100%;height:100%;object-fit:cover}
.stack{display:grid;gap:14px;margin-top:24px}.stack label,.form-grid label,.form-two label{display:grid;gap:7px;font-size:.88rem;font-weight:650;color:#39443f}
input,textarea,select{width:100%;border:1px solid var(--border);border-radius:12px;padding:11px 12px;background:#fff;color:var(--text);outline:none;transition:.2s}input:focus,textarea:focus,select:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent)}
.btn{border:0;border-radius:12px;padding:10px 15px;font-weight:750;display:inline-flex;justify-content:center;align-items:center;gap:8px}.btn.primary{background:var(--primary);color:#fff}.btn.primary:hover{background:var(--primary-strong)}.btn.ghost{background:#fff;color:var(--primary);border:1px solid var(--border)}.btn.subtle{background:var(--surface-soft);color:var(--text);border:1px solid var(--border)}.btn.danger{background:#fff0f0;color:var(--danger);border:1px solid #f0cccc}.full{width:100%}
.divider{display:flex;align-items:center;gap:12px;color:var(--muted);margin:16px 0}.divider:before,.divider:after{content:"";height:1px;background:var(--border);flex:1}.divider span{font-size:.8rem}
.app-shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#23332e;color:#fff;padding:24px 16px;display:flex;flex-direction:column;z-index:30}.sidebar-brand{padding:0 8px 24px}.sidebar-brand small{display:block;color:#b9c6c1;margin-top:3px}.sidebar .brand-mark{background:var(--accent);color:#24352f}
.nav-list{display:grid;gap:7px}.nav-item{border:0;background:transparent;color:#cbd5d1;text-align:left;padding:11px 12px;border-radius:12px;font-weight:650}.nav-item:hover,.nav-item.active{background:rgba(255,255,255,.09);color:#fff}.sidebar-footer{margin-top:auto;display:grid;gap:10px}.badge{font-size:.75rem;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.1);width:max-content;color:#dce6e2}
.main{min-width:0;padding:0 30px 40px}.topbar{min-height:102px;display:flex;align-items:center;justify-content:space-between;gap:20px}.topbar h1{margin:2px 0 0;font-size:1.8rem}.eyebrow{font-size:.72rem;font-weight:850;letter-spacing:.13em;color:var(--primary)}.top-actions,.inline-actions,.hero-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.icon-btn{border:0;background:transparent;font-size:1.2rem;color:inherit;padding:8px}.mobile-only{display:none}
.view{display:none}.view.active{display:block}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.hero{display:grid;grid-template-columns:1.35fr .65fr;align-items:center;min-height:280px;padding:40px;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;right:-80px;bottom:-120px;width:330px;height:330px;border-radius:50%;background:color-mix(in srgb,var(--accent) 20%,transparent);pointer-events:none}.hero>div:first-child,.hero-actions{position:relative;z-index:2}.hero h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.05;margin:10px 0 14px;max-width:780px}.hero p{max-width:720px;color:var(--muted);line-height:1.7;margin:0 0 20px}.hero-symbol{font-size:8rem;text-align:center;position:relative;z-index:1;filter:saturate(.7)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.stat{padding:20px}.stat span{color:var(--muted);font-size:.82rem}.stat strong{display:block;font-size:2rem;margin-top:5px}.two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.section-card{padding:22px}.section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}.section-head h3{margin:3px 0 0;font-size:1.2rem}.text-btn{border:0;background:transparent;color:var(--primary);font-weight:750}.guide-list{margin:0;padding-left:20px;display:grid;gap:12px;color:#43504a;line-height:1.55}.member-list{display:grid;gap:10px}.member-row{display:flex;align-items:center;gap:12px;border-top:1px solid var(--border);padding:11px 0}.member-row:first-child{border-top:0}.avatar{width:46px;height:46px;border-radius:50%;background:#dde7e2;display:grid;place-items:center;overflow:hidden;font-weight:800;color:var(--primary)}.avatar img{width:100%;height:100%;object-fit:cover}.member-row .grow,.grow{flex:1}.member-row strong{display:block}.member-row small{color:var(--muted)}
.toolbar{padding:14px;display:grid;grid-template-columns:minmax(260px,1fr) 180px 150px auto;gap:10px;margin-bottom:18px}.member-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.member-card{overflow:hidden}.member-card .cover{height:160px;background:linear-gradient(145deg,#dfe7e3,#f6efe0);display:grid;place-items:center}.member-card .cover img{width:100%;height:100%;object-fit:cover}.member-card .cover .initials{font-size:2.5rem;font-weight:850;color:var(--primary)}.member-card .body{padding:16px}.member-card h3{margin:0 0 4px}.member-card p{margin:0;color:var(--muted);font-size:.87rem;line-height:1.5}.member-card .meta{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.chip{font-size:.72rem;background:var(--surface-soft);border:1px solid var(--border);border-radius:999px;padding:5px 8px}.member-card .actions{display:flex;gap:8px}.member-card .actions .btn{padding:8px 10px;font-size:.82rem;flex:1}
.empty-state{color:var(--muted);padding:28px;text-align:center;border:1px dashed var(--border);border-radius:14px}.tree-help{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.78rem;margin:-4px 0 14px}.tree-help span{display:flex;align-items:center;gap:7px}.tree-key{display:inline-block;width:28px;height:3px;border-radius:9px;background:var(--primary)}.tree-actions .btn{min-width:42px}.tree-canvas{min-height:420px;overflow:auto;overscroll-behavior:contain;border:1px solid var(--border);border-radius:16px;background:linear-gradient(rgba(53,95,82,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(53,95,82,.035) 1px,transparent 1px),#fbfcfa;background-size:24px 24px;padding:24px;touch-action:pan-x pan-y}.tree-zoom-shell{width:max-content;min-width:100%}.tree-stage{--tree-zoom:1;position:relative;width:max-content;min-width:100%;padding:8px 30px 34px;zoom:var(--tree-zoom)}.tree-lines{position:absolute;inset:0;z-index:0;overflow:visible;pointer-events:none}.tree-lines path{fill:none;stroke:var(--primary);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:.58}.generation-block{position:relative;z-index:1;margin-bottom:86px;min-width:max-content}.generation-block:last-child{margin-bottom:10px}.generation-title{font-size:.78rem;letter-spacing:.1em;color:var(--muted);font-weight:850;margin:0 0 14px;text-align:center}.generation-row{display:flex;justify-content:center;align-items:stretch;gap:44px;min-width:max-content}.tree-person{width:230px;min-height:104px;border:2px solid color-mix(in srgb,var(--primary) 24%,var(--border));border-radius:16px;padding:12px;background:#fff;display:flex;gap:10px;align-items:center;box-shadow:0 9px 24px rgba(31,42,38,.09);position:relative;z-index:2;text-align:left}.tree-person:hover{border-color:var(--primary);transform:translateY(-2px)}.tree-person:before,.tree-person:after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:10px;height:10px;border-radius:50%;background:var(--primary);border:3px solid #fff}.tree-person:before{top:-7px}.tree-person:after{bottom:-7px}.tree-person .avatar{width:44px;height:44px;flex:0 0 44px}.tree-person-copy{min-width:0}.tree-person strong{display:block;line-height:1.25}.tree-person small{display:block;color:var(--muted);margin-top:3px}.tree-rel{font-size:.68rem;color:var(--primary);margin-top:5px;line-height:1.35}.tree-spouse{font-size:.7rem;color:#9a6d25;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.book-sheet{background:#fff;max-width:920px;margin:18px auto;padding:56px;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border);min-height:70vh}.book-cover{text-align:center;padding:50px 20px 70px;border-bottom:2px solid var(--primary)}.book-cover .crest{width:82px;height:82px;border-radius:24px;background:var(--primary);color:#fff;margin:0 auto 20px;display:grid;place-items:center;font-weight:900;font-size:1.4rem;overflow:hidden}.book-cover .crest img{width:100%;height:100%;object-fit:cover}.book-cover h1{font-family:Georgia,serif;font-size:3rem;margin:0}.book-cover p{color:var(--muted)}.book-section{padding:34px 0;border-bottom:1px solid var(--border)}.book-person{display:grid;grid-template-columns:110px 1fr;gap:22px;margin:22px 0}.book-person img,.book-photo-placeholder{width:110px;height:135px;object-fit:cover;border-radius:12px;background:#eef1ed;display:grid;place-items:center;color:var(--primary);font-weight:850}.book-person h3{margin:0 0 8px;font-family:Georgia,serif;font-size:1.45rem}.book-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;font-size:.86rem;color:#44514b}.book-meta b{color:var(--text)}.book-bio{margin-top:12px;line-height:1.7;color:#44514b;white-space:pre-wrap}
.settings-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.form-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.toggle-row{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:9px!important}.toggle-row input{width:auto}.logo-preview-wrap{padding:10px;border:1px dashed var(--border);border-radius:14px}.logo-preview-wrap img{height:72px;max-width:160px;object-fit:contain}.preview-card{padding:28px;border-radius:var(--radius);border:1px solid var(--border);background:linear-gradient(145deg,#fff,#f7f4ec)}.preview-card h2{margin:14px 0 4px}.preview-card p{margin:0 0 18px;color:var(--muted)}
.file-btn input{display:none}.app-footer{text-align:center;color:var(--muted);font-size:.78rem;padding:28px 0 4px}.modal{border:0;padding:0;background:transparent;width:min(900px,calc(100% - 24px));max-height:92vh}.modal::backdrop{background:rgba(16,25,22,.55);backdrop-filter:blur(4px)}.modal-card{background:#fff;border-radius:24px;padding:24px;max-height:90vh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.24)}.modal-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}.modal-head h2{margin:3px 0 0}.photo-editor{display:flex;gap:16px;align-items:center;margin-bottom:20px}.photo-preview{width:96px;height:112px;border-radius:16px;object-fit:cover;background:#edf1ee;border:1px solid var(--border)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.span-2{grid-column:1/-1}.modal-actions{display:flex;gap:10px;align-items:center;margin-top:22px;padding-top:16px;border-top:1px solid var(--border)}
.detail-header{display:grid;grid-template-columns:140px 1fr;gap:22px}.detail-photo{width:140px;height:170px;object-fit:cover;border-radius:18px;background:#edf1ee}.detail-header h2{margin:0 0 4px}.detail-info{display:grid;grid-template-columns:repeat(2,1fr);gap:9px 18px;margin-top:16px}.detail-info div{font-size:.86rem}.detail-info span{display:block;color:var(--muted);font-size:.74rem;margin-bottom:2px}.contact-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.toast{position:fixed;right:22px;bottom:22px;z-index:999;background:#1f2a26;color:#fff;padding:12px 16px;border-radius:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:none}
.btn{transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(31,42,38,.12)}
.nav-item{transition:background .2s ease,color .2s ease,transform .2s ease}.nav-item:hover{transform:translateX(3px)}
.view.active{animation:viewIn .35s ease both}.card{transition:transform .25s ease,box-shadow .25s ease}.card:hover{box-shadow:0 18px 44px rgba(31,42,38,.11)}.member-card:hover{transform:translateY(-4px)}
@keyframes viewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.page-intro{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:0 2px 16px}.page-intro h2{margin:5px 0 4px}.page-intro p{margin:0;color:var(--muted)}
.result-pill{background:var(--primary);color:#fff;border-radius:999px;padding:8px 13px;font-size:.8rem;font-weight:800;white-space:nowrap}
.search-wrap{position:relative}.search-wrap input{padding-left:40px;padding-right:40px}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-52%);font-size:1.25rem;color:var(--primary);pointer-events:none}.clear-search{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:var(--surface-soft);color:var(--muted);width:28px;height:28px;border-radius:50%}
body.compact .section-card{padding:16px}body.compact .member-grid{gap:10px}body.compact .member-card .cover{height:125px}body.compact .topbar{min-height:82px}
@media (max-width:1050px){.member-grid{grid-template-columns:repeat(2,1fr)}.stats-grid{grid-template-columns:repeat(2,1fr)}.settings-grid,.two-col{grid-template-columns:1fr}.hero{grid-template-columns:1fr}.hero-symbol{display:none}.toolbar{grid-template-columns:1fr 1fr}.toolbar .search-wrap{grid-column:1/-1}}
@media (max-width:760px){.app-shell{display:block}.sidebar{position:fixed;left:0;top:0;width:270px;transform:translateX(-105%);transition:.25s;box-shadow:20px 0 60px rgba(0,0,0,.22)}.sidebar.open{transform:none}.main{padding:0 14px 30px}.mobile-only{display:inline-flex}.topbar{min-height:86px}.topbar>div:first-child{display:flex;align-items:center;gap:8px}.topbar .eyebrow{display:none}.topbar h1{font-size:1.35rem}.top-actions .btn.ghost{display:none}.hero{padding:26px 20px;min-height:250px}.hero h2{font-size:2rem}.stats-grid{grid-template-columns:1fr 1fr}.member-grid{grid-template-columns:1fr}.toolbar{grid-template-columns:1fr}.toolbar .search-wrap{grid-column:auto}.form-grid,.form-two{grid-template-columns:1fr}.span-2{grid-column:auto}.book-sheet{padding:28px 20px}.book-cover h1{font-size:2.2rem}.book-person{grid-template-columns:80px 1fr}.book-person img,.book-photo-placeholder{width:80px;height:100px}.book-meta{grid-template-columns:1fr}.detail-header{grid-template-columns:1fr}.detail-photo{width:110px;height:135px}.detail-info{grid-template-columns:1fr}.section-head{flex-direction:column}.top-actions #addMemberTop{padding:9px 11px}.modal-card{padding:18px}.photo-editor{align-items:flex-start}.tree-actions{width:100%}.tree-actions select{flex:1 1 100%}.tree-actions .btn{padding:9px 11px}.tree-canvas{padding:14px;min-height:460px}.tree-stage{padding-left:18px;padding-right:18px}.generation-row{gap:28px}.tree-person{width:205px}.tree-help{font-size:.72rem}}
.tree-line-layer{position:absolute;left:0;top:0;z-index:3;pointer-events:none;overflow:visible}.tree-branch{position:absolute;display:block;background:var(--primary);border-radius:5px;opacity:.82;box-shadow:0 0 0 1px color-mix(in srgb,var(--primary) 18%,transparent)}.tree-person{z-index:4}
.family-chart ul{position:relative;display:flex;justify-content:center;margin:0;padding:72px 0 0;white-space:nowrap}.family-chart>.family-roots{padding-top:10px;gap:54px}.family-chart li{list-style:none;position:relative;text-align:center;padding:72px 18px 0}.family-chart>.family-roots>li{padding-top:0}.family-chart li:before,.family-chart li:after{content:"";position:absolute;top:0;right:50%;width:50%;height:72px;border-top:4px solid var(--primary)}.family-chart li:after{right:auto;left:50%;border-left:4px solid var(--primary)}.family-chart li:only-child:before,.family-chart li:only-child:after{display:none}.family-chart li:first-child:before,.family-chart li:last-child:after{border:0}.family-chart li:last-child:before{border-right:4px solid var(--primary);border-radius:0 12px 0 0}.family-chart li:first-child:after{border-radius:12px 0 0 0}.family-chart ul ul:before{content:"";position:absolute;top:0;left:50%;height:72px;border-left:4px solid var(--primary)}.family-chart .tree-person{display:inline-flex;white-space:normal;vertical-align:top;z-index:4}.family-chart .tree-person:before{display:none}.family-chart .tree-person:after{bottom:-10px;width:12px;height:12px}.family-chart .tree-rel{white-space:normal}.family-chart .tree-spouse{max-width:150px}
.bulk-card{width:min(980px,calc(100vw - 28px))}.bulk-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.bulk-paste-label{display:grid;gap:8px;font-weight:700}.bulk-paste-label textarea{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.82rem;line-height:1.5}.bulk-preview{margin-top:16px;max-height:250px;overflow:auto}.bulk-preview table{width:100%;border-collapse:collapse;text-align:left;font-size:.8rem}.bulk-preview th,.bulk-preview td{padding:8px;border-bottom:1px solid var(--border);white-space:nowrap}.bulk-preview th{position:sticky;top:0;background:var(--surface-soft);color:var(--primary)}
.couple-node{display:inline-flex;align-items:center;justify-content:center;position:relative;z-index:4}.couple-node:after,.single-node:after{content:"";position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);width:12px;height:12px;border-radius:50%;background:var(--primary);border:3px solid #fff;z-index:6}.single-node{display:inline-block;position:relative;z-index:4}.couple-connector{width:52px;height:4px;background:var(--primary);position:relative;display:block;flex:0 0 52px}.couple-connector b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#b55a67;font-size:13px;border:3px solid var(--primary)}.couple-node .tree-person:after,.single-node .tree-person:after{display:none}.couple-role{display:block;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:#9a6d25;font-weight:850;margin-bottom:3px}.spouse-card{border-color:color-mix(in srgb,var(--accent) 55%,var(--border))}
.role-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}.role-guide span{padding:14px;border-radius:12px;background:var(--surface-soft);color:var(--muted);font-size:.82rem}.role-guide b{display:block;color:var(--text);margin-bottom:4px}.users-table{overflow:auto}.users-table table{width:100%;border-collapse:collapse}.users-table th,.users-table td{text-align:left;padding:13px;border-bottom:1px solid var(--border)}.users-table th{color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em}.users-table td strong,.users-table td small{display:block}.users-table td small{color:var(--muted);margin-top:3px}.users-table select{min-width:130px}.role-pill{display:inline-block;padding:5px 9px;border-radius:999px;text-transform:capitalize;font-size:.75rem;font-weight:800}.role-pill.admin{background:#fff0d8;color:#895d16}.role-pill.editor{background:#e3f0eb;color:#285f4c}.role-pill.viewer{background:#edf0f3;color:#5c6770}@media(max-width:760px){.role-guide{grid-template-columns:1fr}.users-table th,.users-table td{padding:10px 8px}}
@media print{body{background:#fff}.sidebar,.topbar,.no-print,.app-footer,.toast{display:none!important}.app-shell,.main{display:block;padding:0}.view{display:none!important}#view-book{display:block!important}.book-sheet{box-shadow:none;border:0;max-width:none;margin:0;padding:15mm}.book-section{break-inside:avoid}.book-person{break-inside:avoid}@page{size:A4;margin:12mm}}

/* V12: background Beranda yang dapat diganti Admin. */
.hero{grid-template-columns:1fr}
.hero>div:first-child{max-width:900px}
.hero{background-size:cover;background-repeat:no-repeat;transition:background-image .25s ease}
.hero.has-hero-background:before{content:"";position:absolute;inset:0;background:rgba(18,29,25,var(--hero-overlay,.45));z-index:1;pointer-events:none}
.hero.has-hero-background:after{display:none}.hero.has-hero-background>div{z-index:2}
.hero.has-hero-background h2,.hero.has-hero-background p,.hero.has-hero-background .eyebrow{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.38)}
.hero.has-hero-background.hero-text-dark:before{background:rgba(255,255,255,var(--hero-overlay,.45))}
.hero.has-hero-background.hero-text-dark h2,.hero.has-hero-background.hero-text-dark p,.hero.has-hero-background.hero-text-dark .eyebrow{color:var(--text);text-shadow:0 1px 10px rgba(255,255,255,.6)}
.background-settings{display:grid;gap:10px;margin-top:8px;padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--surface-soft)}
.background-settings h4{margin:5px 0 0}.background-preview-wrap{display:grid;gap:10px}.background-preview-wrap img{width:100%;height:150px;object-fit:cover;border-radius:12px;border:1px solid var(--border)}.background-preview-wrap .btn{justify-self:start}
.preview-card{background-size:cover;background-repeat:no-repeat}.preview-card p{color:inherit;opacity:.82}

/* V13: alur silsilah konsisten dari leluhur ke keturunan. */
.family-chart>.family-roots{align-items:flex-start;gap:90px}
.family-chart li{padding-left:14px;padding-right:14px;padding-top:68px}
.family-chart li:before,.family-chart li:after,.family-chart ul ul:before{height:68px}
.family-chart ul{padding-top:68px;align-items:flex-start}
.family-chart .tree-person{width:210px;min-height:112px}
.family-chart .couple-connector{width:38px;flex-basis:38px}
.family-chart .couple-node{align-items:center}
.family-chart .tree-person-copy{text-align:left}
.family-chart .tree-rel{font-size:.65rem;line-height:1.3}
.family-chart .couple-role{color:#8a6429}
@media(max-width:760px){.family-chart .tree-person{width:190px}.family-chart li{padding-left:10px;padding-right:10px}.family-chart>.family-roots{gap:55px}}