:root{--linen: #f3ebe6;--canvas: #fbf7f4;--band: #f5eee9;--paper: #fffdfb;--ink: #2b1c27;--ink-soft: #75636f;--line: #8a7581;--line-ended: #8a7581;--malbec: #8c2a47;--malbec-deep: #6f1f37;--malbec-wash: #f7e9ec;--apricot: #bb7550;--font-display: "Bricolage Grotesque", "Instrument Sans", "Segoe UI", system-ui, sans-serif;--font-body: "Instrument Sans", "Segoe UI", "Helvetica Neue", Arial, system-ui, sans-serif;--radius-card: 22px;--radius-photo: 15px;--radius-stage: 30px;--shadow-tint: 43, 28, 39;--shadow-rest: 0 1px 2px rgba(var(--shadow-tint), .06), 0 8px 18px -8px rgba(var(--shadow-tint), .16), 0 22px 44px -28px rgba(var(--shadow-tint), .28);--shadow-lift: 0 2px 4px rgba(var(--shadow-tint), .07), 0 14px 28px -10px rgba(var(--shadow-tint), .22), 0 34px 60px -30px rgba(var(--shadow-tint), .36);--shadow-float: 0 1px 2px rgba(var(--shadow-tint), .06), 0 12px 32px -12px rgba(var(--shadow-tint), .28);--ease-out: cubic-bezier(.2, .8, .2, 1);--ease-spring: cubic-bezier(.34, 1.4, .64, 1)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--linen);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font:inherit;color:inherit}code{font-size:.92em}.app{display:flex;flex-direction:column;height:100%;padding:0 28px 28px}.app__header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 32px;padding:32px 8px 24px}.app__title{margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(2.1rem,4.2vw,3.4rem);font-variation-settings:"opsz" 96;line-height:.95;letter-spacing:-.02em}.app__summary{margin:10px 0 0;font-size:.95rem;color:var(--ink-soft)}.legend{display:flex;gap:22px;margin:0;padding:0 0 4px;list-style:none;font-size:.88rem;color:var(--ink-soft)}.legend li{display:flex;align-items:center;gap:8px}.notice{margin:0 8px 16px;padding:12px 16px;border-radius:14px;font-size:.92rem;line-height:1.4}.notice--error{background:#f8e3e1;color:#7e2620}.notice--warn{background:#f7ecd9;color:#6d4c14}.stage{flex:1;display:grid;place-items:center;border-radius:var(--radius-stage);background:var(--canvas);box-shadow:var(--shadow-float);color:var(--ink-soft);text-align:center;padding:24px}.stage--loading p{animation:breathe 1.8s ease-in-out infinite}.gate{min-height:100%;display:grid;place-items:center;padding:24px 16px}.gate__card{width:min(440px,100%);padding:44px 36px 40px;border-radius:var(--radius-stage);background:var(--canvas);box-shadow:inset 0 1px #fffc,var(--shadow-float);text-align:center;animation:rise-in .6s var(--ease-out) backwards}.gate__mark{display:block;margin:0 auto 22px;border-radius:16px;box-shadow:var(--shadow-rest)}.gate__title{margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(1.7rem,5vw,2.1rem);font-variation-settings:"opsz" 96;line-height:1.05;letter-spacing:-.02em}.gate__text{margin:14px auto 0;max-width:30ch;font-size:1rem;line-height:1.5;color:var(--ink-soft)}.tree{position:relative;flex:1;min-height:0}.tree__viewport{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;overflow:clip;border-radius:var(--radius-stage);background:var(--canvas);box-shadow:inset 0 1px #fffc,var(--shadow-float);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}.tree__viewport:active{cursor:grabbing}.tree__viewport:focus-visible{outline:3px solid var(--malbec);outline-offset:3px}.tree__canvas{position:absolute;top:0;left:0;transform-origin:0 0}.tree__canvas--glide{transition:transform .48s var(--ease-out)}.tree__lines{position:absolute;top:0;right:0;bottom:0;left:0;overflow:visible;animation:fade-in .7s ease .45s backwards}.bands rect{fill:var(--band)}.lines{transition:opacity .3s ease}.lines--dimmed{opacity:.3}.line{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.line--descent{stroke:var(--line);stroke-width:2.25}.line--partner{stroke:var(--line);stroke-width:2.75}.line--ended{stroke:var(--line-ended);stroke-width:2.75;stroke-dasharray:1 5.5}.line--highlight{stroke:var(--malbec);stroke-width:3}.line--highlight-ended{stroke-dasharray:1 7;animation:fade-in .4s ease backwards}.line--related{stroke:var(--apricot);stroke-width:3}.line--trace{stroke-dasharray:1 2;animation:trace .75s var(--ease-out) forwards}.line--related.line--trace{animation-delay:.12s;animation-fill-mode:both}.node{fill:var(--line);stroke:var(--canvas);stroke-width:3}.node--ended{fill:var(--line-ended)}.node--highlight{fill:var(--malbec);animation:pop .38s var(--ease-spring) .2s backwards}.node--related{fill:var(--apricot);animation:pop .38s var(--ease-spring) .3s backwards}.portrait{position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(150deg,var(--tone-a),var(--tone-b))}.portrait--rosewood{--tone-a: #c48289;--tone-b: #9d5c67}.portrait--clay{--tone-a: #d29a78;--tone-b: #aa6e53}.portrait--sage{--tone-a: #a3b198;--tone-b: #748570}.portrait--dusk{--tone-a: #9e8fb0;--tone-b: #6f6187}.portrait--sand{--tone-a: #d6b884;--tone-b: #a98a55}.portrait--lagoon{--tone-a: #86aaa7;--tone-b: #5a7f7d}.portrait__img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transform:scale(1.03);transition:opacity .5s ease,transform .7s var(--ease-out)}.portrait__img--loaded{opacity:1;transform:none}.portrait__initials{font-family:var(--font-display);font-weight:700;font-size:3rem;line-height:1;letter-spacing:-.01em;color:#fffdfbf0;text-shadow:0 1px 12px rgba(var(--shadow-tint),.12)}.person{position:absolute;margin:0;padding:8px 8px 0;display:flex;flex-direction:column;border:0;border-radius:var(--radius-card);background:var(--paper);text-align:center;cursor:pointer;--ring: 0 0 0 0 transparent;box-shadow:var(--ring),var(--shadow-rest);transition:transform .26s var(--ease-out),box-shadow .26s var(--ease-out),opacity .3s ease,background-color .3s ease;animation:card-in .7s var(--ease-out) backwards;animation-delay:calc(var(--gen, 0) * 80ms)}.person:hover{transform:translateY(-3px);box-shadow:var(--ring),var(--shadow-lift)}.person:active{transform:translateY(-1px) scale(.985);transition-duration:.12s}.person:focus-visible{outline:3px solid var(--malbec);outline-offset:5px}.person__photo{flex:none;width:100%;aspect-ratio:1;border-radius:var(--radius-photo);transition:filter .3s ease}.person__photo:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(var(--shadow-tint),.07);pointer-events:none}.person:hover .portrait__img--loaded{transform:scale(1.03)}.person__name{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-top:8px solid transparent;border-bottom:10px solid transparent}.person__name-text{font-weight:600;font-size:.92rem;line-height:1.22;letter-spacing:-.005em;text-align:center;text-wrap:balance;overflow-wrap:break-word}.person--lineage{--ring: 0 0 0 2.5px var(--malbec)}.person--related{--ring: 0 0 0 2.5px var(--apricot)}.person--selected{--ring: 0 0 0 3px var(--paper), 0 0 0 6px var(--malbec);background:var(--malbec-wash);transform:translateY(-4px) scale(1.04);box-shadow:var(--ring),var(--shadow-lift);z-index:1}.person--selected:hover{transform:translateY(-5px) scale(1.04)}.person--selected .person__name-text{color:var(--malbec-deep)}.person--dimmed{opacity:.42}.person--dimmed .person__photo{filter:grayscale(.75)}.person--dimmed:hover{opacity:.75}.person--dimmed:hover .person__photo{filter:none}.glass{background:#fffdfbd6;-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border:1px solid rgba(255,255,255,.75);box-shadow:var(--shadow-float)}.tree__status{position:absolute;left:18px;bottom:18px;max-width:calc(100% - 290px);border-radius:22px}.status{display:flex;align-items:center;gap:14px;min-height:56px;padding:8px 10px 8px 12px;animation:rise-in .32s var(--ease-out)}.status--hint{padding:8px 20px;font-size:.92rem;color:var(--ink-soft)}.status__portrait{flex:none;width:40px;height:40px;border-radius:12px}.status__portrait .portrait__initials{font-size:1.05rem}.status__text{display:flex;flex-direction:column;min-width:0;gap:1px}.status__label{font-size:.76rem;color:var(--ink-soft)}.status__name{font-family:var(--font-display);font-weight:700;font-size:1.1rem;line-height:1.2;letter-spacing:-.015em}.status__key{flex:none;display:flex;gap:14px;padding:0 4px;font-size:.8rem;color:var(--ink-soft);white-space:nowrap}.status__key span{display:flex;align-items:center;gap:6px}.key{display:inline-block;width:18px;height:3px;border-radius:2px}.key--line{background:var(--malbec)}.key--related{background:var(--apricot)}.status__actions{flex:none;display:flex;gap:6px;margin-left:auto}.btn{height:38px;padding:0 16px;border:0;border-radius:13px;font-weight:600;font-size:.86rem;cursor:pointer;transition:background-color .18s ease,transform .18s var(--ease-out),box-shadow .18s ease}.btn:active{transform:scale(.96)}.btn:focus-visible{outline:3px solid var(--malbec);outline-offset:2px}.btn--ghost{background:rgba(var(--shadow-tint),.06);color:var(--ink)}.btn--ghost:hover{background:rgba(var(--shadow-tint),.1)}.btn--accent{background:var(--malbec);color:#fff;box-shadow:0 6px 14px -8px var(--malbec)}.btn--accent:hover{background:var(--malbec-deep)}.tree__controls{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:2px;padding:5px;border-radius:20px}.control{min-width:44px;height:44px;padding:0;border:0;border-radius:15px;background:transparent;font-size:1.2rem;font-weight:500;cursor:pointer;transition:background-color .18s ease,transform .18s var(--ease-out)}.control:hover{background:rgba(var(--shadow-tint),.07)}.control:active{transform:scale(.94)}.control:focus-visible{outline:3px solid var(--malbec);outline-offset:1px}.control--text{padding:0 14px;font-size:.9rem;font-weight:600}.control__level{min-width:46px;font-size:.8rem;font-variant-numeric:tabular-nums;text-align:center;color:var(--ink-soft)}.control__divider{width:1px;height:22px;margin:0 4px;background:rgba(var(--shadow-tint),.12)}@keyframes card-in{0%{opacity:0;transform:translateY(14px) scale(.97)}}@keyframes fade-in{0%{opacity:0}}@keyframes rise-in{0%{opacity:0;transform:translateY(6px)}}@keyframes trace{0%{stroke-dashoffset:1;opacity:0}12%{opacity:1}to{stroke-dashoffset:0;opacity:1}}@keyframes pop{0%{transform:scale(0)}}@keyframes breathe{50%{opacity:.45}}.node{transform-box:fill-box;transform-origin:center}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}@media (max-width: 1100px){.status__key{display:none}}@media (max-width: 640px){.app{padding:0 12px 12px}.app__header{padding:20px 6px 16px;align-items:flex-start;flex-direction:column}.app__summary{margin-top:6px;font-size:.88rem}.legend{gap:16px;font-size:.82rem}.tree__viewport{border-radius:24px}.tree__status{left:10px;right:10px;bottom:76px;max-width:none}.status{gap:10px}.status__name{font-size:1rem}.btn{padding:0 12px}.tree__controls{right:10px;bottom:10px}}