/* Data center, part C (Token Unlocks, Exchange Flows, Network Activity): the chart parts drawn from live data by
   inc/live/data-c.php and assets/js/live/data-c.js, in the design's colours (dark first, then light). */
main { --dc-in: #FF453A; --dc-out: #30D158; --dc-btc: #2997FF; --dc-eth: #BF8CFF; --dc-fill: .28; }
html[data-theme=light] main { --dc-in: #D70015; --dc-out: #248A3D; --dc-btc: #0071E3; --dc-eth: #7B3FE4; --dc-fill: .16; }

/* netflow bars: coins sent to exchanges red, withdrawn green */
main .wcdc-bar { position: absolute; transform: translateX(-50%); border-radius: 2px; background: var(--dc-out); }
main .wcdc-bar[data-f="in"] { background: var(--dc-in); }

/* balance line */
main .wcdc-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; --dc-c: var(--dc-btc); }
main .wcdc-svg[data-c="eth"] { --dc-c: var(--dc-eth); }
main .wcdc-svg stop { stop-color: var(--dc-c); stop-opacity: 0; }
main .wcdc-svg stop:first-child { stop-opacity: var(--dc-fill); }
main .wcdc-svg .wcdc-l { fill: none; stroke: var(--dc-c); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }

/* the value under the pointer */
main .wcdc-v { position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, .24); pointer-events: none; }
main .wcdc-d { position: absolute; z-index: 2; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: var(--dc-eth); box-shadow: 0 0 0 4px rgba(255, 255, 255, .14); pointer-events: none; }
main .wcdc-d[data-c="btc"] { background: var(--dc-btc); }
main .wcdc-tip { position: absolute; z-index: 3; top: 4px; min-width: 176px; display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 12px; background: #F5F5F7; color: #1D1D1F; box-shadow: 0 12px 32px rgba(0, 0, 0, .45); pointer-events: none; }
main .wcdc-tip b { font-size: 12px; font-weight: 600; color: #6E6E73; white-space: nowrap; }
main .wcdc-tip span { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; font-size: 13px; white-space: nowrap; }
main .wcdc-tip i { font-style: normal; color: #6E6E73; }
main .wcdc-tip em { font-style: normal; font-weight: 700; font-variant-numeric: tabular-nums; color: #1D1D1F; }
main .wcdc-tip em[data-f="in"] { color: #D70015; }
main .wcdc-tip em[data-f="out"] { color: #248A3D; }
html[data-theme=light] main .wcdc-v { background: rgba(0, 0, 0, .24); }
html[data-theme=light] main .wcdc-d { box-shadow: 0 0 0 4px rgba(0, 0, 0, .14); }
html[data-theme=light] main .wcdc-tip { background: #1D1D1F; color: #FFFFFF; box-shadow: 0 12px 32px rgba(0, 0, 0, .1); }
html[data-theme=light] main .wcdc-tip b, html[data-theme=light] main .wcdc-tip i { color: #86868B; }
html[data-theme=light] main .wcdc-tip em { color: #FFFFFF; }
html[data-theme=light] main .wcdc-tip em[data-f="in"] { color: #FF453A; }
html[data-theme=light] main .wcdc-tip em[data-f="out"] { color: #30D158; }

/* a summary figure in the plain text colour (the design colours some cells by default) */
html main [data-wc-ch][data-wc-ch="n"] { color: var(--tZYQMwj); }