feat(ui): add remote-control URLs + fix header typos and env

Add support for displaying local remote-control URLs and QR code in the
Settings UI, including styles for URL list, row layout, monospaced links,
and a QR container. Expose a new global API signature getLocalIpAddresses
for retrieving local IPs.

Fix several UI issues:
- Correct typo in header method name (opedAddPlaylistDialog -> openAddPlaylistDialog).
- Fix malformed GitHub URL and collapse img tag formatting.
- Reformat imports and viewChild usage for readability.

Change local development backend URL to localhost:3000 in the local
environment to point to the running local API during development.

These changes improve developer ergonomics (local backend), add a remote
control discovery UX for users on the same network, and tidy up header
bugs and formatting.

apps/web/src/app/settings/settings.component.html

@@ -326,6 +326,49 @@
                     </mat-form-field>
                 </div>
             </div>
+            @if (localIpAddresses().length > 0) {
+                <mat-divider />
+                <div class="row">
+                    <div class="column">
+                        {{ 'SETTINGS.REMOTE_CONTROL_URL' | translate }}
+                        <p>
+                            {{ 'SETTINGS.REMOTE_CONTROL_URL_DESCRIPTION' | translate }}
+                        </p>
+                    </div>
+                    <div class="column margin-right remote-control-urls">
+                        @for (ip of localIpAddresses(); track ip) {
+                            <div class="remote-control-url-item">
+                                <div class="url-row">
+                                    <a
+                                        [href]="'http://' + ip + ':' + settingsForm.value.remoteControlPort"
+                                        target="_blank"
+                                        class="remote-control-url"
+                                    >
+                                        http://{{ ip }}:{{ settingsForm.value.remoteControlPort }}
+                                    </a>
+                                    <button
+                                        mat-icon-button
+                                        type="button"
+                                        (click)="toggleQrCode(ip)"
+                                        [matTooltip]="'SETTINGS.SHOW_QR_CODE' | translate"
+                                    >
+                                        <mat-icon>qr_code_2</mat-icon>
+                                    </button>
+                                </div>
+                                @if (visibleQrCodeIp() === ip) {
+                                    <div class="qr-code-container">
+                                        <qrcode
+                                            [qrdata]="'http://' + ip + ':' + settingsForm.value.remoteControlPort"
+                                            [width]="150"
+                                            errorCorrectionLevel="M"
+                                        ></qrcode>
+                                    </div>
+                                }
+                            </div>
+                        }
+                    </div>
+                </div>
+            }
         }
         <mat-divider />
         <div class="row">