/*
 * Network Graphics System - Cube component styles.
 *
 * Like DNA Helix, this component's SVG content is entirely generated and
 * mutated at runtime by components/cube.js - there is no hand-authored
 * markup to colocate a template with. This file therefore owns paint only:
 * colour and line weight (from variables.css). Position, radius AND
 * resting opacity are all written directly to SVG attributes every frame
 * by cube.js (continuous rotation means depth - and therefore brightness -
 * changes every frame, the same reason DNA Helix's points/lines don't get
 * a static CSS opacity either). Brightness during a discharge is layered
 * on top via the Web Animations API, which - being a real animation effect
 * - takes priority over the plain `opacity` attribute cube.js keeps
 * refreshing underneath it, then the continuously-updated attribute shows
 * through again the instant the pulse ends (same composition DNA Helix's
 * pulses already rely on).
 */

.network-cube {
  display: block;
  width: 100%;
  height: 100%;
}

.cube-vertex {
  fill: rgba(var(--network-point-rgb), 1);
}

/* Decorative density across the cube's 6 faces, echoing Sphere's point
   cloud - dimmer/smaller than .cube-vertex via the radius/opacity cube.js
   writes per frame (JS-side ranges), never via a different colour token. */
.cube-face-point {
  fill: rgba(var(--network-point-rgb), 1);
}

.cube-edge {
  fill: none;
  stroke: rgba(var(--network-line-rgb), 1);
  stroke-width: var(--network-line-width);
  stroke-linecap: round;
}