/* TypeFlow v6.6.4 — final main-test bottom-line cleanup
   Keep the v6.6.3 desktop sizing exactly as-is; only hide the tiny
   fragment of the next row that can peek through at the bottom. */

.typing-tool-page .tf-main-typing-stage .word-viewport{
  position:relative;
  overflow:hidden !important;
  /* A few pixels less usable height prevents the fifth row from peeking in. */
  padding-bottom:20px !important;
}

/* Soft surface-colored mask over the final pixels.
   This avoids changing the overall card size / %100 density. */
.typing-tool-page .tf-main-typing-stage .word-viewport::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:9px;
  z-index:6;
  pointer-events:none;
  background:linear-gradient(
    to bottom,
    color-mix(in srgb,var(--surface) 0%,transparent),
    color-mix(in srgb,var(--surface-2) 96%,var(--surface))
  );
}

html[data-theme="dark"] .typing-tool-page .tf-main-typing-stage .word-viewport::after{
  background:linear-gradient(
    to bottom,
    rgba(17,16,28,0),
    color-mix(in srgb,var(--surface-2) 96%,#0d0f18)
  );
}

/* The current word must remain above the reading surface,
   while the bottom safety mask remains the final clipping layer. */
.typing-tool-page .tf-main-typing-stage .word-stream{
  position:relative;
  z-index:1;
}