:where(gik25-relation-graph, gik25-timeline, gik25-geo-map, gik25-entity-navigator)
[data-widget-selection-state="active"] {
    --gik25-widget-selection-shadow: 0 0 0 3px color-mix(in srgb, var(--gik25-widget-accent) 22%, transparent);
}

.gik25-relation-graph__node[data-widget-selection-state="active"] circle {
    fill: color-mix(in srgb, var(--gik25-widget-accent) 18%, var(--gik25-widget-surface));
    stroke-width: 5;
}

.gik25-relation-graph__node[data-widget-selection-state="active"] text {
    font-weight: 800;
}

.gik25-timeline__button[data-widget-selection-state="active"],
.gik25-geo-map__list-button[data-widget-selection-state="active"],
.gik25-entity-navigator__card[data-widget-selection-state="active"] {
    border-color: var(--gik25-widget-accent);
    box-shadow: var(--gik25-widget-selection-shadow);
}

.gik25-timeline__button[data-widget-selection-state="active"],
.gik25-geo-map__list-button[data-widget-selection-state="active"] {
    background: color-mix(in srgb, var(--gik25-widget-accent) 7%, var(--gik25-widget-surface));
}

.gik25-timeline__button[data-widget-selection-state="active"] .gik25-timeline__title,
.gik25-entity-navigator__card[data-widget-selection-state="active"] .gik25-entity-navigator__card-title {
    color: var(--gik25-widget-accent);
}

.gik25-geo-map__point[data-widget-selection-state="active"] circle {
    fill: var(--gik25-widget-surface);
    stroke: var(--gik25-widget-accent);
    stroke-width: 5;
    filter: drop-shadow(0 0 4px color-mix(in srgb, var(--gik25-widget-accent) 45%, transparent));
}