/* wgf-home-scribe.css - the home page "Prices come from players" band (.hm-sec--scribe).
   Static pitch + 3 steps in index.html; the live pulse is the baked region
   WGF:HOME:SCRIBE-PULSE (home_scribe_render.py), its clock is wgf-home-scribe.js.
   Tokens from static/css/_tokens.css. Green appears ONLY as the --wgf-up data semantic
   on the "recent scan" dot (no green chrome, docs/ui-ux/17-blizzard-palette.md). */

.hm-scribe{
  --hm-scribe-live:var(--wgf-up, #1eff00);
  --hm-scribe-stale:#f0a33a;
}
.hm-scribe__body{
  display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  gap:var(--space-5, 1.5rem);align-items:center;
}
.hm-scribe__lead{margin:0 0 var(--space-3, .75rem);color:var(--wgf-text);line-height:1.55}
.hm-scribe__steps{
  margin:0 0 var(--space-4, 1rem);padding:0;list-style:none;counter-reset:hmscribe;
  display:grid;gap:var(--space-2, .5rem);
}
.hm-scribe__steps li{
  counter-increment:hmscribe;position:relative;padding-left:2.1rem;
  color:var(--wgf-text);line-height:1.45;min-height:1.6rem;
}
.hm-scribe__steps li::before{
  content:counter(hmscribe);position:absolute;left:0;top:-.05rem;
  width:1.55rem;height:1.55rem;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-weight:700;font-size:var(--text-sm);
  color:var(--wgf-bg-base, #111);background:var(--wgf-gold-primary);
}
.hm-scribe__steps b{color:var(--wgf-gold-bright)}
.hm-scribe__cta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3, .75rem);margin:0}
.hm-scribe__how{
  font-size:var(--text-sm);font-weight:600;color:var(--wgf-gold-link);text-decoration:none;
  border-bottom:1px solid transparent;
}
.hm-scribe__how:hover{color:var(--wgf-gold-bright);border-bottom-color:var(--wgf-gold-dim)}

/* the live half */
.hm-scribe__pulse{
  /* client inset frame (kit --wgf-inset-art, wgf-chrome.css) */
  background:var(--wgf-inset-art);border:0;border-radius:0;
  padding:var(--space-4, 1rem);
}
.hm-scribe__last{
  display:flex;align-items:center;gap:.6rem;margin:0 0 var(--space-3, .75rem);
  font-family:var(--font-game);font-size:var(--text-lg, 1.15rem);color:var(--wgf-text);
}
.hm-scribe__ago{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--wgf-gold-primary)}
.hm-scribe__dot{
  flex:none;width:.7rem;height:.7rem;border-radius:50%;position:relative;
  background:var(--hm-scribe-stale);
}
.hm-scribe__pulse--fresh .hm-scribe__dot{background:var(--hm-scribe-live)}
.hm-scribe__pulse--fresh .hm-scribe__dot::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:var(--hm-scribe-live);animation:hm-scribe-ping 1.8s ease-out infinite;
}
.hm-scribe__pulse--stale .hm-scribe__ago{color:var(--hm-scribe-stale)}
@keyframes hm-scribe-ping{
  0%{transform:scale(1);opacity:.7}
  100%{transform:scale(2.6);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .hm-scribe__pulse--fresh .hm-scribe__dot::after{animation:none;opacity:0}
}
.hm-scribe__stats{
  display:flex;flex-wrap:wrap;gap:var(--space-2, .5rem) var(--space-5, 1.5rem);
  margin:0 0 var(--space-2, .5rem);padding:0;list-style:none;color:var(--wgf-muted);
}
.hm-scribe__n{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:700;
  font-size:var(--text-lg, 1.15rem);color:var(--wgf-gold-primary);
}
.hm-scribe__src{margin:0;font-size:var(--text-sm);color:var(--wgf-muted)}

@media (max-width:760px){
  .hm-scribe__body{grid-template-columns:minmax(0,1fr)}
  .hm-scribe__cta .wgf-btn-red{max-width:100%}
}