@font-face {
  font-family: "Quadrillion Sb It";
  src: url("../assets/Quadrillion%20Sb%20It.otf") format("opentype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Quadrillion Sb";
  src: url("../assets/Quadrillion%20Sb.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Bird";
  src: url("../assets/BIRD.TTF") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "DropShade Shadow";
  src: url("../assets/DropShade-Shadow.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cute Animals Dingbat";
  src: url("../assets/Cute%20Animals%20Dingbat.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

html,
body {
  --homepage-canvas: var(--ks-color-neutral-page);
  --homepage-realtime-dots-gap: 24px;
  --homepage-realtime-tracking-gap: 32px;
  --homepage-realtime-results-gap: 8px;
  --homepage-realtime-deck-dots-gap: 8px;
  --homepage-realtime-deck-tracking-gap: 24px;
  --homepage-realtime-tablet-tracking-gap: 32px;
  --homepage-realtime-desktop-tracking-gap: 32px;
}

html:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active),
body:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) {
  background: var(--homepage-canvas);
}

.follow-kindness {
  padding-top: 24px;
  padding-inline: var(--grid-gutter);
  background: var(--homepage-canvas);
}

/* Desktop/tablet homepage column changes should follow the shared
   wrapper/percentage/breakpoint rules in design-system/DESIGN-RULES.md
   and design-system/COMPONENT-RULES.md rather than local fixed-width hacks. */

#search-results-content {
  background: var(--homepage-canvas);
  min-height: calc(100vh - var(--ks-nav-height));
}

.homepage-tracking-results-host {
  width: 100%;
  min-width: 0;
}

.homepage-tracking-results-host[hidden] {
  display: none !important;
}

.homepage-tracking-results-host > .follow-search-tracking {
  margin-top: var(--homepage-realtime-tracking-gap);
}

.homepage-tracking-results-host > .page-shell {
  padding-top: var(--homepage-realtime-results-gap);
}

.homepage-layout-debug {
  position: fixed;
  right: 12px;
  bottom: 72px;
  z-index: 9999;
  max-width: 260px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.92);
  color: #e2e8f0;
  font-size: 11px;
  line-height: 1.45;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.28);
  pointer-events: none;
  text-align: left;
}

.follow-kindness-inner {
  width: var(--ks-home-shell-fluid);
  margin-inline: auto;
  text-align: center;
}

.homepage-layout {
  width: 100%;
}

.homepage-layout__column {
  min-width: 0;
}

.homepage-layout__search-row {
  min-width: 0;
}

.homepage-layout__feed-header-row {
  min-width: 0;
}

.homepage-layout__column[hidden] {
  display: none !important;
}

.homepage-layout__column--left,
.homepage-layout__column--right {
  display: none;
}

.homepage-layout__column--center {
  min-width: 0;
}

.homepage-rail[hidden] {
  display: none !important;
}

.homepage-rail__stack {
  display: grid;
  gap: 24px;
}

.homepage-rail__stack--charts {
  gap: 16px;
}

.homepage-rail-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 216px;
  padding: 18px;
  border: 1px solid var(--ks-card-material-border);
  border-radius: var(--ks-shell-radius-card-md);
  background: #ffffff;
  background-image: var(--ks-card-material-surface);
  box-sizing: border-box;
  box-shadow: var(--ks-shadow-card-shell);
}

.homepage-rail-card::before,
.realtime-hit-feed__viewport::before,
.story-item::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow:
    inset 0 1px 0 var(--ks-card-material-rim-light),
    inset 1px 0 0 rgba(255, 255, 255, 0.52),
    inset -1px 0 0 var(--ks-card-material-rim-side),
    inset 0 -1px 0 var(--ks-card-material-rim-dark);
}

.homepage-rail-card::after,
.story-item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(rgba(148, 163, 184, 0.4), rgba(148, 163, 184, 0.4)) top / 100% 1px no-repeat,
    linear-gradient(rgba(148, 163, 184, 0.28), rgba(148, 163, 184, 0.28)) bottom / 100% 1px no-repeat;
}

.homepage-rail-heading {
  display: none;
}

.homepage-rail-heading__wordmark {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  width: 96px;
  height: 22px;
  margin: 0;
  background: #111827;
  -webkit-mask: url("../assets/kindsteps_word.svg") center / contain no-repeat;
  mask: url("../assets/kindsteps_word.svg") center / contain no-repeat;
}

.homepage-rail-heading__text {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  margin: 0;
  color: #111827;
  font-size: 12px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.homepage-rail-heading__digit {
  display: inline-flex;
  align-items: center;
  margin: 0 1px;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.homepage-rail-heading__title {
  display: inline-flex;
  align-items: center;
  color: #111827;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.homepage-rail-heading__year {
  display: inline-flex;
  align-items: center;
  color: #111827;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.homepage-rail-card--metrics {
  padding: 16px 14px 22px;
  color: var(--ks-color-neutral-text-secondary);
  display: grid;
  grid-template-rows: auto auto 1fr;
  row-gap: 8px;
  align-content: start;
}

.homepage-rail-card--chart {
  padding: 14px 14px 24px;
  color: #1e293b;
}

.homepage-rail-card .realtime-hit-feed__card-title--chart {
  white-space: nowrap;
}

.homepage-rail-card--chart .realtime-hit-feed__chart-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.homepage-rail-card--chart .realtime-hit-feed__chart-summary {
  justify-content: flex-start;
  gap: 12px;
}

.homepage-rail-card--chart .realtime-hit-feed__chart--month-totals {
  display: none;
}

.homepage-rail-card--chart.is-compact .realtime-hit-feed__chart--months {
  display: none;
}

.homepage-rail-card--chart.is-compact .realtime-hit-feed__chart--month-totals {
  display: flex;
  align-items: flex-end;
  justify-content: stretch;
  gap: 12px;
  min-height: 118px;
  margin-top: 10px;
  padding: 4px 0 10px;
}


.realtime-hit-feed__chart-month-total {
  display: flex;
  flex: 1 1 0;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
}

.realtime-hit-feed__chart-bars--month-total {
  width: 100%;
  max-width: 54px;
}

.realtime-hit-feed__chart-month-label--stacked {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
}

.follow-kindness-title,
.follow-kindness-subtitle {
  width: 100%;
}

.follow-kindness-title {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin: 0;
  color: var(--color-button-primary);
  font-size: clamp(26px, 8.5vw, 34px);
  line-height: 1;
  font-weight: 700;
}

.follow-kindness-title__image {
  display: block;
  width: min(100%, 300px);
  aspect-ratio: 5 / 1;
  height: auto;
  margin: 0 auto -10px;
  color: currentColor;
  vertical-align: top;
  filter:
    drop-shadow(0 1px 0 var(--ks-card-material-emboss-highlight))
    drop-shadow(0 2px 1px rgba(255, 255, 255, 0.22))
    drop-shadow(0 -1px 0 rgba(0, 122, 158, 0.24))
    drop-shadow(0 -2px 1px rgba(100, 116, 139, 0.28));
  opacity: 1;
}

.follow-kindness-subtitle {
  display: block;
  width: min(300px, 100%);
  max-width: 300px;
  margin: 14px auto 0;
  color: var(--color-button-primary);
  font-size: clamp(13px, 3.4vw, 17px);
  line-height: 1;
  font-weight: 400;
  white-space: nowrap;
  text-shadow:
    0 1px 0 var(--ks-card-material-emboss-highlight),
    0 2px 1px rgba(255, 255, 255, 0.22),
    0 -1px 0 rgba(0, 122, 158, 0.2),
    0 -2px 1px rgba(100, 116, 139, 0.26);
}

.track-kindness-page {
  padding-top: 50px;
  padding-inline: var(--grid-gutter);
}

.track-kindness-page__inner {
  width: 100%;
  max-width: var(--ks-shell-width);
  margin-inline: auto;
  box-sizing: border-box;
  text-align: center;
}

.track-kindness-title {
  margin: 0;
}

.track-kindness-subtitle {
  display: block;
  width: min(300px, 100%);
  max-width: 300px;
  margin: 5px auto 0;
  color: var(--color-button-primary);
  font-size: clamp(14px, 4vw, 20px);
  line-height: 1;
  font-weight: 400;
  white-space: nowrap;
}

.track-kindness-search {
  margin-top: 35px;
  margin-bottom: 40px;
}

.track-kindness-map-card {
  width: var(--ks-bill-panel-width);
  margin: 0 auto 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.track-kindness-map-wrap {
  width: 100%;
  height: 250px;
  min-height: 250px;
}

.track-kindness-map {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: calc(var(--radius-md) * 0.4);
  overflow: hidden;
}

.track-kindness-map .leaflet-container {
  background: #f5efe2;
}

.track-kindness-map .leaflet-pane,
.track-kindness-map .leaflet-top,
.track-kindness-map .leaflet-bottom {
  z-index: 1;
}

.track-kindness-map .leaflet-control-container {
  display: block !important;
}

.track-kindness-map .leaflet-left {
  left: 20px;
}

.track-kindness-map .leaflet-top {
  top: auto;
  bottom: 20px;
}

.track-kindness-map .leaflet-control-zoom {
  border: 1px solid rgba(17, 24, 39, 0.18);
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.16);
}

.track-kindness-ranking {
  width: var(--ks-bill-panel-width);
  margin: 40px auto 0;
  text-align: left;
}

.track-kindness-ranking__title {
  margin: 0 0 20px;
  color: var(--color-button-primary);
  font-size: clamp(26px, 7.2vw, 34px);
  line-height: 1;
  font-weight: 400;
  letter-spacing: -0.02em;
  text-align: center;
}

.track-kindness-ranking__table {
  border-top: 1px solid rgba(17, 24, 39, 0.12);
}

.track-kindness-ranking__header,
.track-kindness-ranking__row {
  display: grid;
  grid-template-columns: 56px minmax(70px, 0.7fr) minmax(120px, 1.15fr) minmax(160px, 1.4fr) minmax(90px, 0.8fr);
  column-gap: 18px;
  align-items: center;
}

.track-kindness-ranking__header {
  padding: 0 0 14px;
  color: rgba(17, 24, 39, 0.52);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: left;
}

.track-kindness-ranking__row {
  padding: 16px 0 18px;
  border-top: 1px solid rgba(17, 24, 39, 0.12);
}

.track-kindness-ranking__cell {
  min-width: 0;
  color: #111827;
  font-size: 0.98rem;
  line-height: 1.35;
  display: flex;
  align-items: center;
}

.track-kindness-ranking__cell--number {
  justify-content: flex-start;
}

.track-kindness-ranking__cell--state {
  font-weight: 600;
  letter-spacing: 0.01em;
}

.track-kindness-ranking__cell--coords {
  color: rgba(17, 24, 39, 0.72);
  font-variant-numeric: tabular-nums;
}

.track-kindness-ranking__cell--rank {
  font-weight: 400;
  color: var(--color-button-primary);
  text-align: left;
  font-variant-numeric: tabular-nums;
}

.track-kindness-ranking__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 999px;
  background: var(--color-button-primary);
  color: #fff;
  font-size: 0.98rem;
  line-height: 1;
  font-weight: 400;
}

.track-kindness-ranking__empty {
  padding: 18px 0 0;
  color: rgba(17, 24, 39, 0.62);
  font-size: 0.98rem;
  line-height: 1.4;
}

.track-kindness-map .leaflet-control-zoom a {
  width: 24px;
  height: 24px;
  line-height: 24px;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  background: rgba(255, 255, 255, 0.94);
}

@media (pointer: coarse), (max-width: 1023px) {
  .track-kindness-map,
  .track-kindness-map.leaflet-container,
  .track-kindness-map .leaflet-container,
  .track-kindness-map .leaflet-pane,
  .track-kindness-map .leaflet-map-pane,
  .track-kindness-map .leaflet-tile-pane,
  .track-kindness-map .leaflet-overlay-pane,
  .track-kindness-map .leaflet-control-container {
    touch-action: pan-y pinch-zoom !important;
  }
}

html.track-kindness-page-active .follow-kindness,
html.track-kindness-page-active #search-results-content,
body.track-kindness-page-active .follow-kindness,
body.track-kindness-page-active #search-results-content {
  display: none;
}

html.track-kindness-page-active .track-kindness-page,
body.track-kindness-page-active .track-kindness-page {
  display: block;
}

.demo-nomap .story-map-card,
.demo-nomap .kind-steps-map-count,
.demo-nomap .track-kindness-map-card,
.demo-nomap .track-kindness-map-wrap,
.demo-nomap .track-kindness-map {
  display: none !important;
}

.page-shell {
  width: var(--ks-home-shell-fluid);
  margin-inline: auto;
  box-sizing: border-box;
  padding: var(--ks-space-24) 0 calc(var(--ks-space-64) + var(--footer-row-min-height));
  background: var(--homepage-canvas);
  min-height: calc(100vh - var(--ks-nav-height) - var(--footer-row-min-height));
}

#search-results-content.cards-only-results .large-card-grid,
#search-results-content.cards-only-results .kind-steps-map-count,
#search-results-content.cards-only-results .story-map-card {
  display: none;
}

#search-results-content.global-search-results-active main {
  display: none;
}

#search-results-content.global-search-results-active .global-search-results {
  display: block;
}

#search-results-content.cards-only-results .kind-steps-stories {
  margin-top: 0;
}

#search-results-content.cards-only-results .story-pagination-wrap {
  display: none;
}

.global-search-results {
  display: none;
}

html.time-search-active,
body.time-search-active {
  background: #00a1ce;
}

html.stopwatch-search-active,
body.stopwatch-search-active {
  background: #e6f6fb;
  overflow-y: auto;
  overflow-x: hidden;
}

html.screensaver-127-active,
body.screensaver-127-active {
  background: #00a1ce;
  overflow: hidden;
}

html.world-time-map-active,
body.world-time-map-active {
  background: #ffffff;
}

.stopwatch-search-active .top-nav,
.stopwatch-search-active .follow-kindness,
.stopwatch-search-active .bottom-nav,
.stopwatch-search-active .top-sheet,
.stopwatch-search-active .bottom-sheet,
.stopwatch-search-active .time-search-stage {
  -webkit-user-select: none;
  user-select: none;
}

.stopwatch-search-active img,
.stopwatch-search-active .follow-kindness-title__image,
.stopwatch-search-active .ks-short-logo,
.stopwatch-search-active .kindsteps-logo,
.stopwatch-search-active .bird-corner {
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  user-drag: none;
}

.stopwatch-search-active *::selection {
  background: transparent;
  color: inherit;
}

.screensaver-127-active .top-nav,
.screensaver-127-active .follow-kindness,
.screensaver-127-active .bottom-nav,
.screensaver-127-active .time-search-stage {
  -webkit-user-select: none;
  user-select: none;
}

.time-search-active .top-nav,
.time-search-active .follow-kindness,
.time-search-active #search-results-content,
.time-search-active .bottom-nav,
.time-search-active .bottom-nav-inner {
  background: #00a1ce;
}

.stopwatch-search-active .top-nav,
.stopwatch-search-active .follow-kindness,
.stopwatch-search-active #search-results-content,
.stopwatch-search-active .bottom-nav,
.stopwatch-search-active .bottom-nav-inner {
  background: #e6f6fb;
}

.screensaver-127-active .top-nav,
.screensaver-127-active .follow-kindness,
.screensaver-127-active #search-results-content,
.screensaver-127-active .bottom-nav,
.screensaver-127-active .bottom-nav-inner {
  background: #00a1ce;
}

.world-time-map-active .top-nav,
.world-time-map-active .follow-kindness,
.world-time-map-active #search-results-content,
.world-time-map-active .bottom-nav,
.world-time-map-active .bottom-nav-inner {
  background: #ffffff;
}

.stopwatch-search-active .follow-kindness {
  position: relative;
  min-height: calc(100vh - var(--footer-row-min-height));
  padding-top: 0;
  padding-bottom: calc(var(--ks-space-64) + 180px);
  overflow: hidden;
  background-image: url("../images/cows.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left center;
  background-attachment: fixed;
}

.stopwatch-search-active .follow-kindness > .follow-kindness-inner {
  position: relative;
  z-index: 1;
  padding-top: 50px;
}

.stopwatch-dingbat-field {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.stopwatch-dingbat {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  will-change: transform;
  transform-origin: 50% 50%;
  user-select: none;
  overflow: visible;
}

.stopwatch-dingbat--matrix {
  font-family: "Bird", "Quadrillion Sb", "Avenir Next Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  color: rgba(255, 255, 255, 0.92);
  white-space: pre;
  text-align: center;
  letter-spacing: 0;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.12);
}

.screensaver-127-active .follow-kindness {
  min-height: calc(100vh - var(--footer-row-min-height));
  padding-top: 24px;
  padding-bottom: 24px;
}

.time-search-active .top-nav {
  border-bottom-color: rgba(255, 255, 255, 0.24);
  box-shadow: none;
}

.stopwatch-search-active .top-nav {
  border-bottom-color: rgba(255, 107, 107, 0.24);
  box-shadow: none;
}

.screensaver-127-active .top-nav {
  border-bottom-color: rgba(255, 183, 3, 0.24);
  box-shadow: none;
}

.world-time-map-active .top-nav {
  border-bottom-color: rgba(0, 161, 206, 0.18);
  box-shadow: none;
}

.time-search-active .top-nav a,
.time-search-active .top-nav button,
.time-search-active .footer-brand,
.time-search-active .bottom-nav a {
  color: #ffffff;
}

.stopwatch-search-active .top-nav a,
.stopwatch-search-active .top-nav button,
.stopwatch-search-active .footer-brand,
.stopwatch-search-active .bottom-nav a {
  color: #ff6b6b;
}

.screensaver-127-active .top-nav a,
.screensaver-127-active .top-nav button,
.screensaver-127-active .footer-brand,
.screensaver-127-active .bottom-nav a {
  color: #ffb703;
}

.world-time-map-active .top-nav a,
.world-time-map-active .top-nav button,
.world-time-map-active .footer-brand,
.world-time-map-active .bottom-nav a {
  color: #00a1ce;
}

.time-search-active .top-nav .btn,
.time-search-active .top-nav .icon-btn {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.72);
  color: #ffffff;
  box-shadow: none;
}

.stopwatch-search-active .top-nav .btn,
.stopwatch-search-active .top-nav .icon-btn {
  background: transparent;
  border-color: rgba(255, 107, 107, 0.72);
  color: #ff6b6b;
  box-shadow: none;
}

.screensaver-127-active .top-nav .btn,
.screensaver-127-active .top-nav .icon-btn {
  background: transparent;
  border-color: rgba(255, 183, 3, 0.72);
  color: #ffb703;
  box-shadow: none;
}

.world-time-map-active .top-nav .btn,
.world-time-map-active .top-nav .icon-btn {
  background: transparent;
  border-color: rgba(0, 161, 206, 0.72);
  color: #00a1ce;
  box-shadow: none;
}

.time-search-active .v-divider,
.time-search-active .link-divider {
  background: rgba(255, 255, 255, 0.34);
}

.stopwatch-search-active .v-divider,
.stopwatch-search-active .link-divider {
  background: rgba(255, 107, 107, 0.88);
}

.screensaver-127-active .v-divider,
.screensaver-127-active .link-divider {
  background: rgba(255, 183, 3, 0.38);
}

.world-time-map-active .v-divider,
.world-time-map-active .link-divider {
  background: rgba(0, 161, 206, 0.24);
}

.time-search-active .follow-kindness {
  min-height: calc(100vh - var(--footer-row-min-height));
  -webkit-user-select: none;
  user-select: none;
}

.time-search-active .follow-kindness-inner {
  width: 80vw;
  max-width: var(--container-max);
}

.screensaver-127-active .follow-kindness-inner {
  width: min(100%, calc(100vw - 48px));
  max-width: none;
  min-height: calc(100vh - 180px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
}

.screensaver-127-active .follow-kindness-title,
.screensaver-127-active .follow-kindness-subtitle,
.screensaver-127-active .follow-search-shell--home,
.screensaver-127-active .follow-search-example-row,
.screensaver-127-active .follow-search-tracking,
.screensaver-127-active .follow-search-missing,
.screensaver-127-active .see-video-tab,
.screensaver-127-active .mobile-video-tab-ghost {
  display: none !important;
}

.screensaver-127-active .ks-short-logo,
.screensaver-127-active .kindsteps-logo,
.screensaver-127-active .bird-corner {
  color: #ffb703;
}

.world-time-map-active .follow-search-example-serial:hover,
.world-time-map-active .follow-search-example-serial:focus-visible,
.world-time-map-active .follow-search-scanbill:hover .follow-search-scanbill__label,
.world-time-map-active .follow-search-scanbill:focus-visible .follow-search-scanbill__label,
.world-time-map-active .top-inline-links a:hover,
.world-time-map-active .top-inline-links a:focus-visible,
.world-time-map-active .bottom-nav-inline a:hover,
.world-time-map-active .bottom-nav-inline a:focus-visible,
.world-time-map-active .bottom-nav a:hover,
.world-time-map-active .bottom-nav a:focus-visible {
  color: #00a1ce;
  background: transparent;
  transition: none;
}

.global-search-results__shell {
  padding-top: 80px;
}

.global-search-results__header {
  width: 100%;
  max-width: 997px;
  margin: 0 auto 20px;
  padding-inline: var(--grid-gutter);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.global-search-results__eyebrow,
.global-search-results__title,
.global-search-results__count {
  margin: 0;
}

.global-search-results__eyebrow {
  color: rgba(17, 24, 39, 0.52);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.global-search-results__title {
  margin-top: 8px;
  color: var(--color-button-primary);
  font-size: clamp(28px, 4.2vw, 42px);
  line-height: 1.04;
  font-weight: 700;
}

.global-search-results__count {
  margin-top: 8px;
  color: #6b7280;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 400;
}

.global-search-results__list {
  width: 100%;
  max-width: 997px;
  margin: 0 auto;
  padding-inline: var(--grid-gutter);
  box-sizing: border-box;
  display: grid;
  gap: 12px;
}

.homepage-noisy-word-list {
  display: grid;
  gap: 18px;
  width: min(100%, 760px);
  margin: 0 auto;
  text-align: left;
}

.homepage-noisy-word-list__intro {
  margin: 0;
  color: #4b5563;
  font-size: 16px;
  line-height: 1.45;
}

.homepage-noisy-word-list__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.homepage-noisy-word-list__chip {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 999px;
  background: #ffffff;
  color: #1e293b;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
}

.time-search-stage[hidden] {
  display: none;
}

.time-search-stage {
  width: min(100%, 792px);
  margin: 75px auto 0;
  display: flex;
  justify-content: center;
  padding-bottom: 120px;
  -webkit-user-select: none;
  user-select: none;
}

.screensaver-127-active .time-search-stage {
  width: 100%;
  max-width: none;
  flex: 1 1 auto;
  margin: 0;
  padding-bottom: 0;
  align-items: stretch;
}

.world-time-map-active .time-search-stage {
  width: 100%;
  max-width: var(--container-max);
}

.time-search-view {
  width: 100%;
  min-height: 0;
  display: grid;
  align-content: start;
  justify-items: center;
  gap: 12px;
  padding: 0 24px 0;
  text-align: center;
  -webkit-user-select: none;
  user-select: none;
}

.time-search-active:not(.stopwatch-search-active) .follow-kindness-title,
.time-search-active:not(.stopwatch-search-active) .follow-kindness-title *,
.time-search-active:not(.stopwatch-search-active) .follow-kindness-subtitle,
.time-search-active:not(.stopwatch-search-active) .follow-kindness-subtitle *,
.time-search-active:not(.stopwatch-search-active) .follow-search-example-row,
.time-search-active:not(.stopwatch-search-active) .follow-search-example-row *,
.time-search-active:not(.stopwatch-search-active) .follow-search-scanbill,
.time-search-active:not(.stopwatch-search-active) .follow-search-scanbill *,
.time-search-active:not(.stopwatch-search-active) .time-search-view__region,
.time-search-active:not(.stopwatch-search-active) .time-search-view__region *,
.time-search-active:not(.stopwatch-search-active) .time-search-view__clock,
.time-search-active:not(.stopwatch-search-active) .time-search-view__clock *,
.time-search-active:not(.stopwatch-search-active) .time-search-view__offset,
.time-search-active:not(.stopwatch-search-active) .time-search-view__offset *,
.time-search-active:not(.stopwatch-search-active) .time-search-view__hint,
.time-search-active:not(.stopwatch-search-active) .time-search-view__hint *,
.time-search-active:not(.stopwatch-search-active) .world-time-map__meta,
.time-search-active:not(.stopwatch-search-active) .world-time-map__meta * {
  -webkit-user-select: none;
  user-select: none;
}

.time-search-view--screensaver127 {
  width: 100%;
  min-height: calc(100vh - 220px);
  padding: 0;
  display: block;
}

.time-search-view--worldmap {
  width: min(100%, var(--container-max));
  max-width: var(--container-max);
  margin-inline: auto;
  gap: 18px;
  padding: 0 0 32px;
}

.world-time-map__meta {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  color: #00a1ce;
  text-align: left;
  -webkit-user-select: none;
  user-select: none;
}

.world-time-map__meta-item {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.world-time-map__meta-label {
  font-size: 11px;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(0, 161, 206, 0.76);
}

.world-time-map__meta-value {
  font-size: 16px;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #00a1ce;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.world-time-map__canvas {
  width: 100%;
  height: min(54vh, 540px);
  border: 1px solid rgba(0, 161, 206, 0.18);
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 14px 36px rgba(0, 161, 206, 0.08);
}

.world-time-map__canvas .leaflet-container {
  width: 100%;
  height: 100%;
  cursor: crosshair;
  background: #e6f6fb;
}

.world-time-map__canvas .leaflet-control-zoom {
  display: grid;
  gap: 8px;
  padding: 6px;
  margin: 0 0 18px 18px;
  border: 1px solid rgba(17, 24, 39, 0.14);
  border-radius: 22px;
  overflow: visible;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(241, 245, 249, 0.94) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    inset 0 -1px 0 rgba(148, 163, 184, 0.16),
    0 8px 20px rgba(15, 23, 42, 0.12);
}

.world-time-map__canvas .leaflet-control-zoom a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  line-height: 1;
  font-size: 18px;
  font-weight: 700;
  color: #7c8593;
  padding: 0;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 999px;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 28%, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.92) 34%, rgba(233, 239, 246, 0.96) 100%);
  box-shadow:
    inset 0 2px 1px rgba(255, 255, 255, 0.95),
    inset 0 -3px 2px rgba(107, 114, 128, 0.24),
    inset 2px 0 2px rgba(255, 255, 255, 0.28),
    inset -2px 0 2px rgba(107, 114, 128, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.5);
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.72),
    0 -1px 0 rgba(107, 114, 128, 0.18);
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.world-time-map__canvas .leaflet-control-zoom a:hover,
.world-time-map__canvas .leaflet-control-zoom a:focus-visible {
  color: #7c8593;
  background:
    radial-gradient(circle at 30% 28%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.94) 38%, rgba(226, 232, 240, 0.98) 100%);
  box-shadow:
    inset 0 2px 1px rgba(255, 255, 255, 0.98),
    inset 0 -3px 2px rgba(107, 114, 128, 0.26),
    inset 2px 0 2px rgba(255, 255, 255, 0.32),
    inset -2px 0 2px rgba(107, 114, 128, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.56);
  transform: translateY(-1px);
}

.world-time-map__canvas .leaflet-bottom.leaflet-left .leaflet-control-zoom {
  margin-top: 0;
}

.world-time-map__canvas .leaflet-top.leaflet-left .leaflet-control-zoom {
  margin-top: 18px;
}

.screensaver-127-stage {
  position: relative;
  width: 100%;
  min-height: calc(100vh - 220px);
  overflow: hidden;
  background: #00a1ce;
}

.screensaver-127-bounce {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "DropShade Shadow", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 94pt;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #ffb703;
  white-space: nowrap;
  will-change: transform;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
}

.time-search-view__clock {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  font-family: "Quadrillion Sb", "Avenir Next Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  font-style: normal;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  font-size: clamp(78px, 10.4vw, 124px);
  line-height: 1;
  font-weight: 400;
  letter-spacing: 0.12em;
  color: #ffffff;
  text-shadow: none;
}

.time-search-view__clock-core {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
}

.time-search-view__clock-main {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  justify-content: center;
}

.time-search-view__clock-fraction {
  display: inline-flex;
  position: absolute;
  left: calc(100% + 10px);
  top: 0;
  align-items: baseline;
  gap: 6px;
  padding-top: 14px;
  font-size: 0.38em;
  letter-spacing: 0.04em;
  color: #ffffff;
  justify-content: flex-start;
}

.time-search-view__clock-char,
.time-search-view__clock-separator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.time-search-view__clock-char--main {
  width: 0.76em;
  min-width: 0.76em;
}

.time-search-view__clock-separator--main {
  width: 0.34em;
  min-width: 0.34em;
}

.time-search-view__clock-char--fraction {
  width: 0.72em;
  min-width: 0.72em;
}

.time-search-view__clock-separator--fraction {
  width: 0.28em;
  min-width: 0.28em;
}

.time-search-view__region {
  font-size: clamp(15px, 1.8vw, 22px);
  line-height: 1.2;
  font-weight: 300;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #ffffff;
  text-shadow: none;
}

.time-search-view__offset {
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.86);
}

.time-search-view__hint {
  margin-top: 4px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
}

.time-search-view--stopwatch .time-search-view__region,
.time-search-view--stopwatch .time-search-view__clock,
.time-search-view--stopwatch .time-search-view__clock-fraction,
.time-search-view--stopwatch .time-search-view__hint {
  color: #ff6b6b;
}

.time-search-view--stopwatch {
  width: 100%;
  max-width: min(100%, 960px);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-items: center;
  text-align: center;
}

.time-search-view--stopwatch .time-search-view__clock {
  display: flex;
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
  text-shadow: none;
}

.time-search-view--stopwatch .time-search-view__clock-core {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
  margin-inline: auto;
  width: fit-content;
  max-width: 100%;
  transform: scale(var(--stopwatch-fit-scale, 1));
  transform-origin: center top;
}

.time-search-view--stopwatch .time-search-view__clock-main {
  width: auto;
  margin-inline: auto;
  justify-content: center;
  gap: 4px;
}

.time-search-view--stopwatch .time-search-view__clock-char--main {
  width: 0.76em;
  min-width: 0.76em;
}

.time-search-view--stopwatch .time-search-view__clock-separator--main {
  width: 0.34em;
  min-width: 0.34em;
}

.time-search-view--stopwatch .time-search-view__clock-fraction {
  display: inline-flex;
  position: absolute;
  left: calc(100% + 8px);
  justify-content: flex-start;
  align-self: flex-start;
  padding-top: 6px;
  font-size: 0.5em;
  letter-spacing: 0.04em;
}

.time-search-view--stopwatch .time-search-view__clock-fraction--mirror {
  left: auto;
  right: calc(100% + 8px);
  visibility: hidden;
  pointer-events: none;
}

.time-search-view--stopwatch .time-search-view__region,
.time-search-view--stopwatch .time-search-view__hint,
.time-search-view--stopwatch .stopwatch-controls {
  justify-self: center;
}

.time-search-view--stopwatch .time-search-view__region {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  color: #ffffff;
}

.time-search-view--stopwatch .time-search-view__hint,
.time-search-view--stopwatch [data-stopwatch-hint] {
  display: none !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .world-time-map-active .follow-kindness {
    padding-inline: 25px;
  }

  .world-time-map-active .follow-kindness-inner {
    width: 100%;
    max-width: none;
  }

  .time-search-stage {
    width: calc(100% - 40px);
  }

  .world-time-map-active .time-search-stage {
    width: 100%;
    max-width: none;
  }

  .screensaver-127-active .time-search-stage {
    width: 100%;
  }

  .time-search-view {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }

  .time-search-view--screensaver127 {
    min-height: calc(100vh - 190px);
    padding: 0;
  }

  .time-search-view--worldmap {
    width: 100%;
    padding-inline: 0;
    max-width: 100%;
  }

  .world-time-map__meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .world-time-map__canvas {
    height: 48vh;
    min-height: 320px;
    border-radius: 0;
  }

  .screensaver-127-stage {
    min-height: calc(100vh - 190px);
  }

  .screensaver-127-bounce {
    font-size: clamp(52pt, 15vw, 94pt);
  }

  .time-search-view__clock {
    width: 100%;
    max-width: 100%;
    justify-content: center;
    font-size: clamp(46px, 11vw, 88px);
  }

  .time-search-view--stopwatch .time-search-view__clock {
    font-size: clamp(34px, 9vw, 68px);
    letter-spacing: 0.08em;
  }

  .time-search-view--stopwatch .time-search-view__clock-main {
    gap: 4px;
  }

  .time-search-view--stopwatch .time-search-view__clock-char--main {
    width: 0.76em;
    min-width: 0.76em;
  }

  .time-search-view--stopwatch .time-search-view__clock-separator--main {
    width: 0.34em;
    min-width: 0.34em;
  }

  .time-search-view--stopwatch .time-search-view__clock-core {
    --stopwatch-fraction-slot: 1.5em;
    column-gap: 6px;
  }

  .time-search-view--stopwatch .time-search-view__clock-fraction {
    padding-top: 4px;
    min-width: var(--stopwatch-fraction-slot, 1.5em);
  }

  .time-search-view__clock-main,
  .time-search-view__clock-fraction {
    max-width: 100%;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock {
    font-size: clamp(34px, 8.8vw, 64px);
    letter-spacing: 0.04em;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock-main {
    gap: 6px;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock-fraction {
    left: calc(100% + 6px);
    gap: 4px;
    padding-top: 10px;
    font-size: 0.3em;
    letter-spacing: 0.03em;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock-char--main {
    width: 0.68em;
    min-width: 0.68em;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock-separator--main {
    width: 0.24em;
    min-width: 0.24em;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock-char--fraction {
    width: 0.58em;
    min-width: 0.58em;
  }

  .time-search-view:not(.time-search-view--stopwatch) .time-search-view__clock-separator--fraction {
    width: 0.18em;
    min-width: 0.18em;
  }
}

@media (max-width: 767px) {
  .world-time-map-active .follow-kindness {
    padding-inline: 20px;
  }

  .world-time-map-active .follow-kindness-inner {
    width: 100%;
    max-width: none;
  }

  .world-time-map-active .time-search-stage {
    width: 100%;
    max-width: none;
  }

  .world-time-map-active .time-search-view--worldmap {
    width: 100%;
    max-width: 100%;
  }
}

.global-search-result-card {
  width: 100%;
  border: 1px solid var(--color-card-border);
  border-radius: var(--ks-shell-radius-card-sm);
  background: #ffffff;
  padding: 18px 18px 16px;
  text-align: left;
  cursor: pointer;
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.global-search-result-card:hover,
.global-search-result-card:focus-visible {
  background: #f9fafb;
  border-color: rgba(14, 165, 233, 0.28);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
  outline: none;
}

.global-search-result-card--storyfull {
  padding: 14px 16px 0;
}

.global-search-result-card--storyfull .story-copy {
  margin-bottom: 18px;
  line-height: 1.45;
}

#global-search-results[data-results-mode="bill-list"] .global-search-results__list {
  gap: 10px;
  padding-inline: 0;
}

#global-search-results[data-results-mode="bill-list"] .story-item--bill-search {
  cursor: pointer;
}

#global-search-results[data-results-mode="bill-list"] .story-item--bill-search:hover,
#global-search-results[data-results-mode="bill-list"] .story-item--bill-search:focus-visible {
  outline: none;
}

.global-search-result-card__topline,
.global-search-result-card__title,
.global-search-result-card__meta,
.global-search-result-card__story,
.global-search-result-card__foot {
  margin: 0;
}

.global-search-result-card__topline {
  color: rgba(17, 24, 39, 0.56);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.global-search-result-card__title {
  margin-top: 8px;
  color: #111827;
  font-size: clamp(19px, 2.6vw, 24px);
  line-height: 1.12;
  font-weight: 600;
}

.global-search-result-card__meta {
  margin-top: 8px;
  color: #6b7280;
  font-size: 14px;
  line-height: 1.35;
  font-weight: 500;
}

.global-search-result-card__story {
  margin-top: 8px;
  color: #1f2937;
  font-size: 15px;
  line-height: 1.55;
  font-weight: 400;
}

.global-search-result-card__foot {
  margin-top: 12px;
  color: var(--color-button-primary);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 600;
}

.global-search-result-card__foot--bill {
  color: rgba(17, 24, 39, 0.28);
  font-size: 13px;
  line-height: 1.1;
  font-weight: 400;
}

.global-search-result-card__title--bill {
  transition: color 160ms ease;
}

.global-search-result-card:hover .global-search-result-card__title--bill,
.global-search-result-card:focus-visible .global-search-result-card__title--bill {
  color: #22c55e;
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  padding-inline: var(--grid-gutter);
  gap: var(--grid-gutter);
}

.span-12 { grid-column: span 12; }
.span-8 { grid-column: span 8; }
.span-6 { grid-column: span 6; }
.span-4 { grid-column: span 4; }
.span-3 { grid-column: span 3; }

@media (max-width: 1023px) {
  html,
  body {
    background: var(--homepage-canvas);
  }

  :root {
    --homepage-scan-to-feed-gap: 12px;
    --homepage-feed-header-to-card-gap: 14px;
  }

  .follow-kindness {
    padding-inline: var(--grid-gutter-tablet);
  }

  body.homepage-search-front {
    --homepage-canvas: var(--ks-color-neutral-page);
  }

  body.homepage-search-front .follow-search-shell__shape-fill {
    fill: rgba(255, 255, 255, 0.98);
  }

  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) {
    --homepage-canvas: var(--ks-color-neutral-page);
  }

  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-kindness {
    min-height: calc(100vh - var(--ks-nav-height) - var(--footer-row-min-height));
  }

  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell__shape-fill {
    fill: rgba(255, 255, 255, 0.98);
  }

  body.homepage-search-front .realtime-hit-feed,
  body.homepage-search-front .realtime-hit-feed__viewport,
  body.homepage-search-front .realtime-hit-feed__card,
  body.homepage-search-front .realtime-hit-feed__stream,
  body.homepage-search-front .homepage-rail-card,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__viewport,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__card,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__stream,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .homepage-rail-card {
    background: #ffffff;
  }

  body.homepage-search-front .realtime-hit-feed,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed {
    background: var(--homepage-canvas);
    border-radius: var(--ks-shell-radius-card);
    padding-bottom: 28px;
    overflow: hidden;
  }

  body.homepage-search-front .realtime-hit-feed__viewport,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__viewport {
    border-radius: var(--ks-shell-radius-card);
  }

  body.homepage-search-front .realtime-hit-feed__dots-wrap,
  body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__dots-wrap {
    margin-top: 14px;
  }

  .track-kindness-page {
    padding-inline: var(--grid-gutter-tablet);
  }

  .page-shell {
    width: auto;
    margin-inline: var(--ks-page-margin-tablet);
    padding-top: var(--grid-gutter-tablet);
  }

  .global-search-results__header,
  .global-search-results__list {
    padding-inline: 0;
  }

  .global-search-results__header {
    align-items: center;
    text-align: center;
  }

  .cards-grid {
    grid-template-columns: repeat(var(--grid-columns-tablet), minmax(0, 1fr));
    padding-inline: 0;
    gap: var(--grid-gutter-tablet);
  }

  .t-span-8 { grid-column: span 8; }
  .t-span-6 { grid-column: span 6; }
  .t-span-4 { grid-column: span 4; }

  .stories-grid > .stories-timeline {
    grid-column: 1 / -1;
    margin-top: var(--grid-gutter-tablet);
  }

  .homepage-layout--home {
    width: min(100%, 1200px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 30%) minmax(0, 70%);
    column-gap: 24px;
    row-gap: 0;
    align-items: start;
  }

  .homepage-layout__search-row {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
  }

  .homepage-layout__feed-header-row {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    margin-top: var(--homepage-scan-to-feed-gap);
  }

  .homepage-layout__column--left {
    display: block;
    grid-column: 1;
    grid-row: 3;
    margin-top: var(--homepage-feed-header-to-card-gap);
  }

  .homepage-layout__column--center {
    grid-column: 2;
    grid-row: 3;
    margin-top: var(--homepage-feed-header-to-card-gap);
  }

  .homepage-layout__column--right {
    display: block;
    grid-column: 1 / -1;
    grid-row: 4;
  }

  .homepage-layout--home:has(.homepage-layout__column--left:empty) {
    grid-template-columns: minmax(0, 1fr);
  }

  .homepage-layout--home:has(.homepage-layout__column--left:empty) .homepage-layout__feed-header-row,
  .homepage-layout--home:has(.homepage-layout__column--left:empty) .homepage-layout__search-row,
  .homepage-layout--home:has(.homepage-layout__column--left:empty) .homepage-layout__column--center,
  .homepage-layout--home:has(.homepage-layout__column--left:empty) .homepage-layout__column--right {
    grid-column: 1 / -1;
  }

}

@media (min-width: 768px) and (max-width: 1023px) {
  :root {
    --homepage-tablet-outer-buffer: var(--ks-page-margin-tablet);
    --homepage-tablet-container-width: min(calc(100vw - (var(--homepage-tablet-outer-buffer) * 2)), var(--ks-container-max));
    --homepage-tablet-column-gap: 28px;
    --homepage-tablet-side-rail-width: clamp(164px, 22vw, 196px);
    --homepage-tablet-main-lane-width: calc(var(--homepage-tablet-container-width) - var(--homepage-tablet-side-rail-width) - var(--homepage-tablet-column-gap) - 12px);
    --homepage-tablet-main-lane-start: calc((100vw - var(--homepage-tablet-container-width)) / 2 + var(--homepage-tablet-side-rail-width) + var(--homepage-tablet-column-gap));
  }

  .follow-kindness {
    padding-inline: var(--homepage-tablet-outer-buffer);
  }

  .follow-kindness-inner {
    width: var(--homepage-tablet-container-width);
    max-width: var(--homepage-tablet-container-width);
    margin-inline: auto;
  }

  .follow-kindness-title,
  .follow-kindness-subtitle {
    width: var(--homepage-tablet-main-lane-width);
    max-width: var(--homepage-tablet-main-lane-width);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  .follow-kindness-subtitle {
    margin-top: 14px;
  }

  .homepage-layout--home {
    width: var(--homepage-tablet-container-width);
    grid-template-columns:
      minmax(0, var(--homepage-tablet-side-rail-width))
      minmax(0, var(--homepage-tablet-main-lane-width));
    column-gap: var(--homepage-tablet-column-gap);
    row-gap: 0;
  }

  .homepage-layout__search-row {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    max-width: var(--homepage-tablet-main-lane-width);
    justify-self: center;
  }

  .homepage-layout__column--left {
    display: block;
    grid-column: 1;
    grid-row: 3;
    margin-top: var(--homepage-feed-header-to-card-gap);
  }

  .homepage-layout__column--center {
    grid-column: 2;
    grid-row: 3;
    width: 100%;
    max-width: var(--homepage-tablet-main-lane-width);
    justify-self: center;
    margin-top: var(--homepage-feed-header-to-card-gap);
    min-width: 0;
    overflow: hidden;
  }

  .homepage-layout__column--right {
    display: none;
  }

  .homepage-layout__feed-header-row {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    max-width: var(--homepage-tablet-main-lane-width);
    justify-self: center;
    margin-top: var(--homepage-scan-to-feed-gap);
  }

  .homepage-layout__search-row > .follow-search-shell--home,
  .homepage-layout__search-row > .follow-search-example-row,
  .homepage-layout__feed-header-row > .realtime-hit-feed__header,
  .homepage-layout__column--center > .realtime-hit-feed,
  .homepage-layout__column--left > .homepage-rail,
  .homepage-layout__column--left > .homepage-rail > .homepage-rail__stack,
  .homepage-layout__column--left .homepage-rail-card {
    width: 100%;
    max-width: 100%;
  }

  .homepage-layout__column--right > .homepage-rail,
  .homepage-layout__column--right > .homepage-rail > .homepage-rail__stack,
  .homepage-layout__column--right .homepage-rail-card {
    width: 100%;
    max-width: 100%;
  }

  .homepage-layout__search-row > .follow-search-example-row {
    justify-content: center;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics {
    position: relative;
    margin-top: 0;
    padding: 16px 14px 22px;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics::before {
    content: none;
  }

  .homepage-layout__column--right .homepage-rail-heading--metrics {
    display: none;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics .realtime-hit-feed__metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics .realtime-hit-feed__metric-value {
    font-size: 19px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart {
    min-height: 286px;
    padding: 12px 14px 14px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__card-title--chart {
    display: block;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart {
    gap: 8px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-range {
    width: 100%;
    min-width: 0;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-range-button {
    padding-inline: 0;
    font-size: 11px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-area {
    min-height: 102px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-average-value {
    font-size: 15px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-average-label,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-axis,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-axis-labels,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-today-label,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-note {
    font-size: 10px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-today-value {
    font-size: 28px;
  }

  .homepage-layout__column--center > .realtime-hit-feed,
  .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__carousel,
  .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__viewport,
  .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__dots-wrap {
    width: calc(100% - 8px);
    max-width: calc(100% - 8px);
    margin-left: 0;
    margin-right: auto;
  }

  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__peek,
  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__cards,
  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__dots-wrap {
    display: none !important;
  }

  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__stream {
    display: block !important;
    height: auto;
  }

  #search-results-content > .follow-search-tracking {
    width: var(--homepage-tablet-main-lane-width);
    max-width: var(--homepage-tablet-main-lane-width);
    margin: 16px 0 0 var(--homepage-tablet-main-lane-start);
    text-align: center;
  }

  #search-results-content > main.page-shell {
    width: var(--homepage-tablet-main-lane-width);
    max-width: var(--homepage-tablet-main-lane-width);
    margin-left: var(--homepage-tablet-main-lane-start);
    margin-right: 0;
    padding-top: 8px;
  }

  #search-results-content > main.page-shell > .bill-summary-grid,
  #search-results-content > main.page-shell > .bill-journey-lane,
  #search-results-content > main.page-shell > .bill-journey-lane > .kind-steps-map-count,
  #search-results-content > main.page-shell > .bill-journey-lane > .kind-steps-stories,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host,
  #search-results-content > main.page-shell > .bill-journey-lane > .stories-grid,
  #search-results-content > main.page-shell > .bill-journey-lane > .stories-grid > .stories-timeline,
  #search-results-content > main.page-shell > .bill-journey-lane > .story-pagination-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  #search-results-content > main.page-shell > .bill-summary-grid {
    gap: 12px;
    margin-bottom: 24px;
  }

  #search-results-content > main.page-shell > .bill-journey-lane > .kind-steps-map-count {
    margin-top: 18px;
  }

  #search-results-content > main.page-shell > .bill-journey-lane > .kind-steps-stories {
    margin-bottom: 12px;
  }

  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card.story-map-open,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card .story-profile-map-wrap,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card.story-map-open .story-profile-map-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card {
    overflow: hidden;
  }
}

@media (max-width: 767px) {
  html,
  body {
    --homepage-canvas: var(--ks-color-neutral-page);
  }

  .follow-kindness {
    padding-top: 18px;
    padding-inline: 0;
  }

  .track-kindness-page {
    padding-inline: var(--grid-gutter-mobile);
  }

  .page-shell {
    width: var(--ks-home-shell-fluid);
    margin-inline: auto;
    padding-top: var(--grid-gutter-mobile);
  }

  .global-search-results__shell {
    padding-top: 80px;
  }

  .global-search-results__header,
  .global-search-results__list {
    padding-inline: 0;
  }

  #global-search-results .global-search-results__list {
    display: block;
    gap: 0;
  }

  #global-search-results .global-search-results__list .story-item {
    position: relative;
    padding-top: 20px;
  }

  #global-search-results .global-search-results__list .story-item + .story-item {
    margin-top: 0;
  }

  #global-search-results .global-search-results__list .story-item + .story-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    border-top: 1px solid #e8e6dc;
  }

  #global-search-results .global-search-results__list .story-item .story-profile {
    border-top: 0;
    padding-top: 0;
  }

  .global-search-result-card {
    padding: 16px 16px 14px;
  }

  .cards-grid {
    grid-template-columns: repeat(var(--grid-columns-mobile), minmax(0, 1fr));
    padding-inline: 0;
    gap: var(--grid-gutter-mobile);
  }

  .homepage-layout--home {
    display: block;
    width: 100%;
    margin-inline: auto;
  }

  .homepage-layout__column--left,
  .homepage-layout__column--right {
    display: none;
  }

  .homepage-layout__column--center {
    display: block;
    margin-top: var(--homepage-feed-header-to-card-gap);
  }

  .homepage-layout__feed-header-row {
    margin-top: var(--homepage-scan-to-feed-gap);
  }

  .m-span-4 { grid-column: span 4; }
  .m-span-2 { grid-column: span 2; }
}

@media (max-width: 767px) {
  :root {
    --homepage-scan-to-feed-gap: 42px;
    --homepage-feed-header-to-card-gap: 14px;
  }
}

@media (max-width: 359px) {
  .follow-kindness {
    padding-inline: var(--space-sm);
  }

  .track-kindness-page {
    padding-inline: var(--space-sm);
  }

  .page-shell {
    width: var(--ks-home-shell-fluid);
    margin-inline: auto;
  }
}

@media (max-width: 767px) {
  :root {
    --homepage-scan-to-feed-gap: 42px;
    --homepage-feed-header-to-card-gap: 14px;
  }
}

@media (min-width: 600px) and (max-width: 1199px) {
  .follow-kindness-title {
    font-size: clamp(28px, 4vw, 34px);
  }

  .follow-kindness-subtitle {
    font-size: clamp(12px, 1.5vw, 16px);
  }
}

@media (min-width: 1024px) {
  :root {
    --homepage-desktop-outer-margin: clamp(32px, 3vw, 40px);
    --homepage-desktop-container-width: min(calc(100vw - (var(--homepage-desktop-outer-margin) * 2)), var(--ks-container-max));
    --homepage-center-lane-width: calc((var(--homepage-desktop-container-width) - (var(--ks-grid-gutter-desktop) * 2)) * 0.56);
    --homepage-side-rail-width: calc((var(--homepage-desktop-container-width) - (var(--ks-grid-gutter-desktop) * 2) - var(--homepage-center-lane-width)) / 2);
  }

  .follow-kindness {
    padding-inline: var(--homepage-desktop-outer-margin);
  }

  .follow-kindness-inner {
    width: var(--homepage-desktop-container-width);
    margin-inline: auto;
  }

  .follow-kindness-title {
    font-size: 34px;
  }

  .follow-kindness-subtitle {
    font-size: 16px;
  }

  .track-kindness-title {
    font-size: 54px;
  }

  .track-kindness-subtitle {
    font-size: 18px;
  }

  .homepage-layout--home {
    width: var(--homepage-desktop-container-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns:
      minmax(0, var(--homepage-side-rail-width))
      minmax(0, var(--homepage-center-lane-width))
      minmax(0, var(--homepage-side-rail-width));
    column-gap: var(--ks-grid-gutter-desktop);
    row-gap: 12px;
    align-items: start;
  }

  .homepage-layout__column--left,
  .homepage-layout__column--right {
    display: block;
    margin-top: 0;
  }

  .homepage-layout__column--left .homepage-rail-card--chart,
  .homepage-layout__column--right .homepage-rail-card--metrics {
    position: relative;
  }

  .homepage-layout__column--left .homepage-rail-card--chart::before,
  .homepage-layout__column--right .homepage-rail-card--metrics::before {
    position: absolute;
    top: -38px;
    left: 0;
    right: 0;
    color: #1f2937;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    letter-spacing: 0.01em;
  }

  .homepage-layout__column--left .homepage-rail-card--chart::before {
    content: none;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics::before {
    content: none;
  }

  .homepage-layout__column--left .homepage-rail-heading--chart,
  .homepage-layout__column--right .homepage-rail-heading--metrics {
    position: absolute;
    top: -38px;
    left: 0;
    right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .homepage-layout__column--left .homepage-rail-heading--chart,
  .homepage-layout__column--right .homepage-rail-heading--metrics {
    gap: 8px;
  }

  .homepage-layout__column--right .homepage-rail-heading--metrics .homepage-rail-heading__wordmark {
    width: 96px;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: contain;
    mask-size: contain;
  }

  .homepage-layout__feed-header-row {
    display: flex;
    justify-content: center;
  }

  .homepage-layout__feed-header-row > .realtime-hit-feed__header {
    justify-content: center;
    padding: 0;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics .realtime-hit-feed__card-title--metrics {
    display: flex;
  }

  .homepage-layout__column--right .homepage-rail-card--metrics .realtime-hit-feed__metric-value {
    font-size: 19px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart {
    min-height: 286px;
    padding: 12px 14px 14px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__card-title--chart {
    display: block;
  }

  .homepage-layout__search-row {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    justify-self: center;
  }

  .homepage-layout__feed-header-row {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    justify-self: center;
  }

  .homepage-layout__column--left {
    grid-column: 1;
    grid-row: 3;
  }

  .homepage-layout__column--center {
    grid-column: 2;
    grid-row: 3;
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    justify-self: center;
  }

  .homepage-layout__column--right {
    grid-column: 3;
    grid-row: 3;
  }

  .homepage-layout--home:has(.homepage-layout__column--left:empty):has(.homepage-layout__column--right:empty) {
    grid-template-columns: minmax(0, 1fr);
  }

  .homepage-layout--home:has(.homepage-layout__column--left:empty):has(.homepage-layout__column--right:empty) .homepage-layout__search-row,
  .homepage-layout--home:has(.homepage-layout__column--left:empty):has(.homepage-layout__column--right:empty) .homepage-layout__feed-header-row,
  .homepage-layout--home:has(.homepage-layout__column--left:empty):has(.homepage-layout__column--right:empty) .homepage-layout__column--center {
    grid-column: 1 / -1;
  }

  .homepage-layout__search-row > .follow-search-shell--home,
  .homepage-layout__search-row > .follow-search-example-row,
  .homepage-layout__feed-header-row > .realtime-hit-feed__header,
  .homepage-layout__column--center > .follow-search-shell--home,
  .homepage-layout__column--center > .follow-search-example-row,
  .homepage-layout__column--center > .realtime-hit-feed,
  .page-shell {
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    margin-left: auto;
    margin-right: auto;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart {
    gap: 8px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-range {
    width: 100%;
    min-width: 0;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-range-button {
    padding-inline: 0;
    font-size: 11px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-head {
    gap: 8px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-average-value {
    font-size: 15px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-average-label,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-axis,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-axis-labels,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-today-label,
  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-note {
    font-size: 10px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-area {
    min-height: 102px;
  }

  .homepage-layout__column--left .homepage-rail-card--chart .realtime-hit-feed__flat-chart-today-value {
    font-size: 28px;
  }

  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__peek,
  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__cards,
  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__dots-wrap {
    display: none !important;
  }

  .realtime-hit-feed--desktop-feed-only .realtime-hit-feed__stream {
    display: block !important;
    height: auto;
  }

  #search-results-content > .follow-search-tracking {
    width: var(--homepage-center-lane-width);
    max-width: var(--homepage-center-lane-width);
    margin: 16px auto 0;
    text-align: center;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  body.homepage-layout-mode--deck .realtime-hit-feed {
    --homepage-realtime-dots-gap: var(--homepage-realtime-deck-dots-gap);
    --homepage-realtime-tracking-gap: var(--homepage-realtime-deck-tracking-gap);
    padding-bottom: 0;
  }

  body.homepage-layout-mode--deck .follow-kindness-inner {
    width: var(--homepage-tablet-container-width, min(calc(100vw - (var(--ks-page-margin-tablet) * 2)), var(--ks-container-max)));
    max-width: var(--homepage-tablet-container-width, min(calc(100vw - (var(--ks-page-margin-tablet) * 2)), var(--ks-container-max)));
  }

  body.homepage-layout-mode--deck .follow-kindness-title,
  body.homepage-layout-mode--deck .follow-kindness-subtitle {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  body.homepage-layout-mode--deck .homepage-layout--home {
    width: 100%;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 0;
    row-gap: 0;
  }

  body.homepage-layout-mode--deck .homepage-layout__search-row,
  body.homepage-layout-mode--deck .homepage-layout__feed-header-row,
  body.homepage-layout-mode--deck .homepage-layout__column--center {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    justify-self: stretch;
  }

  body.homepage-layout-mode--deck .homepage-layout__column--left,
  body.homepage-layout-mode--deck .homepage-layout__column--right {
    display: none !important;
  }

  body.homepage-layout-mode--deck .homepage-layout__column--center {
    overflow: visible;
  }

  body.homepage-layout-mode--deck .homepage-layout__search-row > .follow-search-shell--home,
  body.homepage-layout-mode--deck .homepage-layout__search-row > .follow-search-example-row,
  body.homepage-layout-mode--deck .homepage-layout__feed-header-row > .realtime-hit-feed__header,
  body.homepage-layout-mode--deck .homepage-layout__column--center > .realtime-hit-feed,
  body.homepage-layout-mode--deck .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__carousel,
  body.homepage-layout-mode--deck .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__viewport,
  body.homepage-layout-mode--deck .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__dots-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  body.homepage-layout-mode--deck .homepage-tracking-results-host > .follow-search-tracking,
  body.homepage-layout-mode--deck .homepage-tracking-results-host > .page-shell {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  body.homepage-layout-mode--deck .homepage-tracking-results-host > .follow-search-tracking {
    text-align: center;
  }

  body.homepage-layout-mode--deck .homepage-tracking-results-host > .page-shell {
    text-align: center;
  }
}

@media (min-width: 820px) and (max-width: 1279px) {
  body.homepage-layout-mode--tablet-side {
    --homepage-realtime-tracking-gap: var(--homepage-realtime-tablet-tracking-gap);
  }

  body.homepage-layout-mode--tablet-side .follow-kindness {
    padding-inline: var(--ks-page-margin-tablet);
    padding-bottom: calc(var(--footer-row-min-height) + 72px);
  }

  body.homepage-layout-mode--tablet-side .follow-kindness-inner {
    width: min(calc(100vw - (var(--ks-page-margin-tablet) * 2)), var(--ks-container-max));
    max-width: min(calc(100vw - (var(--ks-page-margin-tablet) * 2)), var(--ks-container-max));
    margin-inline: auto;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout--home {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(180px, 208px) minmax(0, 1fr);
    column-gap: 24px;
    row-gap: 0;
    align-items: start;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__search-row,
  body.homepage-layout-mode--tablet-side .homepage-layout__feed-header-row,
  body.homepage-layout-mode--tablet-side .homepage-layout__column--center {
    grid-column: 2;
    width: 100%;
    max-width: 100%;
    justify-self: stretch;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left {
    display: block !important;
    grid-column: 1;
    grid-row: 3;
    margin-top: var(--homepage-feed-header-to-card-gap);
    width: 100%;
    max-width: 208px;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--right {
    display: none !important;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--center {
    min-width: 0;
    overflow: visible;
    margin-top: var(--homepage-feed-header-to-card-gap);
    width: 100%;
    max-width: 100%;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail__stack {
    gap: 16px;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-card--metrics {
    position: relative;
    padding: 18px 14px 22px;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-heading--metrics {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin: 0 0 12px;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-heading--metrics .homepage-rail-heading__wordmark {
    width: 96px;
    background: #111827;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: contain;
    mask-size: contain;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-heading--metrics .homepage-rail-heading__text {
    color: #111827;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-heading--metrics {
    display: none;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-card--metrics .realtime-hit-feed__card-title--metrics {
    display: flex;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-card--metrics .realtime-hit-feed__metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-card--metrics .realtime-hit-feed__metric-value {
    font-size: 19px;
  }

  body.homepage-layout-mode--tablet-side .homepage-layout__search-row > .follow-search-shell--home,
  body.homepage-layout-mode--tablet-side .homepage-layout__search-row > .follow-search-example-row,
  body.homepage-layout-mode--tablet-side .homepage-layout__feed-header-row > .realtime-hit-feed__header,
  body.homepage-layout-mode--tablet-side .homepage-layout__column--center > .realtime-hit-feed,
  body.homepage-layout-mode--tablet-side .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__carousel,
  body.homepage-layout-mode--tablet-side .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__viewport,
  body.homepage-layout-mode--tablet-side .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__dots-wrap,
  body.homepage-layout-mode--tablet-side .homepage-tracking-results-host,
  body.homepage-layout-mode--tablet-side .homepage-tracking-results-host > .page-shell {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

}

@media (min-width: 1280px) {
  body.homepage-layout-mode--desktop-full {
    --homepage-realtime-tracking-gap: var(--homepage-realtime-desktop-tracking-gap);
  }

  body.homepage-layout-mode--desktop-full .follow-kindness {
    padding-bottom: calc(var(--footer-row-min-height) + 72px);
  }

  body.homepage-layout-mode--desktop-full .follow-kindness-inner {
    width: var(--homepage-desktop-container-width);
    max-width: var(--homepage-desktop-container-width);
    margin-inline: auto;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout--home {
    width: var(--homepage-desktop-container-width);
    max-width: var(--homepage-desktop-container-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns:
      minmax(0, var(--homepage-side-rail-width))
      minmax(0, var(--homepage-center-lane-width))
      minmax(0, var(--homepage-side-rail-width));
    column-gap: var(--ks-grid-gutter-desktop);
    row-gap: 12px;
    align-items: start;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--left,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--right {
    display: block !important;
    width: 100%;
    max-width: var(--homepage-side-rail-width);
    margin-top: 0;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--center {
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    min-width: 0;
    overflow: visible;
    justify-self: center;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__search-row,
  body.homepage-layout-mode--desktop-full .homepage-layout__feed-header-row {
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    justify-self: center;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__search-row > .follow-search-shell--home,
  body.homepage-layout-mode--desktop-full .homepage-layout__search-row > .follow-search-example-row,
  body.homepage-layout-mode--desktop-full .homepage-layout__feed-header-row > .realtime-hit-feed__header,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--center > .realtime-hit-feed,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__carousel,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__viewport,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--center > .realtime-hit-feed .realtime-hit-feed__dots-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--left > .homepage-rail,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--left > .homepage-rail > .homepage-rail__stack,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--left .homepage-rail-card,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--right > .homepage-rail,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--right > .homepage-rail > .homepage-rail__stack,
  body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-card {
    width: 100%;
    max-width: 100%;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-card--metrics {
    position: relative;
    margin-top: 0;
    padding: 18px 14px 22px;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-heading--metrics {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin: 0 0 12px;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-heading--metrics .homepage-rail-heading__wordmark {
    width: 96px;
    background: #111827;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: contain;
    mask-size: contain;
  }

  body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-heading--metrics .homepage-rail-heading__text {
    color: #111827;
  }

  body.homepage-layout-mode--desktop-full .homepage-tracking-results-host {
    width: 100%;
    max-width: var(--homepage-center-lane-width);
    margin-left: auto;
    margin-right: auto;
  }

  body.homepage-layout-mode--desktop-full .homepage-tracking-results-host > .follow-search-tracking,
  body.homepage-layout-mode--desktop-full .homepage-tracking-results-host > .page-shell {
    width: 100%;
    max-width: 100%;
  }
}

html.theme-dark body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-heading--metrics .homepage-rail-heading__wordmark {
  background: #eef4fb;
}

html.theme-dark body.homepage-layout-mode--desktop-full .homepage-layout__column--right .homepage-rail-heading--metrics .homepage-rail-heading__text {
  color: #eef4fb;
}

@media (min-width: 768px) {
  body.homepage-layout-mode--deck .follow-kindness {
    padding-bottom: calc(var(--footer-row-min-height) + 72px);
  }
}

.follow-search-shell {
  width: min(380px, calc(100% - 30px));
  margin: 24px auto 0;
  position: relative;
  box-sizing: border-box;
}

.follow-search-shell--home {
  --follow-search-shell-stroke: rgba(15, 23, 42, 0.10);
  --follow-search-dropdown-open-height: 520px;
  --follow-search-dropdown-space: 0px;
  width: 100%;
  max-width: var(--ks-home-shell-fluid);
  margin: 16px auto 0;
  margin-bottom: calc(-1 * var(--follow-search-dropdown-space));
  position: relative;
  z-index: 20;
  isolation: isolate;
  overflow: visible;
  box-sizing: border-box;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  min-height: 56px;
  padding-bottom: var(--follow-search-dropdown-space);
  transition:
    padding-bottom 750ms cubic-bezier(0.37, 0, 0.63, 1),
    margin-bottom 750ms cubic-bezier(0.37, 0, 0.63, 1),
    z-index 0ms linear;
}

body.homepage-search-front .follow-search-shell--home {
  transition: z-index 0ms linear;
}

.follow-search-shell--home::before {
  content: none;
}

.follow-search-shell__shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 56px;
  display: block;
  overflow: visible;
  pointer-events: none;
  z-index: 1;
}

.follow-search-shell__shape-fill {
  fill: rgba(255, 255, 255, 0.98);
  filter: url(#follow-search-shell-shadow);
}

.follow-search-shell__shape-stroke {
  fill: none;
  stroke: var(--follow-search-shell-stroke);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
  stroke-linejoin: round;
  stroke-linecap: round;
}

.time-search-active .follow-search-shell--home {
  --follow-search-shell-stroke: rgba(255, 255, 255, 0.92);
  z-index: 40;
}

.stopwatch-search-active .follow-search-shell--home {
  --follow-search-shell-stroke: rgba(255, 255, 255, 0.92);
  z-index: 5;
}

.time-search-active .follow-search-shell__shape-fill {
  fill: #00a1ce;
}

.time-search-active .follow-search-shell--home.is-dropdown-open .follow-search-shell__shape-fill,
.time-search-active .follow-search-shell--home.is-dropdown-closing .follow-search-shell__shape-fill {
  fill: #0698c4;
}

.time-search-active .follow-search-shell__shape-stroke {
  stroke: var(--follow-search-shell-stroke);
}

.stopwatch-search-active .follow-search-shell__shape-fill {
  fill: transparent;
}

.stopwatch-search-active .follow-search-shell__shape-stroke {
  stroke: var(--follow-search-shell-stroke);
}

.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search-shell__shape-fill {
  fill: rgba(255, 255, 255, 0.98);
}

.stopwatch-search-active .follow-search-shell--home.is-dropdown-closing .follow-search-shell__shape-fill {
  fill: transparent;
}

.follow-search-shell--home.is-dropdown-open {
  z-index: 97;
}

.follow-search-shell--home.is-dropdown-closing {
  z-index: 97;
}

.follow-search {
  width: 100%;
  height: 40px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  border-radius: var(--ks-radius-md);
  transition: none;
}

.follow-search--home {
  width: 100%;
  height: 56px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  border-radius: 0;
  transition: none;
  position: relative;
  z-index: 2;
}

.follow-search-shell--home.is-dropdown-open .follow-search--home {
  border-radius: 0;
}

.follow-search-shell--home.is-dropdown-closing .follow-search--home {
  border-radius: 0;
}

.follow-search.track-kindness-search {
  margin: var(--ks-space-32) auto var(--ks-space-40);
}

.track-kindness-page__inner > .follow-search.track-kindness-search {
  width: min(380px, calc(100% - 30px));
  margin: var(--ks-space-32) auto var(--ks-space-40) !important;
}

.track-kindness-page__inner > .story-map-card.track-kindness-map-card {
  margin-top: 0 !important;
}

.follow-search.is-invalid {
  box-shadow: none;
}

.follow-search-field {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  border-radius: var(--ks-radius-md) 0 0 var(--ks-radius-md);
}

.follow-search-field.is-invalid {
  box-shadow: 0 0 0 1px #d93025;
}

.follow-search--home .follow-search-field {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  height: 56px;
  display: flex;
  align-items: center;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
}

.time-search-active .follow-search--home .follow-search-field {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.stopwatch-search-active .follow-search--home .follow-search-field {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-field {
  border-radius: 0;
  border-bottom-color: transparent;
  box-shadow: none;
}

.follow-search-shell--home.is-dropdown-closing .follow-search--home .follow-search-field {
  border-radius: 0;
  border-bottom-color: transparent;
  box-shadow: none;
}

.follow-search--home .follow-search-field.is-invalid {
  box-shadow: 0 0 0 1px #d93025;
}

.follow-search--home .follow-search-leading {
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #0ea5e9;
}

.time-search-active .follow-search--home .follow-search-leading,
.time-search-active .follow-search-magnifier__svg {
  color: #ffffff;
}

.stopwatch-search-active .follow-search--home .follow-search-leading,
.stopwatch-search-active .follow-search-magnifier__svg {
  color: #ffffff;
}

.time-search-active .follow-search-leading__ks-image,
.time-search-active .follow-kindness-title__image,
.time-search-active .ks-short-logo,
.time-search-active .kindsteps-logo,
.time-search-active .bird-corner {
  color: #ffffff;
}

.stopwatch-search-active .top-nav .ks-short-logo,
.stopwatch-search-active .top-nav .kindsteps-logo,
.stopwatch-search-active .top-nav .bird-corner {
  color: #ff6b6b;
  opacity: 1;
}

.stopwatch-search-active .follow-kindness-title__image,
.stopwatch-search-active .follow-search-leading__ks-image,
.stopwatch-search-active .follow-kindness .ks-short-logo,
.stopwatch-search-active .follow-kindness .kindsteps-logo {
  color: #ff6b6b;
  opacity: 1;
}

.follow-search--home .follow-search-leading__ks-image {
  display: block;
  width: 26px;
  height: 26px;
  color: var(--color-button-primary);
}

.follow-search-magnifier {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  flex: 0 0 16px;
}

.follow-search-magnifier__svg {
  display: block;
  width: 16px;
  height: 16px;
  overflow: visible;
  color: #6b7280;
}

.follow-search--home .follow-search-leading__icon {
  display: none;
}

.follow-search--home.is-active .follow-search-leading__ks-image,
.follow-search--home.has-value .follow-search-leading__ks-image {
  display: none;
}

.follow-search--home.is-active .follow-search-leading__icon,
.follow-search--home.has-value .follow-search-leading__icon {
  display: block;
}

.follow-search-input {
  width: 100%;
  min-width: 0;
  height: 40px;
  border: 1px solid var(--color-card-border);
  border-right: 0;
  border-radius: var(--ks-radius-md) 0 0 var(--ks-radius-md);
  background: #ffffff;
  color: var(--color-text);
  box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12);
  padding: 0 14px;
  font-size: var(--ks-font-size-body);
  appearance: none;
  -webkit-appearance: none;
  outline: none;
}

.follow-search--home .follow-search-input {
  flex: 1 1 auto;
  min-width: 0;
  height: 56px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-text);
  box-shadow: none;
  padding: 0 8px 0 0;
  font-size: var(--ks-font-size-body-lg);
  font-weight: var(--ks-font-weight-regular);
  appearance: none;
  -webkit-appearance: none;
  outline: none;
}

.time-search-active .follow-search--home .follow-search-input {
  color: #ffffff;
}

.stopwatch-search-active .follow-search--home .follow-search-input {
  color: #ffffff;
}

.follow-search--home .follow-search-input:focus,
.follow-search--home .follow-search-input:focus-visible,
.follow-search--home .follow-search-input:active {
  outline: none;
  box-shadow: none;
  border-color: transparent;
}

.follow-search-input:focus,
.follow-search-input:focus-visible,
.follow-search-input:active {
  outline: none;
  box-shadow: none;
  border-color: var(--color-card-border);
}

.follow-search--home .follow-search-input.is-invalid,
.follow-search--home .follow-search-input.is-invalid:focus,
.follow-search--home .follow-search-input.is-invalid:focus-visible,
.follow-search--home .follow-search-input.is-invalid:active {
  border-color: #d93025;
  box-shadow: inset 0 0 0 1px #d93025;
}

.follow-search-input.is-invalid,
.follow-search-input.is-invalid:focus,
.follow-search-input.is-invalid:focus-visible,
.follow-search-input.is-invalid:active {
  border-color: #d93025;
  box-shadow: inset 0 0 0 1px #d93025;
}

.follow-search-field.is-invalid .follow-search-input {
  border-color: #d93025 !important;
  box-shadow: none !important;
  background: #ffffff;
}

.follow-search--home .follow-search-field.is-invalid .follow-search-input {
  box-shadow: none !important;
  background: transparent;
}

.follow-search-input::placeholder {
  color: rgba(17, 24, 39, 0.52);
  font-size: var(--ks-font-size-body);
  opacity: 1;
}

.follow-search--home .follow-search-input::placeholder {
  color: rgba(17, 24, 39, 0.46);
  font-size: var(--ks-font-size-body-lg);
  opacity: 1;
}

.time-search-active .follow-search--home .follow-search-input::placeholder {
  color: rgba(255, 255, 255, 0.74);
}

.stopwatch-search-active .follow-search--home .follow-search-input::placeholder {
  color: rgba(255, 255, 255, 0.76);
}

.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-field {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-input,
.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-leading,
.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search-magnifier__svg,
.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-clear,
.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-btn {
  color: #ff6b6b;
}

.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-clear__x::before,
.stopwatch-search-active .follow-search-shell--home.is-dropdown-open .follow-search--home .follow-search-clear__x::after {
  background: #ff6b6b;
}

.stopwatch-search-active .follow-search--home .follow-search-btn:hover,
.stopwatch-search-active .follow-search--home .follow-search-btn:focus-visible,
.stopwatch-search-active .follow-search--home .follow-search-clear:hover,
.stopwatch-search-active .follow-search--home .follow-search-clear:focus-visible {
  opacity: 1;
  filter: none;
  outline: none;
}

.follow-search-btn {
  width: auto;
  flex: 0 0 auto;
  height: 40px;
  box-sizing: border-box;
  padding-left: 15px;
  padding-right: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-card-border);
  border-left: 0;
  border-radius: 0 var(--ks-radius-pill) var(--ks-radius-pill) 0;
  background: var(--color-button-primary);
  color: #ffffff;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
}

.follow-search-btn:hover,
.follow-search-btn:focus-visible {
  filter: brightness(0.94);
}

.follow-search-btn.is-disabled {
  background: var(--color-button-primary);
  border-color: var(--color-button-primary);
  color: #ffffff;
  cursor: not-allowed;
  filter: none;
  opacity: 1;
}

.follow-search--home .follow-search-clear,
.follow-search--home .follow-search-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: #475569;
  padding: 0;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.follow-search--home .follow-search-clear {
  width: 40px;
  height: 56px;
}

.follow-search--home .follow-search-clear__x {
  width: 20px;
  height: 20px;
  position: relative;
  display: block;
}

.follow-search--home .follow-search-clear__x::before,
.follow-search--home .follow-search-clear__x::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 1px;
  width: 2px;
  height: 18px;
  background: #475569;
  border-radius: 999px;
}

.follow-search-clear__x::before {
  transform: rotate(45deg);
}

.follow-search-clear__x::after {
  transform: rotate(-45deg);
}

.follow-search--home .follow-search-btn {
  width: 52px;
  height: 56px;
}

.follow-search--home .follow-search-btn__icon {
  display: block;
}

.follow-search--home .follow-search-btn:hover,
.follow-search--home .follow-search-btn:focus-visible,
.follow-search--home .follow-search-clear:hover,
.follow-search--home .follow-search-clear:focus-visible {
  filter: none;
  opacity: 0.88;
  outline: none;
}

.follow-search--home .follow-search-btn.is-disabled {
  cursor: not-allowed;
  filter: none;
  opacity: 0.45;
}

.time-search-active .follow-search-example,
.time-search-active .follow-search-scanbill__label,
.time-search-active .follow-search-tracking {
  color: #ffffff;
}

.stopwatch-search-active .follow-search-example,
.stopwatch-search-active .follow-search-scanbill__label,
.stopwatch-search-active .follow-search-tracking {
  color: #ffffff;
}

.time-search-active .follow-search--home .follow-search-clear,
.time-search-active .follow-search--home .follow-search-btn {
  color: #ffffff;
}

.stopwatch-search-active .follow-search--home .follow-search-clear,
.stopwatch-search-active .follow-search--home .follow-search-btn {
  color: #ffffff;
}

.time-search-active .follow-search--home .follow-search-clear__x::before,
.time-search-active .follow-search--home .follow-search-clear__x::after {
  background: #ffffff;
}

.stopwatch-search-active .follow-search--home .follow-search-clear__x::before,
.stopwatch-search-active .follow-search--home .follow-search-clear__x::after {
  background: #ffffff;
}

.time-search-active .follow-search-example-row {
  position: relative;
  z-index: 0;
}

.time-search-active .follow-search-example-divider {
  background: rgba(255, 255, 255, 0.58);
}

.stopwatch-search-active .follow-search-example-divider {
  background: rgba(255, 255, 255, 0.58);
}

.time-search-active .follow-search-example-serial {
  color: #ffffff;
}

.stopwatch-search-active .follow-search-example-serial {
  color: #ffffff;
}

.time-search-active .follow-search-example-serial:hover,
.time-search-active .follow-search-example-serial:focus-visible,
.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__label,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__label {
  color: #ffffff;
  opacity: 1;
}

.time-search-active .follow-search-scanbill__corner--tl,
.time-search-active .follow-search-scanbill__corner--tr,
.time-search-active .follow-search-scanbill__corner--bl,
.time-search-active .follow-search-scanbill__corner--br {
  border-color: #ffffff;
}

.stopwatch-search-active .follow-search-scanbill__corner--tl,
.stopwatch-search-active .follow-search-scanbill__corner--tr,
.stopwatch-search-active .follow-search-scanbill__corner--bl,
.stopwatch-search-active .follow-search-scanbill__corner--br {
  border-color: #ffffff;
}

.time-search-active .follow-search-scanbill__plus::before,
.time-search-active .follow-search-scanbill__plus::after {
  background: #ffffff;
}

.stopwatch-search-active .follow-search-scanbill__plus::before,
.stopwatch-search-active .follow-search-scanbill__plus::after {
  background: #ffffff;
}

.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--tl,
.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--tr,
.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--bl,
.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--br,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--tl,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--tr,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--bl,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--br {
  border-color: #ffffff;
}

.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__plus::before,
.time-search-active .follow-search-scanbill:hover .follow-search-scanbill__plus::after,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__plus::before,
.time-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__plus::after {
  background: #ffffff;
}

.time-search-active #search-results-content,
.time-search-active .track-kindness-page,
.time-search-active .follow-search-missing,
.time-search-active .follow-search-tracking {
  display: none !important;
}

.stopwatch-search-active #search-results-content,
.stopwatch-search-active .track-kindness-page,
.stopwatch-search-active .follow-search-missing,
.stopwatch-search-active .follow-search-tracking {
  display: none !important;
}

.time-search-active .follow-kindness-subtitle {
  color: #ffffff;
}

.stopwatch-search-active .follow-kindness-subtitle {
  color: #ff6b6b;
}

.stopwatch-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  width: fit-content;
  max-width: 100%;
  margin-top: 22px;
  flex-wrap: nowrap;
}

.stopwatch-controls__btn {
  appearance: none;
  -webkit-appearance: none;
  min-width: 72px;
  width: auto;
  height: 72px;
  min-height: 72px;
  border: 1px solid rgba(255, 107, 107, 0.84);
  border-radius: 50%;
  background: transparent;
  color: #ff6b6b;
  padding: 15px;
  font-size: 16px;
  line-height: 1.1;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
  aspect-ratio: 1 / 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.stopwatch-search-active .time-search-view--stopwatch .time-search-view__clock,
.stopwatch-search-active .time-search-view--stopwatch .time-search-view__clock-main,
.stopwatch-search-active .time-search-view--stopwatch .time-search-view__clock-fraction,
.stopwatch-search-active .time-search-view--stopwatch .time-search-view__region,
.stopwatch-search-active .time-search-view--stopwatch .time-search-view__hint,
.stopwatch-search-active .stopwatch-laps__label,
.stopwatch-search-active .stopwatch-laps__value {
  color: #ffffff;
}

.stopwatch-search-active .stopwatch-controls__btn {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.92);
  background: rgba(255, 255, 255, 0.08);
}

.stopwatch-search-active .stopwatch-controls__btn:hover,
.stopwatch-search-active .stopwatch-controls__btn:focus-visible {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.92);
}

.stopwatch-search-active .stopwatch-controls__btn:disabled {
  color: rgba(255, 255, 255, 0.55);
  border-color: rgba(255, 255, 255, 0.42);
}

.stopwatch-search-active .stopwatch-laps__row {
  border-top-color: rgba(255, 255, 255, 0.22);
}

.stopwatch-controls__btn:disabled {
  opacity: 1;
  cursor: default;
  box-shadow: none;
}

.stopwatch-controls__btn--primary,
.stopwatch-controls__btn--secondary {
  background: transparent;
  color: #ff6b6b;
}

.stopwatch-controls__btn:hover,
.stopwatch-controls__btn:focus-visible {
  background: #ff6b6b;
  color: #e6f6fb;
  border-color: #ff6b6b;
  outline: none;
}

.stopwatch-laps {
  width: min(100%, 360px);
  max-width: 100%;
  margin: 14px auto 0;
  display: grid;
  gap: 6px;
  justify-items: stretch;
}

.stopwatch-laps:empty {
  display: none;
}

.stopwatch-laps__row {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: 14px;
  padding-top: 6px;
  border-top: 1px solid rgba(255, 107, 107, 0.28);
  color: #ff6b6b;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.stopwatch-laps__label,
.stopwatch-laps__value {
  white-space: nowrap;
}

.stopwatch-laps__label {
  justify-self: start;
}

.stopwatch-laps__value {
  justify-self: end;
}

@media (max-width: 1023px) {
  .time-search-view--stopwatch .time-search-view__clock {
    width: min(100%, calc(100vw - 64px));
    font-size: clamp(28px, 7.4vw, 60px);
    letter-spacing: 0.04em;
  }

  .time-search-view--stopwatch {
    max-width: min(100%, 700px);
  }

  .time-search-view--stopwatch .time-search-view__clock-core {
    column-gap: 0;
  }

  .time-search-view--stopwatch .time-search-view__clock-main {
    gap: 4px;
  }

  .time-search-view--stopwatch .time-search-view__clock-char--main {
    width: 0.76em;
    min-width: 0.76em;
  }

  .time-search-view--stopwatch .time-search-view__clock-separator--main {
    width: 0.34em;
    min-width: 0.34em;
  }

  .time-search-view--stopwatch .time-search-view__clock-fraction {
    left: calc(100% + 6px);
    padding-top: 2px;
    font-size: 0.44em;
  }

  .time-search-view--stopwatch .time-search-view__clock-fraction--mirror {
    right: calc(100% + 6px);
  }

  .stopwatch-controls {
    gap: 14px;
  }

  .stopwatch-controls__btn {
    padding: 13px;
    font-size: 15px;
  }

  .stopwatch-laps__row {
    min-width: 0;
    font-size: 13px;
    gap: 10px;
  }
}

@media (max-width: 767px) {
  .stopwatch-search-active .follow-kindness {
    background-position: calc(50% + 250px) top;
    background-size: auto 100svh;
    background-attachment: scroll;
  }

  .time-search-view--stopwatch {
    max-width: 100%;
    padding-inline: 20px;
    box-sizing: border-box;
  }

  .time-search-view--stopwatch .time-search-view__clock {
    width: min(100%, calc(100vw - 40px));
    font-size: clamp(24px, 6.8vw, 44px);
    letter-spacing: 0.02em;
  }

  .time-search-view--stopwatch .time-search-view__clock-core {
    column-gap: 0;
  }

  .time-search-view--stopwatch .time-search-view__clock-main {
    gap: 4px;
  }

  .time-search-view--stopwatch .time-search-view__clock-char--main {
    width: 0.76em;
    min-width: 0.76em;
  }

  .time-search-view--stopwatch .time-search-view__clock-separator--main {
    width: 0.3em;
    min-width: 0.3em;
  }

  .time-search-view--stopwatch .time-search-view__clock-fraction {
    left: calc(100% + 5px);
    padding-top: 1px;
    font-size: 0.25em;
  }

  .time-search-view--stopwatch .time-search-view__clock-fraction--mirror {
    right: calc(100% + 5px);
  }

  .stopwatch-laps {
    width: min(100%, 280px);
  }

  .stopwatch-controls {
    gap: 12px;
  }

  .stopwatch-controls__btn {
    min-width: 66px;
    width: 66px;
    height: 66px;
    min-height: 66px;
    padding: 12px;
    font-size: 14px;
  }

  .stopwatch-laps__row {
    font-size: 12px;
    gap: 8px;
  }
}

.follow-search-shell--home .follow-search-dropdown[hidden] {
  display: none;
}

.follow-search-shell--home .follow-search-dropdown {
  position: absolute;
  top: 56px;
  left: 0;
  right: 0;
  margin-top: 0;
  z-index: 2;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition:
    max-height 750ms cubic-bezier(0.37, 0, 0.63, 1),
    opacity 220ms ease;
  pointer-events: none;
  background: transparent;
  border-radius: 0 0 28px 28px;
}

.follow-search-shell--home.is-dropdown-open .follow-search-dropdown {
  opacity: 1;
  max-height: var(--follow-search-dropdown-open-height);
  pointer-events: auto;
}

.follow-search-shell--home.is-dropdown-closing .follow-search-dropdown {
  opacity: 1;
  max-height: 0;
  pointer-events: none;
}

.follow-search-shell--home .follow-search-dropdown__inner {
  min-height: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
  padding-top: 18px;
  padding-bottom: 29px;
  position: relative;
  z-index: 3;
  opacity: 0;
  transition: opacity 180ms ease;
}

.follow-search-shell--home .follow-search-dropdown__inner::before {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  top: 0;
  height: 1px;
  background: var(--follow-search-shell-stroke);
  opacity: 0;
  transition: opacity 120ms ease;
}

.follow-search-shell--home.is-dropdown-open .follow-search-dropdown__inner::before {
  opacity: 1;
  transition-delay: 360ms;
}

.follow-search-shell--home.is-dropdown-closing .follow-search-dropdown__inner::before {
  opacity: 0;
  transition-delay: 0ms;
}

.follow-search-shell--home.is-dropdown-open .follow-search-dropdown__inner {
  opacity: 1;
  transition-delay: 70ms;
}

.follow-search-shell--home.is-dropdown-closing .follow-search-dropdown__inner {
  opacity: 1;
  transition-delay: 0ms;
}

.follow-search-shell--home .follow-search-dropdown__item {
  width: calc(100% - 24px);
  min-height: 38px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 9px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: rgba(17, 24, 39, 0.92);
  margin-inline: auto;
  padding: 8px 20px;
  text-align: left;
  font-size: 16px;
  font-weight: 400;
  cursor: pointer;
}

.follow-search-shell--home .follow-search-dropdown__icon {
  flex: 0 0 16px;
  margin-top: 3px;
}

.follow-search-shell--home .follow-search-dropdown__label {
  display: block;
}

.follow-search-shell--home .follow-search-dropdown__content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.follow-search-shell--home .follow-search-dropdown__title {
  display: block;
  color: #111827;
  font-size: 16px;
  line-height: 1.18;
  font-weight: 500;
}

.follow-search-shell--home .follow-search-dropdown__meta {
  display: block;
  color: #6b7280;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 500;
}

.follow-search-shell--home .follow-search-dropdown__description {
  display: block;
  color: #4b5563;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 400;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.follow-search-shell--home .follow-search-dropdown__highlight {
  background: #ffe66d;
  color: inherit;
  padding: 0 1px;
  border-radius: 2px;
}

.follow-search-shell--home .follow-search-dropdown__empty {
  padding: 16px 20px 18px;
}

.follow-search-shell--home .follow-search-dropdown__empty-title,
.follow-search-shell--home .follow-search-dropdown__empty-copy {
  margin: 0;
}

.follow-search-shell--home .follow-search-dropdown__empty-title {
  color: #111827;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 600;
}

.follow-search-shell--home .follow-search-dropdown__empty-copy {
  margin-top: 4px;
  color: #6b7280;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 400;
}

.follow-search-shell--home .follow-search-dropdown__item:hover,
.follow-search-shell--home .follow-search-dropdown__item:focus-visible {
  background: #f3f4f6;
  outline: none;
}

body:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home .follow-search-dropdown__item {
  width: 100%;
  margin-inline: 0;
  border-radius: 0;
  padding-inline: 28px;
}

body:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home .follow-search-dropdown__item:hover,
body:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home .follow-search-dropdown__item:focus-visible {
  background: #eef1f2;
}

.time-search-active .follow-search-shell--home .follow-search-dropdown__inner {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  padding-bottom: 34px;
}

.time-search-active .follow-search-shell--home .follow-search-dropdown__item,
.time-search-active .follow-search-shell--home .follow-search-dropdown__title,
.time-search-active .follow-search-shell--home .follow-search-dropdown__meta,
.time-search-active .follow-search-shell--home .follow-search-dropdown__description,
.time-search-active .follow-search-shell--home .follow-search-dropdown__empty-title,
.time-search-active .follow-search-shell--home .follow-search-dropdown__empty-copy,
.time-search-active .follow-search-shell--home .follow-search-dropdown__icon {
  color: #ffffff;
}

.time-search-active .follow-search-shell--home .follow-search-dropdown__item {
  width: 100%;
  margin-inline: 0;
  border-radius: 0;
  padding-inline: 28px;
}

.time-search-active .follow-search-shell--home .follow-search-dropdown__item:hover,
.time-search-active .follow-search-shell--home .follow-search-dropdown__item:focus-visible {
  background: rgba(255, 255, 255, 0.08);
}

.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__inner {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  padding-bottom: 34px;
}

.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__inner::before {
  background: #ff6b6b;
}

.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__item,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__title,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__meta,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__description,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__empty-title,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__empty-copy,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__icon {
  color: #ff6b6b;
}

.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__item {
  width: 100%;
  margin-inline: 0;
  border-radius: 0;
  padding-inline: 28px;
}

.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__item:hover,
.stopwatch-search-active .follow-search-shell--home .follow-search-dropdown__item:focus-visible {
  background: #eef1f2;
  color: #ff6b6b;
  outline: none;
}

.stopwatch-search-active .follow-search-example-serial:hover,
.stopwatch-search-active .follow-search-example-serial:focus-visible,
.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__label,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__label,
.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--tl,
.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--tr,
.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--bl,
.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__corner--br,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--tl,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--tr,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--bl,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__corner--br {
  color: #ffffff;
  border-color: #ffffff;
  opacity: 1;
}

.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__plus::before,
.stopwatch-search-active .follow-search-scanbill:hover .follow-search-scanbill__plus::after,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__plus::before,
.stopwatch-search-active .follow-search-scanbill:focus-visible .follow-search-scanbill__plus::after {
  background: #ffffff;
}

.follow-search-example-row {
  margin: 12px auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(100%, var(--ks-home-shell-fluid));
  flex-wrap: nowrap;
  gap: 0;
  text-align: center;
}

.follow-search-scanbill {
  --scanbill-frame-width-open: 52px;
  --scanbill-frame-width-closed: 22px;
  --scanbill-hover-close-duration: 500ms;
  --scanbill-hover-hold-duration: 250ms;
  --scanbill-hover-open-duration: 500ms;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
}

.follow-search-scanbill:hover .follow-search-scanbill__label,
.follow-search-scanbill:focus-visible .follow-search-scanbill__label {
  color: #111827;
}

.follow-search-scanbill__viewfinder {
  position: relative;
  width: 52px;
  height: 22px;
  flex: 0 0 auto;
}

.follow-search-scanbill__viewfinder::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 88px;
  height: 58px;
  transform: translate(-50%, -50%) scale(0.9);
  border-radius: 999px;
  background:
    radial-gradient(
      ellipse at center,
      rgba(255, 255, 255, 0.78) 0%,
      rgba(255, 255, 255, 0.42) 28%,
      rgba(255, 255, 255, 0.14) 54%,
      rgba(255, 255, 255, 0) 78%
    );
  opacity: 0;
  pointer-events: none;
}

.follow-search-scanbill__frame {
  position: absolute;
  left: 50%;
  top: 0;
  width: var(--scanbill-frame-width-open);
  height: 22px;
  transform: translateX(-50%);
  transform-origin: center center;
}

.follow-search-scanbill__corner {
  position: absolute;
  width: 9px;
  height: 9px;
  display: block;
}

.follow-search-scanbill__corner--tl {
  top: 0;
  left: 0;
  border-top: 2px solid #111827;
  border-left: 2px solid #111827;
}

.follow-search-scanbill__corner--tr {
  top: 0;
  right: 0;
  border-top: 2px solid #111827;
  border-right: 2px solid #111827;
}

.follow-search-scanbill__corner--bl {
  bottom: 0;
  left: 0;
  border-bottom: 2px solid #111827;
  border-left: 2px solid #111827;
}

.follow-search-scanbill__corner--br {
  right: 0;
  bottom: 0;
  border-right: 2px solid #111827;
  border-bottom: 2px solid #111827;
}

.follow-search-scanbill__plus {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 11px;
  height: 11px;
  transform: translate(-50%, -50%);
}

.follow-search-scanbill__plus::before,
.follow-search-scanbill__plus::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: #111827;
  transform: translate(-50%, -50%);
}

.follow-search-scanbill__plus::before {
  width: 11px;
  height: 1px;
}

.follow-search-scanbill__plus::after {
  width: 1px;
  height: 11px;
}

.follow-search-scanbill:hover .follow-search-scanbill__corner--tl,
.follow-search-scanbill:hover .follow-search-scanbill__corner--tr,
.follow-search-scanbill:hover .follow-search-scanbill__corner--bl,
.follow-search-scanbill:hover .follow-search-scanbill__corner--br,
.follow-search-scanbill:focus-visible .follow-search-scanbill__corner--tl,
.follow-search-scanbill:focus-visible .follow-search-scanbill__corner--tr,
.follow-search-scanbill:focus-visible .follow-search-scanbill__corner--bl,
.follow-search-scanbill:focus-visible .follow-search-scanbill__corner--br {
  border-color: #111827;
}

.follow-search-scanbill:hover .follow-search-scanbill__plus::before,
.follow-search-scanbill:hover .follow-search-scanbill__plus::after,
.follow-search-scanbill:focus-visible .follow-search-scanbill__plus::before,
.follow-search-scanbill:focus-visible .follow-search-scanbill__plus::after {
  background: #111827;
}

.follow-search-scanbill.is-hover-animating .follow-search-scanbill__frame {
  animation: scanbill-viewfinder-cycle calc(
    var(--scanbill-hover-close-duration)
    + var(--scanbill-hover-hold-duration)
    + var(--scanbill-hover-open-duration)
  ) forwards;
}

.follow-search-scanbill.is-hover-animating .follow-search-scanbill__viewfinder::after {
  animation: scanbill-viewfinder-flash 420ms ease-out forwards;
}

@keyframes scanbill-viewfinder-cycle {
  0% {
    width: var(--scanbill-frame-width-open);
    transform: translateX(-50%) scale(1);
    opacity: 1;
  }

  34% {
    width: var(--scanbill-frame-width-closed);
    transform: translateX(-50%) scale(0.88);
    opacity: 0.72;
  }

  48% {
    width: var(--scanbill-frame-width-closed);
    transform: translateX(-50%) scale(0.88);
    opacity: 0.72;
  }

  78% {
    width: var(--scanbill-frame-width-open);
    transform: translateX(-50%) scale(1.03);
    opacity: 1;
  }

  100% {
    width: var(--scanbill-frame-width-open);
    transform: translateX(-50%) scale(1);
    opacity: 1;
  }
}

@keyframes scanbill-viewfinder-flash {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.88);
  }

  22% {
    opacity: 0.9;
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .follow-search-scanbill.is-hover-animating .follow-search-scanbill__frame {
    animation: none;
  }

  .follow-search-scanbill.is-hover-animating .follow-search-scanbill__viewfinder::after {
    animation: none;
  }
}

.follow-search-scanbill__label {
  margin: 0;
  color: #111827;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 400;
  font-style: italic;
  text-transform: none;
  font-family: inherit;
}

.follow-search-example-divider {
  width: 1px;
  height: 15px;
  background: rgba(17, 24, 39, 0.4);
  margin: 0 12px;
  flex: 0 0 auto;
}

.follow-search-example {
  margin: 0;
  padding-top: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: #111827;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 400;
  font-style: italic;
  font-family: inherit;
  white-space: nowrap;
}

.follow-search-example__label--wide {
  display: none;
}

.follow-search-example-serial {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin-left: 0;
  color: #111827;
  font: inherit;
  font-style: normal;
  cursor: pointer;
  transition: color 160ms ease;
}

.follow-search-example-serial:hover,
.follow-search-example-serial:focus-visible {
  color: var(--color-button-primary);
  outline: none;
}

@media (min-width: 768px) {
  .follow-search-example-row {
    display: flex;
    justify-content: center;
    width: min(100%, var(--ks-home-shell-fluid));
  }

  .follow-search-example__label--phone {
    display: none;
  }

  .follow-search-example__label--wide {
    display: inline;
  }
}

.follow-search-tracking {
  width: min(100%, var(--homepage-center-lane-width, var(--ks-home-shell-fluid)));
  margin: 24px auto 0;
  color: var(--color-button-primary);
  font-size: 20px;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
}

.realtime-hit-feed {
  --realtime-feed-collapse-duration: 3500ms;
  --realtime-feed-panel-duration: 900ms;
  --realtime-feed-dot-phase-duration: 1500ms;
  --realtime-feed-dot-yo-yo-duration: 3500ms;
  --realtime-feed-dot-spread-width: calc(var(--ks-home-shell-fluid) - 24px);
  width: var(--ks-home-shell-fluid);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: var(--ks-shell-radius-card);
  background: transparent;
  box-shadow: none;
  text-align: left;
  overflow: visible;
  position: relative;
  z-index: 0;
  box-sizing: border-box;
  transition:
    background-color 260ms ease;
}

.realtime-hit-feed__header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  min-height: 28px;
  padding: 0 15px;
  position: relative;
  z-index: 0;
  transition: none;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .realtime-hit-feed__header {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-start;
    padding: 0;
  }

  .realtime-hit-feed__title {
    font-size: 11px;
  }

  .realtime-hit-feed__wordmark {
    width: 108px;
    margin-left: -7px;
    margin-right: -7px;
  }

  .realtime-hit-feed__header-actions {
    min-width: 0;
    justify-self: auto;
  }
}

.realtime-hit-feed__header::after {
  display: none;
}

.realtime-hit-feed__title {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--ks-feed-title-gap);
  flex: 0 1 auto;
  min-width: 0;
  color: #111827;
  font-size: 12px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.realtime-hit-feed__title-prefix,
.realtime-hit-feed__title-suffix {
  display: inline-flex;
  align-items: center;
}

.realtime-hit-feed__wordmark {
  display: inline-flex;
  align-items: center;
  width: 122px;
  height: 22px;
  background: #111827;
  -webkit-mask: url("../assets/kindsteps_word.svg") center / contain no-repeat;
  mask: url("../assets/kindsteps_word.svg") center / contain no-repeat;
  transform: translateY(-1px);
  margin-left: -9px;
  margin-right: -9px;
}

.realtime-hit-feed__title-suffix {
  margin-left: 0;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.realtime-hit-feed__viewport {
  --realtime-feed-shell-stroke: var(--ks-color-neutral-divider);
  --realtime-feed-open-height: var(--ks-feed-open-height-desktop);
  position: relative;
  margin-top: 0;
  overflow-x: hidden;
  overflow-y: auto;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  border: 1px solid var(--ks-card-material-border);
  border-radius: var(--ks-shell-radius-card);
  background: #f8fafc;
  background-image:
    linear-gradient(180deg, rgba(226, 232, 240, 0.54) 0%, rgba(248, 250, 252, 0.82) 12px, rgba(255, 255, 255, 0.98) 42px, rgba(248, 250, 252, 0.98) 100%);
  height: auto;
  max-height: none;
  box-shadow: var(--ks-shadow-card-window);
  isolation: isolate;
  z-index: 0;
  clip-path: none;
  transition:
    height var(--realtime-feed-panel-duration) cubic-bezier(0.37, 0, 0.63, 1),
    opacity var(--realtime-feed-panel-duration) cubic-bezier(0.37, 0, 0.63, 1),
    border-color 520ms ease,
    box-shadow 520ms ease;
}

.realtime-hit-feed:has(.realtime-hit-feed__card--metrics.is-active) .realtime-hit-feed__viewport {
  border-width: 1px;
  border-color: color-mix(in srgb, var(--realtime-feed-shell-stroke) 78%, rgba(148, 163, 184, 0.32));
  box-shadow: var(--ks-shadow-card-window);
  clip-path: none;
}

.realtime-hit-feed:has(.realtime-hit-feed__card--chart.is-active) .realtime-hit-feed__viewport {
  border-width: 1px;
  border-color: color-mix(in srgb, var(--realtime-feed-shell-stroke) 78%, rgba(148, 163, 184, 0.32));
  box-shadow: var(--ks-shadow-card-window);
  clip-path: none;
}

.realtime-hit-feed__carousel {
  position: relative;
  z-index: 0;
  margin-top: 0;
  padding-bottom: 0;
  overflow: visible;
  transition:
    margin-top var(--realtime-feed-panel-duration) cubic-bezier(0.37, 0, 0.63, 1),
    padding-bottom var(--realtime-feed-panel-duration) cubic-bezier(0.37, 0, 0.63, 1),
    opacity 360ms ease;
}

:root {
  --ks-collapse-line-color: rgba(0, 0, 0, 0.82);
  --ks-collapse-line-thickness: 1px;
  --ks-collapse-line-scale: 0.5;
  --ks-collapse-shell-stroke: rgba(0, 0, 0, 0.74);
}

.realtime-hit-feed__line {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: var(--ks-collapse-line-thickness);
  margin-top: 0;
  background: var(--ks-collapse-line-color);
  border-radius: 999px;
  transform: scaleY(var(--ks-collapse-line-scale));
  transform-origin: center;
  z-index: 1;
  pointer-events: none;
}

.realtime-hit-feed__header-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  margin-left: 0;
}

.realtime-hit-feed__dots-wrap {
  position: relative;
  z-index: 0;
  margin-top: var(--homepage-realtime-dots-gap);
  height: 24px;
  min-height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

@media (max-width: 767px) {
  .realtime-hit-feed__dots-wrap.is-mobile-rolling {
    width: 95vw;
    max-width: 95vw;
    height: 56px;
    min-height: 56px;
    align-items: flex-start;
    left: 50%;
    transform: translateX(-50%);
    overflow: visible;
  }
}

.realtime-hit-feed__dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  position: relative;
  z-index: 0;
  margin-top: 0;
  height: 20px;
}

.realtime-hit-feed__dots.is-mobile-rolling {
  display: block;
  width: 100%;
  height: 56px;
}

.realtime-hit-feed__dot {
  --realtime-feed-dot-shift: 0px;
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.5);
  cursor: pointer;
  transition: transform 180ms ease, background-color 180ms ease, opacity 180ms ease;
  transform-origin: center center;
}

.realtime-hit-feed__dots.is-mobile-rolling .realtime-hit-feed__dot {
  position: absolute;
  left: 0;
  top: 0;
  margin: 0;
  transition: background-color 180ms ease, opacity 180ms ease;
}

.realtime-hit-feed__dot:nth-child(1) {
  --realtime-feed-dot-shift: calc(var(--realtime-feed-dot-spread-width) * -0.5);
  --realtime-feed-dot-collapse-shift: 36px;
}

.realtime-hit-feed__dot:nth-child(2) {
  --realtime-feed-dot-shift: calc(var(--realtime-feed-dot-spread-width) * -0.25);
  --realtime-feed-dot-collapse-shift: 18px;
}

.realtime-hit-feed__dot:nth-child(3) {
  --realtime-feed-dot-shift: 0px;
  --realtime-feed-dot-collapse-shift: 0px;
}

.realtime-hit-feed__dot:nth-child(4) {
  --realtime-feed-dot-shift: calc(var(--realtime-feed-dot-spread-width) * 0.25);
  --realtime-feed-dot-collapse-shift: -18px;
}

.realtime-hit-feed__dot:nth-child(5) {
  --realtime-feed-dot-shift: calc(var(--realtime-feed-dot-spread-width) * 0.5);
  --realtime-feed-dot-collapse-shift: -36px;
}

.realtime-hit-feed__dot:hover,
.realtime-hit-feed__dot:focus-visible {
  background: rgba(100, 116, 139, 0.8);
  transform: scale(1.12);
  outline: none;
}

.realtime-hit-feed__dot.is-active {
  background: rgba(71, 85, 105, 0.95);
  transform: scale(1.14);
}

.realtime-hit-feed__collapse-dot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(71, 85, 105, 0.95);
  transform: translate(-50%, -50%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 180ms ease, transform 180ms ease;
}

.realtime-hit-feed__peek {
  display: none;
}

.realtime-hit-feed__peek--left {
  left: -18px;
}

.realtime-hit-feed__peek--right {
  right: -18px;
}

.realtime-hit-feed__peek-shape {
  display: none;
}

.realtime-hit-feed__cards {
  position: relative;
  min-height: 0;
  height: var(--realtime-hit-feed-stable-height, 216px);
  overflow: hidden;
  border-radius: inherit;
  box-sizing: border-box;
  border: 0;
}

.realtime-hit-feed__cards:has(.realtime-hit-feed__card--metrics.is-active) {
  border: 0;
  background: #ffffff;
}

.realtime-hit-feed__cards:has(.realtime-hit-feed__card--chart.is-active) {
  border: 0;
  background: #ffffff;
}

.realtime-hit-feed__viewport::after {
  display: none;
}

.realtime-hit-feed__stream {
  position: relative;
  min-height: 0;
  height: auto;
  will-change: transform;
  opacity: 1;
  transition: opacity 150ms ease;
  overflow: hidden;
  border-radius: inherit;
  border: 0;
  background: #ffffff;
  box-sizing: border-box;
}

.realtime-hit-feed__carousel.is-transitioning .realtime-hit-feed__viewport,
.realtime-hit-feed__carousel.is-transitioning .realtime-hit-feed__peek {
  visibility: hidden;
}

.realtime-hit-feed__card {
  display: flex;
  position: absolute;
  inset: 0;
  min-height: 216px;
  height: var(--realtime-hit-feed-stable-height, 216px);
  padding: 18px;
  box-sizing: border-box;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.realtime-hit-feed__card--metrics {
  min-height: 216px;
  width: 100%;
  height: 100%;
  padding: 16px 14px 22px;
  background: #ffffff;
  color: var(--ks-color-neutral-text-secondary);
  border-radius: inherit;
  border: 0;
  box-shadow: none;
  box-sizing: border-box;
  position: relative;
  display: grid;
  grid-template-rows: auto auto 1fr;
  grid-template-columns: minmax(0, 1fr);
  row-gap: 8px;
  align-content: stretch;
  justify-items: stretch;
}

.realtime-hit-feed__card--metrics::after {
  display: none;
}

.realtime-hit-feed__card--chart {
  min-height: 216px;
  padding: 14px 14px 24px;
  background: #ffffff;
  color: #1e293b;
  border-radius: inherit;
  border: 0;
  box-shadow: none;
}

.realtime-hit-feed__card.is-active {
  position: absolute;
  inset: 0;
  width: 100%;
  min-width: 100%;
  height: 100%;
  flex-direction: column;
  justify-content: flex-start;
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  z-index: 1;
}

.realtime-hit-feed__card-kicker {
  color: var(--ks-color-primary-500);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 10px;
}

.realtime-hit-feed__card-title {
  margin: 0;
  color: #111827;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 700;
}

.realtime-hit-feed__card-title--metrics {
  color: #111827;
  font-size: 15px;
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__flat-chart-range--metrics,
.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__card-title--metrics,
.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__metrics-grid,
.homepage-rail-card--metrics > .realtime-hit-feed__flat-chart-range--metrics,
.homepage-rail-card--metrics > .realtime-hit-feed__card-title--metrics,
.homepage-rail-card--metrics > .realtime-hit-feed__metrics-grid {
  margin: 0;
  width: 100%;
  min-width: 100%;
}

.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__metric-label {
  display: block;
  white-space: nowrap;
}

.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__metric-label-full {
  display: block;
}

.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__metric-label-main {
  display: none;
}

.realtime-hit-feed__card--metrics-carousel .realtime-hit-feed__metric-label-sub {
  display: none;
}

.realtime-hit-feed__card-title-main {
  display: inline-block;
  line-height: 1;
  text-transform: none;
}

.realtime-hit-feed__card-title-tail {
  display: inline-block;
  line-height: 1;
}

.realtime-hit-feed__card-title--chart {
  color: #111827;
  font-size: 15px;
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 0;
}

.realtime-hit-feed__card--chart-stack {
  padding: 12px 14px 14px;
}

.realtime-hit-feed__flat-chart {
  --chart-label-gap: 14px;
  --chart-to-today-gap: 6px;
  --chart-axis-width: 28px;
  --flat-chart-average-top: 50%;
  --flat-chart-gap: 2px;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 8px;
  min-height: 100%;
  height: 100%;
}

.realtime-hit-feed__flat-chart-range {
  background: #f3f5f9;
  border-radius: 999px;
  padding: 4px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  position: relative;
  z-index: 3;
  pointer-events: auto;
}

.realtime-hit-feed__flat-chart-range::-webkit-scrollbar {
  display: none;
}

.realtime-hit-feed__flat-chart-range-button {
  border: 0;
  background: transparent;
  color: #6d7b94;
  font: inherit;
  font-size: 12px;
  line-height: 1;
  font-weight: 600;
  padding: 7px 0;
  border-radius: 999px;
  cursor: pointer;
  width: 100%;
  min-width: 0;
  transition: background-color 180ms ease, color 180ms ease;
  position: relative;
  z-index: 4;
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  text-align: center;
}

.realtime-hit-feed__flat-chart-range-button.is-active {
  background: #c9d3e0;
  color: #4b5f79;
}

.realtime-hit-feed__flat-chart-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.realtime-hit-feed__flat-chart-average {
  text-align: right;
  white-space: nowrap;
}

.realtime-hit-feed__flat-chart-average-value {
  display: block;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #111827;
}

.realtime-hit-feed__flat-chart-average-label {
  color: #8d97a9;
  font-size: 11px;
  line-height: 1.1;
  font-weight: 500;
}

.realtime-hit-feed__flat-chart-area {
  position: relative;
  min-height: 116px;
  padding: 6px var(--chart-axis-width) 0 0;
}

.realtime-hit-feed__flat-chart-line {
  position: absolute;
  left: 0;
  right: var(--chart-axis-width);
  border-top: 2px dashed #c9ced8;
  pointer-events: none;
}

.realtime-hit-feed__flat-chart-line--avg {
  top: var(--flat-chart-average-top);
}

.realtime-hit-feed__flat-chart-line--mid {
  top: calc(var(--flat-chart-average-top) + 26px);
  opacity: 0.8;
}

.realtime-hit-feed__flat-chart-bars {
  position: absolute;
  left: 0;
  right: var(--chart-axis-width);
  top: 0;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--flat-chart-gap);
  padding-bottom: var(--chart-label-gap);
}

.realtime-hit-feed__flat-chart-bar {
  display: block;
  width: auto;
  min-width: 0;
  flex: 1 1 0;
  min-height: 6px;
  background: var(--chart-bar-color, var(--ks-color-primary-500));
  border-radius: 0;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  clip-path: inset(0 round 0);
  opacity: 0.95;
}

.realtime-hit-feed__flat-chart-axis {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 18px;
  width: var(--chart-axis-width);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  color: #a0a8b7;
  font-size: 11px;
  line-height: 1;
  font-weight: 500;
}

.realtime-hit-feed__flat-chart-average-badge {
  position: absolute;
  right: 2px;
  top: calc(var(--flat-chart-average-top) - 12px);
  transform: translateY(-50%);
  background: var(--chart-bar-color, var(--ks-color-primary-500));
  color: #ffffff;
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  padding: 3px 6px;
  border-radius: 9px;
}

.realtime-hit-feed__flat-chart-axis-labels {
  display: flex;
  justify-content: space-between;
  padding-right: var(--chart-axis-width);
  color: #9ca5b5;
  font-size: 11px;
  line-height: 1;
  font-weight: 500;
  margin-bottom: var(--chart-to-today-gap);
}

.realtime-hit-feed__flat-chart-foot {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
}

.realtime-hit-feed__flat-chart-today-label {
  color: #8d97a9;
  font-size: 11px;
  line-height: 1;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.realtime-hit-feed__flat-chart-today-value {
  margin-top: 2px;
  font-size: 33px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -0.05em;
  color: #111827;
}

.realtime-hit-feed__flat-chart-note {
  color: #8d97a9;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}

.realtime-hit-feed__chart-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.realtime-hit-feed__chart-heading {
  min-width: 0;
  flex: 1 1 auto;
}

.realtime-hit-feed__chart-summary {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  justify-content: flex-end;
  flex: 0 0 auto;
  flex-wrap: wrap;
  margin-top: 0;
}

.realtime-hit-feed__chart-summary-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: #111827;
  font-size: 10px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
}

.realtime-hit-feed__chart-summary-item strong {
  font-size: 13px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #111827;
  margin-top: 8px;
}

.realtime-hit-feed__chart-summary-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.realtime-hit-feed__chart-summary-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
}

.realtime-hit-feed__chart-summary-dot--green {
  background: var(--ks-color-accent-green);
}

.realtime-hit-feed__chart-summary-dot--blue {
  background: var(--ks-color-primary-500);
}

.realtime-hit-feed__card-copy {
  margin: 10px 0 0;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 500;
}

.realtime-hit-feed__metrics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  min-width: 0;
  max-width: none;
  gap: 12px;
  margin-top: 0;
  padding-bottom: 4px;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  height: 100%;
  align-content: stretch;
  justify-items: stretch;
  justify-content: stretch;
}

.realtime-hit-feed__metric {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  width: 100%;
  height: 100%;
  padding: 12px;
  border-radius: 14px;
  background: #ffffff;
  background-image: var(--ks-card-material-surface-soft);
  box-shadow: var(--ks-shadow-card-plastic-sm);
  justify-content: flex-start;
  border: 0;
  position: relative;
  overflow: hidden;
}

.realtime-hit-feed__metric::after {
  content: "";
  position: absolute;
  inset: 0.5px;
  border: 1px solid color-mix(in srgb, var(--ks-color-accent-green) 68%, rgba(255, 255, 255, 0.72));
  border-radius: inherit;
  pointer-events: none;
  box-sizing: border-box;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    inset 0 -1px 0 rgba(15, 23, 42, 0.06);
}

.realtime-hit-feed__metric-value {
  color: var(--ks-color-accent-green);
  font-size: 24px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: -0.03em;
  margin-top: 0;
}

.realtime-hit-feed__metric-label {
  color: #111827;
  font-size: 10px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  min-height: 0;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.realtime-hit-feed__metric-label-main {
  display: block;
}

.realtime-hit-feed__metric-label-full {
  display: none;
}

.realtime-hit-feed__metric-label-sub {
  display: block;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.02em;
  text-transform: none;
  font-weight: 800;
}

.homepage-rail-card--metrics .realtime-hit-feed__metric-label-full {
  display: none;
}

.homepage-rail-card--metrics .realtime-hit-feed__metric-label-sub {
  display: block;
}

@media (max-width: 767px) {
  .realtime-hit-feed__card--metrics {
    padding: 14px 12px 18px;
  }

  .realtime-hit-feed__card--chart {
    padding: 14px 12px 18px;
  }

  .realtime-hit-feed__card--chart-stack {
    padding: 12px 12px 14px;
  }

  .realtime-hit-feed__card-title--metrics {
    font-size: 15px;
    line-height: 1.08;
    margin-bottom: 8px;
    gap: 5px;
  }

  .realtime-hit-feed__metric {
    min-height: 68px;
    padding: 11px 10px 12px;
  }

  .realtime-hit-feed__metric-value {
    font-size: clamp(18px, 5.2vw, 21px);
    line-height: 1.02;
    letter-spacing: -0.025em;
  }

  .realtime-hit-feed__metric-label {
    font-size: 9px;
    line-height: 1.18;
    letter-spacing: 0.05em;
  }

  .realtime-hit-feed__metrics-grid {
    gap: 10px;
    padding-bottom: 2px;
  }

  .realtime-hit-feed__chart-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
  }

  .realtime-hit-feed__card-title--chart {
    font-size: 14px;
    line-height: 1.1;
  }

  .realtime-hit-feed__flat-chart {
    gap: 7px;
  }

  .realtime-hit-feed__flat-chart-range-button {
    font-size: 11px;
    padding: 6px 10px;
  }

  .realtime-hit-feed__flat-chart-average-value {
    font-size: 15px;
  }

  .realtime-hit-feed__flat-chart-average-label,
  .realtime-hit-feed__flat-chart-today-label,
  .realtime-hit-feed__flat-chart-note,
  .realtime-hit-feed__flat-chart-axis-labels,
  .realtime-hit-feed__flat-chart-axis {
    font-size: 10px;
  }

  .realtime-hit-feed__flat-chart-area {
    min-height: 108px;
  }

  .realtime-hit-feed__flat-chart-today-value {
    font-size: 29px;
  }
}

.realtime-hit-feed__chart-legend {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 8px;
}

.realtime-hit-feed__chart-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #334155;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.realtime-hit-feed__chart-legend-item--peak {
  color: #0f172a;
}

.realtime-hit-feed__chart-legend-swatch {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
}

.realtime-hit-feed__chart-legend-swatch--gray {
  background: #94a3b8;
}

.realtime-hit-feed__chart-legend-swatch--green {
  background: var(--ks-color-accent-green);
}

.realtime-hit-feed__chart-legend-swatch--yellow {
  background: var(--ks-color-accent-yellow);
}

.realtime-hit-feed__chart-legend-swatch--blue {
  background: var(--ks-color-primary-500);
}

.realtime-hit-feed__chart {
  display: grid;
  grid-template-columns: repeat(31, minmax(0, 1fr));
  gap: 2px;
  align-items: end;
  flex: 1 1 auto;
  min-height: 132px;
  margin-top: 10px;
  padding: 10px 18px 24px;
  border-bottom: 0;
  border-top: 0;
  border-radius: 10px;
}

.realtime-hit-feed__chart--months {
  display: flex;
  align-items: flex-end;
  justify-content: stretch;
  gap: 12px;
  min-height: 118px;
  margin-top: 8px;
  padding: 4px 18px 10px;
  border-radius: 10px;
}

.realtime-hit-feed__chart-month {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  flex: var(--month-week-count) 1 0;
  min-width: 0;
}

.realtime-hit-feed__chart-month-bars {
  display: grid;
  grid-template-columns: repeat(var(--month-week-count), minmax(0, 1fr));
  align-items: flex-end;
  justify-content: stretch;
  gap: 4px;
  min-height: 92px;
}

.realtime-hit-feed__chart-day--month {
  width: 100%;
  min-width: 0;
}

.realtime-hit-feed__chart-month-label {
  margin-top: 6px;
  color: #475569;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  text-align: center;
  white-space: nowrap;
}

.realtime-hit-feed__chart-month-label-month,
.realtime-hit-feed__chart-month-label-year {
  display: block;
}

.realtime-hit-feed__chart-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

.realtime-hit-feed__chart-bars {
  width: 100%;
  height: 92px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 2px;
}

.realtime-hit-feed__chart-bar {
  display: block;
  width: calc(50% - 1px);
  min-width: 2px;
  border-radius: 4px 4px 0 0;
  box-shadow: var(--ks-shadow-card-plastic-bar);
  position: relative;
  overflow: hidden;
}

.realtime-hit-feed__chart-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset -1px 0 0 rgba(15, 23, 42, 0.08),
    inset 1px 0 0 rgba(255, 255, 255, 0.18);
  pointer-events: none;
}

.realtime-hit-feed__chart-bar--green {
  background: var(--ks-color-accent-green);
}

.realtime-hit-feed__chart-bar--yellow {
  background: var(--ks-color-accent-yellow);
}

.realtime-hit-feed__chart-bar--blue {
  background: var(--ks-color-primary-500);
}

.realtime-hit-feed__chart-label {
  margin-top: 8px;
  color: #475569;
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
}

.realtime-hit-feed__chart-label--ghost {
  color: transparent;
}

@media (max-width: 767px) {
  .realtime-hit-feed__chart-summary-grid {
    gap: 8px;
  }

  .realtime-hit-feed__chart-stat-value {
    font-size: 16px;
  }

  .realtime-hit-feed__chart {
    padding-bottom: 11px;
  }
}

.realtime-hit-feed__card-list {
  margin: 12px 0 0;
  padding: 0 0 0 18px;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.realtime-hit-feed__animation-panel {
  --realtime-hit-feed-animation-stroke: var(--realtime-feed-shell-stroke);
  position: absolute;
  z-index: 3;
  overflow: hidden;
  border: 0;
  border-radius: var(--ks-shell-radius-card);
  background: #ffffff;
  box-shadow: none;
  pointer-events: none;
  transition:
    left 1500ms cubic-bezier(0.16, 0.84, 0.2, 1),
    top 1500ms cubic-bezier(0.16, 0.84, 0.2, 1),
    width 1500ms cubic-bezier(0.16, 0.84, 0.2, 1),
    height 1500ms cubic-bezier(0.16, 0.84, 0.2, 1),
    opacity 360ms ease,
    background-color 220ms ease;
}

.realtime-hit-feed__animation-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid var(--realtime-hit-feed-animation-stroke);
  border-radius: inherit;
  pointer-events: none;
  box-sizing: border-box;
  z-index: 2;
  transition: opacity 180ms ease, border-color 180ms ease;
}

.realtime-hit-feed__animation-panel--metrics {
  --realtime-hit-feed-animation-stroke: var(--ks-collapse-shell-stroke);
}

.realtime-hit-feed__animation-panel--chart {
  --realtime-hit-feed-animation-stroke: var(--ks-collapse-shell-stroke);
}

.realtime-hit-feed__animation-panel--metrics .realtime-hit-feed__card--metrics,
.realtime-hit-feed__animation-panel--chart .realtime-hit-feed__card--chart {
  border: 0;
  box-shadow: none;
}

.realtime-hit-feed__animation-panel--metrics .realtime-hit-feed__cards,
.realtime-hit-feed__animation-panel--chart .realtime-hit-feed__cards,
.realtime-hit-feed__animation-panel--metrics .realtime-hit-feed__viewport,
.realtime-hit-feed__animation-panel--chart .realtime-hit-feed__viewport,
.realtime-hit-feed__animation-panel--metrics .realtime-hit-feed__stream,
.realtime-hit-feed__animation-panel--chart .realtime-hit-feed__stream {
  border: 0;
  box-shadow: none;
}

.realtime-hit-feed__animation-panel .realtime-hit-feed__stream,
.realtime-hit-feed__animation-panel .realtime-hit-feed__card {
  display: block;
  position: relative;
  z-index: 1;
}

.realtime-hit-feed__animation-panel .realtime-hit-feed__stream {
  height: auto;
}

.realtime-hit-feed__animation-panel.is-compact .realtime-hit-feed__stream,
.realtime-hit-feed__animation-panel.is-compact .realtime-hit-feed__card {
  opacity: 0;
}

.realtime-hit-feed__animation-panel.is-compact {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.realtime-hit-feed__animation-panel.is-compact::before {
  display: block;
}

.realtime-hit-feed__animation-panel.is-compact::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: var(--ks-collapse-line-thickness);
  transform: translateY(-50%) scaleY(var(--ks-collapse-line-scale));
  transform-origin: center;
  border-radius: 999px;
  background: var(--ks-collapse-line-color);
  box-sizing: border-box;
  z-index: 0;
}

.realtime-hit-feed__toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 68px;
  min-height: 36px;
  padding: 6px 12px;
  border: 0;
  background: transparent;
  color: var(--ks-color-coral-500, #ff6b6b);
  cursor: pointer;
  font: inherit;
  flex: 0 0 auto;
  border-radius: 999px;
  touch-action: manipulation;
}

.realtime-hit-feed__toggle::before {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 999px;
}

.realtime-hit-feed__toggle-label {
  color: var(--ks-color-coral-500, #ff6b6b);
  font-size: 12px;
  line-height: 1;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  min-height: 18px;
}

.realtime-hit-feed__toggle:hover,
.realtime-hit-feed__toggle:focus-visible {
  outline: none;
}

.realtime-hit-feed__toggle-icon {
  position: relative;
  display: block;
  width: 18px;
  height: 18px;
  transform: rotate(45deg);
  transition: transform var(--realtime-feed-collapse-duration) cubic-bezier(0.37, 0, 0.63, 1);
}

.realtime-hit-feed__toggle-icon::before,
.realtime-hit-feed__toggle-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 999px;
  background: currentColor;
  transform: translate(-50%, -50%);
}

.realtime-hit-feed__toggle-icon::before {
  width: 2px;
  height: 18px;
}

.realtime-hit-feed__toggle-icon::after {
  width: 18px;
  height: 2px;
}

@media (max-width: 767px) {
  .follow-kindness-inner {
    width: 100%;
    max-width: var(--ks-home-shell-fluid);
    margin-inline: auto;
    box-sizing: border-box;
  }

  .homepage-layout__feed-header-row {
    display: flex;
    justify-content: center;
  }

  .realtime-hit-feed {
    width: 100%;
    max-width: var(--ks-home-shell-fluid);
    margin-inline: auto;
    padding: 0;
    border-radius: 0;
    box-sizing: border-box;
  }

  .homepage-layout__feed-header-row > .realtime-hit-feed__header {
    justify-content: center;
    padding: 0;
  }

  .realtime-hit-feed__header {
    padding: 0 15px;
  }

  .realtime-hit-feed__viewport {
    --realtime-feed-open-height: var(--ks-feed-open-height-mobile);
  }

  .realtime-hit-feed__peek {
    width: 20px;
    height: 146px;
  }

  .realtime-hit-feed__peek--left {
    left: -14px;
  }

  .realtime-hit-feed__peek--right {
    right: -14px;
  }

  .realtime-hit-feed__peek-shape {
    width: 62px;
  }

}


.realtime-hit-feed__item {
  --realtime-feed-highlight-radius: calc(var(--ks-shell-radius-card) - 1px);
  position: relative;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: start;
  column-gap: 12px;
  row-gap: 0;
  min-height: 140px;
  padding: 14px 18px;
  border-top: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  isolation: isolate;
  cursor: default;
}

.realtime-hit-feed__item:first-child {
  border-top-left-radius: var(--ks-shell-radius-card);
  border-top-right-radius: var(--ks-shell-radius-card);
}

.realtime-hit-feed__item:last-child {
  border-bottom-left-radius: var(--ks-shell-radius-card);
  border-bottom-right-radius: var(--ks-shell-radius-card);
}

.realtime-hit-feed__item::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 0;
  transform: translateY(-50%);
  height: 1px;
  background: rgba(15, 23, 42, 0.18);
}

.realtime-hit-feed__item::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid transparent;
  background: transparent;
  border-radius: inherit;
  pointer-events: none;
  transition: border-color 180ms ease, background-color 180ms ease;
  box-sizing: border-box;
  z-index: 0;
}

.realtime-hit-feed__item.is-armed::after {
  border-color: rgba(255, 183, 3, 0.92);
  background: color-mix(in srgb, var(--ks-color-accent-yellow) 32%, rgba(255, 255, 255, 0.68));
}

.realtime-hit-feed__item.is-armed .realtime-hit-feed__click-badge,
.realtime-hit-feed__jump-target--rail.is-armed .realtime-hit-feed__click-badge {
  background: var(--ks-color-primary-500);
  border-color: var(--ks-color-primary-500);
  color: #ffffff;
  font-weight: 700;
}

.realtime-hit-feed__item.is-armed .realtime-hit-feed__avatar,
.realtime-hit-feed__jump-target--rail.is-armed .realtime-hit-feed__avatar {
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--ks-color-accent-yellow) 82%, rgba(255, 255, 255, 0.55)),
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    inset 0 -2px 3px rgba(15, 23, 42, 0.14),
    0 3px 10px rgba(255, 183, 3, 0.26);
}

.realtime-hit-feed__jump-target {
  cursor: pointer;
  touch-action: manipulation;
}

.realtime-hit-feed__jump-target:focus-visible {
  outline: 0;
}

.realtime-hit-feed__jump-target--rail {
  appearance: none;
  -webkit-appearance: none;
  width: 42px;
  min-width: 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: start;
  justify-content: flex-start;
  gap: 6px;
  padding: 2px 0 4px;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  transition: transform 180ms ease, filter 180ms ease;
}

.realtime-hit-feed__jump-target--rail:hover,
.realtime-hit-feed__jump-target--rail:focus-visible {
  transform: translateY(-1px);
  filter: saturate(1.03);
}

.realtime-hit-feed__jump-target--rail:active {
  transform: translateY(1px);
}

.realtime-hit-feed__item:first-child::before {
  display: none;
}

.realtime-hit-feed__avatar {
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  align-self: center;
  margin-top: 0;
  border-radius: 999px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    inset 0 -2px 3px rgba(15, 23, 42, 0.14),
    0 3px 8px rgba(15, 23, 42, 0.10);
}

.realtime-hit-feed__click-badge {
  min-width: 42px;
  height: 18px;
  padding: 0 6px;
  align-self: center;
  border: 1px solid var(--ks-color-primary-500);
  border-radius: 999px;
  background: transparent;
  color: var(--ks-color-primary-500);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  line-height: 1;
  font-weight: 500;
  text-align: center;
  white-space: nowrap;
  margin: 0 auto;
}

.realtime-hit-feed__jump-target--rail:hover .realtime-hit-feed__click-badge,
.realtime-hit-feed__jump-target--rail:focus-visible .realtime-hit-feed__click-badge,
.realtime-hit-feed__jump-target--rail:active .realtime-hit-feed__click-badge {
  background: var(--ks-color-primary-500);
  border-color: var(--ks-color-primary-500);
  color: #ffffff;
  font-weight: 700;
}

.realtime-hit-feed__body {
  position: relative;
  z-index: 1;
}

.realtime-hit-feed__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.realtime-hit-feed__avatar--fallback {
  background: var(--ks-color-primary-500);
  border: 0;
  box-shadow: none;
}

.realtime-hit-feed__avatar-badge {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ks-color-primary-500);
  border-radius: 999px;
}

.realtime-hit-feed__avatar-ks {
  width: 75%;
  height: 75%;
  color: #ffffff;
}

.realtime-hit-feed__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 0;
  gap: 5px;
}

.realtime-hit-feed__headline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 0;
}

.realtime-hit-feed__name {
  color: #111827;
  font-size: var(--ks-type-reading-lg);
  line-height: 1.15;
  font-weight: 700;
}

.realtime-hit-feed__name--anonymous {
  color: var(--ks-color-primary-500);
  letter-spacing: 0.01em;
}

.realtime-hit-feed__meta-divider {
  width: 1px;
  height: 16px;
  margin: 0 8px;
  align-self: center;
  background: rgba(148, 163, 184, 0.85);
}

.realtime-hit-feed__location {
  color: #111827;
  font-size: var(--ks-type-reading-lg);
  line-height: 1.15;
  font-weight: 700;
}

.realtime-hit-feed__billline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 0;
  color: var(--ks-color-neutral-text-secondary);
  font-size: var(--ks-type-reading-lg);
  line-height: 1.1;
  font-weight: 700;
}

.realtime-hit-feed__stop {
  color: var(--ks-color-primary-500);
  font-weight: 700;
}

.realtime-hit-feed__denomination {
  color: var(--ks-color-accent-green, #34c759);
  font-weight: 700;
}

.realtime-hit-feed__amount {
  color: var(--ks-color-neutral-text-secondary);
  font-weight: 700;
}

.realtime-hit-feed__amount-value {
  color: var(--ks-color-accent-green, #34c759);
  font-weight: 700;
}

.realtime-hit-feed__serial {
  color: var(--ks-color-accent-green, #34c759);
}

.realtime-hit-feed__excerpt {
  display: block;
  margin: 0;
  color: #475569;
  font-size: 15px;
  line-height: 1.24;
  font-weight: 500;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 767px) {
  .realtime-hit-feed__headline {
    align-items: flex-start;
  }

  .realtime-hit-feed__meta-divider {
    height: 14px;
    margin: 0 6px;
  }

  .realtime-hit-feed__name,
  .realtime-hit-feed__location,
  .realtime-hit-feed__billline,
  .realtime-hit-feed__excerpt {
    font-size: var(--ks-type-reading-md);
  }

  .realtime-hit-feed__excerpt {
    line-height: 1.24;
  }

  .realtime-hit-feed__chart--months {
    gap: 10px;
    min-height: 110px;
    margin-top: 10px;
    padding-bottom: 8px;
  }

  .realtime-hit-feed__chart-month-bars {
    min-height: 84px;
    gap: 3px;
  }

  .realtime-hit-feed__chart-bars {
    height: 84px;
    gap: 1px;
  }

  .realtime-hit-feed__chart-month-label {
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.15;
  }
}

.realtime-hit-feed.is-collapsed .realtime-hit-feed__viewport {
  height: 1px !important;
  max-height: 1px;
  margin-top: 0;
  border-width: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  clip-path: inset(0 round 999px);
}

.realtime-hit-feed.is-collapsed {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.realtime-hit-feed.is-collapsed .realtime-hit-feed__line {
  display: block;
}

body.homepage-search-front .realtime-hit-feed.is-collapsed .realtime-hit-feed__viewport {
  height: var(--realtime-feed-open-height) !important;
  max-height: var(--realtime-feed-open-height);
  border-width: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  clip-path: none;
  pointer-events: none;
  transition: none;
}

body.homepage-search-front .realtime-hit-feed.is-collapsed .realtime-hit-feed__line {
  display: block;
}

.realtime-hit-feed.is-collapsed .realtime-hit-feed__carousel,
.realtime-hit-feed.is-collapsing .realtime-hit-feed__carousel {
  padding-bottom: 0;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__viewport {
  transition-duration: 1500ms, 1500ms, 520ms, 520ms;
  transition-delay: 0ms, 0ms, 0ms, 0ms;
  transition-timing-function: cubic-bezier(0.18, 0.88, 0.32, 1), cubic-bezier(0.18, 0.88, 0.32, 1), ease, ease;
}

.realtime-hit-feed.is-collapsing:has(.realtime-hit-feed__card--metrics.is-active) .realtime-hit-feed__viewport {
  border-width: 1px;
  border-color: var(--ks-collapse-shell-stroke);
  background: transparent;
  clip-path: inset(0 round var(--ks-shell-radius-card));
}

.realtime-hit-feed.is-collapsing:has(.realtime-hit-feed__card--chart.is-active) .realtime-hit-feed__viewport {
  border-width: 1px;
  border-color: var(--ks-collapse-shell-stroke);
  background: transparent;
  clip-path: inset(0 round var(--ks-shell-radius-card));
}

.realtime-hit-feed.is-collapsing:has(.realtime-hit-feed__card--metrics.is-active) .realtime-hit-feed__cards,
.realtime-hit-feed.is-collapsing:has(.realtime-hit-feed__card--chart.is-active) .realtime-hit-feed__cards {
  border: 0;
  background: transparent;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__carousel {
  transition-duration:
    1500ms,
    1500ms,
    480ms;
  transition-delay:
    0ms,
    0ms,
    0ms;
  transition-timing-function:
    cubic-bezier(0.18, 0.88, 0.32, 1),
    cubic-bezier(0.18, 0.88, 0.32, 1),
    ease;
}

body.homepage-search-front .realtime-hit-feed.is-collapsed .realtime-hit-feed__carousel,
body.homepage-search-front .realtime-hit-feed.is-collapsing .realtime-hit-feed__carousel {
  padding-bottom: 0;
  transition: none;
}

.realtime-hit-feed__toggle[aria-expanded="false"] .realtime-hit-feed__toggle-icon {
  transform: rotate(0deg);
}

.realtime-hit-feed.is-collapsed .realtime-hit-feed__dots {
  opacity: 0;
  pointer-events: none;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dots {
  pointer-events: none;
}

.realtime-hit-feed.is-opening .realtime-hit-feed__dot,
.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot,
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot {
  opacity: 0;
}

.realtime-hit-feed.is-opening .realtime-hit-feed__dot {
  transform: translateX(0) scale(0.82);
  animation: realtime-hit-feed-dots-spread var(--realtime-feed-stage-open-duration) cubic-bezier(0.2, 0.82, 0.22, 1) forwards;
}

.realtime-hit-feed.is-opening .realtime-hit-feed__dot:nth-child(1) { animation-delay: 340ms; }
.realtime-hit-feed.is-opening .realtime-hit-feed__dot:nth-child(2) { animation-delay: 460ms; }
.realtime-hit-feed.is-opening .realtime-hit-feed__dot:nth-child(3) { animation-delay: 580ms; }
.realtime-hit-feed.is-opening .realtime-hit-feed__dot:nth-child(4) { animation-delay: 700ms; }
.realtime-hit-feed.is-opening .realtime-hit-feed__dot:nth-child(5) { animation-delay: 820ms; }

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot {
  animation: realtime-hit-feed-dots-gather calc(var(--realtime-feed-stage-close-duration) * 0.72) cubic-bezier(0.22, 0.82, 0.2, 1) forwards;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(1) { animation-delay: 0ms; }
.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(2) { animation-delay: 45ms; }
.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(3) { animation-delay: 90ms; }
.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(4) { animation-delay: 135ms; }
.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(5) { animation-delay: 180ms; }

body.homepage-search-front .realtime-hit-feed.is-collapsed .realtime-hit-feed__cards,
body.homepage-search-front .realtime-hit-feed.is-collapsed .realtime-hit-feed__stream,
body.homepage-search-front .realtime-hit-feed.is-collapsed .realtime-hit-feed__peek {
  opacity: 0;
  pointer-events: none;
  transition: none;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__collapse-dot {
  visibility: visible;
  animation: realtime-hit-feed-dot-collapse 1500ms cubic-bezier(0.2, 0.78, 0.22, 1) 0ms forwards;
}

.realtime-hit-feed.is-opening .realtime-hit-feed__collapse-dot {
  visibility: hidden;
  opacity: 0;
  animation: none;
}

.realtime-hit-feed.is-opening .realtime-hit-feed__dot {
  opacity: 0;
  transform: translateX(var(--realtime-feed-dot-collapse-shift)) scale(1);
  animation: realtime-hit-feed-dots-yo-yo var(--realtime-feed-dot-yo-yo-duration) linear calc(var(--realtime-feed-panel-duration) + 120ms) forwards;
  transition: background-color 180ms ease;
}

html.browser-samsung-note20-n981u .realtime-hit-feed:not(.is-collapsed) .realtime-hit-feed__dots {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

html.browser-samsung-note20-n981u .realtime-hit-feed:not(.is-collapsed) .realtime-hit-feed__dot {
  opacity: 1 !important;
  visibility: visible !important;
}

html.browser-samsung-note20-n981u .realtime-hit-feed.is-opening .realtime-hit-feed__dot,
html.browser-samsung-note20-n981u .realtime-hit-feed.is-opening .realtime-hit-feed__dots,
html.browser-samsung-note20-n981u .realtime-hit-feed.is-collapsing .realtime-hit-feed__dot,
html.browser-samsung-note20-n981u .realtime-hit-feed.is-collapsing .realtime-hit-feed__dots {
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
}

@keyframes realtime-hit-feed-dot-collapse {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(0) scale(0.94);
  }
  10% {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
  }
  52% {
    opacity: 1;
    transform: translateX(-50%) translateY(-10px) scale(0.96);
  }
  100% {
    opacity: 0;
    transform: translateX(-50%) translateY(-26px) scale(0.72);
  }
}

@keyframes realtime-hit-feed-dot-open {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(-20px) scale(0.82);
  }
  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
  }
}

@keyframes realtime-hit-feed-dots-yo-yo {
  0% {
    opacity: 0;
    transform: translateX(var(--realtime-feed-dot-collapse-shift)) scale(1);
  }
  3% {
    opacity: 1;
    transform: translateX(var(--realtime-feed-dot-collapse-shift)) scale(1);
  }
  10% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.22)) scale(1.004);
  }
  17% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.62)) scale(1.012);
  }
  24% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.92)) scale(1.018);
  }
  30% {
    opacity: 1;
    transform: translateX(var(--realtime-feed-dot-shift)) scale(1.02);
  }
  36% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.78)) scale(1.016);
  }
  43% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.34)) scale(1.008);
  }
  50% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.02)) scale(1);
  }
  58% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.26)) scale(1.006);
  }
  65% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.56)) scale(1.01);
  }
  72% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.44)) scale(1.008);
  }
  79% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.16)) scale(1.003);
  }
  86% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.01)) scale(1);
  }
  92% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.12)) scale(1.002);
  }
  97% {
    opacity: 1;
    transform: translateX(calc(var(--realtime-feed-dot-shift) * 0.28)) scale(1.004);
  }
  100% {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

.time-search-active .realtime-hit-feed,
.stopwatch-search-active .realtime-hit-feed,
.screensaver-127-active .realtime-hit-feed,
.world-time-map-active .realtime-hit-feed {
  display: none;
}

.follow-search-missing[hidden] {
  display: none;
}

.follow-search-missing {
  margin: 28px auto 0;
  max-width: 760px;
  padding: 24px 28px;
  border: 1px solid rgba(80, 176, 220, 0.24);
  border-radius: var(--ks-shell-radius-card-lg);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(246, 250, 252, 0.98) 100%);
  box-shadow: 0 18px 36px rgba(24, 64, 92, 0.08);
}

.follow-search-missing__eyebrow {
  margin: 0 0 10px;
  color: #6e7787;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.follow-search-missing__title {
  margin: 0;
  color: #1b2a3a;
  font-size: 32px;
  line-height: 1.08;
  font-weight: 800;
}

.follow-search-missing__copy {
  margin: 14px 0 0;
  color: #4f5f73;
  font-size: 18px;
  line-height: 1.55;
}

.follow-search-missing__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-top: 22px;
}

.follow-search-missing__btn {
  appearance: none;
  border: 1px solid rgba(80, 176, 220, 0.28);
  border-radius: 999px;
  background: #ffffff;
  color: #28506b;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  padding: 14px 20px;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.follow-search-missing__btn:hover,
.follow-search-missing__btn:focus-visible {
  border-color: rgba(80, 176, 220, 0.56);
  color: #173f59;
  transform: translateY(-1px);
}

.follow-search-missing__btn--primary {
  border-color: var(--color-button-primary);
  background: var(--color-button-primary);
  color: #ffffff;
}

.follow-search-missing__btn--primary:hover,
.follow-search-missing__btn--primary:focus-visible {
  background: #3998c6;
  color: #ffffff;
}

.follow-search-missing__btn--secondary {
  border-color: var(--color-button-primary);
  background: #ffffff;
  color: var(--color-button-primary);
  align-self: center;
}

.follow-search-missing__btn--secondary:hover,
.follow-search-missing__btn--secondary:focus-visible {
  color: #1d89ba;
  border-color: #1d89ba;
  background: #ffffff;
}


@media (max-width: 1399px) {
  .follow-search-missing {
    max-width: none;
    margin: 24px 0 0;
    padding: 18px 0 22px;
    border: 0;
    border-top: 1px solid #e5dfd0;
    border-bottom: 1px solid #e5dfd0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .follow-search-missing__title {
    font-size: 28px;
    line-height: 1.06;
  }

  .follow-search-missing__copy {
    font-size: 18px;
  }

  .follow-search-missing__actions {
    margin-top: 18px;
  }
}

@media (max-width: 767px) {
  .follow-search-missing__title {
    font-size: 22px;
  }

  .follow-search-missing__copy {
    font-size: 16px;
    line-height: 1.6;
  }

  .follow-search-missing__btn {
    width: 100%;
    justify-content: center;
  }

  .follow-search-missing__btn--secondary {
    width: auto;
    justify-content: flex-start;
  }
}

.scan-bill-overlay[hidden] {
  display: none;
}

.scan-bill-overlay {
  position: fixed;
  inset: 0;
  z-index: 160;
  background: rgba(0, 0, 0, 0.96);
}

.scan-bill-shell {
  position: relative;
  width: 100%;
  height: 100dvh;
  overflow: hidden;
  background: #000000;
  --scan-bill-guide-top: calc(env(safe-area-inset-top, 0px) + 132px);
  --scan-bill-guide-width: 84vw;
  --scan-bill-guide-height: calc(var(--scan-bill-guide-width) * 0.238045601);
  --scan-bill-guide-bottom: calc(var(--scan-bill-guide-top) + var(--scan-bill-guide-height));
  --scan-bill-guide-copy-gap: 3.5vw;
  --scan-bill-guide-filters-gap: 3.5vw;
  --scan-bill-status-width: 80vw;
  --scan-bill-filters-width: 80vw;
  --scan-bill-filter-height: 10.5vw;
  --scan-bill-filter-font-size: 3.7vw;
  --scan-bill-capture-size: 32vw;
  --scan-bill-capture-font-size: 5.8vw;
  --scan-bill-swap-size: 9vw;
  --scan-bill-bottom-offset: calc(39.75vw + 24px);
}

.scan-bill-loading {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.84) 0%, rgba(3, 8, 19, 0.74) 100%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}

.scan-bill-shell.is-loading .scan-bill-loading {
  opacity: 1;
}

.scan-bill-loading__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 168px;
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 999px;
  background: rgba(9, 16, 34, 0.84);
  color: rgba(255, 255, 255, 0.92);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.03em;
  backdrop-filter: blur(12px);
}

.scan-bill-topbar {
  position: absolute;
  top: calc(env(safe-area-inset-top, 0px) + 16px);
  left: 16px;
  right: 20px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.scan-bill-topbar__logo {
  display: block;
  width: auto;
  height: 70px;
}

.scan-bill-topbar__controls {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: auto;
  min-width: 0;
  width: auto;
  padding: 0;
  border-radius: 0;
  position: relative;
  overflow: visible;
  background: transparent;
  transition: none;
}

.scan-bill-topbar__track {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 8px;
  width: max-content;
  min-width: 0;
}

.scan-bill-topbar__close,
.scan-bill-topbar__back,
.scan-bill-topbar__flash {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #ffffff;
  padding: 0;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  border-radius: 999px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.scan-bill-topbar__flash {
  transition: none;
}

.scan-bill-topbar__flash[hidden] {
  display: none !important;
}

.scan-bill-topbar__back[hidden] {
  display: none !important;
}

.scan-bill-topbar__flash {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.scan-bill-topbar__back {
  height: 36px;
  min-width: 72px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.scan-bill-topbar__bolt {
  position: relative;
  width: 12px;
  height: 16px;
  display: block;
}

.scan-bill-topbar__bolt::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #ffffff;
  opacity: 1;
  clip-path: polygon(55% 0%, 15% 47%, 42% 47%, 24% 100%, 86% 38%, 54% 38%);
}

.scan-bill-topbar__close {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
  pointer-events: auto;
}

.scan-bill-topbar__x {
  position: relative;
  width: 14px;
  height: 14px;
  display: inline-block;
  transform: rotate(-45deg);
  transition: none;
}

.scan-bill-topbar__x::before,
.scan-bill-topbar__x::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 2px;
  border-radius: 999px;
  background: #ffffff;
  transform-origin: center center;
}

.scan-bill-topbar__x::before {
  transform: translate(-50%, -50%) rotate(0deg);
}

.scan-bill-topbar__x::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.scan-bill-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
  transform: scale(1);
  transition: opacity 220ms ease, transform 220ms ease;
}

.scan-bill-shell.is-loading .scan-bill-video {
  opacity: 0;
  transform: scale(1.02);
}

.scan-bill-canvas {
  display: none;
}

.scan-bill-guide {
  position: absolute;
  top: var(--scan-bill-guide-top);
  left: 50%;
  z-index: 2;
  width: var(--scan-bill-guide-width);
  height: var(--scan-bill-guide-height);
  transform: translateX(-50%);
}

.scan-bill-guide__frame {
  position: relative;
  width: 100%;
  height: 100%;
}

.scan-bill-guide__corner {
  position: absolute;
  width: 9.4%;
  height: 24.8%;
}

.scan-bill-guide__corner--tl {
  top: 0;
  left: 0;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
}

.scan-bill-guide__corner--tr {
  top: 0;
  right: 0;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
}

.scan-bill-guide__corner--bl {
  left: 0;
  bottom: 0;
  border-left: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
}

.scan-bill-guide__corner--br {
  right: 0;
  bottom: 0;
  border-right: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
}

.scan-bill-guide.has-detection .scan-bill-guide__corner--tl,
.scan-bill-guide.has-detection .scan-bill-guide__corner--tr,
.scan-bill-guide.has-detection .scan-bill-guide__corner--bl,
.scan-bill-guide.has-detection .scan-bill-guide__corner--br {
  border-color: #36c86b;
}

.scan-bill-result--live {
  position: absolute;
  top: calc(var(--scan-bill-guide-bottom) + 33vw);
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  width: var(--scan-bill-guide-width);
}

.scan-bill-editor-wrap {
  position: absolute;
  top: calc(var(--scan-bill-guide-bottom) + 31.5vw);
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  width: var(--scan-bill-guide-width);
}

.scan-bill-editor-wrap[hidden] {
  display: none;
}

.scan-bill-editor {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 4px;
}

.scan-bill-editor__slot {
  position: relative;
  flex: 0 0 auto;
  width: 31px;
  height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  overflow: hidden;
}

.scan-bill-editor__slot--wide {
  width: 37px;
}

.scan-bill-editor__slot--locked {
  border-color: rgba(255, 212, 90, 0.96);
  background: rgba(255, 212, 90, 0.16);
}

.scan-bill-editor__slot--active {
  background: #ffffff;
}

.scan-bill-editor__value {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  pointer-events: none;
}

.scan-bill-editor__slot:focus-within {
  background: #ffffff;
}

.scan-bill-editor__slot:focus-within .scan-bill-editor__value {
  color: #0f172a;
}

.scan-bill-editor__slot--active .scan-bill-editor__value {
  color: #0f172a;
}

.scan-bill-editor__button {
  position: absolute;
  inset: 0;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.scan-bill-editor-note {
  margin: 10px 0 0;
  color: rgba(255, 255, 255, 0.92);
  text-align: center;
  font-size: 13px;
  line-height: 1.3;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

.scan-bill-picker {
  position: absolute;
  z-index: 4;
  width: 100px;
  max-height: 340px;
  overflow-y: auto;
  border: 1px solid rgba(15, 23, 42, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.2);
  padding: 6px 0;
}

.scan-bill-picker[hidden] {
  display: none;
}

.scan-bill-picker__option {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: #0f172a;
  height: 34px;
  padding: 0 12px;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}

.scan-bill-picker__option.is-active {
  background: #f7f8fa;
  color: #0f172a;
}

.scan-bill-status--guide {
  position: absolute;
  top: calc(var(--scan-bill-guide-bottom) + var(--scan-bill-guide-copy-gap));
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  width: var(--scan-bill-status-width);
  min-height: 9vw;
}

.scan-bill-filters {
  position: absolute;
  top: calc(var(--scan-bill-guide-bottom) + var(--scan-bill-guide-copy-gap) + 12vw);
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  width: var(--scan-bill-filters-width);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3vw;
}

.scan-bill-filter__select {
  width: 100%;
  height: var(--scan-bill-filter-height);
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 999px;
  padding: 0 9vw 0 4vw;
  background-color: transparent;
  background-image:
    linear-gradient(45deg, transparent 50%, #ffffff 50%),
    linear-gradient(135deg, #ffffff 50%, transparent 50%);
  background-position:
    calc(100% - 4.8vw) calc(50% - 0.7vw),
    calc(100% - 3.2vw) calc(50% - 0.7vw);
  background-size: 1.5vw 1.5vw, 1.5vw 1.5vw;
  background-repeat: no-repeat;
  color: #ffffff;
  font-size: var(--scan-bill-filter-font-size);
  font-weight: 600;
  line-height: 1;
  box-shadow: none;
}

.scan-bill-filter__select:disabled {
  color: rgba(255, 255, 255, 0.68);
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255, 255, 255, 0.55) 50%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.55) 50%, transparent 50%);
  border-color: rgba(255, 255, 255, 0.6);
}

.scan-bill-bottom {
  position: absolute;
  left: 5vw;
  right: 5vw;
  top: calc(var(--scan-bill-guide-bottom) + var(--scan-bill-bottom-offset));
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4.5vw;
}

.scan-bill-status,
.scan-bill-result {
  margin: 0;
  color: #ffffff;
  text-align: center;
  font-size: 3.6vw;
  line-height: 1.35;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
}

.scan-bill-result {
  font-size: 9vw;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.scan-bill-result.is-fallback {
  font-size: 5vw;
  font-weight: 500;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.scan-bill-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.scan-bill-capture,
.scan-bill-swap,
.scan-bill-use,
.scan-bill-retake {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  color: #ffffff;
  min-width: 33vw;
  height: 10vw;
  padding: 0 4.5vw;
  font-size: 3.8vw;
  line-height: 1;
  font-weight: 600;
  cursor: pointer;
}

.scan-bill-capture:disabled,
.scan-bill-swap:disabled,
.scan-bill-use:disabled,
.scan-bill-retake:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.scan-bill-swap {
  width: var(--scan-bill-swap-size);
  min-width: var(--scan-bill-swap-size);
  height: var(--scan-bill-swap-size);
  padding: 0;
  margin-left: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 5vw;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 6vw);
  z-index: 2;
}

.scan-bill-swap img {
  display: block;
  width: auto;
  height: 4vw;
}

.scan-bill-capture {
  width: var(--scan-bill-capture-size);
  min-width: var(--scan-bill-capture-size);
  height: var(--scan-bill-capture-size);
  padding: 0;
  background: rgba(0, 0, 0, 0.16);
  border-width: 2px;
  font-size: var(--scan-bill-capture-font-size);
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: none;
}

.scan-bill-use,
.scan-bill-retake {
  min-width: 45vw;
  height: 10vw;
}

.scan-bill-use {
  position: absolute;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 6vw);
  transform: translateX(-50%);
  z-index: 2;
  min-width: auto;
  height: 9vw;
  padding: 0 3.5vw;
  border: 0;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.5);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}


.kind-steps-stories {
  margin: 0 0 16px;
  color: var(--color-button-primary);
  font-size: clamp(26px, 8.5vw, 34px);
  line-height: 1;
  font-weight: 700;
  text-align: center;
}

.kind-steps-map-count {
  margin: 30px 0 0;
  color: rgba(0, 0, 0, 0.38);
  font-size: 13px;
  line-height: 1.1;
  font-weight: 700;
  text-align: center;
}

.kind-steps-map-label,
.kind-steps-map-value {
  display: inline-block;
}

.kind-steps-map-value {
  margin-left: 5px;
}

.bill-journey-lane {
  width: 100%;
}

.bill-journey-map-host {
  width: 100%;
}

.stories-timeline {
  position: relative;
  width: 100%;
  margin: 0;
  display: grid;
  gap: 10px;
}

.stories-grid {
  margin-top: 0;
  display: block;
  padding-inline: 0;
}

.stories-grid > .stories-timeline {
  grid-column: auto;
  width: 100%;
  max-width: none;
  margin-inline: auto;
}

.story-pagination-wrap {
  width: 100%;
  max-width: var(--ks-bill-panel-width);
  margin: 26px auto 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

.story-pagination-controls {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  color: #111827;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 400;
}

.story-pagination-size-label {
  margin: 0;
}

.story-pagination-size {
  min-width: 78px;
  height: 35px;
  border: 1px solid var(--color-card-border);
  border-radius: 999px;
  background: #ffffff;
  color: #111827;
  font-size: 15px;
  font-weight: 500;
  padding: 0 15px;
  appearance: none;
  -webkit-appearance: none;
  text-align: center;
  text-align-last: center;
  box-shadow: none;
  cursor: pointer;
}

.story-pagination-size:focus,
.story-pagination-size:focus-visible,
.story-pagination-size:active {
  outline: none;
  box-shadow: none;
  border-color: var(--color-card-border);
}

.story-pagination-size:hover,
.story-pagination-size:focus-visible {
  background: #6b7280;
  border-color: #6b7280;
  color: #ffffff;
}

.story-pagination {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

.story-pagination-pages {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

.story-pagination-arrow,
.story-pagination-page {
  appearance: none;
  border: 0;
  background: transparent;
  color: #4b5563;
  font-size: 15px;
  line-height: 1;
  font-weight: 500;
  min-width: 36px;
  height: 36px;
  border-radius: 999px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease, font-weight 160ms ease;
}

.story-pagination-arrow__glyph {
  display: block;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
}

.story-pagination-arrow__glyph--left {
  border-right: 11px solid currentColor;
}

.story-pagination-arrow__glyph--right {
  border-left: 11px solid currentColor;
}

.story-pagination-arrow:hover,
.story-pagination-page:hover,
.story-pagination-page:focus-visible {
  background: rgba(17, 24, 39, 0.06);
  color: #111827;
  font-weight: 700;
  outline: none;
}

.story-pagination-arrow:hover,
.story-pagination-arrow:focus-visible {
  background: transparent;
  color: #374151;
  font-weight: 500;
}

.story-pagination-page.is-active {
  background: rgba(17, 24, 39, 0.08);
  color: #111827;
  font-weight: 700;
}

.story-pagination-arrow[disabled] {
  cursor: default;
  opacity: 0.35;
}

html.theme-dark .story-pagination-arrow,
html.theme-dark .story-pagination-page {
  color: #eef4fb;
}

html.theme-dark .story-pagination-arrow:hover,
html.theme-dark .story-pagination-arrow:focus-visible,
html.theme-dark .story-pagination-page:hover,
html.theme-dark .story-pagination-page:focus-visible {
  background: rgba(74, 100, 142, 0.32);
  color: #ffffff;
  outline: none;
}

html.theme-dark .story-pagination-page.is-active {
  border: 1px solid rgba(255, 255, 255, 0.82) !important;
  background: var(--homepage-canvas) !important;
  background-image: none !important;
  color: #ffffff;
  font-weight: 700;
  box-shadow: none !important;
}

html.theme-dark .story-pagination-page.is-active:hover,
html.theme-dark .story-pagination-page.is-active:focus-visible {
  background: color-mix(in srgb, var(--homepage-canvas) 78%, white 22%) !important;
  background-image: none !important;
  border-color: rgba(196, 214, 238, 0.92) !important;
  color: #ffffff;
}

html.theme-dark .story-pagination-size {
  border: 1px solid rgba(255, 255, 255, 0.82);
  background: var(--homepage-canvas);
  color: #ffffff;
}

html.theme-dark .story-pagination-size:focus,
html.theme-dark .story-pagination-size:focus-visible,
html.theme-dark .story-pagination-size:active {
  border-color: rgba(255, 255, 255, 0.82);
  box-shadow: none;
}

html.theme-dark .story-pagination-size:hover,
html.theme-dark .story-pagination-size:focus-visible {
  background: color-mix(in srgb, var(--homepage-canvas) 78%, white 22%);
  border-color: rgba(196, 214, 238, 0.92);
  color: #ffffff;
}

/* Keep story stack width locked to the top summary card at every breakpoint */
@media (min-width: 768px) and (max-width: 1023px) {
  .stories-grid > .stories-timeline {
    grid-column: 1 / -1;
  }

  .story-profile-map-wrap {
    height: 200px;
  }
}

.story-item {
  --story-card-surface: var(--color-card-bg);
  position: relative;
  background: var(--color-card-bg);
  border: var(--ks-shell-border-width) solid var(--ks-card-material-border);
  border-radius: var(--ks-shell-radius-card-md);
  background-image: var(--ks-card-material-surface);
  padding: 14px 16px 0;
  overflow: visible;
  box-shadow: var(--ks-shadow-card-shell);
}

.story-item--focused {
  border-color: rgba(14, 165, 233, 0.52);
  box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.12);
  transition: border-color 220ms ease, box-shadow 220ms ease;
}

.story-map-card {
  position: relative;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  overflow: visible;
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
}






.story-date {
  margin: 0 0 4px;
  color: #6b7280;
  font-size: var(--ks-type-reading-md);
  line-height: 1.2;
}

.story-profile {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 8px;
  border-top: 0;
  padding-top: 8px;
  margin-bottom: 6px;
}

.story-profile-map-wrap {
  width: var(--ks-story-map-viewport-width);
  max-width: var(--ks-story-map-viewport-width);
  height: auto;
  flex: 0 0 auto;
  border-radius: var(--ks-shell-radius-card-md) var(--ks-shell-radius-card-md) 0 0;
  overflow: hidden;
  border: 1px solid var(--ks-card-material-border);
  border-bottom: 0;
  background: transparent;
  box-shadow: var(--ks-shadow-card-shell);
  position: relative;
  display: block;
  transition: none;
  transform: none;
  filter: none;
  isolation: isolate;
}

.story-profile-map-wrap::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 18px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.16) 0%, rgba(15, 23, 42, 0.08) 32%, rgba(15, 23, 42, 0.02) 62%, rgba(15, 23, 42, 0) 100%);
  z-index: 2;
}

.story-static-map-stage {
  position: relative;
  width: var(--ks-story-map-viewport-width);
  max-width: var(--ks-story-map-viewport-width);
  height: auto;
  aspect-ratio: var(--story-static-map-aspect, 1 / 1);
  margin: 0;
}

.story-static-map-canvas {
  position: absolute;
  inset: 0;
  width: var(--ks-story-map-viewport-width);
  max-width: var(--ks-story-map-viewport-width);
  overflow: hidden;
  border-radius: 0;
  border: 0;
  background: transparent;
}

.story-static-map-image {
  display: block;
  width: var(--ks-story-map-viewport-width);
  max-width: none;
  height: 100%;
  object-fit: cover;
}

.story-static-pin {
  position: absolute;
  width: 30px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  transform: translate(-50%, -100%);
  cursor: pointer;
  z-index: 2;
}

.story-static-pin-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.story-map-marker-image.is-linked-hover,
.story-map-marker-image.is-linked-active {
  filter: brightness(0) saturate(100%);
}

.story-static-pin.is-open {
  z-index: 8;
}

.story-static-popup-layer {
  display: none;
  position: absolute;
  z-index: 999;
  pointer-events: auto;
}

.story-static-popup-layer.is-visible {
  display: block;
}

.story-static-popup-layer .story-map-popup {
  min-width: 128px;
  max-width: min(220px, calc(100vw - 32px));
}

.story-static-popup-layer .story-map-popup::after {
  left: 50%;
  top: auto;
  right: auto;
  bottom: -6px;
  transform: translateX(-50%) rotate(45deg);
}

.story-static-popup-layer.popup-right .story-map-popup::after {
  left: -6px;
  right: auto;
  top: 18px;
  bottom: auto;
  transform: translateY(-50%) rotate(45deg);
}

.story-static-popup-layer.popup-left .story-map-popup::after {
  left: auto;
  right: -6px;
  top: 18px;
  bottom: auto;
  transform: translateY(-50%) rotate(45deg);
}

.story-static-popup-layer.popup-below .story-map-popup::after {
  left: 50%;
  top: -6px;
  bottom: auto;
  transform: translateX(-50%) rotate(45deg);
}

.story-static-popup {
  display: none;
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  min-width: 128px;
  max-width: min(220px, calc(100vw - 32px));
  padding: 10px 12px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.14);
  color: #111827;
  white-space: normal;
  text-align: left;
  font-size: 13px;
  line-height: 1.2;
  z-index: 20;
  transform-origin: center bottom;
  pointer-events: auto;
}

.story-static-popup::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 10px solid #ffffff;
  transform: translateX(-50%);
}

.story-static-pin.popup-right .story-static-popup {
  left: calc(100% + 13px);
  top: -9px;
  bottom: auto;
  transform: none;
  transform-origin: left 14px;
}

.story-static-pin.popup-right .story-static-popup::after {
  left: -10px;
  top: 14px;
  border-left: 0;
  border-right: 10px solid #ffffff;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  transform: none;
}

.story-static-pin.popup-left .story-static-popup {
  left: auto;
  right: calc(100% + 13px);
  top: -9px;
  bottom: auto;
  transform: none;
  transform-origin: right 14px;
}

.story-static-pin.popup-left .story-static-popup::after {
  left: auto;
  right: -10px;
  top: 14px;
  border-left: 10px solid #ffffff;
  border-right: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  transform: none;
}

.story-static-pin.is-open .story-static-popup {
  display: block;
  animation: story-static-popup-pop-top 1500ms cubic-bezier(0.14, 0.86, 0.24, 1) both;
}

.story-static-pin.popup-right.is-open .story-static-popup {
  animation-name: story-static-popup-pop-right;
}

.story-static-pin.popup-left.is-open .story-static-popup {
  animation-name: story-static-popup-pop-left;
}

@keyframes story-static-popup-pop-top {
  0% {
    transform: translateX(-50%) scale(0.18);
  }

  62% {
    transform: translateX(-50%) scale(1.04);
  }

  100% {
    transform: translateX(-50%) scale(1);
  }
}

@keyframes story-static-popup-pop-right {
  0% {
    transform: scale(0.18);
  }

  62% {
    transform: scale(1.04);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes story-static-popup-pop-left {
  0% {
    transform: scale(0.18);
  }

  62% {
    transform: scale(1.04);
  }

  100% {
    transform: scale(1);
  }
}

.story-route-search {
  width: fit-content;
  max-width: 100%;
  height: 40px;
  flex: 0 0 auto;
  margin: 0 auto 20px;
  display: flex;
  align-items: stretch;
  gap: 0;
  border-radius: calc(var(--radius-md) * 0.6);
  transition: none;
}

.story-route-search.is-invalid {
  box-shadow: none;
}

.story-route-search-field {
  position: relative;
  flex: 0 1 20ch;
  min-width: 0;
  border-radius: calc(var(--radius-md) * 0.6) 0 0 calc(var(--radius-md) * 0.6);
}

.story-route-search-field.is-invalid {
  box-shadow: 0 0 0 1px #d93025;
}

.story-route-search-input {
  width: calc(20ch - 35px);
  min-width: 0;
  height: 40px;
  border: 1px solid var(--color-card-border);
  border-right: 0;
  border-radius: calc(var(--radius-md) * 0.6) 0 0 calc(var(--radius-md) * 0.6);
  background: #ffffff;
  color: #4b5563;
  box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12);
  padding: 0 14px;
  font-size: 1rem;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
}

.story-route-search-input:focus,
.story-route-search-input:focus-visible,
.story-route-search-input:active {
  outline: none;
  box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12);
  border-color: var(--color-card-border);
}

.story-route-search-input::placeholder {
  color: #4b5563;
  opacity: 1;
}

.story-route-search-input.is-invalid,
.story-route-search-input.is-invalid:focus,
.story-route-search-input.is-invalid:focus-visible,
.story-route-search-input.is-invalid:active,
.story-route-search-field.is-invalid .story-route-search-input,
.story-route-search.is-invalid .story-route-search-input {
  border-color: #d93025 !important;
  box-shadow: none !important;
  background: #ffffff !important;
}

.story-route-search-menu {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  border: 1px solid var(--color-card-border);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: #ffffff;
  box-shadow: none;
  overflow: hidden;
  z-index: 70;
  opacity: 1;
  visibility: hidden;
  transform: translateY(0);
  max-height: 0;
  pointer-events: none;
  will-change: max-height;
  transition:
    max-height 160ms cubic-bezier(0.4, 0, 0.2, 1),
    border-color 160ms cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s linear 160ms;
}

.story-route-search-field.menu-open .story-route-search-input {
  border-bottom-left-radius: 0;
  border-bottom-color: transparent;
}

.story-route-search-field.menu-open .story-route-search-menu {
  border-color: var(--color-card-border);
  box-shadow: none;
  visibility: visible;
  max-height: 180px;
  pointer-events: auto;
  transition:
    max-height 1.5s cubic-bezier(0.12, 0.78, 0.24, 1),
    border-color 1.5s cubic-bezier(0.12, 0.78, 0.24, 1),
    visibility 0s linear 0s;
}

.story-route-search-menu button {
  width: 100%;
  height: 36px;
  min-height: 40px;
  line-height: 40px;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  background: #ffffff;
  color: rgba(0, 0, 0, 0.3);
  text-align: left;
  padding: 0 14px;
  font-size: 1rem;
  font-weight: 400;
  cursor: pointer;
}

.story-route-search-menu button:first-child {
  border-top: 1px solid #e5e7eb;
}

.story-route-search-menu button:last-child {
  border-bottom: 0;
}

.story-route-search-menu button:hover {
  background: #f3f4f6;
}

.story-route-search-btn {
  position: relative;
  flex: 0 0 auto;
  height: 40px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-button-primary);
  border-radius: 0 var(--radius-pill) var(--radius-pill) 0;
  background: #ffffff;
  color: var(--color-button-primary);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.story-route-search-btn:hover,
.story-route-search-btn:focus-visible {
  background: var(--color-button-primary);
  color: #ffffff;
  border-color: var(--color-button-primary);
}

.story-route-search-btn.is-disabled {
  background: var(--color-button-primary);
  border-color: var(--color-button-primary);
  color: #ffffff;
  cursor: not-allowed;
  opacity: 1;
}

.story-profile-badge-wrap {
  position: relative;
  width: var(--ks-badge-avatar-size);
  height: var(--ks-badge-avatar-size);
  border-radius: 999px;
  border: var(--ks-badge-avatar-border-width) solid var(--ks-badge-avatar-border-color);
  background: var(--story-badge-bg, #d1d5db);
  color: var(--story-badge-text, #111827);
  box-shadow: var(--ks-badge-avatar-shadow);
  display: grid;
  place-items: center;
  box-sizing: border-box;
  padding: 0;
  overflow: hidden;
}

.story-profile-badge-stack {
  position: relative;
  width: var(--ks-badge-avatar-size);
  min-width: var(--ks-badge-avatar-size);
  height: var(--ks-badge-avatar-size);
}

.story-profile-badge-text {
  display: block;
  font-size: 24px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  text-shadow: var(--story-badge-text-shadow, none);
}

.story-profile-badge-wrap--fallback {
  background: var(--ks-color-primary-500);
  color: #ffffff;
  border: 2px solid #374151;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    inset 0 -2px 3px rgba(15, 23, 42, 0.18),
    0 3px 8px rgba(15, 23, 42, 0.14);
}

.story-profile-badge-logo {
  width: 72%;
  height: 72%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.story-profile-badge-ks {
  width: 75%;
  height: 75%;
  color: #ffffff;
}

.story-profile-badge-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: brightness(0) invert(1);
  display: block;
}

.story-profile-badge-wrap--photo {
  background: #ffffff;
  cursor: default;
}

.story-profile-badge-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  pointer-events: none;
}


.story-profile-bottom {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 8px;
}

.story-profile-main {
  min-width: 0;
  padding-top: 0;
  text-align: left;
}

.story-profile-line1 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  line-height: 1.1;
  text-align: left;
}

.story-profile-name,
.story-city,
.story-copy {
  font-family: inherit;
  font-size: var(--ks-type-reading-lg);
  letter-spacing: 0;
}

.story-profile-name {
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}

.story-profile-verify,
.story-profile-degree {
  font-size: var(--ks-type-reading-sm);
  color: #4b5563;
}

.story-profile-time {
  font-size: var(--ks-type-reading-sm);
  color: var(--ks-color-accent-coral);
  line-height: 1.1;
  font-weight: 700;
  margin-left: 4px;
}

.story-profile-follow {
  color: rgba(17, 24, 39, 0.56);
  font-size: var(--ks-type-reading-sm);
  font-weight: 400;
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  align-self: start;
  padding-top: 0;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: right;
  cursor: pointer;
}

.story-profile-follow--serial {
  white-space: nowrap;
}

.story-profile-follow__label {
  opacity: 0.74;
  margin-right: 2px;
}

@media (min-width: 768px) {
  .story-route-search {
    margin-top: 0;
    margin-bottom: 20px;
  }
}

@media (max-width: 767px) {
  .follow-search-shell--home {
    width: 100%;
  }

  .follow-search--home {
    width: 100%;
  }

  .track-kindness-map-card {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 20px 0 20px;
    margin-top: 0;
    margin-bottom: 0;
    border-top: 1px solid #e8e6dc;
    border-bottom: 4px dotted #e8e6dc;
  }

  .track-kindness-ranking {
    margin-top: 40px;
  }

  .track-kindness-ranking__title {
    margin-bottom: 16px;
    text-align: center;
  }

  .track-kindness-ranking__header,
  .track-kindness-ranking__row {
    grid-template-columns: 52px minmax(0, 1fr) minmax(0, 0.8fr);
    row-gap: 12px;
  }

  .track-kindness-ranking__header {
    padding-bottom: 12px;
    text-align: left;
  }

  .track-kindness-ranking__cell {
    font-size: 0.94rem;
  }

  .track-kindness-ranking__cell--rank {
    text-align: left;
  }

  .track-kindness-map-wrap {
    height: auto;
    min-height: 0;
    aspect-ratio: 1 / 1;
  }

  .story-route-search {
    margin-top: 0;
    margin-bottom: 20px;
  }
}

.story-route-arrow {
  background: transparent;
  border: 0;
}

.story-route-arrow-glyph {
  display: inline-block;
  color: #50b0dc;
  font-size: 15px;
  line-height: 1;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
}

.story-profile-map .leaflet-popup-content-wrapper {
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.14);
}

.story-profile-map .leaflet-popup-content {
  margin: 8px 10px;
  font-size: 12px;
  line-height: 1.35;
  color: #1f2937;
}

.story-city {
  margin: 0 0 4px;
  color: #1f2937;
  line-height: 1.2;
  font-weight: 700;
}

.story-city-state-badge {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ks-badge-state-size);
  min-width: var(--ks-badge-state-size);
  height: var(--ks-badge-state-size);
  margin-left: 4px;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 999px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--story-badge-bg, #d1d5db) 86%, white 14%) 0%, color-mix(in srgb, var(--story-badge-bg, #d1d5db) 94%, black 6%) 100%);
  color: var(--story-badge-text, #111827);
  box-shadow: var(--ks-badge-state-shadow);
  font-size: 15px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  text-shadow: none;
  box-sizing: border-box;
  cursor: pointer;
  vertical-align: middle;
  transition: box-shadow 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.story-city-state-badge:hover,
.story-city-state-badge:focus-visible {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    inset 0 -1px 0 rgba(15, 23, 42, 0.14),
    0 2px 4px rgba(15, 23, 42, 0.1);
  transform: translateY(-1px);
  outline: none;
}

.story-meta-line {
  margin: 0 0 8px;
  color: #1f2937;
  font-family: inherit;
  font-size: var(--ks-type-reading-lg);
  letter-spacing: 0;
  line-height: 1.2;
  font-weight: 400;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 4px 7px;
}

.story-meta-group {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  flex: 0 0 auto;
  min-width: max-content;
}

.story-meta-group--with-divider {
  border-left: 1px solid rgba(0, 0, 0, 0.5);
  padding-left: 7px;
}

.story-meta-group--wrapped {
  border-left: 0;
  padding-left: 0;
}

.story-meta-line .story-city {
  margin: 0;
}

.story-meta-brand {
  order: 1;
  font-family: inherit;
  font-size: var(--ks-type-reading-lg);
  letter-spacing: 0;
  font-weight: 400;
}

.story-meta-brand[data-story-stop-number] {
  color: #1f2937;
  cursor: pointer;
}

.story-meta-number {
  order: 2;
  color: var(--color-button-primary);
  font-weight: 700;
  margin-left: 7px;
}

.story-meta-number[data-story-stop-number] {
  min-width: 0;
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-button-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  cursor: pointer;
  font-size: var(--ks-type-reading-lg);
  font-weight: 700;
  line-height: 1;
  box-sizing: border-box;
  box-shadow: none;
  text-shadow: none;
  transition: color 160ms ease;
}

.story-meta-number[data-story-stop-number][data-digit-count="1"],
.story-meta-number[data-story-stop-number][data-digit-count="2"] {
  width: auto;
  min-width: 0;
  padding: 0;
}

.story-meta-brand[data-story-stop-number]:hover,
.story-meta-brand[data-story-stop-number]:focus-visible,
.story-meta-number[data-story-stop-number]:hover,
.story-meta-number[data-story-stop-number]:focus-visible {
  outline: none;
}

.story-meta-brand[data-story-stop-number].is-linked-hover,
.story-meta-brand[data-story-stop-number].is-linked-active,
.story-meta-number[data-story-stop-number].is-linked-hover,
.story-meta-number[data-story-stop-number].is-linked-active {
  transform: none;
}

.story-meta-number[data-story-stop-number]:hover,
.story-meta-number[data-story-stop-number]:focus-visible {
  color: #0887cc;
}

.story-meta-number[data-story-stop-number].is-linked-hover,
.story-meta-number[data-story-stop-number].is-linked-active {
  color: #ea983a;
}

.story-stop-warning-bubble {
  position: fixed;
  left: 0;
  top: 0;
  width: min(125px, calc(100vw - 32px));
  max-width: min(125px, calc(100vw - 32px));
  min-height: 66px;
  padding: 9px 12px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16);
  color: #111827;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 500;
  text-align: left;
  white-space: normal;
  word-break: break-word;
  z-index: 1200;
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.story-stop-warning-bubble::after {
  content: '';
  position: absolute;
  left: var(--story-stop-warning-arrow-x, 50%);
  top: 100%;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 9px solid #ffffff;
  transform: translateX(-50%);
}

.story-stop-warning-bubble.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.story-meta-info {
  order: 3;
  margin-left: 5px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 2px solid var(--color-button-primary);
  background: var(--story-card-surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
  line-height: 0;
  color: var(--color-button-primary);
  cursor: pointer;
  position: relative;
  top: -0.5px;
  transition: background-color 160ms ease, color 160ms ease;
}

.story-meta-number[data-story-stop-number] + .story-meta-info {
  margin-left: 7px;
}

.story-meta-info:hover {
  background: var(--color-button-primary);
  color: #ffffff;
}

.story-money-label {
  order: 4;
  font-family: inherit;
  font-size: var(--ks-type-reading-lg);
  letter-spacing: 0;
  font-weight: 400;
}

.story-money-denomination {
  color: var(--ks-color-accent-green);
  font-weight: 700;
}

.story-money-amount {
  order: 5;
  margin-left: 5px;
  color: var(--ks-color-accent-green);
  font-weight: 700;
}

.story-money-amount--empty {
  display: none;
}

.story-money-amount + .story-meta-info {
  order: 6;
  border-color: var(--ks-color-accent-green);
  color: var(--ks-color-accent-green);
}

.story-money-amount + .story-meta-info:hover {
  background: var(--ks-color-accent-green);
  color: #ffffff;
}

.story-total-label {
  order: 7;
  font-family: inherit;
  font-size: var(--ks-type-reading-lg);
  letter-spacing: 0;
  font-weight: 400;
  margin-left: 2px;
}

.story-total-amount {
  order: 8;
  margin-left: 5px;
  color: var(--ks-color-accent-coral);
  font-weight: 700;
}

.story-meta-info--total {
  order: 9;
  border-color: var(--ks-color-accent-coral);
  color: var(--ks-color-accent-coral);
}

.story-meta-info--total:hover {
  background: var(--ks-color-accent-coral);
  color: #ffffff;
}

.story-meta-info--city {
  border-color: #1f2937;
  color: #1f2937;
}

.story-meta-info--city:hover {
  background: #1f2937;
  color: #ffffff;
}

.story-meta-info-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.story-meta-popup {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  min-width: 180px;
  max-width: min(260px, calc(100vw - 32px));
  padding: 10px 12px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.14);
  color: #111827;
  font-size: var(--ks-type-reading-sm);
  line-height: 1.25;
  text-align: left;
  white-space: normal;
  z-index: 40;
  display: none;
}

.story-meta-popup::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 10px solid #ffffff;
  transform: translateX(-50%);
}

.story-meta-info-wrap.is-open .story-meta-popup {
  display: block;
}

.story-copy {
  margin: 0;
  color: #1f2937;
  line-height: 1.2;
  font-weight: 400;
  text-align: left;
}

.story-item.is-expanded .story-copy {
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

.story-read-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--color-button-primary);
  font-weight: 400;
  text-decoration: none;
  white-space: nowrap;
}

.story-read-more:hover,
.story-read-more:focus-visible {
  text-decoration: none;
}

.story-read-more__glyph {
  position: relative;
  width: 12px;
  height: 12px;
  display: inline-block;
  flex: 0 0 auto;
  top: 1px;
  transform: rotate(0deg);
  transition: transform 500ms cubic-bezier(0.42, 0, 0.58, 1);
}

.story-read-more__glyph::before,
.story-read-more__glyph::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1px;
  height: 12px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center center;
}

.story-read-more__glyph::before {
  transform: translate(-50%, -50%) rotate(0deg);
}

.story-read-more__glyph::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.story-item.is-expanded:not(.is-opening) .story-read-more__glyph,
.story-item.is-collapsing .story-read-more__glyph {
  transform: rotate(45deg);
}

.story-search-highlight {
  background: #f8f1b8;
  color: #111827;
  padding: 0 1px;
  border-radius: 2px;
}

.story-engagement {
  margin: 15px -16px 0;
  padding: 10px 16px;
  border-top: 1px solid #d1d5db;
  border-bottom: 1px solid #d1d5db;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #6b7280;
  font-size: 13px;
  line-height: 1.1;
  font-weight: 400;
}

.story-engagement-left {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.story-engagement-right {
  display: none;
}

.story-engagement-icons {
  display: inline-flex;
  align-items: center;
}

.story-engagement-icons img {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  margin-right: -3px;
  border: 1px solid #ffffff;
  background: #ffffff;
}

.story-engagement-icons img:last-child {
  margin-right: 0;
}

.story-engagement-count,
.story-engagement-reposts {
  white-space: nowrap;
}

.story-engagement-right {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.story-engagement-count {
  color: inherit;
}

.story-engagement-reposts {
  color: inherit;
}


.story-actions {
  margin: 0 -16px 0;
  padding: 10px 30px 15px 16px;
  border-top: 0;
  border-bottom: 0;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-end;
}

.story-actions > * {
  flex: 0 0 auto;
  margin: 0;
}

.story-action-timestamp {
  color: rgba(0, 0, 0, 0.5);
  font-size: 13px;
  line-height: 1.1;
  font-weight: 400;
  white-space: nowrap;
}

.story-actions-buttons {
  display: inline-flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 40px;
}


.story-action-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: #4b5563;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 2px;
  padding: 0;
  margin: 0;
  width: auto;
  min-width: auto;
  min-height: 0;
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  cursor: pointer;
}

.story-action-btn span {
  display: block;
  margin: 0;
  white-space: nowrap;
}

.story-action-btn img {
  display: block;
  width: auto;
  height: 15px;
  object-fit: contain;
}

.story-reaction-wrap {
  position: relative;
  display: inline-flex;
  justify-content: flex-start;
  align-items: end;
  flex: 0 0 auto;
}

.story-reactions {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  transform: translate(-50%, 6px);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
  z-index: 10;
}

.story-reactions.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
  transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 0s;
}

.story-reaction-btn {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  width: 35px;
  height: 35px;
  cursor: pointer;
  border-radius: 999px;
}

.story-reaction-btn img {
  display: block;
  width: 35px !important;
  height: 35px !important;
  object-fit: contain;
}

.story-reaction-btn:hover img,
.story-reaction-btn:focus-visible img {
  transform: translateY(-2px);
}

@media (max-width: 767px) {
  .stories-timeline {
    width: 100%;
    gap: 0;
  }

  .stories-grid > .stories-timeline {
    grid-column: 1 / -1;
    margin-top: 0;
  }

  /* Phone-only: keep content below nav on the shared page canvas and remove story cards */
  .follow-kindness,
  .page-shell {
    background: var(--homepage-canvas);
  }

  .story-item {
    background: #ffffff;
    border: var(--ks-shell-border-width) solid var(--ks-shell-border-color);
    border-radius: var(--ks-shell-radius-card-md);
    padding: 14px 16px 0;
  }

  .story-actions {
    margin: 0 0 0;
    padding: 10px 30px 15px 0;
    border-bottom: 0;
  }

  .story-engagement {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .story-item .story-actions {
    margin-left: calc(-1 * var(--grid-gutter-mobile));
    margin-right: calc(-1 * var(--grid-gutter-mobile));
    padding-left: var(--grid-gutter-mobile);
    padding-right: 30px;
  }

  .story-profile {
    border-top: 0;
    padding-top: 8px;
  }

  .story-city {
    font-size: var(--ks-type-reading-lg);
  }

  .story-copy {
    font-size: var(--ks-type-reading-lg);
  }

  .story-pagination-wrap {
    margin-top: 22px;
    gap: 14px;
    padding-inline: var(--grid-gutter-mobile);
    flex-wrap: wrap;
  }

  .story-pagination {
    flex-wrap: wrap;
    row-gap: 10px;
  }

  .story-pagination-pages {
    gap: 12px;
  }

  .story-pagination-controls {
    gap: 12px;
  }

  .story-pagination-arrow,
  .story-pagination-page {
    min-width: 34px;
    height: 34px;
    font-size: 14px;
  }

  .story-pagination-arrow__glyph {
    border-top-width: 6px;
    border-bottom-width: 6px;
  }

  .story-pagination-arrow__glyph--left {
    border-right-width: 10px;
  }

  .story-pagination-arrow__glyph--right {
    border-left-width: 10px;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .story-actions {
    border-bottom: 0;
  }

  .story-profile {
    border-top: 0;
  }
}

@media (min-width: 1024px) {
  .page-shell {
    width: var(--homepage-center-lane-width);
    max-width: var(--homepage-center-lane-width);
    margin-left: auto;
    margin-right: auto;
    padding-top: 8px;
  }

  .page-shell > .bill-summary-grid,
  .page-shell > .bill-journey-lane {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .bill-journey-lane > .kind-steps-map-count,
  .bill-journey-lane > .kind-steps-stories,
  .bill-journey-lane > .bill-journey-map-host,
  .bill-journey-lane > .stories-grid,
  .bill-journey-lane > .story-pagination-wrap,
  .bill-journey-map-host > .story-map-card,
  .bill-journey-map-host > .story-map-card.story-map-open,
  .bill-journey-lane .stories-grid > .stories-timeline {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .page-shell > .bill-summary-grid {
    margin-bottom: 20px;
  }

  .bill-journey-lane > .kind-steps-map-count {
    margin-top: 18px;
  }

  .bill-journey-lane > .kind-steps-stories {
    margin-bottom: 12px;
  }

  .bill-journey-map-host > .story-map-card {
    margin-bottom: 16px;
  }

  .bill-journey-map-host > .story-map-card .story-profile-map-wrap,
  .bill-journey-map-host > .story-map-card.story-map-open .story-profile-map-wrap {
    width: 100%;
    max-width: 100%;
  }
}

@media (min-width: 1024px) {
  #search-results-content > main.page-shell {
    width: var(--homepage-center-lane-width) !important;
    max-width: var(--homepage-center-lane-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #search-results-content > main.page-shell > .bill-summary-grid {
    width: 100% !important;
    max-width: var(--homepage-center-lane-width) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #search-results-content > main.page-shell > .bill-journey-lane,
  #search-results-content > main.page-shell > .bill-journey-lane > .kind-steps-map-count,
  #search-results-content > main.page-shell > .bill-journey-lane > .kind-steps-stories,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card.story-map-open,
  #search-results-content > main.page-shell > .bill-journey-lane > .stories-grid,
  #search-results-content > main.page-shell > .bill-journey-lane > .stories-grid > .stories-timeline,
  #search-results-content > main.page-shell > .bill-journey-lane > .story-pagination-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card .story-profile-map-wrap,
  #search-results-content > main.page-shell > .bill-journey-lane > .bill-journey-map-host > .story-map-card.story-map-open .story-profile-map-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Hard shadow reset across this layout */
.top-sheet,
.bottom-sheet,
.bottom-nav {
  box-shadow: none !important;
}

html.theme-dark body,
html.theme-dark .follow-kindness,
html.theme-dark .follow-kindness-inner,
html.theme-dark #search-results-content,
html.theme-dark .page-shell {
  background: var(--ks-theme-page-bg);
  color: var(--ks-theme-text-primary);
}

html.theme-dark .follow-kindness-title,
html.theme-dark .follow-kindness-subtitle {
  color: var(--ks-color-primary-500);
}

html.theme-dark .follow-kindness-title__image {
  filter:
    drop-shadow(0 1px 0 rgba(177, 224, 244, 0.24))
    drop-shadow(0 2px 1px rgba(177, 224, 244, 0.08))
    drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.36))
    drop-shadow(0 -3px 2px rgba(0, 0, 0, 0.3));
}

html.theme-dark .follow-kindness-subtitle {
  text-shadow:
    0 1px 0 rgba(177, 224, 244, 0.18),
    0 2px 1px rgba(177, 224, 244, 0.06),
    0 -1px 0 rgba(0, 0, 0, 0.34),
    0 -2px 1px rgba(0, 0, 0, 0.28);
}

html.theme-dark .follow-search-shell--home {
  --follow-search-shell-stroke: var(--ks-theme-search-shell-stroke);
}

html.theme-dark .follow-search-shell__shape-fill {
  fill: var(--ks-theme-search-shell-fill);
}

html.theme-dark .follow-search-shell--home.is-dropdown-open .follow-search-shell__shape-fill,
html.theme-dark .follow-search-shell--home.is-dropdown-closing .follow-search-shell__shape-fill {
  fill: #22324a;
}

html.theme-dark .follow-search--home .follow-search-leading,
html.theme-dark .follow-search-magnifier__svg,
html.theme-dark .follow-search--home .follow-search-input,
html.theme-dark .follow-search--home .follow-search-clear,
html.theme-dark .follow-search-example,
html.theme-dark .follow-search-example-divider,
html.theme-dark .follow-search-scanbill {
  color: var(--ks-theme-search-text);
}

html.theme-dark .follow-search--home .follow-search-leading__ks-image {
  color: #ffffff;
}

html.theme-dark .follow-search--home .follow-search-clear__x::before,
html.theme-dark .follow-search--home .follow-search-clear__x::after {
  background: #ffffff;
}

html.theme-dark .follow-search--home .follow-search-input::placeholder {
  color: rgba(238, 244, 251, 0.64);
}

html.theme-dark .follow-search-example-serial,
html.theme-dark .follow-search-scanbill__label {
  color: #eef4fb;
}

html.theme-dark .follow-search-scanbill:hover .follow-search-scanbill__label,
html.theme-dark .follow-search-scanbill:focus-visible .follow-search-scanbill__label {
  color: #ffffff;
}

html.theme-dark .follow-search-scanbill__corner--tl,
html.theme-dark .follow-search-scanbill__corner--tr,
html.theme-dark .follow-search-scanbill__corner--bl,
html.theme-dark .follow-search-scanbill__corner--br {
  border-color: #ffffff;
}

html.theme-dark .follow-search-scanbill__plus::before,
html.theme-dark .follow-search-scanbill__plus::after {
  background: #ffffff;
}

html.theme-dark .follow-search-shell--home .follow-search-dropdown {
  background: transparent;
}

html.theme-dark .follow-search-shell--home .follow-search-dropdown__inner {
  background: #22324a;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 -1px 0 rgba(9, 16, 30, 0.28),
    0 10px 24px rgba(0, 0, 0, 0.16);
}

html.theme-dark .follow-search-shell--home .follow-search-dropdown__inner::before {
  background: rgba(127, 149, 184, 0.34);
}

html.theme-dark .follow-search-shell--home .follow-search-dropdown__item {
  color: #eef4fb;
}

html.theme-dark .follow-search-shell--home .follow-search-dropdown__title,
html.theme-dark .follow-search-shell--home .follow-search-dropdown__empty-title {
  color: #ffffff;
}

html.theme-dark .follow-search-shell--home .follow-search-dropdown__meta,
html.theme-dark .follow-search-shell--home .follow-search-dropdown__description,
html.theme-dark .follow-search-shell--home .follow-search-dropdown__empty-copy,
html.theme-dark .follow-search-shell--home .follow-search-dropdown__icon {
  color: #eef4fb;
}

html.theme-dark body:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home .follow-search-dropdown__item:hover,
html.theme-dark body:not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home .follow-search-dropdown__item:focus-visible {
  background: rgba(255, 255, 255, 0.05);
}

html.theme-dark body.homepage-search-front .follow-search-shell__shape-fill,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell__shape-fill {
  fill: var(--ks-theme-search-shell-fill);
}

html.theme-dark body.homepage-search-front .follow-search-shell--home.is-dropdown-open .follow-search-shell__shape-fill,
html.theme-dark body.homepage-search-front .follow-search-shell--home.is-dropdown-closing .follow-search-shell__shape-fill,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home.is-dropdown-open .follow-search-shell__shape-fill,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .follow-search-shell--home.is-dropdown-closing .follow-search-shell__shape-fill {
  fill: #22324a;
}

html.theme-dark .realtime-hit-feed__title,
html.theme-dark .realtime-hit-feed__toggle-label,
html.theme-dark .realtime-hit-feed__toggle {
  color: var(--ks-color-coral-500, #ff6b6b);
}

html.theme-dark .realtime-hit-feed__title {
  color: var(--ks-theme-feed-header);
}

html.theme-dark .realtime-hit-feed__wordmark {
  background-color: currentColor;
  color: var(--ks-theme-feed-header);
}

html.theme-dark .realtime-hit-feed__viewport {
  border-color: rgba(127, 149, 184, 0.34);
  background: var(--ks-theme-surface-raised);
  background-image: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 -1px 0 rgba(9, 16, 30, 0.28);
}

html.theme-dark .realtime-hit-feed__item::before {
  background: rgba(127, 149, 184, 0.24);
}

html.theme-dark .realtime-hit-feed__item.is-armed::after {
  border-color: rgba(255, 183, 3, 0.82);
  background: rgba(255, 183, 3, 0.18);
}

html.theme-dark .realtime-hit-feed__avatar {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 3px rgba(0, 0, 0, 0.28),
    0 4px 10px rgba(0, 0, 0, 0.24);
  background: var(--ks-theme-photo-ring);
}

html.theme-dark .realtime-hit-feed__click-badge {
  border-color: var(--ks-color-accent-yellow);
  color: var(--ks-color-accent-yellow);
}

html.theme-dark .realtime-hit-feed__jump-target--rail:hover .realtime-hit-feed__click-badge,
html.theme-dark .realtime-hit-feed__jump-target--rail:focus-visible .realtime-hit-feed__click-badge,
html.theme-dark .realtime-hit-feed__jump-target--rail:active .realtime-hit-feed__click-badge {
  background: var(--ks-color-accent-yellow);
  border-color: var(--ks-color-accent-yellow);
  color: #ffffff;
}

html.theme-dark .realtime-hit-feed__item.is-armed .realtime-hit-feed__click-badge,
html.theme-dark .realtime-hit-feed__jump-target--rail.is-armed .realtime-hit-feed__click-badge {
  background: var(--ks-color-accent-yellow);
  border-color: var(--ks-color-accent-yellow);
  color: #ffffff;
}

html.theme-dark .realtime-hit-feed__name,
html.theme-dark .realtime-hit-feed__location {
  color: #ffffff;
}

html.theme-dark .realtime-hit-feed__billline,
html.theme-dark .realtime-hit-feed__stop,
html.theme-dark .realtime-hit-feed__amount {
  color: #ffffff;
}

html.theme-dark .realtime-hit-feed__excerpt {
  color: #eef4fb;
}

html.theme-dark .realtime-hit-feed__dots-wrap {
  color: rgba(184, 199, 218, 0.78);
}

html.theme-dark .realtime-hit-feed__dot {
  background: rgba(184, 199, 218, 0.42);
}

html.theme-dark .realtime-hit-feed__dot.is-active {
  background: rgba(184, 199, 218, 0.92);
}

html.theme-dark .homepage-rail-card,
html.theme-dark .story-item,
html.theme-dark .story-meta-popup {
  color: var(--ks-theme-text-primary);
}

html.theme-dark .homepage-rail-card {
  background: var(--ks-theme-surface-raised);
  background-image: none;
  border-color: rgba(127, 149, 184, 0.34);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    inset 0 -1px 0 rgba(9, 16, 30, 0.24);
}

html.theme-dark .homepage-rail-heading__wordmark {
  background: var(--ks-color-primary-500);
}

html.theme-dark .homepage-rail-heading--metrics .homepage-rail-heading__wordmark {
  background: #eef4fb;
}

html.theme-dark .homepage-rail-heading__text,
html.theme-dark .homepage-rail-heading__digit,
html.theme-dark .homepage-rail-heading__title,
html.theme-dark .homepage-rail-heading__year,
html.theme-dark .homepage-rail-card--metrics,
html.theme-dark .homepage-rail-card--chart {
  color: #eef4fb;
}

html.theme-dark .homepage-rail-heading--metrics .homepage-rail-heading__text {
  color: #eef4fb;
}

html.theme-dark body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-heading--metrics .homepage-rail-heading__wordmark {
  background: #eef4fb;
}

html.theme-dark body.homepage-layout-mode--tablet-side .homepage-layout__column--left .homepage-rail-heading--metrics .homepage-rail-heading__text {
  color: #eef4fb;
}

html.theme-dark .realtime-hit-feed__cards:has(.realtime-hit-feed__card--metrics.is-active),
html.theme-dark .realtime-hit-feed__cards:has(.realtime-hit-feed__card--chart.is-active),
html.theme-dark .realtime-hit-feed__stream,
html.theme-dark .realtime-hit-feed__card--metrics,
html.theme-dark .realtime-hit-feed__card--chart {
  background: var(--ks-theme-surface-raised);
}

html.theme-dark .realtime-hit-feed__card-title,
html.theme-dark .realtime-hit-feed__card-title--metrics,
html.theme-dark .realtime-hit-feed__card-title--chart,
html.theme-dark .realtime-hit-feed__card-copy,
html.theme-dark .realtime-hit-feed__chart-summary-item,
html.theme-dark .realtime-hit-feed__chart-summary-item strong,
html.theme-dark .realtime-hit-feed__chart-legend-item,
html.theme-dark .realtime-hit-feed__chart-legend-item--peak {
  color: #eef4fb;
}

html.theme-dark .realtime-hit-feed__metric {
  background: var(--ks-theme-surface-inset);
  background-image: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    inset 0 -1px 0 rgba(9, 16, 30, 0.28);
}

html.theme-dark .realtime-hit-feed__metric::after {
  border-color: rgba(127, 149, 184, 0.34);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.18);
}

html.theme-dark .realtime-hit-feed__metric-label,
html.theme-dark .realtime-hit-feed__metric-value {
  color: #eef4fb;
}

html.theme-dark .realtime-hit-feed__chart {
  background: var(--ks-theme-surface-inset);
  border-radius: 10px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    inset 0 -1px 0 rgba(9, 16, 30, 0.22);
}

html.theme-dark .realtime-hit-feed__chart-label,
html.theme-dark .realtime-hit-feed__chart-month-label {
  color: #c7d3e1;
}

html.theme-dark .realtime-hit-feed__chart-bar::after {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    inset -1px 0 0 rgba(9, 16, 30, 0.14),
    inset 1px 0 0 rgba(255, 255, 255, 0.12);
}

html.theme-dark .realtime-hit-feed__flat-chart-range {
  background: rgba(255, 255, 255, 0.05);
}

html.theme-dark .realtime-hit-feed__flat-chart-range-button {
  color: #c7d3e1;
}

html.theme-dark .realtime-hit-feed__flat-chart-range-button.is-active {
  background: rgba(184, 199, 218, 0.18);
  color: #eef4fb;
}

html.theme-dark .realtime-hit-feed__flat-chart-average-value,
html.theme-dark .realtime-hit-feed__flat-chart-today-value {
  color: #eef4fb;
}

html.theme-dark .realtime-hit-feed__flat-chart-average-label,
html.theme-dark .realtime-hit-feed__flat-chart-today-label,
html.theme-dark .realtime-hit-feed__flat-chart-note,
html.theme-dark .realtime-hit-feed__flat-chart-axis-labels,
html.theme-dark .realtime-hit-feed__flat-chart-axis {
  color: #c7d3e1;
}

html.theme-dark .realtime-hit-feed__flat-chart-line {
  border-top-color: rgba(184, 199, 218, 0.46);
}

html.theme-dark body.homepage-search-front .realtime-hit-feed__viewport,
html.theme-dark body.homepage-search-front .realtime-hit-feed__cards,
html.theme-dark body.homepage-search-front .realtime-hit-feed__stream,
html.theme-dark body.homepage-search-front .realtime-hit-feed__card,
html.theme-dark body.homepage-search-front .homepage-rail-card,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__viewport,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__cards,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__stream,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__card,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .homepage-rail-card {
  background: var(--ks-theme-surface-raised);
}

html.theme-dark body.homepage-search-front .realtime-hit-feed,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed {
  background: var(--ks-theme-page-bg);
}

html.theme-dark body.homepage-search-front .realtime-hit-feed__dots-wrap,
html.theme-dark body:has(#search-results-content[hidden]):not(.track-kindness-page-active):not(.time-search-active):not(.stopwatch-search-active):not(.screensaver-127-active):not(.world-time-map-active) .realtime-hit-feed__dots-wrap {
  background: var(--ks-theme-page-bg);
  margin-top: 0;
  padding-top: 16px;
  padding-bottom: 2px;
}

html.theme-dark .story-item {
  --story-card-surface: #132033;
  background: #132033;
  background-image: none;
  border-color: rgba(127, 149, 184, 0.34);
  box-shadow: none;
}

html.theme-dark .story-item::before,
html.theme-dark .story-item::after {
  box-shadow: none;
}

html.theme-dark .story-profile-badge-wrap {
  border-color: var(--ks-theme-photo-ring-border);
  background: var(--ks-theme-photo-ring);
}

html.theme-dark .story-profile-badge-wrap--photo {
  background: var(--ks-theme-photo-ring);
}

html.theme-dark .story-profile-badge-wrap--fallback {
  background: var(--ks-color-primary-500);
  border-color: rgba(255, 255, 255, 0.14);
}

html.theme-dark .story-copy,
html.theme-dark .story-profile-name,
html.theme-dark .story-city,
html.theme-dark .story-date,
html.theme-dark .story-meta-line,
html.theme-dark .story-total-label,
html.theme-dark .story-money-label {
  color: #eef4fb;
}

html.theme-dark .story-profile-verify,
html.theme-dark .story-profile-degree,
html.theme-dark .story-profile-time,
html.theme-dark .story-profile-follow,
html.theme-dark .story-action-timestamp,
html.theme-dark .story-engagement {
  color: #aab8cb;
}

html.theme-dark .story-engagement,
html.theme-dark .story-meta-popup,
html.theme-dark .story-reactions {
  background: #132033;
  border-color: rgba(127, 149, 184, 0.34);
  color: #eef4fb;
}

html.theme-dark .bill-summary-card__icon,
html.theme-dark .story-profile-badge-logo img {
  filter: var(--ks-theme-icon-filter-dark);
}

html.theme-dark .story-action-btn {
  color: #eef4fb;
}

html.theme-dark .story-actions .story-action-btn img {
  filter: brightness(0) invert(1) !important;
}

html.theme-dark .story-meta-brand,
html.theme-dark .story-meta-brand[data-story-stop-number],
html.theme-dark .story-meta-brand[data-story-stop-number]:hover,
html.theme-dark .story-meta-brand[data-story-stop-number]:focus-visible,
html.theme-dark .story-meta-brand[data-story-stop-number].is-linked-hover,
html.theme-dark .story-meta-brand[data-story-stop-number].is-linked-active {
  color: #eef4fb;
}

html.theme-dark .story-meta-number,
html.theme-dark .story-meta-number[data-story-stop-number],
html.theme-dark .story-meta-number[data-story-stop-number]:hover,
html.theme-dark .story-meta-number[data-story-stop-number]:focus-visible,
html.theme-dark .story-meta-number[data-story-stop-number].is-linked-hover,
html.theme-dark .story-meta-number[data-story-stop-number].is-linked-active {
  color: var(--ks-color-primary-500);
}

html.theme-dark .story-search-highlight {
  background: rgba(255, 183, 3, 0.26);
  color: #fff7d1;
}

html.theme-dark .story-meta-info--city {
  border-color: rgba(238, 244, 251, 0.7);
  color: #eef4fb;
}

html.theme-dark .story-meta-info--city:hover {
  background: rgba(238, 244, 251, 0.12);
  color: #ffffff;
}

html.theme-dark .follow-search-tracking {
  color: var(--ks-color-primary-500);
}

html.theme-dark .track-kindness-map .leaflet-control-zoom {
  border: 1px solid rgba(165, 188, 220, 0.2);
  border-radius: 16px;
  overflow: hidden;
  background:
    radial-gradient(circle at 28% 22%, rgba(86, 114, 160, 0.16) 0%, rgba(86, 114, 160, 0.05) 24%, rgba(29, 43, 66, 0) 48%),
    linear-gradient(180deg, #243754 0%, #18253b 54%, #132033 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -2px 4px rgba(4, 10, 20, 0.54),
    0 10px 22px rgba(3, 8, 18, 0.34);
}

html.theme-dark .track-kindness-map .leaflet-control-zoom a {
  color: #ffffff;
  background:
    radial-gradient(circle at 28% 22%, rgba(100, 128, 178, 0.28) 0%, rgba(100, 128, 178, 0.1) 24%, rgba(34, 49, 74, 0) 48%),
    linear-gradient(180deg, #314868 0%, #22324a 56%, #18263d 100%);
  border-bottom: 1px solid rgba(165, 188, 220, 0.16);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.38);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    inset 0 -2px 4px rgba(4, 10, 20, 0.54),
    inset 1px 0 0 rgba(255, 255, 255, 0.05),
    inset -1px 0 0 rgba(7, 13, 24, 0.28);
}

html.theme-dark .track-kindness-map .leaflet-control-zoom a:last-child {
  border-bottom: 0;
}

html.theme-dark .track-kindness-map .leaflet-control-zoom a:hover,
html.theme-dark .track-kindness-map .leaflet-control-zoom a:focus-visible {
  background:
    radial-gradient(circle at 28% 22%, rgba(124, 150, 198, 0.3) 0%, rgba(124, 150, 198, 0.12) 24%, rgba(34, 49, 74, 0) 48%),
    linear-gradient(180deg, #395273 0%, #293b59 56%, #1d2c44 100%);
}
.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot,
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot {
  opacity: 0;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot {
  transition:
    transform 260ms cubic-bezier(0.3, 0.9, 0.25, 1),
    opacity 140ms ease 120ms,
    background-color 180ms ease;
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(1),
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot:nth-child(1) {
  transform: translateX(36px) scale(0.82);
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(2),
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot:nth-child(2) {
  transform: translateX(18px) scale(0.9);
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(3),
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot:nth-child(3) {
  transform: translateX(0) scale(0.96);
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(4),
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot:nth-child(4) {
  transform: translateX(-18px) scale(0.9);
}

.realtime-hit-feed.is-collapsing .realtime-hit-feed__dot:nth-child(5),
.realtime-hit-feed.is-collapsed .realtime-hit-feed__dot:nth-child(5) {
  transform: translateX(-36px) scale(0.82);
}