feat: initialize k-tv-frontend with Next.js and Tailwind CSS

- Added package.json with dependencies and scripts for development, build, and linting.
- Created postcss.config.mjs for Tailwind CSS integration.
- Added SVG assets for UI components including file, globe, next, vercel, and window icons.
- Configured TypeScript with tsconfig.json for strict type checking and module resolution.

k-tv-frontend/app/(main)/tv/components/channel-controls.tsx

@@ -0,0 +1,46 @@
+import { ChevronUp, ChevronDown } from "lucide-react";
+
+interface ChannelControlsProps {
+  channelNumber: number;
+  channelName: string;
+  onPrevChannel: () => void;
+  onNextChannel: () => void;
+}
+
+export function ChannelControls({
+  channelNumber,
+  channelName,
+  onPrevChannel,
+  onNextChannel,
+}: ChannelControlsProps) {
+  return (
+    <div className="flex flex-col items-center gap-1 rounded-lg bg-black/60 p-3 backdrop-blur-md">
+      <button
+        onClick={onNextChannel}
+        aria-label="Next channel"
+        className="flex h-10 w-10 items-center justify-center rounded-md text-zinc-400 transition-colors hover:bg-zinc-700 hover:text-white active:scale-95"
+      >
+        <ChevronUp className="h-5 w-5" />
+      </button>
+
+      <div className="flex flex-col items-center px-2 py-1 text-center">
+        <span className="font-mono text-2xl font-bold tabular-nums text-white leading-none">
+          {channelNumber}
+        </span>
+        <span className="mt-0.5 max-w-20 truncate text-[10px] text-zinc-400">
+          {channelName}
+        </span>
+      </div>
+
+      <button
+        onClick={onPrevChannel}
+        aria-label="Previous channel"
+        className="flex h-10 w-10 items-center justify-center rounded-md text-zinc-400 transition-colors hover:bg-zinc-700 hover:text-white active:scale-95"
+      >
+        <ChevronDown className="h-5 w-5" />
+      </button>
+    </div>
+  );
+}
+
+export type { ChannelControlsProps };