/* A quiet appreciation control, next to the view's existing share actions. */
body .graph-sharing button.network-reaction{
 --reaction-heart:#f2a9c8;
 flex:0 0 auto;gap:8px;min-width:0;min-height:44px;
 padding:9px 11px;color:var(--ui-text,#edf3fa);
 border-color:var(--ui-border,#405467);
 background:linear-gradient(120deg,color-mix(in srgb,var(--surface-a,#775cce) 12%,#111a25),#101923);
 transition:background .18s,border-color .18s,color .18s;
}
body .graph-sharing button.network-reaction:hover{
 color:var(--ui-text,#edf3fa);border-color:color-mix(in srgb,var(--reaction-heart) 65%,var(--ui-border,#405467));
 background:color-mix(in srgb,var(--surface-a,#775cce) 18%,#111a25);
}
body .graph-sharing button.network-reaction svg{
 width:17px;height:17px;stroke:var(--reaction-heart);stroke-width:1.65;fill:transparent;
 transition:fill .18s,transform .18s;flex-shrink:0;
}
body .graph-sharing button.network-reaction[aria-pressed=true]{
 border-color:color-mix(in srgb,var(--reaction-heart) 48%,#3b2945);
 background:linear-gradient(115deg,color-mix(in srgb,var(--surface-a,#775cce) 20%,#151524),color-mix(in srgb,var(--reaction-heart) 10%,#171522));
}
body .graph-sharing button.network-reaction[aria-pressed=true] svg{fill:var(--reaction-heart)}
body .graph-sharing button.network-reaction:focus-visible{outline:2px solid var(--ui-focus,#a9d6f1);outline-offset:3px}
body .graph-sharing button.network-reaction:disabled{opacity:.65;cursor:wait}
.network-reaction-count{
 display:inline-flex;align-items:center;justify-content:center;min-width:22px;min-height:22px;padding:2px 6px;
 border-radius:6px;color:var(--ui-text,#edf3fa);background:color-mix(in srgb,var(--surface-b,#58b9e1) 10%,#111b28);
 font-size:10px;line-height:1.4;font-variant-numeric:tabular-nums;white-space:nowrap;
}
.network-reaction-status{font:10px/1.6 var(--font,sans-serif);color:var(--ui-muted,#a6b6c7);margin:7px 0 0;max-width:520px}
.network-reaction-status:empty{display:none}
.network-reaction-status.is-error{color:#edb5bd}
@media(max-width:550px){
 body .graph-sharing button.network-reaction{padding-inline:10px;gap:7px}
 .network-reaction-count{min-width:23px}
}
@media(prefers-reduced-motion:reduce){body .graph-sharing button.network-reaction,body .graph-sharing button.network-reaction svg{transition:none}}
@media(forced-colors:active){
 body .graph-sharing button.network-reaction{border:1px solid ButtonText;background:ButtonFace;color:ButtonText}
 body .graph-sharing button.network-reaction svg{stroke:ButtonText}
 body .graph-sharing button.network-reaction[aria-pressed=true] svg{fill:Highlight;stroke:Highlight}
 .network-reaction-count{border:1px solid ButtonText;background:ButtonFace;color:ButtonText}
}