refactor: update route types import and enhance highlight effect in CSS

- Changed the import path for route types in next-env.d.ts to the development directory.
- Revised the CSS for the highlight effect to improve visual presentation and consistency.
- Updated sample IDs in page.tsx and modified headline text for clarity, reflecting the new focus on "Get clean transcript".
- Incremented version number in the footer to v1.10.2.

Author: devhims

sample/app/globals.css

@@ -49,13 +49,13 @@ html, body {
   text-wrap: balance;
 }
 
-/* Highlighter-pen effect — wraps only the text per line, sits as a stripe
-   across the lower portion of the characters. Defined as plain CSS rather
-   than @utility because Tailwind 4 was tree-shaking it out. */
+/* Highlighter-pen effect: wraps only the text per line, with the color capped
+   to the visible ascender height instead of the heading's larger line box. */
 .highlight {
-  /* Highlight fully covers the text. Small transparent bands at top and
-     bottom keep the stripes from butting against adjacent lines on wrap. */
-  background: linear-gradient(180deg, transparent 15%, #fde68a 15%, #fde68a 94%, transparent 94%);
+  background-image: linear-gradient(#fde68a, #fde68a);
+  background-repeat: no-repeat;
+  background-position: 0 50%;
+  background-size: 100% 0.72em;
   -webkit-box-decoration-break: clone;
   box-decoration-break: clone;
   padding: 0 0.08em;

sample/app/page.tsx

@@ -88,11 +88,11 @@ const LANGUAGES = [
 ] as const;
 
 const SAMPLE_IDS = [
-  '7GeFt8suV8E',
-  'jNQXAC9IVRw',
+  '0Gb1z-2SjHY',
   'D37Ijn2o5U0',
   'g9JIUM0MHgQ',
   '6BB6exR8Zd8',
+  '55pTFVoclvE',
 ];
 function apiUrl(path: string, params: URLSearchParams): string {
   const query = params.toString();
@@ -211,14 +211,14 @@ export default function HomePage() {
 
         {/* Headline */}
         <h1 className='mt-3 font-serif text-[44px] sm:text-[56px] leading-[1.15] tracking-[-0.02em] text-stone-900'>
-          <span className='highlight'>Get the transcript</span>
+          <span className='highlight'>Get clean transcript</span>
           <br />
           <span className='highlight italic font-light'>
             for any{' '}
             <span className='not-italic font-normal tracking-[-0.01em]'>
               YouTube
             </span>{' '}
-            video.
+            video
           </span>
         </h1>
 
@@ -543,7 +543,7 @@ export default function HomePage() {
           >
             github
           </a>
-          <span className='ml-auto font-mono text-stone-400'>v1.10.0</span>
+          <span className='ml-auto font-mono text-stone-400'>v1.10.2</span>
         </div>
       </footer>
     </main>

sample/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.