/* assets/dcr-ruler.css · The Desert Camel Report: the dual Gregorian/Hijri ruler, one component for the cover
   (index.html, under the lead spread) and Signals (signals.html, under the four multiples). The markup is built once,
   by .research/reset/r4/pages/dashboard.py ruler(d); Signals imports it. Owned by the index lane. */

/* the dual Gregorian/Hijri ruler: one grid column per day of the counted weeks, inside the plot's 4px insets, so each
   month sits under the columns it holds. Gregorian above (ink), Hijri beneath (muted), the calendar markers as numbered
   nodes listed under it with their sources. The Hijri row slides 11 days into register when the figure comes into view
   (.is-on from the script); static with reduced motion or the script off. */
.cv-ruler{ display:grid; gap:4px; padding-inline:var(--pad, 4px); margin-block-start:-4px; }
.cv-ruler__k{ margin:0 0 2px; color:var(--ink-muted); }
.cv-ruler__row{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(var(--days, 105), minmax(0, 1fr)); }
.cv-ruler__m{ min-inline-size:0; padding:4px 6px 0; border-inline-start:1px solid var(--silver, #D1D1D9);
  font:500 var(--fs-micro, 11px)/1.25 var(--font-mono); letter-spacing:.04em; text-transform:uppercase; overflow:hidden; }
.cv-ruler__row--g .cv-ruler__m{ color:var(--ink); }
.cv-ruler__row--h .cv-ruler__m{ color:var(--ink-muted); background:var(--ghost-white, #F8F8FA); padding-block-end:4px; }
.cv-ruler__m span{ display:block; overflow-wrap:anywhere; }
.cv-ruler__m.is-narrow span{ position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media (max-width:719px){ .cv-ruler__row--h .cv-ruler__m.is-mid span{ position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; } }
.cv-ruler__row--k{ grid-auto-rows:20px; margin-block-start:2px; }
.cv-ruler__node{ position:relative; min-inline-size:0; display:flex; align-items:center; }
.cv-ruler__node::before{ content:""; position:absolute; inset-inline:0; inset-block-start:50%; block-size:2px; margin-block-start:-1px; border-radius:2px; background:var(--purple-200, #D5DCFF); }
.cv-ruler__dot{ position:relative; display:grid; place-items:center; inline-size:18px; block-size:18px; margin-inline-start:-9px; border-radius:50%;
  background:#fff; box-shadow:inset 0 0 0 1.5px var(--purple, #3B06D4); color:var(--purple, #3B06D4); font:600 var(--fs-micro, 11px)/1 var(--font-mono); }
.cv-ruler__node.is-on .cv-ruler__dot, .cv-ruler__node.is-lit .cv-ruler__dot{ background:var(--purple, #3B06D4); color:#fff; }
main.dcr.hubr .cv-ruler__node.is-dim{ opacity:.45; }
main.dcr.hubr :is(.cv-ruler__node, .cv-mark).is-lit{ box-shadow:none; }   /* lit markers fill their dot instead of the card ring */
main.dcr.hubr .cv-mark.is-lit .cv-mark__n{ background:var(--purple, #3B06D4); color:#fff; }
@media (prefers-reduced-motion:no-preference){
  html.js .cv-ruler:not(.is-on) .cv-ruler__row--h{ transform:translateX(calc(100% * 11 / var(--days, 105))); opacity:.4; }
  .cv-ruler__row--h{ transition:transform var(--dur-slow, 560ms) var(--ease-emphasized, ease) var(--dur-base, 320ms), opacity var(--dur-slow, 560ms) var(--ease-standard, ease) var(--dur-base, 320ms); }
  .cv-ruler__dot{ transition:background var(--dur-quick, 200ms) var(--ease-standard, ease), color var(--dur-quick, 200ms) var(--ease-standard, ease); }
}
.cv-marks{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:6px 20px; }
.cv-mark{ display:grid; grid-template-columns:18px minmax(0, 1fr); align-items:start; gap:8px; font:400 var(--fs-small, 14px)/1.45 var(--font-sans); color:var(--ink); }
.cv-mark__b{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 8px; min-inline-size:0; }
.cv-mark__n{ display:inline-grid; place-items:center; inline-size:18px; block-size:18px; border-radius:50%; margin-block-start:1px;
  box-shadow:inset 0 0 0 1.5px var(--purple, #3B06D4); color:var(--purple, #3B06D4); font:600 var(--fs-micro, 11px)/1 var(--font-mono); }
.cv-mark.is-on .cv-mark__n{ background:var(--purple, #3B06D4); color:#fff; }
.cv-mark__t{ font-weight:600; }
.cv-mark__d{ font:500 var(--fs-micro, 11px)/1.4 var(--font-mono); letter-spacing:var(--track-label, .08em); text-transform:uppercase; color:var(--ink-muted); }
.cv-mark .dcr-src{ font-size:var(--fs-meta, 12px); color:var(--ink-muted); }
main.dcr.hubr .cv-mark.is-dim{ opacity:.55; }
[dir="rtl"] .cv-ruler__dot{ margin-inline-start:0; margin-inline-end:-9px; }