:root {
    --heritage-burgundy-deep: #2a0710;
    --heritage-burgundy: #4a0d1a;
    --heritage-burgundy-soft: #671426;
    --heritage-gold: #e1c173;
    --heritage-gold-light: #f2dfa1;
    --heritage-parchment-line: #c6b8a8;
}

.tree-stage {
    isolation: isolate;
    background:
        radial-gradient(ellipse at 50% 2%, rgba(145, 42, 61, 0.34) 0%, rgba(101, 21, 37, 0.18) 32%, transparent 64%),
        radial-gradient(ellipse at 18% 78%, rgba(116, 24, 42, 0.20) 0%, transparent 42%),
        radial-gradient(ellipse at 82% 72%, rgba(20, 3, 8, 0.24) 0%, transparent 46%),
        repeating-linear-gradient(94deg, rgba(255, 244, 235, 0.010) 0 1px, rgba(12, 0, 4, 0.012) 1px 3px),
        linear-gradient(145deg, #5b1021 0%, var(--heritage-burgundy) 42%, #390914 72%, var(--heritage-burgundy-deep) 100%);
    box-shadow:
        inset 0 24px 64px rgba(18, 1, 7, 0.18),
        inset 0 -34px 90px rgba(10, 0, 4, 0.22);
}

.tree-stage::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.42;
    background:
        radial-gradient(circle at 30% 18%, rgba(255, 236, 224, 0.025), transparent 24%),
        radial-gradient(circle at 72% 58%, rgba(255, 236, 224, 0.018), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,0.018), rgba(0,0,0,0.025));
    mix-blend-mode: soft-light;
}

.family-tree {
    position: relative;
    z-index: 1;
}

.tree-stage .stage-toolbar,
.tree-stage .legend,
.tree-stage .tree-empty {
    z-index: 2;
}

/* A bordó háttéren a nem kiemelt kapcsolatok is maradjanak finoman olvashatók,
   de ne versenyezzenek az arany vérvonallal. */
.tree-stage .edge {
    stroke: #b6a99d;
    opacity: 0.82;
}

.tree-stage .edge.parent-biological,
.tree-stage .edge.parent-unknown {
    stroke: #c7bcaf;
}

.tree-stage .edge.parent-step,
.tree-stage .edge.parent-foster,
.tree-stage .edge.parent-adoptive,
.tree-stage .edge.parent-guardian {
    stroke: #a79282;
}

.tree-stage .edge.partner {
    stroke: #bd8d89;
}

.tree-stage .edge.sibling {
    stroke: #9daab2;
}

.tree-stage .edge.bloodline-gold {
    stroke: var(--heritage-gold) !important;
    stroke-width: 3.15 !important;
    opacity: 1 !important;
    filter:
        drop-shadow(0 0 1.5px rgba(255, 239, 188, 0.62))
        drop-shadow(0 0 4px rgba(226, 187, 95, 0.22));
}

.tree-stage .edge.bloodline-gold.uncertain {
    opacity: 0.76 !important;
}

.tree-stage .edge-label rect {
    fill: rgba(251, 247, 239, 0.96);
    stroke: rgba(190, 173, 151, 0.86);
}

.tree-stage .edge-label text {
    fill: #665b50;
}

.tree-stage .node-card {
    fill: #fffaf1;
    stroke: #a9937a;
    filter: drop-shadow(0 5px 9px rgba(18, 2, 7, 0.28));
}

.tree-stage .node.side-node .node-card {
    fill: #f8f0e4;
}

.tree-stage .node.focus .node-card {
    fill: #f1dfc3;
    stroke: #8a6c3d;
}

.tree-stage .branch-toggle circle {
    fill: #fff9ef;
    stroke: #a58d70;
}

.tree-stage .view-switch,
.tree-stage .depth-control,
.tree-stage .zoom-controls,
.tree-stage .legend,
.tree-stage .tree-empty {
    border-color: rgba(190, 173, 151, 0.82);
    background: rgba(250, 245, 235, 0.94);
    box-shadow: 0 7px 24px rgba(19, 2, 8, 0.18);
}

.tree-stage .legend-line.bloodline {
    border-color: var(--heritage-gold);
    box-shadow: 0 -1px 5px rgba(242, 223, 161, 0.48);
}