/* words/article.css */
/* Everything is scoped under .yh-article to avoid collisions with home/archive. */

.yh-article{
  /* keep default site vibe, don’t globally restyle */
  width: 100%;
  min-width: 0;
}

/* Masthead layout: nav (L) + logo (C) + top8 (R), but NOT fixed */
.yh-article .yh-masthead{
  position: relative;
  display: grid;
  grid-template-columns: 240px 1fr 240px;
  gap: 16px;
  align-items: start;
  padding: 18px 16px 0;
}

/* The three desktop tracks cannot fit below their content width. Keep the
   same header children and order, but let the one existing grid stack before
   it can widen the mobile page beyond the viewport. */
@media (max-width: 560px){
  .yh-article .yh-masthead{
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding-inline: clamp(14px, 4vw, 20px);
  }
  .yh-article .nav,
  .yh-article .yh-logoWrap,
  .yh-article .top8{
    grid-column: 1;
    max-width: 100%;
  }
}

/* Override global fixed positioning ONLY on article pages */
.yh-article .nav,
.yh-article .top8{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}

/* The legacy article shell keeps Top 8 in the existing 240px desktop track.
   Size its four cells from that actual track so the final column cannot widen
   the document beyond the viewport. */
.yh-article .top8{
  --yhTop8Size: min(70px, calc((100% - 18px) / 4));
  min-width: 0;
}

/* Center archive-sized logo like archive.html */
.yh-article .yh-logoWrap{
  text-align: center;
  pointer-events: none;
}
.yh-article .yh-logoWrap a{
  pointer-events: auto;
  display: inline-block;
}
.yh-article .yh-logo{
  width: min(420px, 65vw);
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* BILLBOARD cover */
.yh-article .yh-cover{
  width: 100%;
  height: 180vh;            /* “multiple scrolls” feel on desktop */
  min-height: 900px;
  max-height: 2000px;
  margin-top: 18px;
  background: #111;         /* stable fallback if image loads slow */
  overflow: hidden;
}
@media (max-width: 980px){
  .yh-article .yh-cover{
    height: 90vh;
    height: min(520px, calc(100svh - 8px));
  min-height: clamp(420px, 62svh, 520px);
  max-height: calc(100svh - 8px);
  }
}
.yh-article .yh-cover img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;        /* dominant visual, safe cropping */
  object-position: center;  /* stable rule */
}

/* Fluid editorial column: mobile uses the available width, then the reading
   measure settles at a readable desktop cap instead of shrinking at 1440px. */
.yh-article .yh-content{
  --yh-article-inline-pad: clamp(14px, 4vw, 32px);
  margin: 0 auto;
  width: 100%;
  max-width: 52rem;
  padding-top: clamp(32px, 4vw, 48px);
  padding-right: max(var(--yh-article-inline-pad), env(safe-area-inset-right, 0px));
  padding-bottom: clamp(64px, 8vw, 96px);
  padding-left: max(var(--yh-article-inline-pad), env(safe-area-inset-left, 0px));
}

/* Title hierarchy: big but subordinate to cover */
.yh-article .yh-title{
  font-family: Times, "Times New Roman", serif;
  font-size: clamp(32px, calc(20px + 3.1vw), 52px);
  line-height: 1.04;
  margin: 0 0 10px;
  min-width: 0;
  overflow-wrap: anywhere;
}
.yh-article .yh-subtitle{
  font-size: clamp(15.5px, calc(14.75px + 0.2vw), 17.5px);
  line-height: 1.45;
  margin: 0 0 18px;
  opacity: .85;
  overflow-wrap: anywhere;
}
.yh-article .yh-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  align-items: center;
  font-size: clamp(12.5px, calc(12px + 0.12vw), 13.5px);
  opacity: .75;
  margin-bottom: 28px;
}
.yh-article .yh-placeholderNotice{
  margin: 0 0 28px;
  padding: 12px 14px;
  border: 1px solid #000;
  border-radius: 14px;
  background: #fff;
  font-size: 14px;
  line-height: 1.4;
}
.yh-article .yh-tags{
  display: none !important;
}
.yh-article #yhMetaSep{
  display: none !important;
}
.yh-article .yh-tag{
  border: 1px solid #000;
  border-radius: 999px;
  padding: 6px 10px;
  text-decoration: none;
  color: inherit;
}

/* Body typography scales smoothly without becoming oversized on wide screens. */
.yh-article .yh-prose{
  min-width: 0;
  font-size: clamp(15.5px, calc(14.75px + 0.24vw), 18px);
  line-height: 1.62;
  overflow-wrap: anywhere;
}
.yh-article .yh-prose p{ margin: 0 0 1em; }
.yh-article .yh-prose h2{
  font-size: clamp(23px, calc(20px + 0.65vw), 28px);
  line-height: 1.2;
  margin: clamp(32px, 5vw, 42px) 0 14px;
  font-family: Times, "Times New Roman", serif;
}
.yh-article .yh-prose h3{
  font: 700 clamp(20px, calc(18px + 0.5vw), 24px)/1.25 Times, "Times New Roman", serif;
  margin: clamp(28px, 4vw, 36px) 0 12px;
}
.yh-article .yh-prose h4{
  font-size: clamp(17.5px, calc(16.5px + 0.3vw), 20px);
  line-height: 1.3;
  margin: 26px 0 10px;
}
.yh-article .yh-prose blockquote,
.yh-article .yh-prose .pullquote{
  margin: clamp(24px, 5vw, 42px) clamp(0px, 3vw, 28px);
  font-size: clamp(18px, calc(16px + 0.55vw), 24px);
  line-height: 1.45;
}
.yh-article .yh-prose figcaption,
.yh-article .yh-prose .wp-element-caption{
  font-size: clamp(12px, calc(11.5px + 0.12vw), 13px);
  line-height: 1.45;
}
.yh-article .yh-prose ul,
.yh-article .yh-prose ol{
  padding-inline-start: clamp(22px, 4vw, 32px);
}
.yh-article .yh-prose a{
  overflow-wrap: anywhere;
}
.yh-article .yh-prose img,
.yh-article .yh-prose video,
.yh-article .yh-prose iframe,
.yh-article .yh-prose embed,
.yh-article .yh-prose object,
.yh-article .yh-prose figure{
  max-width: 100%;
}
.yh-article .yh-prose img,
.yh-article .yh-prose video{
  height: auto;
}
.yh-article .yh-prose iframe{
  width: 100%;
}
.yh-article .yh-prose pre,
.yh-article .yh-prose table{
  display: block;
  max-width: 100%;
  overflow-x: auto;
}

/* Related posts row (3 cards, 16:9) */
.yh-article .yh-related{
  margin-top: 70px;
  border-top: 1px solid #000;
  padding-top: 24px;
}
.yh-article .yh-related > h2{
  font-size: clamp(22px, calc(19px + 0.7vw), 28px);
  line-height: 1.2;
}
.yh-article .yh-relatedGrid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 980px){
  .yh-article .yh-relatedGrid{
    grid-template-columns: 1fr;
  }
}
.yh-article .yh-card{
  border: 1px solid #000;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background: #fff;
}
.yh-article .yh-cardMedia{
  aspect-ratio: 16 / 9;
  width: 100%;
  background: #111;
  overflow: hidden;
}
.yh-article .yh-cardMedia img,
.yh-article .yh-cardMedia video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.yh-article .yh-cardBody{
  padding: 12px 12px 14px;
}
.yh-article .yh-cardTitle{
  font-size: 16px;
  margin: 0 0 6px;
  font-weight: 700;
}
.yh-article .yh-cardSub{
  font-size: 13px;
  margin: 0;
  opacity: .75;
}

/* Invisible reading coordinate system. The train is the only visible layer. */
.yh-progress{
  --yh-article-train-x: 0px;
  position: fixed;
  left: 0;
  right: 0;
  bottom: env(safe-area-inset-bottom, 0px);
  height: 10px;
  z-index: 99999;
  pointer-events: none;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.yh-progress::before,
.yh-progress::after{
  display:none;
  content:none;
}
/* Tuck the emblem below the browser edge when reading pauses. The outer
   layer moves vertically; the train keeps its reading/footer motion inside. */
.yh-progress[data-yh-reading-progress-ready="1"]{
  transform: translate3d(0,0,0);
  transition: transform 420ms cubic-bezier(.18,1.22,.32,1);
}
.yh-progress[data-yh-reading-progress-ready="1"].is-scroll-idle{
  transform: translate3d(0,var(--yh-article-train-idle-drop,80px),0);
  transition-duration: 360ms;
  transition-timing-function: cubic-bezier(.4,0,.7,.2);
}
@media (prefers-reduced-motion: reduce){
  .yh-progress[data-yh-reading-progress-ready="1"]{ transition: none; }
}
.yh-progress.is-hidden,
.yh-progress.is-exited{
  visibility: hidden;
  opacity: 0;
}
.yh-progress.is-exiting,
.yh-progress.is-entering{
  display: block;
  visibility: visible;
  opacity: 1;
}
.yh-progress.is-exiting .yh-progress__train{
  transform: translate3d(calc(100vw + 36px),0,0);
  transition-duration: 340ms;
  transition-timing-function: cubic-bezier(.4,0,.8,.2);
}
.yh-progress.is-entering .yh-progress__train{
  transform: translate3d(calc(100vw + 36px),0,0);
  transition: none;
}

.yh-progress__track{
  display:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.yh-progress__fill{
  display:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.yh-progress__track::before,
.yh-progress__track::after,
.yh-progress__fill::before,
.yh-progress__fill::after{
  display:none !important;
  content:none !important;
}
.yh-progress__train{
  position: absolute;
  bottom: 6px; /* sit on top of bar */
  left: 0;
  transform: translate3d(var(--yh-article-train-x),0,0);
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #d50000; /* placeholder “3 train” badge */
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  transition: transform 180ms cubic-bezier(.2,.8,.25,1);
  will-change: transform;
}

/* Mail footer (document-flow; non-overlay) */
.yh-article .yh-content{
  transition: opacity 160ms linear;
}
body.yh-footer-active .yh-article .yh-content{
  opacity: 0.42;
}

/* Full-width footer section lives as a sibling AFTER main.yh-content */
.yh-article .yh-mailFooter{
  position: relative;
  width: 100%;
  height: min(520px, calc(100svh - 8px));
  min-height: clamp(420px, 62svh, 520px);
  max-height: calc(100svh - 8px);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-top: 1px solid rgba(255,255,255,0.10);
  background: #000;
  background-image: var(--yh-mail-bg, url("../assets/footer/mail-cover.png"));
  background-size: cover;
  background-position: center;
}

/* Subtle darkening for readability */
.yh-article .yh-mailFooter::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.55);
  pointer-events: none;
}

.yh-article .yh-mailFooter__inner{
  position: relative;
  height: 100%;
  min-height: clamp(420px, 62svh, 520px);
  max-height: calc(100svh - 8px);
  padding: 30px 16px 52px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Gentle reveal motion (no overlay, no scroll interception) */
.yh-article .yh-mailFooter__inner{
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 260ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}
.yh-article .yh-mailFooter.is-inview .yh-mailFooter__inner{
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .yh-article .yh-mailFooter__inner{
    transition: none;
    opacity: 1;
    transform: none;
  }
}

/* Form */
.yh-article .yh-mailFooter__form{
  position: relative;
  display: flex;
  gap: 12px;
  align-items: flex-end;
  justify-content: center;
  width: min(760px, calc(100vw - 64px));
}

.yh-article .yh-mailFooter__input{
  flex: 1 1 auto;
  min-width: 220px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: 800;
  padding: 10px 2px 8px;
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255,255,255,0.7);
  outline: none;
}
.yh-article .yh-mailFooter__input::placeholder{
  color: rgba(255,255,255,0.84);
  -webkit-text-fill-color: rgba(255,255,255,0.84);
  font-weight: 700;
  opacity: 1;
}
.yh-article .yh-mailFooter__input:focus{
  border-bottom-color: rgba(255,255,255,0.95);
}
.yh-article .yh-mailFooter__input,
.yh-article .yh-mailFooter__input:focus,
.yh-article .yh-mailFooter__input:active,
.yh-article .yh-mailFooter__input.is-busy,
.yh-article .yh-mailFooter__input[readonly],
.yh-article .yh-mailFooter__input[aria-disabled="true"]{
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  outline: none;
  opacity: 1;
}
.yh-article .yh-mailFooter__input.is-busy,
.yh-article .yh-mailFooter__input[readonly],
.yh-article .yh-mailFooter__input[aria-disabled="true"]{
  pointer-events: none;
}
.yh-article .yh-mailFooter__input:-webkit-autofill,
.yh-article .yh-mailFooter__input:-webkit-autofill:hover,
.yh-article .yh-mailFooter__input:-webkit-autofill:focus,
.yh-article .yh-mailFooter__input:-webkit-autofill:active{
  -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
  box-shadow: 0 0 0 1000px transparent inset !important;
  -webkit-text-fill-color: #fff !important;
  transition: background-color 99999s ease-in-out 0s;
}

.yh-article .yh-mailFooter__btn{
  flex: 0 0 auto;
  border: 0;
  cursor: pointer;
  padding: 10px 18px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 15px;
  text-transform: lowercase;
  background: #1f7a3a;
  color: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,0.35);
  border-radius: 999px;
}
.yh-article .yh-mailFooter__btn:focus{
  outline: 2px solid rgba(255,255,255,0.65);
  outline-offset: 2px;
}

.yh-article .yh-mailFooter__msg{
  position: absolute;
  top: 18px;
  left: 0;
  right: 0;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  letter-spacing: 0.02em;
  color: rgba(255,255,255,0.78);
  pointer-events: none;
  min-height: 16px;
}

.yh-article .yh-mailFooter__homeMapLink{
  position: absolute;
  left: 16px;
  top: 16px;
  width: 132px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  text-decoration: none;
  background: transparent;
  border: 0;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.5s ease;
  z-index: 12;
}
.yh-article .yh-mailFooter__homeMapIcon{
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.34;
}
.yh-article .yh-mailFooter.yh-mailFooter--postTrash .yh-mailFooter__homeMapLink{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.yh-article .yh-mailFooter.yh-mailFooter--postTrash .yh-mailFooter__homeMapLink:hover .yh-mailFooter__homeMapIcon,
.yh-article .yh-mailFooter.yh-mailFooter--postTrash .yh-mailFooter__homeMapLink:focus .yh-mailFooter__homeMapIcon{
  opacity: 0.92;
}
.yh-article .yh-mailFooter.yh-mailFooter--postTrash .yh-mailFooter__homeMapLink:focus{
  outline: 2px solid rgba(255,255,255,0.65);
  outline-offset: 4px;
}

/* Social icons (bottom-left) */
.yh-article .yh-mailFooter__social{
  position: absolute;
  left: 16px;
  bottom: 16px;
  display: flex;
  gap: 14px;
  align-items: center;
}
.yh-article .yh-mailFooter__icon{
  width: 56px;
  height: 56px;
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: rgba(255,255,255,0.95);
  background: transparent;
  border: 0;
  padding: 0;
  opacity: 0.9;
}
.yh-article .yh-mailFooter__icon:hover{
  opacity: 1;
}
.yh-article .yh-mailFooter__icon:focus{
  outline: 2px solid rgba(255,255,255,0.65);
  outline-offset: 2px;
}
.yh-article .yh-mailFooter__icon .yh-ico{
  width: 34px;
  height: 34px;
  fill: currentColor;
}

.yh-article .yh-mailFooter__icon .yh-mailFooter__icoImg{
  width: 34px;
  height: 34px;
  display: block;
}

/* Back to top (bottom-right) */
.yh-article .yh-mailFooter__top{
  position: absolute;
  right: 16px;
  bottom: 16px;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: #1f7a3a;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 14px rgba(0,0,0,0.35);
}
.yh-article .yh-mailFooter__top .yh-ico--arrow{
  width: 22px;
  height: 22px;
}
.yh-article .yh-mailFooter__top .yh-ico--arrow path{
  fill: none;
  stroke: currentColor;
  stroke-width: 3.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.yh-article .yh-mailFooter__top:focus{
  outline: 2px solid rgba(255,255,255,0.65);
  outline-offset: 2px;
}

/* Subtle logo overlay (near bottom-right) */
.yh-article .yh-mailFooter__logo{
  position: absolute;
  right: 76px; /* 16px padding + 46px button + ~14px gap */
  bottom: 16px;
  left: auto;
  transform: translateY(3px);
  filter: brightness(0) invert(1);
  width: 132px;
  height: auto;
  opacity: 0.34;
  pointer-events: none;
  user-select: none;
}

@media (max-width: 980px){
  .yh-article .yh-mailFooter{
    height: min(500px, calc(100svh - 8px));
    min-height: clamp(400px, 60svh, 500px);
  }
  .yh-article .yh-mailFooter__inner{
    min-height: clamp(400px, 60svh, 500px);
    padding: 24px 14px 46px;
  }
}

@media (max-width: 760px){
  .yh-article .yh-mailFooter{
    height: min(470px, calc(100svh - 8px));
    min-height: clamp(380px, 58svh, 470px);
  }
  .yh-article .yh-mailFooter__inner{
    min-height: clamp(380px, 58svh, 470px);
    padding: 18px 12px 40px;
  }
  .yh-article .yh-mailFooter__form{
    gap: 10px;
    width: min(760px, calc(100vw - 32px));
  }
  .yh-article .yh-mailFooter__input{
    min-width: 0;
    font-size: 16px;
  }
  .yh-article .yh-mailFooter__btn{
    padding: 9px 16px;
    font-size: 14px;
  }
  .yh-article .yh-mailFooter__msg{
    top: 12px;
  }
  .yh-article .yh-mailFooter__homeMapLink{
    left: 12px;
    top: 12px;
    width: 112px;
  }
  .yh-article .yh-mailFooter__social{
    left: 12px;
    bottom: 12px;
    gap: 10px;
  }
  .yh-article .yh-mailFooter__icon{
    width: 46px;
    height: 46px;
  }
  .yh-article .yh-mailFooter__icon .yh-ico,
  .yh-article .yh-mailFooter__icon .yh-mailFooter__icoImg{
    width: 28px;
    height: 28px;
  }
  .yh-article .yh-mailFooter__top{
    right: 12px;
    bottom: 12px;
    width: 40px;
    height: 40px;
  }
  .yh-article .yh-mailFooter__logo{
    right: 60px;
    bottom: 12px;
    width: 104px;
  }
}

@media (max-width: 520px){
  .yh-article .yh-mailFooter{
    height: min(446px, calc(100svh - 6px));
    min-height: clamp(360px, 56svh, 446px);
  }
  .yh-article .yh-mailFooter__inner{
    min-height: clamp(360px, 56svh, 446px);
    padding: 14px 10px 34px;
  }
  .yh-article .yh-mailFooter__form{
    gap: 8px;
    width: calc(100vw - 20px);
  }
  .yh-article .yh-mailFooter__input{
    font-size: 14px;
    padding: 8px 2px 7px;
  }
  .yh-article .yh-mailFooter__btn{
    padding: 8px 14px;
    font-size: 13px;
  }
  .yh-article .yh-mailFooter__msg{
    top: 10px;
    font-size: 12px;
  }
  .yh-article .yh-mailFooter__homeMapLink{
    left: 10px;
    top: 10px;
    width: 88px;
  }
  .yh-article .yh-mailFooter__social{
    left: 10px;
    bottom: 10px;
    gap: 8px;
  }
  .yh-article .yh-mailFooter__icon{
    width: 38px;
    height: 38px;
  }
  .yh-article .yh-mailFooter__icon .yh-ico,
  .yh-article .yh-mailFooter__icon .yh-mailFooter__icoImg{
    width: 24px;
    height: 24px;
  }
  .yh-article .yh-mailFooter__top{
    right: 10px;
    bottom: 10px;
    width: 34px;
    height: 34px;
  }
  .yh-article .yh-mailFooter__top .yh-ico--arrow{
    width: 18px;
    height: 18px;
  }
  .yh-article .yh-mailFooter__logo{
    right: 50px;
    bottom: 10px;
    width: 86px;
    opacity: 0.26;
  }
}

/* ------------------------------------------------------------
   Mail Footer Rats: minimal overlay CSS (scoped, safe)
   User-tunable alignment:
     --yh-rat-offset: npx   (positive moves lanes DOWN)
   ------------------------------------------------------------ */

.yh-article .yh-mailFooter{
  --yh-rat-offset: 0px;
}

/* Button micro-animation: visually reads "subscribe-yng" without reflow */
.yh-article .yh-mailFooter__btn{
  position: relative;
  will-change: transform;
  transition: transform 220ms ease;
}
.yh-article .yh-mailFooter__btnText{
  display: inline-block;
  position: relative;
  white-space: nowrap;
}
.yh-article .yh-mailFooter__btnText::after{
  content: "";
  opacity: 0;
  transform: translateX(-2px);
  transition: opacity 180ms ease, transform 180ms ease;
}
.yh-article .yh-mailFooter__btn.yh-btn--yng{
  transform: scale(1.045);
}
.yh-article .yh-mailFooter__btn.yh-btn--yng .yh-mailFooter__btnText::after{
  content: "-yng";
  opacity: 1;
  transform: translateX(0);
}
.yh-article .yh-mailFooter__btn.yh-btn--busy{
  cursor: default;
}

/* Overlay container */
.yh-article .yh-mailFooter__inner{
  position: relative;
}
.yh-article .yh-ratsOverlay{
  position: absolute;
  inset: 0;
  z-index: 30;
  pointer-events: none;
}

/* Lane positioning: JS writes --yh-rat-mid/top/bot */
.yh-article .yh-ratsLane{
  position: absolute;
  left: 0;
  width: 100%;
  height: 154px;
  pointer-events: none;
  overflow: visible;
}
.yh-article .yh-ratsLane.yh-ratsLane--preroll{
  will-change: clip-path;
  animation-duration: var(--yh-preroll-ms, 1680ms);
  animation-timing-function: linear;
  animation-iteration-count: 1;
  animation-fill-mode: both;
}
.yh-article .yh-ratsLane.yh-ratsLane--preroll[data-yh-preroll-origin="left"]{
  animation-name: yh-rats-build-left;
}
.yh-article .yh-ratsLane.yh-ratsLane--preroll[data-yh-preroll-origin="right"]{
  animation-name: yh-rats-build-right;
}
@keyframes yh-rats-build-left{
  from{ clip-path: inset(0 calc(100% - var(--yh-preroll-head, 12%)) 0 0); }
  to{ clip-path: inset(0 0 0 0); }
}
@keyframes yh-rats-build-right{
  from{ clip-path: inset(0 0 0 calc(100% - var(--yh-preroll-head, 12%))); }
  to{ clip-path: inset(0 0 0 0); }
}
.yh-article .yh-ratsLane--mid{ top: calc(var(--yh-rat-mid, 0px) + var(--yh-rat-offset, 0px)); }
.yh-article .yh-ratsLane--top{ top: calc(var(--yh-rat-top, 0px) + var(--yh-rat-offset, 0px)); }
.yh-article .yh-ratsLane--bot{ top: calc(var(--yh-rat-bot, 0px) + var(--yh-rat-offset, 0px)); }
.yh-article .yh-ratsLane--top2{ top: calc(var(--yh-rat-top2, 0px) + var(--yh-rat-offset, 0px)); }

.yh-article .yh-ratsImg{
  width: 100%;
  height: auto;
  display: block;
  max-width: none;
}
.yh-article .yh-ratsLane.is-flipped .yh-ratsImg{
  transform: scaleX(-1);
}

/* Character-frozen wipe layer */
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail,
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail:focus,
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail:active,
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail.is-busy,
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail[readonly],
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail[aria-disabled="true"]{
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  caret-color: transparent !important;
  text-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-top-color: transparent !important;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,0.7) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  opacity: 1 !important;
}
.yh-article .yh-mailFooter.yh-mailFooter--wiping #yhMailEmail::placeholder{
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
.yh-article .yh-mailFooter.yh-mailFooter--wiping .yh-mailFooter__msg{
  opacity: 0 !important;
}
.yh-article .yh-mailWipeLayer{
  position: absolute;
  z-index: 35;
  pointer-events: none;
}
.yh-article .yh-mailWipeText{
  position: absolute;
  overflow: visible;
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-weight: 800;
}
.yh-article .yh-mailWipeMeasure{
  position: relative;
  white-space: pre;
  user-select: none;
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-weight: 800;
}
.yh-article .yh-mailWipeMeasureChar{
  display: inline-block;
  white-space: pre;
}
.yh-article .yh-mailWipeChar{
  position: absolute;
  top: 0;
  white-space: pre;
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-weight: 800;
  opacity: 0;
  transition: opacity 36ms linear;
}
.yh-article .yh-mailWipeChar:not(.is-gone){
  opacity: 1;
}
.yh-article .yh-mailWipeChar.is-gone{
  opacity: 0;
}

.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail,
.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail:focus,
.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail:active,
.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail.is-busy,
.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail[readonly],
.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail[aria-disabled="true"]{
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  caret-color: transparent !important;
}
.yh-article .yh-mailFooter.yh-mailFooter--bridge #yhMailEmail::placeholder{
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
.yh-article .yh-mailFooter.yh-mailFooter--bridge .yh-mailFooter__msg{
  opacity: 0 !important;
}


.yh-article .yh-mailFooter.yh-mailFooter--spam{
  position: relative;
  z-index: 9995;
}

/* Glitch mode (footer-only, safe; killable by removing spam class) */
.yh-article .yh-mailFooter.yh-mailFooter--spam::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  opacity: 0.35;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.05) 0px,
    rgba(255,255,255,0.05) 1px,
    rgba(0,0,0,0) 3px,
    rgba(0,0,0,0) 6px
  );
  animation: yh-spam-flicker 220ms steps(2,end) infinite;
}
@keyframes yh-spam-flicker{
  0%{ opacity: 0.16; }
  50%{ opacity: 0.48; }
  100%{ opacity: 0.25; }
}
@media (prefers-reduced-motion: reduce){
  .yh-article .yh-mailFooter.yh-mailFooter--spam::before{
    animation: none;
    opacity: 0.18;
  }
}

/* Golden rat */
.yh-article .yh-goldenRun{
  position: absolute;
  left: 0;
  width: 100%;
  height: 140px;
  top: calc(var(--yh-rat-mid, 0px) + var(--yh-rat-offset, 0px));
  z-index: 40;
  pointer-events: none;
  will-change: transform;
  animation: yh-golden-sweep 1.76s linear infinite;
}
@keyframes yh-golden-sweep{
  0%{ transform: translateX(-110%); }
  100%{ transform: translateX(110%); }
}

.yh-article .yh-goldenRat{
  position: absolute;
  left: 16%;
  top: 16px;
  width: 118px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
}
.yh-article .yh-goldenRat img{
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.35));
}

/* Pop feedback (cartoon burst lines) */
.yh-article .yh-goldenRat.is-pop{
  animation: none;
}
.yh-article .yh-goldenRat.is-pop img{
  transform: scale(0.25);
  opacity: 0;
  transition: transform 180ms ease-out, opacity 180ms ease-out;
}
.yh-article .yh-goldenRat.is-pop::after{
  content: "";
  position: absolute;
  inset: -18px;
  background:
    repeating-conic-gradient(
      from 0deg,
      rgba(255,255,255,0.0) 0deg 14deg,
      rgba(255,255,255,0.9) 14deg 18deg
    );
  border-radius: 999px;
  opacity: 0.95;
  transform: scale(0.8);
  transition: transform 180ms ease-out, opacity 180ms ease-out;
}



/* Footer-entry feedback: compact green transit-status pop (one reusable node). */
.yh-zeromin{
  position: relative;
  left: auto;
  bottom: auto;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-weight: 800;
  font-size: clamp(10px, .8vw, 12px);
  line-height: 1;
  letter-spacing: .02em;
  color: #39ff3a;
  text-shadow: 0 0 6px rgba(57,255,58,.55);
  transform: translate3d(0,0,0);
  will-change: transform, opacity;
  display: inline-flex;
  align-items: center;
  width: auto;
  white-space: nowrap;
  gap: 4px;
}
.yh-zeromin__coin{
  display: inline-grid;
  place-items: center;
  width: 14px;
  height: 14px;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: #39ff3a;
  font: 900 6px/1 Arial, Helvetica, sans-serif;
  box-shadow: 0 0 10px rgba(57,255,58,.45);
}
.yh-zeromin.is-pop .yh-zeromin__coin{
  animation: yh-zeromin-coin .56s cubic-bezier(.2,.9,.25,1.2) both;
}
.yh-zeromin__label{ white-space: nowrap; }
.yh-zeromin.is-pop{
  animation: yh-zeromin-pop .75s ease-out forwards;
}
@keyframes yh-zeromin-pop{
  0%{ transform: translate3d(0,0,0); opacity: 1; }
  90%{ opacity: 1; }
  100%{ transform: translate3d(0,var(--yh-zeromin-travel, 8px),0); opacity: 0; }
}
@keyframes yh-zeromin-coin{
  0%{ transform: translateY(8px) rotate(-45deg) scale(.2); opacity:0; }
  55%{ transform: translateY(-3px) rotate(185deg) scale(1.16); opacity:1; }
  100%{ transform: translateY(0) rotate(360deg) scale(1); opacity:1; }
}

/* Footer-local top-right safe area; kept below the rat overlay (z-index 30). */
.yh-article .yh-mailFooter__completion{
  position: absolute;
  left: auto;
  right: max(14px, env(safe-area-inset-right));
  top: max(14px, env(safe-area-inset-top));
  bottom: auto;
  width: max-content;
  height: auto;
  display: block;
  contain: layout;
  overflow: visible;
  pointer-events: none;
  z-index: 20;
}
.yh-article .yh-mailFooter__completion .yh-zeromin{
  position: relative;
  left: auto;
  bottom: auto;
}
@media (max-width: 520px){
  .yh-article .yh-mailFooter__completion{
    right: max(10px, env(safe-area-inset-right));
    top: max(10px, env(safe-area-inset-top));
  }
}

@media (prefers-reduced-motion: reduce){
  .yh-progress.is-exiting .yh-progress__train{ transition-duration: .01ms; }
  .yh-zeromin.is-pop{
    animation: none;
    transform: none;
    opacity: 1;
  }
  .yh-zeromin.is-pop .yh-zeromin__coin{ animation: none; }
}


/* === YH RAT REALISM UPGRADE (sprite gait + bob, scoped) === */

.yh-article .yh-mailFooter{ --yh-rat-frames: 13; --yh-rat-steps: 12; --yh-rat-w: 168px; }

.yh-article .yh-ratsRun{ position:absolute; inset:0; will-change: transform; animation-fill-mode: both; }
.yh-article .yh-ratsRun.is-rtl{ animation-name: yh-rat-sweep-rtl; }
.yh-article .yh-ratsRun.is-ltr{ animation-name: yh-rat-sweep-ltr; }
@keyframes yh-rat-sweep-rtl{ from{transform:translate3d(120%,0,0)} to{transform:translate3d(-120%,0,0)} }
@keyframes yh-rat-sweep-ltr{ from{transform:translate3d(-120%,0,0)} to{transform:translate3d(120%,0,0)} }

.yh-article .yh-rat{
  position:absolute;
  bottom: calc(8px + var(--dy, 0px));
  width: var(--yh-rat-w);
  height: 90px;
  background-image: var(--yh-rat-sprite, url("../assets/anim/rat-run-mid.webp"));
  background-repeat: no-repeat;
  background-size: calc(var(--yh-rat-frames) * 100%) 100%;
  background-position: 0 0;
  will-change: transform, background-position, opacity;
  filter: saturate(0.92) brightness(0.98) contrast(1.02) drop-shadow(0 3px 8px rgba(0,0,0,0.34));
  animation: yh-rat-gait var(--g,600ms) steps(var(--yh-rat-steps), end) infinite,
             yh-rat-bob  var(--b,280ms) ease-in-out infinite;
  transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1));
  transform-origin: 50% 60%;
}
@keyframes yh-rat-gait{ from{background-position:0 0} to{background-position:100% 0} }
@keyframes yh-rat-bob{ 0%{ transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1)); } 50%{ transform: translate3d(0,-0.9px,0) scaleX(var(--flip,1)) scale(var(--s,1)); } 100%{ transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1)); } }
.yh-article .yh-rat::before{ content:""; position:absolute; inset:0; background:inherit; opacity:0.006; transform: translateX(var(--trail,-1.2px)); pointer-events:none; }
.yh-article .yh-rat.is-face-left{ --flip: -1; }
.yh-article .yh-rat.yh-rat--tone-brown{ filter: saturate(0.96) brightness(0.99) contrast(1.06) drop-shadow(0 3px 8px rgba(0,0,0,0.34)); }
.yh-article .yh-rat.yh-rat--tone-black{ filter: brightness(0.58) saturate(0.42) contrast(1.18) drop-shadow(0 3px 8px rgba(0,0,0,0.42)); }
.yh-article .yh-rat.yh-rat--tone-gray{ filter: grayscale(0.82) saturate(0.38) brightness(1.08) contrast(1.10) drop-shadow(0 3px 8px rgba(0,0,0,0.34)); }
.yh-article .yh-rat.yh-rat--tone-pale{ filter: grayscale(0.40) saturate(0.34) brightness(1.26) contrast(1.01) drop-shadow(0 3px 8px rgba(0,0,0,0.30)); }

.yh-article .yh-rat.yh-rat--tone-brown{ --yh-rat-look-filter: saturate(0.96) brightness(0.99) contrast(1.04); }
.yh-article .yh-rat.yh-rat--tone-black{ --yh-rat-look-filter: brightness(0.44) saturate(0.24) contrast(1.24); }
.yh-article .yh-rat.yh-rat--tone-gray{ --yh-rat-look-filter: grayscale(0.76) saturate(0.36) brightness(1.02) contrast(1.10); }
.yh-article .yh-rat.yh-rat--tone-pale{ --yh-rat-look-filter: grayscale(0.36) saturate(0.32) brightness(1.18) contrast(1.02); }

.yh-article .yh-lingererLane .yh-rat:not(.yh-rat--look-active),
.yh-article .yh-lingererLane .yh-rat.is-face-left:not(.yh-rat--look-active){
  clip-path: none;
}

.yh-article .yh-lingererLane .yh-ratBonk{
  position:absolute;
  left:0;
  bottom:0;
  width:0;
  height:0;
  transform-origin: 50% 72%;
  will-change: transform;
  pointer-events:none;
}
.yh-article .yh-lingererLane .yh-ratBonk > .yh-rat{ left:0; }
.yh-article .yh-lingererLane .yh-ratBonk.yh-ratBonk--hit{ animation: yh-lingerer-bonk 180ms cubic-bezier(.24,.82,.28,1) 1 both; }
.yh-article .yh-lingererLane .yh-ratBonk.yh-ratBonk--hitRed{ animation: yh-lingerer-bonk-red 210ms cubic-bezier(.21,.86,.24,1) 1 both; }
.yh-article .yh-lingererLane .yh-ratBonk.yh-ratBonk--hitFurious{ animation: yh-lingerer-bonk-furious 236ms cubic-bezier(.18,.88,.22,1) 1 both; }

.yh-article .yh-lingererLane .yh-rat::after{ display:none; }

.yh-article .yh-lingererLane .yh-ratEyes{
  position:absolute;
  left:0;
  bottom: calc(8px + var(--dy, 0px));
  width: var(--yh-rat-w);
  height: 90px;
  transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1));
  transform-origin: 50% 60%;
  pointer-events:none;
  will-change: transform, opacity;
  overflow: visible;
  z-index: 2;
}
.yh-article .yh-lingererLane .yh-ratEyes.is-face-left{ --flip: -1; }
.yh-article .yh-lingererLane .yh-ratEyes__pair{
  position:absolute;
  left:61%;
  top:20.5%;
  width:24px;
  height:13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2px;
  opacity:0.22;
  transform: translate3d(0,0,0) scale(0.90);
  transform-origin:50% 50%;
  transition: opacity 100ms linear;
  filter: drop-shadow(0 0 0.45px rgba(18, 10, 10, 0.24));
}
.yh-article .yh-lingererLane .yh-ratEye{
  position:relative;
  display:block;
  width:10px;
  height:8px;
  border-radius: 58% 62% 58% 62%;
  background: rgb(var(--yh-lingerer-eye-sclera-rgb, 245, 241, 237));
  border: 1px solid rgba(34, 20, 16, 0.22);
  box-shadow:
    inset 0 0.6px 0 rgba(255,255,255,0.62),
    0 0 0.8px rgba(26, 16, 12, 0.18);
}
.yh-article .yh-lingererLane .yh-ratEye--left{
  transform: rotate(-4deg);
}
.yh-article .yh-lingererLane .yh-ratEye--right{
  transform: translateY(-0.2px) rotate(3deg);
}
.yh-article .yh-lingererLane .yh-ratPupil{
  position:absolute;
  left:52%;
  top:52%;
  width:3px;
  height:3px;
  border-radius:999px;
  transform: translate(-50%,-50%);
  background: rgb(var(--yh-lingerer-eye-pupil-rgb, 24, 12, 10));
  box-shadow:
    0 0 0.4px rgba(0,0,0,0.45),
    0 0 0.6px rgba(255,255,255,0.10);
}
.yh-article .yh-lingererLane .yh-ratBrow{
  position:absolute;
  top:13.4%;
  width:11px;
  height:4px;
  border-radius:999px;
  background: rgba(58, 18, 14, 0.84);
  box-shadow: 0 0 0.8px rgba(0,0,0,0.24);
  opacity:0;
  transform-origin:50% 50%;
  transition: opacity 90ms linear;
  z-index:4;
}
.yh-article .yh-lingererLane .yh-ratBrow--left{
  left:59.8%;
  transform: rotate(-2deg) translate3d(0,0,0);
}
.yh-article .yh-lingererLane .yh-ratBrow--right{
  left:67.9%;
  transform: rotate(2deg) translate3d(0,0,0);
}
.yh-article .yh-lingererLane .yh-ratSteam{
  position:absolute;
  top:-2.4%;
  width:10px;
  height:18px;
  border-radius:999px;
  background: radial-gradient(circle at 50% 70%, rgba(234,232,226,0.80) 0%, rgba(214,212,208,0.34) 56%, rgba(255,255,255,0) 74%);
  filter: blur(0.7px);
  opacity:0;
  transform: translate3d(0,0,0) scale(0.82);
  pointer-events:none;
  z-index:1;
}
.yh-article .yh-lingererLane .yh-ratSteam--left{
  left:55.5%;
}
.yh-article .yh-lingererLane .yh-ratSteam--right{
  left:72.4%;
}
.yh-article .yh-lingererLane .yh-rat:not(.yh-rat--red-eyes) + .yh-ratEyes .yh-ratEyes__pair{
  opacity:0.16;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--bonking + .yh-ratEyes .yh-ratEyes__pair{
  opacity:0.92;
  animation: yh-lingerer-eye-pop 180ms cubic-bezier(.24,.82,.28,1) 1 both;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--bonk-crooked + .yh-ratEyes .yh-ratEye--left{
  transform: translateY(-0.4px) scale(1.12, 1.03) rotate(-8deg);
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--bonk-crooked + .yh-ratEyes .yh-ratEye--right{
  transform: translateY(0.15px) scale(0.96, 1.06) rotate(5deg);
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--red-eyes + .yh-ratEyes{
  --yh-lingerer-eye-sclera-rgb: 255, 56, 56;
  --yh-lingerer-eye-pupil-rgb: 34, 4, 4;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--red-eyes + .yh-ratEyes .yh-ratEyes__pair{
  opacity:0.86;
  filter: drop-shadow(0 0 2.5px rgba(255, 52, 52, 0.22));
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--red-eyes + .yh-ratEyes .yh-ratEye{
  border-color: rgba(92, 8, 8, 0.32);
  box-shadow:
    inset 0 0.5px 0 rgba(255,196,196,0.42),
    0 0 1.2px rgba(96, 8, 8, 0.28);
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--bonking.yh-rat--bonking-red + .yh-ratEyes .yh-ratEyes__pair,
.yh-article .yh-lingererLane .yh-rat.yh-rat--red-eyes.yh-rat--bonking + .yh-ratEyes .yh-ratEyes__pair{
  opacity:1;
  animation: yh-lingerer-eye-pop-red 210ms cubic-bezier(.21,.86,.24,1) 1 both;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes{
  --yh-lingerer-eye-sclera-rgb: 198, 14, 14;
  --yh-lingerer-eye-pupil-rgb: 24, 0, 0;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes .yh-ratEyes__pair{
  opacity:1;
  transform: translate3d(0,-0.5px,0) scale(0.98,1.10);
  filter: drop-shadow(0 0 4px rgba(185, 18, 18, 0.34));
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes .yh-ratEye{
  border-color: rgba(74, 4, 4, 0.54);
  box-shadow:
    inset 0 0.5px 0 rgba(255,208,208,0.38),
    0 0 1.7px rgba(96, 8, 8, 0.36);
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes .yh-ratPupil{
  width:3.4px;
  height:3.4px;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes .yh-ratBrow{
  opacity:0.96;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes .yh-ratBrow--left{
  transform: rotate(-15deg) translate3d(-0.3px,0,0);
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes .yh-ratBrow--right{
  transform: rotate(15deg) translate3d(0.3px,0,0);
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--bonking.yh-rat--bonking-furious + .yh-ratEyes .yh-ratEyes__pair,
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes.yh-rat--bonking + .yh-ratEyes .yh-ratEyes__pair{
  opacity:1;
  animation: yh-lingerer-eye-pop-furious 228ms cubic-bezier(.18,.88,.22,1) 1 both;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--furious-eyes + .yh-ratEyes.yh-ratEyes--steam .yh-ratSteam{
  animation: yh-lingerer-steam-puff 280ms ease-out 1 both;
}
.yh-article .yh-lingererLane .yh-rat.yh-rat--look-active + .yh-ratEyes,
.yh-article .yh-lingererLane--looking .yh-ratEyes{
  opacity:0 !important;
}

.yh-article .yh-lingererLane--looking .yh-ratsRun,
.yh-article .yh-lingererLane--looking .yh-ratSlot,
.yh-article .yh-lingererLane--looking .yh-rat{ animation-play-state: paused !important; }

.yh-article .yh-rat.yh-rat--look-active{
  background-repeat: no-repeat !important;
  background-color: transparent !important;
  animation: none !important;
  height: 104px !important;
  width: calc(var(--yh-rat-w) * 1.02) !important;
  bottom: calc(2px + var(--dy, 0px)) !important;
  transform: translate3d(0,-2px,0) scaleX(1) scale(calc(var(--s,1) * 1.01));
  transform-origin: 50% 70%;
  filter: var(--yh-rat-look-filter, none) !important;
}

.yh-article .yh-rat.yh-rat--look-active::before{ display:none; }
.yh-article .yh-rat.yh-rat--look-active::after{ display:none; }


.yh-article .yh-rat.yh-rat--look-turnin{
  --yh-look-frames: 6;
  background-image: var(--yh-rat-look-turnin) !important;
  background-size: calc(var(--yh-look-frames) * 100%) 100% !important;
  background-position: 0 0 !important;
  animation: yh-rat-look-turnin var(--look-in,360ms) steps(6,end) 1 forwards !important;
}
.yh-article .yh-rat.yh-rat--look-hold{
  background-image: var(--yh-rat-look-front) !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  background-position: center bottom !important;
  animation: yh-rat-look-idle 560ms ease-in-out infinite alternate !important;
}
.yh-article .yh-rat.yh-rat--look-turnout{
  --yh-look-frames: 6;
  background-image: var(--yh-rat-look-turnout) !important;
  background-size: calc(var(--yh-look-frames) * 100%) 100% !important;
  background-position: 0 0 !important;
  animation: yh-rat-look-turnout var(--look-out,420ms) steps(6,end) 1 forwards !important;
}

@keyframes yh-rat-look-turnin{ from{ background-position:0 0 } to{ background-position:100% 0 } }
@keyframes yh-rat-look-turnout{ from{ background-position:0 0 } to{ background-position:100% 0 } }
@keyframes yh-rat-look-idle{ from{ transform: translate3d(0,-2px,0) scaleX(1) scale(calc(var(--s,1) * 1.01)); } to{ transform: translate3d(0,-3px,0) scaleX(1) scale(calc(var(--s,1) * 1.01)); } }
@keyframes yh-lingerer-bonk{
  0%{ transform: translate3d(0,0,0) scale3d(1,1,1) rotate(0deg); }
  28%{ transform: translate3d(-1px,-1px,0) scale3d(0.92,1.10,1) rotate(-1.4deg); }
  62%{ transform: translate3d(0.6px,0.2px,0) scale3d(1.04,0.97,1) rotate(1.1deg); }
  100%{ transform: translate3d(0,0,0) scale3d(1,1,1) rotate(0deg); }
}
@keyframes yh-lingerer-bonk-red{
  0%{ transform: translate3d(0,0,0) scale3d(1,1,1) rotate(0deg); }
  22%{ transform: translate3d(-1.6px,-1.8px,0) scale3d(0.88,1.16,1) rotate(-2.3deg); }
  48%{ transform: translate3d(1.1px,0.3px,0) scale3d(1.08,0.95,1) rotate(1.9deg); }
  72%{ transform: translate3d(-0.4px,-0.2px,0) scale3d(0.98,1.03,1) rotate(-0.8deg); }
  100%{ transform: translate3d(0,0,0) scale3d(1,1,1) rotate(0deg); }
}
@keyframes yh-lingerer-eye-pop{
  0%{ transform: translate3d(0,0,0) scale(0.82); }
  34%{ transform: translate3d(0,-0.6px,0) scale(1.14,1.06); }
  62%{ transform: translate3d(0,0,0) scale(0.96,1.02); }
  100%{ transform: translate3d(0,0,0) scale(0.78); }
}
@keyframes yh-lingerer-eye-pop-red{
  0%{ transform: translate3d(0,0,0) scale(0.78); }
  26%{ transform: translate3d(-0.3px,-0.8px,0) scale(1.20,1.08); }
  56%{ transform: translate3d(0.3px,0,0) scale(1.04,1.02); }
  100%{ transform: translate3d(0,0,0) scale(0.82); }
}
@keyframes yh-lingerer-bonk-furious{
  0%{ transform: translate3d(0,0,0) scale3d(1,1,1) rotate(0deg); }
  20%{ transform: translate3d(-1.9px,-2.1px,0) scale3d(0.85,1.18,1) rotate(-2.9deg); }
  46%{ transform: translate3d(1.5px,0.4px,0) scale3d(1.11,0.93,1) rotate(2.3deg); }
  72%{ transform: translate3d(-0.5px,-0.2px,0) scale3d(0.97,1.04,1) rotate(-1.2deg); }
  100%{ transform: translate3d(0,0,0) scale3d(1,1,1) rotate(0deg); }
}
@keyframes yh-lingerer-eye-pop-furious{
  0%{ transform: translate3d(0,0,0) scale(0.82); }
  22%{ transform: translate3d(-0.3px,-1px,0) scale(1.28,1.16); }
  56%{ transform: translate3d(0.34px,0.1px,0) scale(1.06,1.04); }
  100%{ transform: translate3d(0,-0.1px,0) scale(0.90,1.04); }
}
@keyframes yh-lingerer-steam-puff{
  0%{ opacity:0; transform: translate3d(0,0,0) scale(0.78); }
  18%{ opacity:0.82; }
  100%{ opacity:0; transform: translate3d(0,-11px,0) scale(1.12); }
}

/* spam conveyor */
.yh-article .yh-ratsConveyor{ position:absolute; inset:0; width:200%; display:flex; will-change: transform; animation-timing-function: linear; animation-iteration-count: infinite; }
@keyframes yh-conv-rtl{ from{transform:translate3d(0,0,0)} to{transform:translate3d(-50%,0,0)} }
@keyframes yh-conv-ltr{ from{transform:translate3d(-50%,0,0)} to{transform:translate3d(0,0,0)} }
.yh-article .yh-ratsConveyor.is-rtl{ animation-name: yh-conv-rtl; }
.yh-article .yh-ratsConveyor.is-ltr{ animation-name: yh-conv-ltr; }
.yh-article .yh-ratsPattern{ position:relative; width:50%; height:100%; }
.yh-article .yh-ratSlot{
  position:absolute;
  left:0;
  bottom:0;
  width:0;
  height:0;
  will-change: transform;
  animation: yh-rat-slot-drift var(--m,3600ms) ease-in-out infinite alternate;
  animation-delay: var(--phase,0ms);
}
@keyframes yh-rat-slot-drift{
  from{ transform: translate3d(0,0,0); }
  to{ transform: translate3d(var(--mx,0px),0,0); }
}

/* freeze all rats on kill */
.yh-article .yh-mailFooter.yh-ratsFrozen .yh-ratsConveyor,
.yh-article .yh-mailFooter.yh-ratsFrozen .yh-rat,
.yh-article .yh-mailFooter.yh-ratsFrozen .yh-ratsRun{ animation-play-state: paused !important; }

/* golden uses gold sheet */
.yh-article .yh-goldenRat{ background: url("../assets/anim/rat-run-gold.webp") no-repeat 0 0 / calc(var(--yh-rat-frames) * 100%) 100%; height: 80px; position: absolute; }
.yh-article .yh-goldenRat img{ display:none; }

/* kill sequence: flip + fall + burst pulse */
.yh-article .yh-goldenRat.is-dying{ transform: rotate(180deg) translate3d(0, var(--yh-die-dy,240px), 0); transition: transform 650ms cubic-bezier(.2,.8,.2,1); }
.yh-article .yh-goldenRat.is-exploding::after{ content:""; position:absolute; inset:-18px; border-radius:999px; background: repeating-conic-gradient(from 0deg, rgba(255,255,255,0) 0 14deg, rgba(255,255,255,.95) 14deg 18deg); opacity:.9; transform: scale(.65); animation: yh-pop 420ms ease-out 0s 3; }


/* Option B: animated media rats (experimental realism path) */
.yh-article .yh-mailFooter.yh-mailFooter--mediaRats{ --yh-rat-w: 158px; }
.yh-article .yh-mailFooter.yh-mailFooter--mediaRats .yh-rat{
  background: none !important;
  background-image: none !important;
  overflow: visible;
  width: var(--yh-rat-w);
  height: 86px;
  animation: none;
  transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1));
  transform-origin: 50% 60%;
  filter: drop-shadow(0 3px 10px rgba(0,0,0,0.42));
}
.yh-article .yh-mailFooter.yh-mailFooter--mediaRats .yh-rat::before{ display:none; }
.yh-article .yh-mailFooter.yh-mailFooter--mediaRats .yh-ratMedia{
  display:block;
  width:auto;
  height:100%;
  object-fit:contain;
  pointer-events:none;
}


/* === Phase 3B.1 boss intro scaffold === */
.yh-article .yh-mailFooter{
  --yh-boot-cursor: var(--yh-boot-cursor-url, url("../assets/anim/timberland-boot-cursor-56.png") 18 52, pointer);
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed,
.yh-article .yh-mailFooter.yh-mailFooter--bossArmed *{
  cursor: var(--yh-boot-cursor) !important;
}

.yh-article .yh-bossHud{
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 64;
  display: inline-flex;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(0, -8px, 0);
  transition: opacity 220ms ease, transform 220ms ease;
}
.yh-article .yh-bossHud.is-visible{
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.yh-article .yh-bossHud__lives{
  display: inline-flex;
  align-items: flex-end;
  gap: 4px;
}
.yh-article .yh-bossHud__life{
  position: relative;
  width: 34px;
  height: 27px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  transform-origin: 50% 100%;
  transition: filter 180ms ease, opacity 180ms ease, transform 180ms ease;
}
.yh-article .yh-bossHud__life img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.42));
}
.yh-article .yh-bossHud__life.is-spent{
  opacity: 0.46;
  transform: translateY(1px) scale(0.97);
}
.yh-article .yh-bossHud__life.is-spent img{
  filter: grayscale(1) saturate(0) brightness(0.48) contrast(1.06) drop-shadow(0 1px 1px rgba(0,0,0,0.26));
}

.yh-article .yh-goldenIntroRun{
  position: absolute;
  left: 0;
  width: 100%;
  height: 124px;
  top: calc(var(--yh-rat-top, 0px) + var(--yh-rat-offset, 0px) + 2px);
  z-index: 58;
  pointer-events: none;
  animation: yh-golden-intro-pass var(--yh-golden-intro-ms, 1780ms) cubic-bezier(.16,.72,.16,1) 1 both;
  will-change: transform;
}
@keyframes yh-golden-intro-pass{
  0%{ transform: translate3d(-34%, 6px, 0); }
  10%{ transform: translate3d(-20%, -1px, 0); }
  24%{ transform: translate3d(2%, 2px, 0); }
  40%{ transform: translate3d(28%, -2px, 0); }
  58%{ transform: translate3d(54%, 2px, 0); }
  76%{ transform: translate3d(82%, -1px, 0); }
  100%{ transform: translate3d(112%, 0, 0); }
}
.yh-article .yh-goldenIntroFrame{
  position: absolute;
  left: 0;
  bottom: 18px;
  width: 184px;
  height: 82px;
  border-radius: 999px;
  overflow: hidden;
  background: transparent;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,0.38));
}
.yh-article .yh-goldenIntroFrame::after{
  content: "";
  position: absolute;
  inset: -10px -8px -4px -8px;
  border-radius: 999px;
  background: radial-gradient(ellipse at 48% 58%, rgba(255,210,91,0.22), rgba(255,210,91,0) 72%);
  pointer-events: none;
}
.yh-article .yh-goldenIntroMedia{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: inherit;
  transform: scale(1.03);
  filter: hue-rotate(-18deg) contrast(1.18) saturate(1.92) brightness(1.22);
  -webkit-mask-image: radial-gradient(ellipse 98% 82% at 50% 58%, rgba(0,0,0,1) 52%, rgba(0,0,0,0.96) 62%, rgba(0,0,0,0.72) 74%, rgba(0,0,0,0) 88%);
  mask-image: radial-gradient(ellipse 98% 82% at 50% 58%, rgba(0,0,0,1) 52%, rgba(0,0,0,0.96) 62%, rgba(0,0,0,0.72) 74%, rgba(0,0,0,0) 88%);
}

.yh-article .yh-bossChase{
  position: absolute;
  left: 0;
  top: 0;
  width: 156px;
  height: 90px;
  z-index: 61;
  pointer-events: none;
  will-change: transform;
}
.yh-article .yh-bossChase::after{
  content: "";
  position: absolute;
  left: 26px;
  right: 22px;
  top: 6px;
  bottom: 8px;
  border-radius: 999px;
  pointer-events: none;
  opacity: 0;
  mix-blend-mode: screen;
  background: radial-gradient(ellipse at 46% 54%, rgba(255,255,255,0.96) 0%, rgba(255,242,115,0.72) 28%, rgba(255,214,58,0.34) 54%, rgba(255,214,58,0) 76%);
  transform: scale(0.66,0.48);
}
.yh-article .yh-bossChase.is-impacting::after{
  animation: yh-boss-root-impact 260ms ease-out 1;
}
.yh-article .yh-bossChase.is-impacting-heavy::after{
  animation: yh-boss-root-impact-heavy 320ms ease-out 1;
}
.yh-article .yh-bossChase__body{
  position: absolute;
  inset: 0;
  --yh-live-boss-scale: 0.75;
  transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale));
  transform-origin: 50% 72%;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,0.34));
  will-change: transform, filter, opacity;
}
.yh-article .yh-bossChase__body::before{
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 6px;
  bottom: 8px;
  border-radius: 999px;
  pointer-events: none;
  background: radial-gradient(ellipse at 46% 54%, rgba(255,255,184,0.94) 0%, rgba(255,241,76,0.82) 26%, rgba(255,225,38,0.46) 50%, rgba(255,225,38,0) 74%);
  filter: blur(10px);
  mix-blend-mode: screen;
  opacity: 0.84;
  animation: yh-boss-gold-lantern 620ms ease-in-out infinite alternate;
}
.yh-article .yh-bossChase__body::after{
  content: "";
  position: absolute;
  left: 28px;
  right: 24px;
  top: 8px;
  bottom: 4px;
  border-radius: 999px;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(ellipse at 44% 56%, rgba(255,250,207,0.92) 0%, rgba(255,238,69,0.58) 28%, rgba(255,238,69,0.22) 50%, rgba(255,238,69,0) 72%);
  mix-blend-mode: screen;
}
.yh-article .yh-bossChase__body.is-transforming{
  animation: yh-boss-tighten 560ms cubic-bezier(.2,.84,.22,1) 1 both;
}
.yh-article .yh-bossChase__body.is-turning{
  animation: yh-boss-turn-snap 210ms cubic-bezier(.2,.86,.2,1) 1 both;
}
@keyframes yh-boss-gold-lantern{
  0%{ opacity: 0.72; transform: translate3d(0,0,0) scale(0.98); }
  100%{ opacity: 1; transform: translate3d(0,0,0) scale(1.06); }
}
@keyframes yh-boss-turn-snap{
  0%{ transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale)); }
  34%{ transform: translate3d(4px,-1px,0) scale(calc(var(--yh-live-boss-scale) * 0.95), calc(var(--yh-live-boss-scale) * 1.05)); }
  68%{ transform: translate3d(-1px,0,0) scale(calc(var(--yh-live-boss-scale) * 0.91), calc(var(--yh-live-boss-scale) * 1.02)); }
  100%{ transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale)); }
}
@keyframes yh-boss-tighten{
  0%{ transform: translate3d(0,0,0) scale(1.03); filter: drop-shadow(0 12px 18px rgba(0,0,0,0.38)); }
  16%{ transform: translate3d(7px,-1px,0) scale(0.99,1.04); }
  36%{ transform: translate3d(3px,0,0) scale(0.92,1.02); }
  58%{ transform: translate3d(-2px,1px,0) scale(0.78,0.90); }
  74%{ transform: translate3d(0,0,0) scale(0.66,0.73); filter: drop-shadow(0 9px 15px rgba(0,0,0,0.36)); }
  84%{ transform: translate3d(0,0,0) scale(0.62,0.66); filter: drop-shadow(0 8px 14px rgba(0,0,0,0.35)); }
  100%{ transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale)); filter: drop-shadow(0 7px 14px rgba(0,0,0,0.34)); }
}
.yh-article .yh-bossChase__rat{
  left: 0 !important;
  bottom: 0 !important;
  width: 150px !important;
  height: 80px !important;
  --trail: -0.8px;
  filter: hue-rotate(-18deg) saturate(3.18) brightness(1.60) contrast(1.24) drop-shadow(0 3px 7px rgba(0,0,0,0.30)) drop-shadow(0 0 16px rgba(255,238,69,0.86)) drop-shadow(0 0 32px rgba(255,247,164,0.56));
}
.yh-article .yh-bossChase__rat::before{
  opacity: 0.004;
}
.yh-article .yh-bossChase__body[data-yh-damage="1"]::before{
  opacity: 0.58;
  filter: blur(9px);
}
.yh-article .yh-bossChase__body[data-yh-damage="1"]::after{
  opacity: 0.18;
}
.yh-article .yh-bossChase__body[data-yh-damage="2"]::before{
  opacity: 0.22;
  filter: blur(7px);
}
.yh-article .yh-bossChase__body[data-yh-damage="2"]::after{
  opacity: 0.06;
}

@media (prefers-reduced-motion: reduce){
  .yh-article .yh-bossHud{ transition: none; }
  .yh-article .yh-goldenIntroRun{ animation-duration: 2200ms; }
}

/* Live golden gait polish — append this to your CURRENT words/article.css */
.yh-article .yh-goldenRat{
  --yh-rat-frames: 13;
  --yh-rat-steps: 12;
}
.yh-article .yh-mailFooter.yh-mailFooter--bossArmed{
  --yh-boss-gold: rgba(255,232,52,0.56);
  --yh-boss-gold-soft: rgba(255,232,52,0.30);
  --yh-boss-gold-hot: rgba(255,247,164,0.82);
  --yh-boss-white-soft: rgba(255,255,255,0.09);
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 18;
  pointer-events: none;
  background:
    radial-gradient(128% 82% at 50% 64%, var(--yh-boss-gold-soft), rgba(255,238,69,0) 56%),
    radial-gradient(72% 42% at 50% 76%, var(--yh-boss-white-soft), rgba(255,255,255,0) 68%),
    repeating-linear-gradient(
      to bottom,
      rgba(255,240,190,0.016) 0 1px,
      rgba(0,0,0,0) 3px 8px
    );
  mix-blend-mode: screen;
  opacity: 0.92;
  animation: yh-boss-aura-breathe 2.6s ease-in-out infinite alternate;
}

@keyframes yh-boss-aura-breathe{
  0%{
    opacity: 0.72;
    transform: translate3d(0,0,0) scale(1);
  }
  100%{
    opacity: 1;
    transform: translate3d(0,0,0) scale(1.015);
  }
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-goldenIntroFrame{
  filter:
    drop-shadow(0 10px 18px rgba(0,0,0,0.38))
    drop-shadow(0 0 22px rgba(255,232,52,0.56))
    drop-shadow(0 0 34px rgba(255,244,142,0.34));
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossChase__body{
  filter:
    drop-shadow(0 8px 16px rgba(0,0,0,0.34))
    drop-shadow(0 0 20px rgba(255,232,52,0.58))
    drop-shadow(0 0 38px rgba(255,247,164,0.34));
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud{
  transform-origin: 100% 0%;
}
.yh-article .yh-bossHud.is-damage-pop{
  animation: yh-boss-hud-hit 360ms cubic-bezier(.18,.88,.2,1) 1;
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life{
  animation: yh-boss-hud-wobble 2.6s ease-in-out infinite;
  will-change: transform, filter;
  overflow: visible;
}
.yh-article .yh-bossHud__life.is-hit-loss{
  animation: yh-boss-hud-life-loss 520ms cubic-bezier(.18,.92,.22,1) 1;
}
.yh-article .yh-bossHud__life.is-hit-loss::after{
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: 999px;
  border: 2px solid rgba(255,236,92,0.86);
  box-shadow: 0 0 18px rgba(255,236,92,0.42);
  animation: yh-boss-hud-life-ring 520ms ease-out 1;
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life:nth-child(1){
  animation-delay: 0ms;
}
.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life:nth-child(2){
  animation-delay: 170ms;
}
.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life:nth-child(3){
  animation-delay: 340ms;
}

@keyframes yh-boss-hud-hit{
  0%{ transform: translate3d(0,0,0) scale(1); filter: none; }
  22%{ transform: translate3d(0,-2px,0) scale(1.08); filter: drop-shadow(0 0 10px rgba(255,236,92,0.42)); }
  58%{ transform: translate3d(0,0,0) scale(0.98); }
  100%{ transform: translate3d(0,0,0) scale(1); filter: none; }
}

@keyframes yh-boss-hud-life-loss{
  0%{ transform: translate3d(0,0,0) scale(1); }
  28%{ transform: translate3d(0,-2px,0) scale(1.18); }
  56%{ transform: translate3d(0,0,0) scale(0.92); }
  100%{ transform: translate3d(0,0,0) scale(1); }
}

@keyframes yh-boss-hud-life-ring{
  0%{ opacity: 0; transform: scale(0.48); }
  18%{ opacity: 1; transform: scale(0.92); }
  100%{ opacity: 0; transform: scale(1.36); }
}

@keyframes yh-boss-hud-wobble{
  0%{
    transform: translate3d(0,0,0) rotate(0deg) scale(1);
  }
  20%{
    transform: translate3d(0,-1px,0) rotate(-1.2deg) scale(1.01);
  }
  48%{
    transform: translate3d(0.5px,0,0) rotate(0.9deg) scale(0.995);
  }
  72%{
    transform: translate3d(-0.5px,-0.5px,0) rotate(-0.7deg) scale(1.008);
  }
  100%{
    transform: translate3d(0,0,0) rotate(0deg) scale(1);
  }
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life img{
  filter:
    drop-shadow(0 1px 3px rgba(0,0,0,0.42))
    drop-shadow(0 0 8px rgba(255,238,69,0.34));
}

.yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life.is-spent{
  animation-duration: 3.2s;
}

@media (prefers-reduced-motion: reduce){
  .yh-article .yh-mailFooter.yh-mailFooter--bossArmed::after,
  .yh-article .yh-mailFooter.yh-mailFooter--bossArmed .yh-bossHud__life{
    animation: none !important;
  }
}
.yh-article .yh-mailFooter.yh-mailFooter--bossArmed,
.yh-article .yh-mailFooter.yh-mailFooter--bossArmed *{
  cursor: none !important;
}

.yh-bootFollower{
  position: fixed;
  left: 0;
  top: 0;
  width: 56px;
  height: 45px;
  z-index: 100020;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(-140px,-140px,0);
  transition: opacity 90ms linear;
  will-change: transform, opacity;
}
.yh-bootFollower.is-visible{
  opacity: 1;
}
.yh-bootFollower__inner{
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: contain;
  transform-origin: 30% 74%;
  transform: rotate(16deg) translate3d(0,0,0);
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.24));
  will-change: transform, filter;
}

.yh-bootFollower.is-swatting .yh-bootFollower__inner{
  animation: yh-boot-swipe 170ms cubic-bezier(.22,.88,.24,1) 1;
}
.yh-bootFollower.is-hit .yh-bootFollower__inner{
  animation: yh-boot-hit 210ms cubic-bezier(.2,.9,.2,1) 1;
}

@keyframes yh-boot-swipe{
  0%{
    transform: rotate(16deg) translate3d(0,0,0) scale(1);
  }
  42%{
    transform: rotate(-8deg) translate3d(-12px,12px,0) scale(1.02,0.98);
  }
  100%{
    transform: rotate(16deg) translate3d(0,0,0) scale(1);
  }
}

@keyframes yh-boot-hit{
  0%{
    transform: rotate(16deg) translate3d(0,0,0) scale(1);
    filter: drop-shadow(0 5px 10px rgba(0,0,0,0.28));
  }
  40%{
    transform: rotate(-16deg) translate3d(-12px,12px,0) scale(1.06,0.95);
    filter: drop-shadow(0 6px 12px rgba(0,0,0,0.30)) drop-shadow(0 0 10px rgba(255,238,69,0.30));
  }
  100%{
    transform: rotate(16deg) translate3d(0,0,0) scale(1);
    filter: drop-shadow(0 5px 10px rgba(0,0,0,0.28));
  }
}

.yh-article .yh-mailFooter.yh-mailFooter--postTrash .yh-ratsLane,
.yh-article .yh-mailFooter.yh-mailFooter--postTrash .yh-ratScatter{
  display: none !important;
}

.yh-article .yh-postTrashAmbient{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:4;
}
.yh-article .yh-postTrashHud{
  position:absolute;
  left:50%;
  top:12px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:4px 6px;
  pointer-events:none;
  z-index:7;
}
.yh-article .yh-postTrashHud__logo{
  width:clamp(30px, 2.45vw, 38px);
  height:clamp(30px, 2.45vw, 38px);
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,0.22));
  flex:0 0 auto;
}
.yh-article .yh-postTrashHud__counter{
  min-height:clamp(24px, 2.1vw, 30px);
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  flex:0 0 auto;
}
.yh-article .yh-postTrashHud__digit{
  width:clamp(30px, 2.45vw, 38px);
  height:clamp(30px, 2.45vw, 38px);
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,0.20));
  flex:0 0 auto;
}

.yh-article .yh-subwayClock{
  position:absolute;
  top:10px;
  right:12px;
  width:clamp(228px, 25vw, 292px);
  min-height:54px;
  padding:4px;
  pointer-events:none;
  z-index:7;
  background:#060606;
  border:1px solid #000;
  border-radius:6px;
  box-shadow:
    0 2px 0 rgba(255,255,255,0.03) inset,
    0 -2px 0 rgba(0,0,0,0.45) inset,
    0 5px 12px rgba(0,0,0,0.42),
    0 0 0 2px rgba(0,0,0,0.92);
}
.yh-article .yh-subwayClock::before{
  content:"";
  position:absolute;
  inset:3px 3px auto auto;
  width:28%;
  height:2px;
  background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.18), rgba(255,255,255,0));
  opacity:0.55;
  pointer-events:none;
}
.yh-article .yh-subwayClock__screen{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:2px;
  min-height:46px;
  padding:7px 8px 6px;
  background:
    linear-gradient(180deg, rgba(36,46,36,0.72), rgba(8,14,8,0.98) 24%, rgba(6,10,6,1) 100%),
    repeating-linear-gradient(180deg, rgba(146,255,164,0.07) 0 1px, rgba(0,0,0,0) 1px 3px),
    linear-gradient(90deg, rgba(0,0,0,0.56), rgba(22,28,22,0.16) 12%, rgba(22,28,22,0.16) 88%, rgba(0,0,0,0.56));
  border:1px solid rgba(28,28,28,0.98);
  border-radius:3px;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.03),
    inset 0 0 22px rgba(0,0,0,0.66);
  overflow:hidden;
}
.yh-article .yh-subwayClock__screen::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(90deg, rgba(124, 255, 146, 0.045) 0 1px, rgba(0,0,0,0) 1px 4px);
  mix-blend-mode:screen;
  opacity:0.7;
  pointer-events:none;
}
.yh-article .yh-subwayClock__row{
  position:relative;
  display:grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items:center;
  column-gap:6px;
  min-height:18px;
  color:#7eff78;
  font-family:"Courier New", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size:11px;
  font-weight:700;
  line-height:1;
  letter-spacing:-0.02em;
  text-transform:none;
  white-space:nowrap;
}
.yh-article .yh-subwayClock__row.is-next .yh-subwayClock__destination,
.yh-article .yh-subwayClock__row.is-next .yh-subwayClock__timer{
  color:#8dff85;
}
.yh-article .yh-subwayClock__row.is-waiting .yh-subwayClock__timer{
  opacity:0.96;
}
.yh-article .yh-subwayClock__bullet{
  width:15px;
  height:15px;
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center;
  filter:drop-shadow(0 0 1px rgba(255,80,80,0.35));
}
.yh-article .yh-subwayClock__destination,
.yh-article .yh-subwayClock__timer{
  position:relative;
  z-index:1;
  color:#75ff72;
  text-shadow:
    0 0 2px rgba(117,255,114,0.45),
    0 0 5px rgba(72,186,72,0.28);
}
.yh-article .yh-subwayClock__destination{
  overflow:hidden;
  text-overflow:ellipsis;
  padding-right:6px;
}
.yh-article .yh-subwayClock__timer{
  justify-self:end;
  min-width:44px;
  text-align:right;
  letter-spacing:-0.03em;
}
@media (max-width: 720px){
  .yh-article .yh-subwayClock{
    top:8px;
    right:8px;
    width:210px;
    min-height:50px;
  }
  .yh-article .yh-subwayClock__screen{
    min-height:42px;
    padding:6px 7px 5px;
  }
  .yh-article .yh-subwayClock__row{
    grid-template-columns: 15px minmax(0, 1fr) auto;
    column-gap:5px;
    font-size:10px;
  }
  .yh-article .yh-subwayClock__bullet{
    width:13px;
    height:13px;
  }
}
.yh-article .yh-postTrashAmbient__droppings,
.yh-article .yh-postTrashAmbient__scene{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.yh-article .yh-postTrashAmbient__droppings{
  z-index:6;
  isolation:isolate;
}
.yh-article .yh-postTrashAmbient__scene{
  z-index:1;
}
.yh-article .yh-ratDropping{
  position:absolute;
  width:65px;
  height:27px;
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center;
  display:block;
  transform: translate3d(-50%, -62%, 0) rotate(var(--drop-rot, -4deg)) scale(var(--drop-scale, 1));
  transform-origin:50% 50%;
  mix-blend-mode:normal;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.24));
  opacity:1;
  isolation:isolate;
  will-change:transform;
  animation:yh-rat-drop-pop 160ms ease-out 1 both;
}
.yh-article .yh-ratDropping.is-aging{
  transition: opacity 620ms linear;
  opacity:0;
}
.yh-article .yh-ambushCan{
  position:absolute;
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center bottom;
  opacity:0;
  transform: translate3d(0, 16px, 0) scale(0.92);
  animation: yh-ambush-can-pop 220ms ease-out 1 forwards;
  filter: drop-shadow(0 5px 8px rgba(0,0,0,0.26));
  z-index:1;
}
.yh-article .yh-ambushRat{
  position:absolute;
  left:0;
  top:0;
  pointer-events:none;
  will-change:transform, opacity;
  z-index:3;
}
.yh-article .yh-ambushRat__body{
  position:relative;
  width:100%;
  height:100%;
  transform-origin:50% 68%;
  will-change:transform, filter;
}
.yh-article .yh-ambushRat__rat{
  left:0;
  bottom:0;
}
.yh-article .yh-ambushRat.is-dying{
  transition: transform 540ms cubic-bezier(.20,.84,.22,1), opacity 520ms ease-in;
}
.yh-article .yh-ambushRat__body.is-croaked{
  animation: yh-ambush-croak 130ms cubic-bezier(.28,.82,.24,1) 1 both;
}
.yh-article .yh-ambushRat__body.is-croaked .yh-ambushRat__rat{
  animation-play-state: paused;
  filter: saturate(0.56) brightness(0.84) contrast(1.02) drop-shadow(0 3px 8px rgba(0,0,0,0.34));
}
.yh-article .yh-ambushRat__body.is-falling{
  transform: rotate(98deg) scale(0.98, 0.92);
  transition: transform 520ms cubic-bezier(.16,.82,.18,1);
}
@keyframes yh-ambush-croak{
  0%{ transform: rotate(0deg) scale(1); }
  52%{ transform: rotate(84deg) translate3d(1px, -4px, 0) scale(0.98, 1.02); }
  100%{ transform: rotate(90deg) translate3d(0px, -2px, 0) scale(0.98, 0.98); }
}
@keyframes yh-ambush-can-pop{
  0%{ opacity:0; transform: translate3d(0, 16px, 0) scale(0.92); }
  100%{ opacity:0.96; transform: translate3d(0, 0, 0) scale(1); }
}
@keyframes yh-rat-drop-pop{
  0%{ opacity:0; transform: translate3d(-50%, -50%, 0) rotate(var(--drop-rot, -4deg)) scale(calc(var(--drop-scale, 1) * 0.82)); }
  100%{ opacity:1; transform: translate3d(-50%, -50%, 0) rotate(var(--drop-rot, -4deg)) scale(var(--drop-scale, 1)); }
}

.yh-article .yh-bossChase__body[data-yh-damage="1"] .yh-bossChase__rat{
  filter:
    hue-rotate(-10deg)
    saturate(1.74)
    brightness(1.08)
    contrast(1.18)
    sepia(0.08)
    drop-shadow(0 3px 7px rgba(0,0,0,0.34))
    drop-shadow(0 0 6px rgba(255,228,44,0.22))
    drop-shadow(0 0 12px rgba(255,247,164,0.12));
}

.yh-article .yh-bossChase__body[data-yh-damage="2"] .yh-bossChase__rat{
  filter:
    hue-rotate(2deg)
    saturate(0.78)
    brightness(0.74)
    contrast(1.18)
    sepia(0.24)
    drop-shadow(0 3px 7px rgba(0,0,0,0.40))
    drop-shadow(0 0 2px rgba(255,226,52,0.08));
}

.yh-article .yh-bossChase__body.is-hit-confirm{
  animation: yh-boss-hit-confirm 820ms cubic-bezier(.16,.9,.22,1) 1 both;
}
.yh-article .yh-bossChase__body.is-hit-confirm::after{
  animation: yh-boss-hit-burst 620ms ease-out 1 both;
}

.yh-article .yh-bossChase__rat.is-hit-confirm{
  animation:
    yh-rat-gait var(--g,600ms) steps(var(--yh-rat-steps), end) infinite,
    yh-rat-bob  var(--b,280ms) ease-in-out infinite,
    yh-boss-hit-rat 820ms cubic-bezier(.16,.9,.22,1) 1 both;
}

.yh-article .yh-bossChase__body.is-frazzled .yh-bossChase__rat{
  animation:
    yh-rat-gait var(--g,600ms) steps(var(--yh-rat-steps), end) infinite,
    yh-rat-bob  var(--b,280ms) ease-in-out infinite,
    yh-boss-frazzled 92ms linear 6;
}

@keyframes yh-boss-root-impact{
  0%{ opacity: 0; transform: scale(0.54,0.40); }
  22%{ opacity: 1; transform: scale(1.02,0.78); }
  100%{ opacity: 0; transform: scale(1.42,1.04); }
}

@keyframes yh-boss-root-impact-heavy{
  0%{ opacity: 0; transform: scale(0.42,0.30); }
  18%{ opacity: 1; transform: scale(1.14,0.86); }
  100%{ opacity: 0; transform: scale(1.66,1.14); }
}

@keyframes yh-boss-hit-confirm{
  0%{
    transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale)) rotate(0deg);
  }
  12%{
    transform: translate3d(-18px,7px,0) scale(calc(var(--yh-live-boss-scale) * 1.22), calc(var(--yh-live-boss-scale) * 0.66)) rotate(18deg);
  }
  28%{
    transform: translate3d(10px,4px,0) scale(calc(var(--yh-live-boss-scale) * 0.96), calc(var(--yh-live-boss-scale) * 1.02)) rotate(178deg);
  }
  46%{
    transform: translate3d(8px,3px,0) scale(calc(var(--yh-live-boss-scale) * 0.94), calc(var(--yh-live-boss-scale) * 0.98)) rotate(188deg);
  }
  60%{
    transform: translate3d(6px,3px,0) scale(calc(var(--yh-live-boss-scale) * 0.95), calc(var(--yh-live-boss-scale) * 0.98)) rotate(188deg);
  }
  74%{
    transform: translate3d(-4px,1px,0) scale(calc(var(--yh-live-boss-scale) * 0.98), calc(var(--yh-live-boss-scale) * 0.96)) rotate(124deg);
  }
  88%{
    transform: translate3d(-6px,1px,0) scale(calc(var(--yh-live-boss-scale) * 1.02), calc(var(--yh-live-boss-scale) * 0.94)) rotate(34deg);
  }
  100%{
    transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale)) rotate(0deg);
  }
}

@keyframes yh-boss-hit-burst{
  0%{
    opacity: 0;
    transform: translate3d(0,0,0) scale(0.44,0.30);
  }
  14%{
    opacity: 1;
    transform: translate3d(-5px,1px,0) scale(1.26,0.94);
  }
  34%{
    opacity: 0.62;
    transform: translate3d(0,0,0) scale(1.58,1.12);
  }
  62%{
    opacity: 0.18;
    transform: translate3d(0,0,0) scale(1.90,1.28);
  }
  100%{
    opacity: 0;
    transform: translate3d(0,0,0) scale(2.04,1.38);
  }
}

@keyframes yh-boss-hit-rat{
  0%{
    opacity: 1;
    filter: brightness(1.22) saturate(1.62) contrast(1.1);
  }
  14%{
    opacity: 0.34;
    filter: brightness(0.16) saturate(0.22) contrast(1.36);
  }
  34%{
    opacity: 0.74;
    filter: brightness(0.48) saturate(0.40) contrast(1.26);
  }
  58%{
    opacity: 0.70;
    filter: brightness(0.34) saturate(0.28) contrast(1.28);
  }
  78%{
    opacity: 0.92;
    filter: brightness(0.78) saturate(0.72) contrast(1.16);
  }
  100%{
    opacity: 1;
    filter: brightness(1.06) saturate(1.10) contrast(1.08);
  }
}

@keyframes yh-boss-frazzled{
  0%{
    transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1));
  }
  18%{
    transform: translate3d(-3.4px,1.0px,0) scaleX(var(--flip,1)) scale(calc(var(--s,1) * 1.05));
  }
  36%{
    transform: translate3d(3.0px,-1.4px,0) scaleX(var(--flip,1)) scale(calc(var(--s,1) * 0.97));
  }
  54%{
    transform: translate3d(-2.8px,1.2px,0) scaleX(var(--flip,1)) scale(calc(var(--s,1) * 1.03));
  }
  72%{
    transform: translate3d(2.4px,-0.8px,0) scaleX(var(--flip,1)) scale(calc(var(--s,1) * 0.98));
  }
  100%{
    transform: translate3d(0,0,0) scaleX(var(--flip,1)) scale(var(--s,1));
  }
}

.yh-article .yh-bossChase__body.is-death-hit{
  animation: yh-boss-death-hit 420ms cubic-bezier(.16,.9,.2,1) 1 both;
}
.yh-article .yh-bossChase__body.is-death-hit::after{
  animation: yh-boss-death-burst 460ms ease-out 1 both;
}
.yh-article .yh-bossChase__rat.is-death-hit{
  animation:
    yh-rat-gait var(--g,600ms) steps(var(--yh-rat-steps), end) infinite,
    yh-rat-bob  var(--b,280ms) ease-in-out infinite,
    yh-boss-death-rat 420ms cubic-bezier(.16,.9,.2,1) 1 both;
}
.yh-article .yh-bossChase__body.is-dead-drop{
  animation: yh-boss-dead-drop 740ms cubic-bezier(.18,.76,.22,1) 1 both;
}
.yh-article .yh-bossChase__rat.is-dead-drop{
  animation:
    yh-rat-gait var(--g,600ms) steps(var(--yh-rat-steps), end) infinite,
    yh-rat-bob  var(--b,280ms) ease-in-out infinite,
    yh-boss-dead-rat 740ms cubic-bezier(.18,.76,.22,1) 1 both;
}

@keyframes yh-boss-death-hit{
  0%{
    transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale));
  }
  20%{
    transform: translate3d(-20px,6px,0) scale(calc(var(--yh-live-boss-scale) * 1.22), calc(var(--yh-live-boss-scale) * 0.70));
  }
  54%{
    transform: translate3d(8px,-2px,0) scale(calc(var(--yh-live-boss-scale) * 0.95), calc(var(--yh-live-boss-scale) * 1.08));
  }
  100%{
    transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale));
  }
}

@keyframes yh-boss-death-burst{
  0%{
    opacity: 0;
    transform: translate3d(0,0,0) scale(0.42,0.32);
  }
  16%{
    opacity: 1;
    transform: translate3d(-5px,1px,0) scale(1.18,0.90);
  }
  58%{
    opacity: 0.36;
    transform: translate3d(0,0,0) scale(1.62,1.18);
  }
  100%{
    opacity: 0;
    transform: translate3d(0,0,0) scale(1.82,1.28);
  }
}

@keyframes yh-boss-death-rat{
  0%{
    opacity: 1;
    filter: hue-rotate(-7deg) brightness(1.1) saturate(1.34) contrast(1.08);
  }
  18%{
    opacity: 0.38;
    filter: brightness(0.28) saturate(0.42) contrast(1.26);
  }
  58%{
    opacity: 0.82;
    filter: brightness(0.54) saturate(0.54) contrast(1.18);
  }
  100%{
    opacity: 0.74;
    filter: brightness(0.46) saturate(0.34) contrast(1.22);
  }
}

@keyframes yh-boss-dead-drop{
  0%{
    opacity: 1;
    transform: translate3d(0,0,0) scale(var(--yh-live-boss-scale)) rotate(0deg);
  }
  22%{
    opacity: 1;
    transform: translate3d(-2px,1px,0) scale(calc(var(--yh-live-boss-scale) * 0.96), calc(var(--yh-live-boss-scale) * 1.03)) rotate(22deg);
  }
  54%{
    opacity: 1;
    transform: translate3d(8px,10px,0) scale(calc(var(--yh-live-boss-scale) * 0.94), calc(var(--yh-live-boss-scale) * 0.88)) rotate(182deg);
  }
  74%{
    opacity: 0.96;
    transform: translate3d(12px,14px,0) scale(calc(var(--yh-live-boss-scale) * 0.92), calc(var(--yh-live-boss-scale) * 0.82)) rotate(188deg);
  }
  100%{
    opacity: 0;
    transform: translate3d(18px,42px,0) scale(calc(var(--yh-live-boss-scale) * 0.88), calc(var(--yh-live-boss-scale) * 0.68)) rotate(188deg);
  }
}

@keyframes yh-boss-dead-rat{
  0%{
    opacity: 0.92;
    filter: brightness(0.62) saturate(0.56) contrast(1.18);
  }
  38%{
    opacity: 0.88;
    filter: brightness(0.42) saturate(0.34) contrast(1.2);
  }
  68%{
    opacity: 0.74;
    filter: brightness(0.28) saturate(0.18) contrast(1.22);
  }
  100%{
    opacity: 0;
    filter: brightness(0.12) saturate(0.06) contrast(1.26);
  }
}

.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_hit"] .yh-ratsLane,
.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_drop"] .yh-ratsLane,
.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_scatter"] .yh-ratsLane{
  transition: opacity 180ms linear, filter 180ms linear;
}

.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_scatter"] .yh-ratsLane,
.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_scatter"] .yh-lingererLane{
  opacity: 0.16;
  filter: blur(0.4px) saturate(0.82);
}
.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_hit"] .yh-bossHud,
.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_drop"] .yh-bossHud,
.yh-article .yh-mailFooter[data-yh-boss-stage="golden_death_scatter"] .yh-bossHud{
  opacity: 0.18;
  transform: translate3d(0,0,0) scale(0.96);
  transition: opacity 180ms linear, transform 180ms ease;
}

.yh-article .yh-ratScatter{
  position: absolute;
  inset: 0;
  z-index: 58;
  pointer-events: none;
}
.yh-article .yh-ratScatter__bin{
  position: absolute;
  width: 54px;
  height: 110px;
  margin-left: -27px;
  margin-top: -55px;
  z-index: 1;
  pointer-events: none;
  transform: translate3d(0,0,0) rotate(var(--tilt, 0deg));
  will-change: transform, filter, opacity;
  animation: yh-trash-can-throb 680ms ease-in-out infinite alternate;
}
.yh-article .yh-ratScatter__bin.is-active{
  animation-duration: 210ms;
}
.yh-article .yh-ratScatter__bin::after{
  content: "";
  position: absolute;
  left: 11px;
  right: 11px;
  top: 4px;
  height: 15px;
  border-radius: 999px;
  background: radial-gradient(ellipse at 50% 44%, rgba(0,0,0,0.98) 0%, rgba(8,8,8,0.96) 58%, rgba(255,237,102,0.24) 76%, rgba(255,237,102,0) 100%);
  box-shadow: 0 0 0 1px rgba(255,238,69,0.14), 0 0 10px rgba(255,238,69,0.18);
}
.yh-article .yh-ratScatter__binArt{
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% auto;
  filter: drop-shadow(0 5px 10px rgba(0,0,0,0.38));
}
.yh-article .yh-ratScatter__runner{
  position: absolute;
  width: 142px;
  height: 82px;
  z-index: 2;
  will-change: transform, opacity;
}
.yh-article .yh-ratScatter__rat{
  width: 138px !important;
  height: 74px !important;
  filter: drop-shadow(0 3px 7px rgba(0,0,0,0.28));
  transform-origin: 50% 72%;
}

@keyframes yh-trash-can-throb{
  0%{
    transform: translate3d(0,0,0) rotate(var(--tilt, 0deg)) scale(0.98);
    filter: drop-shadow(0 6px 10px rgba(0,0,0,0.18));
  }
  100%{
    transform: translate3d(0,0,0) rotate(var(--tilt, 0deg)) scale(1.02);
    filter: drop-shadow(0 8px 12px rgba(0,0,0,0.26));
  }
}

@keyframes yh-rat-scatter-roach{
  0%{
    opacity: 0;
    transform: translate3d(0,0,0) scale(0.96) rotate(0deg);
  }
  5%{
    opacity: 1;
    transform: translate3d(0,0,0) scale(1) rotate(0deg);
  }
  24%{
    opacity: 1;
    transform: translate3d(var(--x1), var(--y1), 0) scale(1.02) rotate(var(--r1));
  }
  49%{
    opacity: 1;
    transform: translate3d(var(--x2), var(--y2), 0) scale(0.98) rotate(var(--r2));
  }
  74%{
    opacity: 1;
    transform: translate3d(var(--x3), var(--y3), 0) scale(0.92) rotate(var(--r3));
  }
  90%{
    opacity: 1;
    transform: translate3d(calc(var(--tx) * 0.88), calc(var(--ty) * 0.88), 0) scale(0.68) rotate(calc(var(--rf) * 0.72));
  }
  100%{
    opacity: 0;
    transform: translate3d(var(--tx), var(--ty), 0) scale(0.08) rotate(var(--rf));
  }
}

.yh-article .yh-mailFooter[data-yh-boss-stage="golden_assist"] .yh-bossHud{
  filter: drop-shadow(0 0 6px rgba(255,255,255,0.06));
}

@media (prefers-reduced-motion: reduce){
  .yh-bootFollower.is-swatting .yh-bootFollower__inner,
  .yh-bootFollower.is-hit .yh-bootFollower__inner,
  .yh-article .yh-bossChase__body.is-hit-confirm,
  .yh-article .yh-bossChase__rat.is-hit-confirm,
  .yh-article .yh-bossChase__body.is-frazzled .yh-bossChase__rat,
  .yh-article .yh-bossChase__body.is-death-hit,
  .yh-article .yh-bossChase__rat.is-death-hit,
  .yh-article .yh-bossChase__body.is-dead-drop,
  .yh-article .yh-bossChase__rat.is-dead-drop,
  .yh-article .yh-ratScatter__runner,
  .yh-article .yh-ratScatter__pocket{
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Draggable 3-train fidget: throw it, gravity brings it back to reading progress. */
.yh-progress__train{
  pointer-events: auto;
  touch-action: none;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
.yh-progress.is-fidget .yh-progress__train,
.yh-progress.is-fidget-dragging .yh-progress__train,
.yh-progress.is-fidget-flight .yh-progress__train{
  cursor: grabbing;
  transition: none !important;
  transform: translate3d(var(--yh-fidget-x, var(--yh-article-train-x)), var(--yh-fidget-y, 0px), 0) !important;
}
@media (prefers-reduced-motion: reduce){
  .yh-progress.is-fidget-flight .yh-progress__train{
    transition: transform 180ms linear !important;
  }
}

.yh-progress.is-shooting,
.yh-progress.is-fidget{
  z-index: 99999;
}
.yh-progress.is-shooting .yh-progress__train,
.yh-progress.is-ball-special .yh-progress__train{
  box-shadow: 0 2px 10px rgba(0,0,0,.18), 0 0 0 2px rgba(255,140,0,.35);
}
.yh-progress[data-ball-type="antigrav"] .yh-progress__train,
.yh-progress.is-ball-special[data-ball-type] .yh-progress__train{
  filter: none;
}
.yh-progress.is-frozen .yh-progress__train{
  box-shadow: 0 0 0 3px #7ad7ff, 0 0 18px rgba(122,215,255,.65);
}

.yh-hoop{
  position: fixed;
  width: 132px;
  height: 138px;
  z-index: 99990;
  pointer-events: none;
  transform: translate3d(0,0,0);
}
.yh-hoop__backboard{
  position: absolute;
  left: 0;
  top: 0;
  width: 132px;
  height: 86px;
  padding: 0;
  border: 2px solid #6a6a66;
  pointer-events: auto;
  touch-action: none;
  -webkit-touch-callout: none;
  background-color: #d8d4cc;
  background-image: url("/assets/words/hoop-backboard.png");
  background-size: cover;
  background-position: center;
  box-shadow: 0 0 0 1px #2c2c2c, 0 12px 26px rgba(0,0,0,.42);
  cursor: pointer;
}
.yh-hoop__backboard.is-tinted{
  background-color: var(--yh-board-color, #e9e7e1);
  background-blend-mode: multiply;
}
.yh-hoop__face{
  position: absolute;
  inset: 8px 10px;
  width: calc(100% - 20px);
  height: calc(100% - 16px);
  object-fit: cover;
  pointer-events: none;
}
.yh-hoop__rim{
  position: absolute;
  left: 50%;
  top: 92px;
  width: 46px;
  height: 10px;
  margin-left: -23px;
  border: 3px solid #e87722;
  border-radius: 50%;
  background: rgba(232,119,34,.12);
  box-shadow: 0 2px 0 #b85a14, 0 6px 10px rgba(0,0,0,.25);
  pointer-events: none;
  z-index: 3;
}
.yh-hoop__net{
  position: absolute;
  left: 50%;
  top: 100px;
  width: 44px;
  height: 34px;
  margin-left: -22px;
  color: #f4f4f0;
  pointer-events: none;
  z-index: 2;
  filter: drop-shadow(0 2px 1px rgba(0,0,0,.35));
}
.yh-hoop__net svg{ width: 100%; height: 100%; display: block; }
.yh-hoop.is-swish .yh-hoop__net{
  animation: yh-net-swish .42s ease-out;
}
@keyframes yh-net-swish{
  0%{ transform: scaleY(.86) translateY(-2px); }
  55%{ transform: scaleY(1.12) translateY(3px); }
  100%{ transform: scaleY(1) translateY(0); }
}

.yh-hoopBall{
  position: fixed;
  left: 0;
  top: 0;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  z-index: 99998;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
}

.yh-hoopHud{
  position: fixed;
  top: max(10px, env(safe-area-inset-top));
  right: max(10px, env(safe-area-inset-right));
  z-index: 100010;
  min-width: 118px;
  padding: 10px 12px 8px;
  background: rgba(8,8,8,.78);
  color: #fff;
  border: 1px solid rgba(255,255,255,.16);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  letter-spacing: .04em;
  line-height: 1.35;
}
.yh-hoopHud__close{
  position: absolute;
  top: 4px;
  right: 6px;
  width: 22px;
  height: 22px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.yh-hoopHud__row{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-right: 18px;
}
.yh-hoopHud__row b{ font-variant-numeric: tabular-nums; }
.yh-hoopHud__makes{ opacity: .82; font-size: 10px; margin-top: 2px; }

.yh-zeromin--score{
  position: fixed;
  left: max(14px, env(safe-area-inset-left));
  bottom: max(28px, env(safe-area-inset-bottom));
  z-index: 100005;
  pointer-events: none;
}

.yh-trainPicker,
.yh-boardPicker{
  position: fixed;
  inset: 0;
  z-index: 100020;
  background: rgba(0,0,0,.42);
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.yh-trainPicker[hidden],
.yh-boardPicker[hidden]{ display: none; }
.yh-trainPicker__sheet,
.yh-boardPicker__sheet{
  width: min(100%, 420px);
  max-height: min(72vh, 560px);
  overflow: auto;
  background: #111;
  color: #fff;
  padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
  border-top: 3px solid #EE352E;
}
.yh-trainPicker__title,
.yh-boardPicker__sheet p{
  margin: 0 0 10px;
  font: 800 13px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.yh-trainPicker__scroll{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-height: 220px;
  overflow: auto;
  padding-bottom: 8px;
}
.yh-trainPicker__line{
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  font: 800 20px/1 Arial, Helvetica, sans-serif;
  cursor: pointer;
}
.yh-trainPicker__line.is-selected,
.yh-trainPicker__ball.is-selected{
  outline: 3px solid #fff;
  outline-offset: 2px;
}
.yh-trainPicker__balls{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.yh-trainPicker__balls[hidden]{ display: none; }
.yh-trainPicker__ball,
.yh-trainPicker__exit,
.yh-trainPicker__close,
.yh-boardPicker__sheet button,
.yh-boardPicker__upload{
  border: 1px solid rgba(255,255,255,.2);
  background: #1c1c1c;
  color: #fff;
  padding: 8px 10px;
  font: 700 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  cursor: pointer;
}
.yh-trainPicker__exit,
.yh-trainPicker__close{ width: 100%; margin-top: 8px; }
.yh-trainPicker__exit[hidden]{ display: none; }
.yh-boardPicker__colors{ display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.yh-boardPicker__swatch{
  width: 28px;
  height: 28px;
  border: 1px solid rgba(255,255,255,.35) !important;
  padding: 0 !important;
}
.yh-boardPicker__upload input{ display: block; margin-top: 6px; color: #fff; }

html.yh-shooting,
body.yh-shooting{
  overflow: hidden !important;
  overscroll-behavior: none;
}
body.yh-shooting{
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
}

.yh-hoopPrompt{
  position: fixed;
  inset: 0;
  z-index: 100025;
  background: rgba(0,0,0,.42);
  display: flex;
  align-items: center;
  justify-content: center;
}
.yh-hoopPrompt[hidden]{ display: none; }
.yh-hoopPrompt__sheet{
  width: min(92vw, 280px);
  background: #111;
  color: #fff;
  padding: 18px 16px;
  border-top: 3px solid #EE352E;
  text-align: center;
}
.yh-hoopPrompt__sheet p{
  margin: 0 0 14px;
  font: 800 18px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.yh-hoopPrompt__actions{ display: flex; gap: 8px; }
.yh-hoopPrompt__actions button{
  flex: 1;
  border: 1px solid rgba(255,255,255,.2);
  background: #1c1c1c;
  color: #fff;
  padding: 10px 12px;
  font: 700 14px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  cursor: pointer;
}