/* Herald · Eye-Rest — app tweaks. Base in glass-core.css (premium kit:
   accent medallions, depth, per-app aqua accent come for free). */

/* ---------- home ---------- */
.er-card {
  margin: 6px 2px 18px;
  padding: 20px 22px;
  border-radius: 18px;
  background:
    radial-gradient(120% 140% at 50% 0%, var(--aa-bloom2, rgba(52,216,196,0.12)), transparent 70%),
    rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.08) inset,
    0 0 24px var(--aa-glow-soft, rgba(52, 216, 196, 0.16));
  text-align: center;
}
.er-rule {
  font-size: 46px;
  font-weight: 800;
  letter-spacing: -1px;
  color: var(--app-accent, var(--accent));
  text-shadow:
    0 0 26px var(--aa-glow, rgba(52, 216, 196, 0.42)),
    0 0 64px var(--aa-glow-soft, rgba(52, 216, 196, 0.24));
}
.er-rule span {
  margin: 0 8px;
  color: var(--text-muted);
  font-weight: 600;
}
.er-blurb {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--text-secondary);
}
.er-blurb b { color: var(--text-primary); font-weight: 700; }

.er-go {
  display: block;
  width: 100%;
  margin: 4px 0 14px;
  padding: 16px 0;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.3px;
}
.er-foot {
  text-align: center;
  font-size: 12px;
  color: var(--text-muted);
}

/* ---------- run: the ring ---------- */
.er-ring {
  position: relative;
  width: 300px;
  height: 300px;
  margin: 10px auto 14px;
  flex-shrink: 0;
}
.er-ring svg { width: 100%; height: 100%; display: block; }
.er-ring-bg {
  fill: none;
  stroke: rgba(255, 255, 255, 0.10);
  stroke-width: 12;
}
.er-ring-fg {
  fill: none;
  stroke: var(--app-accent, var(--accent));
  stroke-width: 12;
  stroke-linecap: round;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  transition: stroke-dashoffset 0.95s linear;
  filter: drop-shadow(0 0 12px var(--aa-glow, rgba(52, 216, 196, 0.55)));
}
.er-ring-fg.er-ring-rest {
  filter: drop-shadow(0 0 20px var(--aa-glow-lg, rgba(52, 216, 196, 0.7)));
}
.er-ring-c {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.er-big {
  font-size: 62px;
  line-height: 1;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -1px;
  color: var(--text-primary);
}
.er-big-rest {
  font-size: 120px;
  color: var(--app-accent, var(--accent));
  text-shadow:
    0 0 34px var(--aa-glow, rgba(52, 216, 196, 0.5)),
    0 0 90px var(--aa-glow-soft, rgba(52, 216, 196, 0.28));
}
.er-sub {
  margin-top: 10px;
  font-size: 16px;
  font-weight: 600;
  color: var(--text-secondary);
}
.er-wrap-rest .er-sub { color: var(--app-accent, var(--accent)); }
.er-hint {
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-muted);
  margin-top: 2px;
}
.er-back { opacity: 0.5; }