Move to the layout REPO_POLICIES.md gives (closes #30)

The Go module moves from backend/ to the root (go.mod, go.sum,
.golangci.yml, cmd/, internal/), the page's source to web/, and nginx's
two files to configs/. backend/ is gone: its LICENSE and .dockerignore
are deleted, and its .gitignore entries, README and scripts are folded
into the root ones. script/build builds the server binary after the
frontend; script/run and script/clean move up from backend/script/;
make test, lint, fmt and fmt-check do what the backend's did. Vite's
root is web/ and it still builds into dist/. go.mod ignores
node_modules/, whose npm packages can ship .go files. script/bootstrap
no longer installs gcc, which only the host Go tests needed.

Model: opus-5-5

web/src/styles.css

@@ -0,0 +1,149 @@
+@import "tailwindcss";
+
+@theme {
+    --color-latency-excellent: #22c55e;
+    --color-latency-good: #84cc16;
+    --color-latency-moderate: #eab308;
+    --color-latency-poor: #f97316;
+    --color-latency-bad: #ef4444;
+    --color-latency-offline: #6b7280;
+}
+
+body {
+    font-family:
+        ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+}
+
+/* ---- Minimum tap targets ----------------------------------------------
+   Every interactive control is at least 44x44 CSS px (Apple HIG, WCAG 2.2
+   SC 2.5.5). Not scoped to a breakpoint or to `pointer: coarse`: a large
+   phone in landscape is above the 768px breakpoint and still a touch
+   device. */
+
+/* The button grows to 44x44 while the negative margins keep its layout
+   footprint at the 16x16 of the icon inside it, so row height and the
+   icon's position are unchanged. */
+.pin-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 2.75rem;
+    height: 2.75rem;
+    margin: -0.875rem;
+}
+
+/* A select paints its own background and border, so it has to actually be
+   44 tall rather than borrow the trick above. */
+#interval-select {
+    min-height: 2.75rem;
+}
+
+/* The tappable target for #debug-toggle is the label wrapping it. */
+.debug-toggle-label {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 2.75rem;
+}
+
+.sparkline-container {
+    background: linear-gradient(
+        to bottom,
+        rgba(255, 255, 255, 0.02) 0%,
+        rgba(255, 255, 255, 0) 100%
+    );
+}
+
+/* ---- Mobile responsive layout (portrait / narrow viewports) ---- */
+@media (max-width: 768px) {
+    /* Header: stack title and controls vertically */
+    header .flex.items-center.justify-between {
+        flex-direction: column;
+        align-items: flex-start !important;
+        gap: 1rem;
+    }
+
+    header .flex.flex-col.items-end {
+        align-items: flex-start !important;
+        flex-direction: row;
+        flex-wrap: wrap;
+        gap: 0.75rem;
+    }
+
+    /* Pause button: smaller on mobile, but not below the tap-target floor */
+    #pause-btn {
+        padding: 0.5rem 1rem;
+        min-height: 2.75rem;
+    }
+
+    #pause-btn svg {
+        width: 1.25rem;
+        height: 1.25rem;
+    }
+
+    #pause-text {
+        font-size: 0.875rem;
+    }
+
+    /* Summary box: wrap into a grid for readability */
+    #summary {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 0.25rem 0.5rem;
+        justify-content: center;
+        line-height: 1.6;
+    }
+
+    /* Hide the pipe separators on mobile */
+    #summary .text-gray-600.mx-3 {
+        display: none;
+    }
+
+    /* Host row: stack vertically */
+    .host-row .flex.items-center.gap-4 {
+        flex-direction: column;
+        align-items: stretch !important;
+        gap: 0.5rem;
+    }
+
+    /* Info section: full width, remove fixed width */
+    .host-row .w-\[420px\] {
+        width: 100% !important;
+        display: grid;
+        grid-template-columns: 1fr auto;
+        align-items: center;
+    }
+
+    /* Host name row with dot */
+    .host-row .flex.items-center.gap-2.min-w-\[200px\] {
+        min-width: 0;
+    }
+
+    /* Latency value: slightly smaller on mobile */
+    .host-row .latency-value {
+        font-size: 1.875rem;
+        line-height: 2.25rem;
+    }
+
+    /* Sparkline: full width below the info */
+    .host-row .sparkline-container {
+        width: 100%;
+        flex-shrink: 0;
+    }
+
+    /* Pin button: inline with the host info */
+    .host-row .pin-btn {
+        position: absolute;
+        right: 0.5rem;
+        top: 0.5rem;
+    }
+
+    .host-row {
+        position: relative;
+    }
+
+    /* Footer legend: wrap nicely */
+    footer p {
+        line-height: 1.8;
+    }
+}