/* UI refinement follows unslop by Damir Sokolovsky (@heydamir), CC BY 4.0.
   https://github.com/heydamir/unslop */
/* Range Console — type roles.
   Context labels and Vietnamese sentences use normal case and tracking so
   diacritics stay legible alongside map imagery. */

.rc-hero,
.rc-display,
.rc-eyebrow,
.rc-label,
.rc-num {
  font-synthesis: none;
  text-shadow: none;
  -webkit-text-stroke: 0;
}

.rc-hero {
  margin: 0;
  font-family: var(--rc-font-condensed);
  font-size: clamp(2.75rem, 6vw, 4.25rem);
  font-weight: 700;
  line-height: var(--rc-lh-hero);
  letter-spacing: var(--rc-track-display);
  color: var(--rc-ink);
  text-wrap: balance;
}

.rc-hero em {
  font-style: normal;
  color: var(--rc-signal);
}

.rc-display {
  margin: 0;
  font-family: var(--rc-font-condensed);
  font-size: var(--rc-fs-28);
  font-weight: 700;
  line-height: var(--rc-lh-title);
  letter-spacing: 0;
  color: var(--rc-ink);
  text-wrap: balance;
}

.rc-title {
  margin: 0;
  font-family: var(--rc-font-condensed);
  font-size: var(--rc-fs-20);
  font-weight: 600;
  line-height: var(--rc-lh-title);
  color: var(--rc-ink);
}

.rc-copy {
  margin: 0;
  max-inline-size: 68ch;
  font-family: var(--rc-font-body);
  font-size: var(--rc-fs-15);
  line-height: var(--rc-lh-body);
  color: var(--rc-ink);
}

.rc-muted {
  color: var(--rc-slate);
}

.rc-eyebrow {
  display: flex;
  align-items: center;
  gap: var(--rc-space-2);
  margin: 0;
  font-family: var(--rc-font-condensed);
  font-size: var(--rc-fs-12);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--rc-signal-text);
}

.rc-eyebrow::before {
  content: "";
  inline-size: 14px;
  block-size: 2px;
  background: var(--rc-signal);
}

.rc-label {
  font-family: var(--rc-font-condensed);
  font-size: var(--rc-fs-12);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--rc-slate);
}

.rc-num {
  font-family: var(--rc-font-condensed);
  font-size: var(--rc-fs-40);
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--rc-ink);
}

.rc-num-big {
  font-family: var(--rc-font-display);
  font-size: clamp(3rem, 9vw, 5.5rem);
  font-weight: 400;
  line-height: 0.92;
  font-variant-numeric: tabular-nums;
  color: var(--rc-ink);
}

.rc-mono {
  font-family: var(--rc-font-mono);
  font-size: var(--rc-fs-13);
  font-variant-numeric: tabular-nums;
  color: var(--rc-slate);
}

.rc-hairline {
  margin: 0;
  border: 0;
  border-block-start: var(--rc-hairline);
}

/* Registration marks: the only decorative chrome besides hairlines. */
.rc-marked {
  position: relative;
}

.rc-marked::before,
.rc-marked::after {
  content: "";
  position: absolute;
  inline-size: 10px;
  block-size: 10px;
  pointer-events: none;
}

.rc-marked::before {
  inset-block-start: 0;
  inset-inline-start: 0;
  border-block-start: 2px solid var(--rc-signal);
  border-inline-start: 2px solid var(--rc-signal);
}

.rc-marked::after {
  inset-block-end: 0;
  inset-inline-end: 0;
  border-block-end: 2px solid var(--rc-signal);
  border-inline-end: 2px solid var(--rc-signal);
}

/* The old light-theme class only changes the theme value, not the palette;
   paper is the default shell now, so it must render identically. */
html[data-aim-local] :is(.hall-root, .hall-portal).hall-light {
  --h-bg: var(--rc-paper);
  --h-panel: var(--rc-paper-raise);
  --h-surface: var(--rc-paper-sunk);
  --h-text: var(--rc-ink);
  --h-text-soft: var(--rc-ink-soft);
  --h-text-muted: var(--rc-slate);
  --h-border: var(--rc-rule);
  --h-on-accent: var(--rc-on-signal);
  --h-row-hover: var(--rc-paper-sunk);
}