.graph-screen{background:#fff;grid-template-rows:auto minmax(0,1fr);height:100dvh;display:grid;overflow:hidden}.graph-screen>.site-header{z-index:20;position:relative}.graph-page{width:100%;min-width:0;min-height:0;margin:0;position:relative}#graph-area,#container{width:100%;height:100%;position:absolute;inset:0}.graph-description{z-index:5;overscroll-behavior:contain;background:#ffffffed;border:1px solid #dbe2ea;border-radius:16px;width:min(340px,100% - 40px);max-height:calc(100% - 40px);position:absolute;top:20px;right:20px;overflow-y:auto;box-shadow:0 6px 24px #17203314}.graph-description summary{cursor:pointer;justify-content:space-between;align-items:center;gap:12px;padding:18px 20px;list-style:none;display:flex}.graph-description summary::-webkit-details-marker{display:none}.graph-description summary:after{content:"+";color:#0369a1;font-size:20px}.graph-description details[open] summary:after{content:"−"}.graph-description summary:focus-visible{outline-offset:-4px;border-radius:12px;outline:2px solid #069af0}.graph-description h1{letter-spacing:-.3px;font-size:17px;line-height:1.4}.graph-description-content{padding:0 20px 20px}.graph-description-content>p{color:#526176;margin:0;font-size:13px;line-height:1.6}.graph-description-content #graph-instructions{color:#64748b;margin-top:12px;font-size:12px}.graph-legend{color:#64748b;border-top:1px solid #e2e8f0;flex-wrap:wrap;gap:8px 14px;margin:16px 0 0;padding:14px 0 0;font-size:11px;list-style:none;display:flex}.graph-legend li{align-items:center;gap:6px;display:inline-flex}.legend-dot{border-radius:50%;width:8px;height:8px}.selected-dot{background:#f97316}.children-dot{background:#c407aa}.parents-dot{background:#5806f0}@media (width<=600px){.graph-description{width:min(300px,100% - 24px);max-height:calc(100% - 24px);top:12px;right:12px}}#node-popup{z-index:10;box-sizing:border-box;overscroll-behavior:contain;color:#172033;background:#fff;border:1px solid #dbe2ea;border-radius:12px;width:min(320px,100% - 24px);max-height:min(440px,100% - 24px);padding:20px;font:14px/1.5 system-ui,sans-serif;position:absolute;overflow:auto;box-shadow:0 8px 28px #17203326}#node-popup-close{color:#334155;cursor:pointer;background:#f1f5f9;border:0;border-radius:6px;width:32px;height:32px;font-size:22px;position:absolute;top:8px;right:8px}#node-popup h2{overflow-wrap:anywhere;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;margin:0 24px 16px 0;font-size:17px}#node-popup h2.is-dragging{cursor:grabbing}.node-details{grid-template-columns:auto 1fr;gap:4px 16px;display:grid}.node-details dt,.popup-note{color:#64748b}.node-details dd{overflow-wrap:anywhere;margin:0}.popup-tabs{gap:8px;margin:18px 0 8px;display:flex}.popup-tabs button{color:#475569;font:inherit;cursor:pointer;background:#f8fafc;border:1px solid #dbe2ea;border-radius:6px;flex:1;padding:8px}.popup-tabs button[aria-pressed=true]{color:#075985;background:#e0f2fe;border-color:#069af0;font-weight:600}.popup-tabs button:focus-visible{outline-offset:2px;outline:2px solid #069af0}.popup-note{margin:0 0 12px;font-size:12px}#node-popup-connections{margin:0;padding-left:22px}#node-popup-connections li{border-bottom:1px solid #eef2f6;padding:6px 0}.child-details{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.child-name{overflow-wrap:anywhere;min-width:0}.child-size{color:#64748b;font-variant-numeric:tabular-nums;flex-shrink:0}