/* The network background of theme v2 (SITE-THEME-V2 2026-11-06), shared by the site and the app's sign-in screens; the canvas is drawn by
   shared/js/network-bg.js. Contract:
   - `.net-bg`: the fixed canvas the script puts first in <body>, behind every page's content (z-index -1 in the root stacking context),
     never catching the pointer. A page that shows it keeps its ground on <html> and its <body> transparent, so the canvas sits between the
     ground and the content; cards and panels keep their own surface.
   - `.net-hero` with `.net-glow` and `.net-grid`: the two still layers of a page's first screen, placed by the page inside a positioned,
     isolated box: one soft mint glow at the top centre and a faint 64 px grid that shows only around the centre. Both fade out downward.
   - Colours are mixed from the theme's tokens (theme-a.css), so light and dark follow by themselves: in light the grid is dark ink at
     low alpha and the glow stays subtle. Nothing here moves; printing shows none of it. */
.net-bg { position: fixed; inset: 0; z-index: -1; display: block; width: 100%; height: 100%; pointer-events: none; }
.net-hero { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, #000 50%, transparent 92%); mask-image: linear-gradient(to bottom, #000 50%, transparent 92%); }
.net-glow { position: absolute; left: 50%; top: -60px; width: min(900px, 120vw); height: 600px; transform: translateX(-50%);
  background: radial-gradient(closest-side, color-mix(in srgb, var(--primary) 18%, transparent), transparent); }
.net-grid { position: absolute; inset: 0; background-position: center top; background-size: 64px 64px;
  background-image: linear-gradient(to right, color-mix(in srgb, var(--foreground) 6%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in srgb, var(--foreground) 6%, transparent) 1px, transparent 1px);
  -webkit-mask-image: radial-gradient(ellipse 55% 48% at 50% 32%, #000 25%, transparent 78%); mask-image: radial-gradient(ellipse 55% 48% at 50% 32%, #000 25%, transparent 78%); }
@media print { .net-bg, .net-hero { display: none !important; } }