/* AXI-x Cast v0.1 — the score for the hexagram and the almanac (AXI-023).
   The script (cast.js, in the repository, not on the page) writes the record;
   the build writes the lines as blocks with --r only. Everything else — the
   span of a yang line, the gap in a yin line, which line is lit — is here.
   Laws:
     1 · a hexagram is a stage of six rows at the page's row, one line a row;
         the first cast is the bottom row and the first in the DOM (the I Ching
         reads upward; the DOM reads in the order the days came)
     2 · a yang line is one block the full base width; a yin line is two blocks
         either side of the centre base column — 4 of 7, 3 of 5, 2 of 3 — so the
         gap is a column of the page's own grid, not a drawn stroke
     3 · a young line is white; a moving line is navy; nothing else is lit
     4 · the newest line, if it moves, is the one signal; a hexagram at rest
         carries none (no signal at rest, AXI-015/020)
     5 · the label is the line's date and number, mono, inside the block */
.hx{margin-top:14px}
.hx .eyebrow{font-family:var(--snx-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--snx-ai-deep);font-weight:600;margin-bottom:10px;font-variant-numeric:tabular-nums}
.hx-stage{grid-template-rows:repeat(6,var(--snx-row))}
.hx-l{--rs:1;--bg:var(--snx-white)}
.hx-l .snx-pad{padding:0 12px;height:100%;display:flex;align-items:center}
.hx-l p{font-family:var(--snx-mono);font-size:11px;letter-spacing:.06em;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--snx-ink-60)}
.hx-moving{--bg:var(--snx-navy)}
.hx-moving p{color:var(--snx-chalk)}
.hx-lit{--bg:var(--snx-signal)}
.hx-lit p{color:var(--snx-ink);font-weight:600}
/* law 2: spans per edition */
.hx-yang{--c:1;--s:7}
.hx-yin.hx-left{--c:1;--s:3}
.hx-yin.hx-right{--c:5;--s:3}
@media (max-width:1023px){
  .hx-yang{--s:5}
  .hx-yin.hx-left{--s:2}
  .hx-yin.hx-right{--c:4;--s:2}
}
@media (max-width:639px){
  .hx-yang{--s:3}
  .hx-yin.hx-left{--s:1}
  .hx-yin.hx-right{--c:3;--s:1}
  .hx-l p{font-size:9.5px;letter-spacing:.04em}
  .hx-l .snx-pad{padding:0 8px}
  .hx-yin .k{display:none}   /* a half-block at 3×2 is ~108px: the date and the number fit, the kind does not */
}
/* the tables: coins and the almanac */
.ct{border-collapse:collapse;width:100%;font-size:14px}
.ct th{font-family:var(--snx-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-align:left;padding:12px 16px 8px;border-bottom:2px solid var(--snx-ink);color:var(--snx-ink-60);font-weight:600}
.ct td{padding:10px 16px;border-bottom:1px solid var(--snx-ink-18);vertical-align:top;font-variant-numeric:tabular-nums}
.ct tr:last-child td{border-bottom:0}
.ct td:first-child{font-weight:600;color:var(--snx-ai-deep)}
.ct td i{display:block;font-style:normal;font-family:var(--snx-mono);font-size:10px;letter-spacing:.04em;color:var(--snx-ink-40);margin-top:3px}
.ct tr.fallen td,.ct td.fallen{color:var(--snx-work)}
.ct .g{font-family:var(--snx-mono);letter-spacing:-.04em;color:var(--snx-ink-60);margin-left:6px}
.alm td{font-family:var(--snx-mono);font-size:12.5px}
.alm td:first-child{white-space:nowrap}
.cast-line{font-size:var(--snx-s3);margin-top:14px;font-variant-numeric:tabular-nums}
.cast-line b{font-family:var(--snx-mono);font-weight:700;color:var(--snx-ai-deep)}
.cast-line .g{font-family:var(--snx-mono);letter-spacing:-.04em;color:var(--snx-ink-60)}
.cast-line em{display:block;font-style:normal;font-size:15px;color:var(--snx-ink-60);margin-top:6px}