fix components

apps/playground/src/app/app.html

@@ -0,0 +1,48 @@
+<header class="page-header">
+  <div class="page-header__top">
+    <div>
+      <h1>@pi/ui</h1>
+      <p>
+        Catálogo de la librería migrada a Angular 22: componentes standalone,
+        señales, OnPush y Signal Forms.
+      </p>
+    </div>
+
+    <div class="theme-toggles">
+      <label class="theme-toggle">
+        <span>Tema alternativo</span>
+        <pi-slide-toggle [(checked)]="alternativeTheme" />
+      </label>
+      <label class="theme-toggle">
+        <span>Modo oscuro</span>
+        <pi-slide-toggle [(checked)]="darkMode" />
+      </label>
+    </div>
+  </div>
+
+  <nav class="page-nav">
+    @for (link of navLinks; track link.path) {
+    <a
+      [routerLink]="link.path"
+      routerLinkActive="is-active"
+      [routerLinkActiveOptions]="{ exact: true }"
+      >{{ link.label }}</a
+    >
+    }
+  </nav>
+
+  <p class="theme-hint">
+    Tema:
+    <strong>{{ alternativeTheme() ? 'alternative' : 'default' }}</strong> ·
+    <code
+      >{{ alternativeTheme() ? 'pi-shell__alternative' : 'pi-shell__default'
+      }}</code
+    >
+    en el <code>&lt;body&gt;</code>. Los dos temas comparten exactamente los
+    mismos selectores: solo cambian los tokens <code>--pi-color-*</code> y
+    <code>--pi-theme-*</code> que definen <code>themes/_default.scss</code> y
+    <code>themes/_alternative.scss</code>.
+  </p>
+</header>
+
+<router-outlet />