fix: make layout fully responsive for any screen size

Root cause: viewport was hardcoded to width=3840 and body to
3840x2160px. If TV browser has different viewport, content
overflows and can't be zoomed to fit.

Changes:
- viewport meta: width=device-width instead of width=3840
- body: 100vw/100vh instead of fixed pixels
- App container: w-screen h-screen
- font-size: clamp(14px, 1.15vw, 24px) scales with viewport
- Topology: horizontal chain (Modem → FW → Switch) saves
  vertical space, VM pills in 3-col grid, all sizes relative
- Kanban: 3-col grid, compact project cards
- All padding/gaps use rem (scale with base font)
- Removed all hardcoded pixel max-widths

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/index.css

@@ -21,7 +21,7 @@
 }
 
 html {
-  font-size: 24px;
+  font-size: clamp(14px, 1.15vw, 24px);
 }
 
 body {
@@ -30,11 +30,10 @@ body {
   font-family: "Inter", system-ui, -apple-system, sans-serif;
   margin: 0;
   overflow: hidden;
-  width: 3840px;
-  height: 2160px;
+  width: 100vw;
+  height: 100vh;
 }
 
-/* Smooth scrollbar for overflow areas */
 ::-webkit-scrollbar {
   width: 6px;
 }