/* ============================================================
   loopglyph — arcade retint. GENERATED by tools/gen-skins.py; edit that,
   or add hand-written rules to the bottom of this file below the marker.

   The game declares its surfaces as --lo-<role> tokens. This maps the
   roles the arcade layer knows about onto --nx-* values, once per theme, so
   the board picks up the lit palette without any of the game's own layout,
   sizing or logic changing. Roles that are not in the vocabulary keep the
   game's value: the skin follows the player's theme now, so an unmapped
   token is still correct for the page it is on.
   ============================================================ */

:root body.gv-neon{
  --lg-cell-bg: rgba(16,26,48,.82);
  --lg-cell-br: rgba(120,200,255,.30);
  --lg-sat-bg: color-mix(in srgb, var(--nx-lime) 18%, transparent);
  --lg-sat-br: color-mix(in srgb, var(--nx-lime) 62%, transparent);
  --lg-bad-bg: color-mix(in srgb, var(--nx-red) 18%, transparent);
  --lg-bad-br: color-mix(in srgb, var(--nx-red) 58%, transparent);
  --lg-line: var(--nx-accent);
  --lg-dot: var(--nx-dim);
  --lg-shadow: 0 14px 34px var(--nx-drop);
}

:root[data-theme="light"] body.gv-neon{
  --lg-cell-bg: rgba(255,255,255,.94);
  --lg-cell-br: rgba(18,38,72,.20);
  --lg-sat-bg: color-mix(in srgb, var(--nx-lime) 16%, transparent);
  --lg-sat-br: color-mix(in srgb, var(--nx-lime) 62%, transparent);
  --lg-bad-bg: color-mix(in srgb, var(--nx-red) 16%, transparent);
  --lg-bad-br: color-mix(in srgb, var(--nx-red) 58%, transparent);
  --lg-line: var(--nx-accent);
  --lg-dot: var(--nx-dim);
  --lg-shadow: 0 12px 26px var(--nx-drop);
}

/* ---- hand-written below this line (not regenerated) ---- */


/* The loop IS the game, so the drawn edge is the one thing that should glow.
   Everything else — vertices, blanks, crosses — stays quiet around it. */
:root body.gv-neon .lgEdge.on{
  background: var(--nx-accent);
  box-shadow:
    0 0 10px color-mix(in srgb, var(--nx-accent) calc(85% * var(--nx-glow)), transparent),
    0 0 22px color-mix(in srgb, var(--nx-accent) calc(45% * var(--nx-glow)), transparent);
  border-radius: 2px;
}
:root body.gv-neon .lgEdge.x{ background: color-mix(in srgb, var(--nx-red) 55%, transparent); }
/* Satisfied and conflicting cells are RINGED, not washed.
   A blurred inset glow peaks at the centre of the box — which on a small
   numbered cell is exactly where the digit sits, so the number it is meant to
   celebrate became the hardest one on the board to read. The state now reads
   as a rim plus an outer halo, and the digit is given its own solid colour and
   full opacity so no fill can dim it. */
:root body.gv-neon .lgCell.sat{
  color: var(--nx-ink);
  opacity: 1;
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb, var(--nx-lime) 60%, transparent),
    0 0 16px color-mix(in srgb, var(--nx-lime) calc(45% * var(--nx-glow)), transparent);
}
:root body.gv-neon .lgCell.bad{
  color: var(--nx-ink);
  opacity: 1;
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb, var(--nx-red) 60%, transparent),
    0 0 14px color-mix(in srgb, var(--nx-red) calc(38% * var(--nx-glow)), transparent);
}
:root body.gv-neon .lgCell.bad.flash{ animation: lgBad .4s ease; }
@keyframes lgBad{ 0%,100%{filter:none} 45%{filter:brightness(1.6) saturate(1.4)} }