/* Colour for the SVG symbol canon (`js/astro-glyphs-d3.js`).
 *
 * The module draws geometry and names classes; every colour lives here, as a
 * token. That split is what lets one glyph follow the palette instead of
 * carrying a hex the palette cannot reach.
 *
 * THE MECHANISM: each glyph root sets `color` from a token, and every shape
 * inside paints with `currentColor`. So a surface can retint a whole glyph —
 * or a whole composition — with one declaration, and a nested symbol inherits
 * it without the module knowing anything about the palette.
 *
 * Consumes `brand-tokens.css`; declares no core token of its own. */

.ag {
  display: block;
  color: var(--gold);
}

/* Relations sit in a row of text-height content, so they align to it. */
.ag-relation { display: inline-block; vertical-align: middle; }

/* ── The two primitives every shape is built from ─────────────────── */
.ag-stroke {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ag-solid { fill: currentColor; stroke: none; }

/* Unicode points (☉ ☽ ☿ ♀) — the characters `astro-symbols.js` already holds.
   `font-variant-emoji: text` keeps the system from serving them as colour
   emoji, which would drag in someone else's palette. */
.ag-char {
  fill: currentColor;
  stroke: none;
  font-family: var(--f-display);
  font-variant-emoji: text;
}

/* The chart angles are two letters, not a glyph — they read as a label, so
   they are lettered like one. */
.ag-point_asc .ag-char,
.ag-point_mc .ag-char,
.ag-point_dsc .ag-char,
.ag-point_ic .ag-char {
  font-family: var(--f-mono);
  letter-spacing: -0.04em;
}

/* ── Lunar phase ──────────────────────────────────────────────────
   The unlit disc is drawn on every phase — a new moon is a ring, not a gap in
   the row — so the outline carries the shape and the fill carries the light. */
.ag-phase .ag-disc {
  fill: var(--bg-2);
  stroke: currentColor;
  stroke-width: 1.2;
}

.ag-phase .ag-lit { fill: currentColor; stroke: none; }

/* ── Station ──────────────────────────────────────────────────────
   One shape, mirrored: retrograde points back, direct points forward. Colour
   does NOT distinguish them — direction does. Tinting retrograde as a warning
   would be the product making a claim the astronomy does not make.

   Heavier stroke than the rest of the canon on purpose: this mark lives at
   7–12px beside a planet, and it is the one symbol whose whole information
   content is a direction. A direction that does not read is nothing. */
.ag-station .ag-stroke { stroke-width: 2.3; }

/* ── Signs ────────────────────────────────────────────────────────
   The replacement for the Unicode zodiac, which the design system forbids. */
.ag-sign .ag-stroke { stroke-width: 1.8; }

/* ── Aspects ──────────────────────────────────────────────────────
   Lighter than the signs: an aspect mark usually sits between two glyphs and
   should not outweigh the bodies it relates. */
.ag-aspect .ag-stroke { stroke-width: 1.7; }

/* ── Relations (level 2) ──────────────────────────────────────────
   Three qualities, three separate visual axes, so none of them competes:
   tone → colour, strength → weight, phase → direction. */

/* Tone. The canonical polarity pair of the palette — the same two colours the
   synastry grid has read harmony and tension in since REQ-335. A third value
   for `neutral` would be a new colour; gold is the surface's own voice, which
   is exactly what "neither" should look like. */
.ag-tone--gift { color: var(--harmony); }
.ag-tone--tension { color: var(--tension); }
.ag-tone--neutral { color: var(--gold-2); }

/* Strength. The link is the only thing that carries it, so the glyphs stay
   identical whether the contact is strong or mild — the bodies do not change,
   the bond does. */
.ag-link { stroke: currentColor; fill: none; }
.ag-link--strong { stroke-width: 2; opacity: 0.75; }
.ag-link--moderate { stroke-width: 1.3; opacity: 0.55; }
.ag-link--mild { stroke-width: 0.8; opacity: 0.38; }

/* Phase. `exact` is a ring around the mark rather than an arrow: at a perfect
   orb there is no direction left to point in.

   The ring ALONE was not enough — beside `stable` (which draws nothing) the two
   read as the same row at a glance, and `exact` is the loudest thing the
   astronomy has to say. So the mark itself also thickens. Weight, not a second
   colour: colour is already spoken for by tone. */
.ag-exact-ring {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.3;
  opacity: 0.8;
}

.ag-rel--exact .ag-aspect .ag-stroke { stroke-width: 2.8; }

/* Which side is the transit. A footnote under the moving body — dimmer than
   everything above it, because it answers a question the reader only asks
   second ("which one is moving?"), never first. What carries no mark is the
   natal chart, and a chart does not move. */
.ag-moving-bar {
  stroke: currentColor;
  stroke-width: 1.4;
  stroke-linecap: round;
  opacity: 0.45;
}

.ag-moving .ag-stroke { stroke-width: 2.6; opacity: 0.6; }

/* ── Degraded ─────────────────────────────────────────────────────
   Below a symbol's `minSize` the identity drops and the presence stays. The
   reader never gets a hole where a symbol was — that is the whole point of
   degrading instead of throwing. */
.ag--degraded .ag-dot { fill: currentColor; opacity: 0.8; }

/* ── Surface scopes ───────────────────────────────────────────────
   On the natal wheel a glyph annotates a planet at speck size, so the canon is
   dimmed to stay a footnote rather than compete with what it marks. */
.nw-svg .ag { color: var(--gold-dim); }