@prolibu-suite/cobalt-core 0.9.6 → 0.10.1

package/dist/collection/components/co-app-shell/co-app-shell.css

@@ -1,3 +1,88 @@
+/* squircle-surface.css — receta ÚNICA de superficie squircle (co-app-shell,
+   co-drawer, co-modal). Se @import-a desde el CSS del componente como PRIMER
+   statement (Stencil inlinea @import relativos; precedente co-select.css:3) y
+   el tsx agrega las clases. Spec: prolibu-front-v2/docs/superpowers/specs/
+   2026-09-02-suite-v2-intel-perf-remediation-design.md §7 (E1, E5).
+
+   Variables que declara CADA consumidor sobre el elemento (o un ancestro):
+     --co-sq-r            radio de esquina
+     --co-sq-shadow       box-shadow (rama Chromium ≥139, sigue el corner-shape)
+     --co-sq-drop-shadow  filter drop-shadow (fallback Safari/Firefox)
+   Conversión entre ambas: drop-shadow(x y σ) ≡ box-shadow x y 2σ.
+
+   Clases:
+     .co-sq-elevation           sombra que sigue la silueta squircle
+     .co-sq-clip                recorte superelíptico SIN máscara
+     .co-sq-elevation-fallback  SIEMPRE en un ancestro del .co-sq-clip: en el
+                                fallback la sombra es un `filter`, y `filter` se
+                                aplica antes que `mask` en el mismo elemento →
+                                la máscara la recortaría.
+
+   Reglas: (1) el componente NO redeclara border-radius / overflow / filter /
+   mask / box-shadow en esos elementos (una redeclaración posterior le gana al
+   partial por cascada; guard squircle-surface-guard.test.ts); (2)
+   .co-sq-elevation y .co-sq-clip pueden ir en el MISMO elemento (co-modal) o
+   en padre/hijo (shell, drawer); (3) `contain: layout` NO va acá: lo declara
+   cada componente donde E2/E20 lo piden.
+
+   Las 4 rutas SVG son una superelipse de exponente 4 = `corner-shape: squircle`
+   (superellipse(2)): misma silueta, error máx 1e-4 — a 14 px de radio la
+   diferencia con un círculo es ≤1.87 px en la punta. Sin `+2px` anti-costura en
+   la rama Chromium: sin máscara no hay costura posible (historia del hack: nota
+   de memoria cobalt-squircle-mask-seam). */
+
+.co-sq-elevation {
+  border-radius: var(--co-sq-r);
+  corner-shape: squircle;
+  box-shadow: var(--co-sq-shadow);
+}
+
+.co-sq-clip {
+  overflow: hidden;
+  border-radius: var(--co-sq-r);
+  corner-shape: squircle;
+}
+
+/* F2 (E1): Safari/Firefox = píxel-idéntico a la receta anterior (filter
+   drop-shadow en el ancestro + máscara de 6 capas en el clip). */
+@supports not (corner-shape: squircle) {
+  .co-sq-elevation {
+    box-shadow: none;
+  }
+
+  .co-sq-elevation-fallback {
+    filter: var(--co-sq-drop-shadow);
+  }
+
+  /* Declarado DESPUÉS de .co-sq-elevation a propósito: cuando ambas clases van
+     en el mismo elemento (co-modal) gana el radius 0 y la máscara define la
+     forma. 4 esquinas + cruz de 2 barras (H full-width, V full-height); las
+     barras van `calc(... + 2px)` para solapar cada esquina ~1px y evitar la
+     costura sub-píxel que flickeaba con el zoom. */
+  .co-sq-clip {
+    border-radius: 0;
+    --co-sq-tl: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M100 0L97.5 0L95 0L92.5 0L90 0L87.5 0.01L85 0.01L82.5 0.02L80 0.04L77.5 0.06L75 0.1L72.5 0.14L70 0.2L67.5 0.28L65 0.38L62.5 0.5L60 0.65L57.5 0.83L55 1.04L52.5 1.3L50 1.6L47.5 1.96L45 2.37L42.5 2.85L40 3.41L37.5 4.05L35 4.8L32.5 5.65L30 6.63L27.5 7.77L25 9.07L22.5 10.58L20 12.34L17.5 14.41L15 16.85L12.5 19.79L10 23.42L7.5 28.06L5 34.37L2.5 44.29L0 100L100 100Z%27 fill=%27%23fff%27/></svg>");
+    --co-sq-tr: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M0 0L2.5 0L5 0L7.5 0L10 0L12.5 0.01L15 0.01L17.5 0.02L20 0.04L22.5 0.06L25 0.1L27.5 0.14L30 0.2L32.5 0.28L35 0.38L37.5 0.5L40 0.65L42.5 0.83L45 1.04L47.5 1.3L50 1.6L52.5 1.96L55 2.37L57.5 2.85L60 3.41L62.5 4.05L65 4.8L67.5 5.65L70 6.63L72.5 7.77L75 9.07L77.5 10.58L80 12.34L82.5 14.41L85 16.85L87.5 19.79L90 23.42L92.5 28.06L95 34.37L97.5 44.29L100 100L0 100Z%27 fill=%27%23fff%27/></svg>");
+    --co-sq-bl: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M0 0L2.5 55.71L5 65.63L7.5 71.94L10 76.58L12.5 80.21L15 83.15L17.5 85.59L20 87.66L22.5 89.42L25 90.93L27.5 92.23L30 93.37L32.5 94.35L35 95.2L37.5 95.95L40 96.59L42.5 97.15L45 97.63L47.5 98.04L50 98.4L52.5 98.7L55 98.96L57.5 99.17L60 99.35L62.5 99.5L65 99.62L67.5 99.72L70 99.8L72.5 99.86L75 99.9L77.5 99.94L80 99.96L82.5 99.98L85 99.99L87.5 99.99L90 100L92.5 100L95 100L97.5 100L100 100L100 0Z%27 fill=%27%23fff%27/></svg>");
+    --co-sq-br: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M100 0L97.5 55.71L95 65.63L92.5 71.94L90 76.58L87.5 80.21L85 83.15L82.5 85.59L80 87.66L77.5 89.42L75 90.93L72.5 92.23L70 93.37L67.5 94.35L65 95.2L62.5 95.95L60 96.59L57.5 97.15L55 97.63L52.5 98.04L50 98.4L47.5 98.7L45 98.96L42.5 99.17L40 99.35L37.5 99.5L35 99.62L32.5 99.72L30 99.8L27.5 99.86L25 99.9L22.5 99.94L20 99.96L17.5 99.98L15 99.99L12.5 99.99L10 100L7.5 100L5 100L2.5 100L0 100L0 0Z%27 fill=%27%23fff%27/></svg>");
+    -webkit-mask:
+      var(--co-sq-tl) top left / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      var(--co-sq-tr) top right / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      var(--co-sq-bl) bottom left / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      var(--co-sq-br) bottom right / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      linear-gradient(#fff 0 0) center / 100% calc(100% - 2 * var(--co-sq-r) + 2px) no-repeat,
+      linear-gradient(#fff 0 0) center / calc(100% - 2 * var(--co-sq-r) + 2px) 100% no-repeat;
+            mask:
+      var(--co-sq-tl) top left / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      var(--co-sq-tr) top right / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      var(--co-sq-bl) bottom left / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      var(--co-sq-br) bottom right / var(--co-sq-r) var(--co-sq-r) no-repeat,
+      linear-gradient(#fff 0 0) center / 100% calc(100% - 2 * var(--co-sq-r) + 2px) no-repeat,
+      linear-gradient(#fff 0 0) center / calc(100% - 2 * var(--co-sq-r) + 2px) 100% no-repeat;
+  }
+}
+
+
 :host {
   display: flex;
   height: 100vh;
@@ -129,55 +214,36 @@
   margin: var(--co-spacing-sm);
   margin-left: 0;
   min-height: 0;
-  /* Elevation: a layered soft drop-shadow that follows the squircle silhouette
-     of the inner card (drop-shadow respects the child mask; a box-shadow here
-     would be rectangular and the inner mask would clip it away). */
-  filter:
-    drop-shadow(0 1px 2px rgba(31, 28, 27, 0.06))
-    drop-shadow(0 10px 28px rgba(31, 28, 27, 0.12));
-  /* Squircle geometry — shared with .main__card via inheritance. Fixed-radius
-     corner-mask (4 corner pieces + 2 bars) so the radius stays constant at any
-     shell size and the corners are smooth. Radius knob: --co-border-radius-md. */
+  /* E2: containing block + stacking context para los `position: fixed`
+     slotteados (co-fab, co-action-bar centrada en la card, uploads de Drive).
+     Antes lo daba el `filter: drop-shadow` — que se fue al partial y solo
+     existe en el fallback — y sin esto se re-anclarían al viewport. El Host ya
+     es overflow:hidden y .main no scrollea, así que el overflow "ink" que
+     introduce contain no cambia nada. */
+  contain: layout;
+  /* Squircle: receta en global/squircle-surface.css — .main lleva
+     .co-sq-elevation (+ .co-sq-elevation-fallback), .main__card lleva
+     .co-sq-clip. Radio: --co-shell-r se queda como knob público (co-drawer.css
+     lo hereda por el flat tree del slot). */
   --co-shell-r: var(--co-border-radius-md);
-  --co-sq-tl: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M100 0L97.5 0L95 0L92.5 0L90 0L87.5 0.01L85 0.01L82.5 0.02L80 0.04L77.5 0.06L75 0.1L72.5 0.14L70 0.2L67.5 0.28L65 0.38L62.5 0.5L60 0.65L57.5 0.83L55 1.04L52.5 1.3L50 1.6L47.5 1.96L45 2.37L42.5 2.85L40 3.41L37.5 4.05L35 4.8L32.5 5.65L30 6.63L27.5 7.77L25 9.07L22.5 10.58L20 12.34L17.5 14.41L15 16.85L12.5 19.79L10 23.42L7.5 28.06L5 34.37L2.5 44.29L0 100L100 100Z%27 fill=%27%23fff%27/></svg>");
-  --co-sq-tr: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M0 0L2.5 0L5 0L7.5 0L10 0L12.5 0.01L15 0.01L17.5 0.02L20 0.04L22.5 0.06L25 0.1L27.5 0.14L30 0.2L32.5 0.28L35 0.38L37.5 0.5L40 0.65L42.5 0.83L45 1.04L47.5 1.3L50 1.6L52.5 1.96L55 2.37L57.5 2.85L60 3.41L62.5 4.05L65 4.8L67.5 5.65L70 6.63L72.5 7.77L75 9.07L77.5 10.58L80 12.34L82.5 14.41L85 16.85L87.5 19.79L90 23.42L92.5 28.06L95 34.37L97.5 44.29L100 100L0 100Z%27 fill=%27%23fff%27/></svg>");
-  --co-sq-bl: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M0 0L2.5 55.71L5 65.63L7.5 71.94L10 76.58L12.5 80.21L15 83.15L17.5 85.59L20 87.66L22.5 89.42L25 90.93L27.5 92.23L30 93.37L32.5 94.35L35 95.2L37.5 95.95L40 96.59L42.5 97.15L45 97.63L47.5 98.04L50 98.4L52.5 98.7L55 98.96L57.5 99.17L60 99.35L62.5 99.5L65 99.62L67.5 99.72L70 99.8L72.5 99.86L75 99.9L77.5 99.94L80 99.96L82.5 99.98L85 99.99L87.5 99.99L90 100L92.5 100L95 100L97.5 100L100 100L100 0Z%27 fill=%27%23fff%27/></svg>");
-  --co-sq-br: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27><path d=%27M100 0L97.5 55.71L95 65.63L92.5 71.94L90 76.58L87.5 80.21L85 83.15L82.5 85.59L80 87.66L77.5 89.42L75 90.93L72.5 92.23L70 93.37L67.5 94.35L65 95.2L62.5 95.95L60 96.59L57.5 97.15L55 97.63L52.5 98.04L50 98.4L47.5 98.7L45 98.96L42.5 99.17L40 99.35L37.5 99.5L35 99.62L32.5 99.72L30 99.8L27.5 99.86L25 99.9L22.5 99.94L20 99.96L17.5 99.98L15 99.99L12.5 99.99L10 100L7.5 100L5 100L2.5 100L0 100L0 0Z%27 fill=%27%23fff%27/></svg>");
+  --co-sq-r: var(--co-shell-r);
+  /* Sombra: box-shadow (Chromium ≥139, sigue el corner-shape) / drop-shadow
+     (fallback). Overridables desde el host por custom property, NO por
+     ::part(main){filter} (eso reinstala el render surface con dos blurs por
+     frame). Conversión: drop-shadow(x y σ) ≡ box-shadow x y 2σ. */
+  --co-sq-shadow: var(--co-app-shell-shadow, 0 1px 4px rgba(31, 28, 27, 0.06), 0 10px 56px rgba(31, 28, 27, 0.12));
+  --co-sq-drop-shadow: var(--co-app-shell-drop-shadow, drop-shadow(0 1px 2px rgba(31, 28, 27, 0.06)) drop-shadow(0 10px 28px rgba(31, 28, 27, 0.12)));
 }
 
-/* The visible card: smooth (squircle) corners + a subtle glass hairline rim.
-   The mask lives here (not on .main) so .main's drop-shadow isn't clipped. */
+/* The visible card: el recorte squircle lo da .co-sq-clip (partial). No
+   redeclarar overflow / border-radius / mask acá: le ganarían al partial por
+   orden de cascada. (Sin glass top-rim: el 1px blanco se leía como una línea
+   sobre el navbar oscuro; el borde de la card lo define la sombra de .main.) */
 .main__card {
   flex: 1;
   min-height: 0;
   display: flex;
   flex-direction: column;
-  overflow: hidden;
-  border-radius: 0; /* the mask defines the (smooth) shape */
-  /* (No glass top-rim: the 1px white highlight read as a distracting line on the
-     dark navbar. The card edge is defined by .main's drop-shadow instead.) */
-  /* Squircle via 4 corner pieces + a cross of 2 bars (H full-width, V full-height).
-     The bars are sized `calc(... + 2px)` so they OVERLAP each corner by ~1px on
-     every side: otherwise the bar↔corner edges abut exactly at x=r / y=r and the
-     fractional-pixel rounding (per device-pixel-ratio) leaves a <1px transparent
-     SEAM there. Because the navbar slotted on top is semi-transparent, that seam
-     read as a faint line that flickered in/out with browser zoom. The overlap
-     lands in the corners' already-opaque area, so the rounded shape is unchanged
-     (at most a sub-px nub at the very corner tip). */
-  -webkit-mask:
-    var(--co-sq-tl) top left / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    var(--co-sq-tr) top right / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    var(--co-sq-bl) bottom left / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    var(--co-sq-br) bottom right / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    linear-gradient(#fff 0 0) center / 100% calc(100% - 2 * var(--co-shell-r) + 2px) no-repeat,
-    linear-gradient(#fff 0 0) center / calc(100% - 2 * var(--co-shell-r) + 2px) 100% no-repeat;
-          mask:
-    var(--co-sq-tl) top left / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    var(--co-sq-tr) top right / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    var(--co-sq-bl) bottom left / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    var(--co-sq-br) bottom right / var(--co-shell-r) var(--co-shell-r) no-repeat,
-    linear-gradient(#fff 0 0) center / 100% calc(100% - 2 * var(--co-shell-r) + 2px) no-repeat,
-    linear-gradient(#fff 0 0) center / calc(100% - 2 * var(--co-shell-r) + 2px) 100% no-repeat;
 }
 
 /* ─── Header ────────────────────────────────────────────────── */

package/dist/collection/components/co-app-shell/co-app-shell.js

@@ -16,10 +16,10 @@ export class CoAppShell {
         this.contentCard = true;
     }
     render() {
-        return (h(Host, { key: '7a45ab21e3ad256e25f05df33ad827931532c34a' }, h("aside", { key: '5ca5469a35e630b4ab01be23cae46efc43cb1519', class: "sidebar", part: "sidebar" }, h("div", { key: 'f4243197b46e67b4d632aa8abad803b07f471bb2', class: "sidebar__header", part: "sidebar-header" }, h("slot", { key: 'b609c8272c05f7e4cbb2c8ae1ab0c24430541f84', name: "sidebar-header" })), h("div", { key: '72ca1118e1eeb6b5f3467c16c82dac60c4dc4042', class: "sidebar__body", part: "sidebar-body" }, h("slot", { key: '48c65d150a4836996cf7406f32142bcb86e545df', name: "sidebar" })), h("div", { key: 'be09567b81d7abae1738decfd30b9b7b6edb47f2', class: "sidebar__footer", part: "sidebar-footer" }, h("slot", { key: 'd202466aa14916d7fd3be163a615ce1156151150', name: "sidebar-footer" }))), h("div", { key: 'd8b6f0cfdf0c4123b413d5d8bad78813fb7ba1a9', class: "main", part: "main" }, h("div", { key: '0efa85801eaa0cd339875ff4a1fd9cedcd715751', class: "main__card", part: "card" }, h("header", { key: 'befa647b3822ed055166c3e2da9aca9fb54c1204', class: "main__header", part: "header" }, h("slot", { key: 'b08034b07963d178f3b8e9cee16d3975f97a7b90', name: "navbar" })), h("main", { key: '3b0adfc33dd08b08fb2edf84a5f098c0ff7d1003', class: {
+        return (h(Host, { key: '7a45ab21e3ad256e25f05df33ad827931532c34a' }, h("aside", { key: '5ca5469a35e630b4ab01be23cae46efc43cb1519', class: "sidebar", part: "sidebar" }, h("div", { key: 'f4243197b46e67b4d632aa8abad803b07f471bb2', class: "sidebar__header", part: "sidebar-header" }, h("slot", { key: 'b609c8272c05f7e4cbb2c8ae1ab0c24430541f84', name: "sidebar-header" })), h("div", { key: '72ca1118e1eeb6b5f3467c16c82dac60c4dc4042', class: "sidebar__body", part: "sidebar-body" }, h("slot", { key: '48c65d150a4836996cf7406f32142bcb86e545df', name: "sidebar" })), h("div", { key: 'be09567b81d7abae1738decfd30b9b7b6edb47f2', class: "sidebar__footer", part: "sidebar-footer" }, h("slot", { key: 'd202466aa14916d7fd3be163a615ce1156151150', name: "sidebar-footer" }))), h("div", { key: 'e7d10070e45f3eec363c3206ba8858b55fae6270', class: "main co-sq-elevation co-sq-elevation-fallback", part: "main" }, h("div", { key: 'b3a78141a04b5592f20ce26a7da8a6e596c5a2bf', class: "main__card co-sq-clip", part: "card" }, h("header", { key: 'f9c8d6a6c42d143328d9062e49ab63904c7ba485', class: "main__header", part: "header" }, h("slot", { key: '42722bbc79a308258a89d43c0a9d7eafd0841b47', name: "navbar" })), h("main", { key: 'fd841d8a6010c4feb278ce6f7914591d145ad304', class: {
                 'main__content': true,
                 'main__content--card': this.contentCard,
-            }, part: "content" }, h("slot", { key: '4c38a0a04548bc6cd2cc04d9b3fb095f5548fdde' }))))));
+            }, part: "content" }, h("slot", { key: '03c35d1fa1c9f849aa235e5afc940c7f919371a8' }))))));
     }
     static get is() { return "co-app-shell"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-audio-player/co-audio-player.js

@@ -38,10 +38,22 @@ export class CoAudioPlayer {
         // Bumped by every init(); an in-flight extractPeaks whose token no longer matches
         // belongs to a superseded `src` and must not write peaks/duration.
         this.loadToken = 0;
-        this.onMeta = () => { this.syncDuration(); };
-        this.onCanPlay = () => { this.isLoading = false; };
+        this.onMeta = () => { this.syncDuration(); this.applyPendingSeek(); };
+        /**
+         * A seek asked for before the media had data. `<audio>` DROPS a `currentTime`
+         * write while `readyState` is HAVE_NOTHING, silently: with `preload="metadata"`
+         * and a clip never played, the very first jump (clicking a transcript line on
+         * a recording nobody opened yet) went nowhere. Kept here and applied as soon
+         * as the element can take it.
+         */
+        this.pendingSeek = null;
+        this.onCanPlay = () => { this.isLoading = false; this.applyPendingSeek(); };
         this.onWaiting = () => { this.isLoading = true; };
-        this.onTime = () => { var _a; this.currentTime = ((_a = this.audio) === null || _a === void 0 ? void 0 : _a.currentTime) || 0; };
+        this.onTime = () => {
+            var _a;
+            this.currentTime = ((_a = this.audio) === null || _a === void 0 ? void 0 : _a.currentTime) || 0;
+            this.coTimeUpdate.emit({ currentTime: this.currentTime, duration: this.knownDuration });
+        };
         this.onEnded = () => { this.isPlaying = false; this.currentTime = 0; this.coEnded.emit(); };
         this.onErr = (e) => { this.isLoading = false; this.hasError = true; this.coError.emit(e); };
         this.toggle = () => {
@@ -198,12 +210,26 @@ export class CoAudioPlayer {
         this.isPlaying = false;
     }
     async extractPeaks(url, token) {
+        var _a;
         let ctx;
         try {
+            /**
+             * `OfflineAudioContext` FIRST, and a live `AudioContext` only as the
+             * fallback: decoding a waveform needs no audio OUTPUT, and a live context
+             * created before the user has interacted trips the browser's autoplay
+             * policy — "The AudioContext was not allowed to start. It must be resumed
+             * (or created) after a user gesture on the page", once per player. A page
+             * with 15 recordings logged it 15 times. The offline one has no output
+             * device, so the policy does not apply to it.
+             *
+             * Its arguments are placeholders: nothing is ever rendered through this
+             * context, it is only the host for `decodeAudioData`.
+             */
+            const OfflineCtx = window.OfflineAudioContext || window.webkitOfflineAudioContext;
             const Ctx = window.AudioContext || window.webkitAudioContext;
-            if (!Ctx || typeof fetch === 'undefined')
+            if ((!OfflineCtx && !Ctx) || typeof fetch === 'undefined')
                 return; // keep fallback
-            ctx = new Ctx();
+            ctx = OfflineCtx ? new OfflineCtx(1, 1, 44100) : new Ctx();
             const buf = await (await fetch(url)).arrayBuffer();
             const audioBuf = await ctx.decodeAudioData(buf);
             if (token !== this.loadToken)
@@ -212,7 +238,7 @@ export class CoAudioPlayer {
             this.decodedDuration = audioBuf.duration;
             this.peaks = resamplePeaks(this.rawChannelData, this.effectiveBars);
         }
-        catch (_a) {
+        catch (_b) {
             if (token !== this.loadToken)
                 return;
             // Undecodable (codec WebAudio can't handle, CORS, network): keep the
@@ -225,11 +251,13 @@ export class CoAudioPlayer {
         finally {
             // Always release the context. Chrome caps concurrent AudioContexts per
             // document, so leaking one per failed decode would eventually stop every
-            // later player on the page from decoding at all.
+            // later player on the page from decoding at all. `close()` lives on
+            // AudioContext, not on every BaseAudioContext (an OfflineAudioContext
+            // needs no closing and may not implement it): optional call, not a cast.
             try {
-                await (ctx === null || ctx === void 0 ? void 0 : ctx.close());
+                await ((_a = ctx === null || ctx === void 0 ? void 0 : ctx.close) === null || _a === void 0 ? void 0 : _a.call(ctx));
             }
-            catch ( /* already closed */_b) { /* already closed */ }
+            catch ( /* already closed */_c) { /* already closed */ }
         }
         if (token === this.loadToken)
             this.syncDuration();
@@ -244,6 +272,47 @@ export class CoAudioPlayer {
         if (!Object.is(next, this.duration))
             this.duration = next;
     }
+    applyPendingSeek() {
+        if (this.pendingSeek == null || !this.audio)
+            return;
+        const target = this.pendingSeek;
+        this.pendingSeek = null;
+        this.audio.currentTime = target;
+        this.currentTime = this.audio.currentTime;
+        this.coTimeUpdate.emit({ currentTime: this.currentTime, duration: this.knownDuration });
+    }
+    /**
+     * Move the playhead. Clamped to `[0, duration]`: `audio.currentTime` takes a
+     * restricted double and THROWS on a non-finite value, and a duration that is
+     * not known yet reads as 0 (see `knownDuration`).
+     */
+    async seek(seconds) {
+        var _a;
+        if (!this.audio || !Number.isFinite(seconds))
+            return;
+        const total = this.knownDuration;
+        const target = total ? Math.max(0, Math.min(total, seconds)) : Math.max(0, seconds);
+        this.audio.currentTime = target;
+        // The element could not take it yet (no data): keep it for `loadedmetadata`.
+        // The readback is the only way to tell — the write throws nothing.
+        if (Math.abs(((_a = this.audio.currentTime) !== null && _a !== void 0 ? _a : 0) - target) > 0.05)
+            this.pendingSeek = target;
+        // Optimistic either way: the UI shows where playback is GOING, and the
+        // pending write lands on its own.
+        this.currentTime = target;
+        this.coTimeUpdate.emit({ currentTime: this.currentTime, duration: total });
+    }
+    /** Start playback if it is not already running (no-op on a failed load). */
+    async play() {
+        if (!this.audio || this.isPlaying || this.hasError)
+            return;
+        try {
+            await this.audio.play();
+            this.isPlaying = true;
+            this.coPlay.emit();
+        }
+        catch ( /* autoplay blocked or source not ready: the button still works */_a) { /* autoplay blocked or source not ready: the button still works */ }
+    }
     async download() {
         if (!this.src || typeof fetch === 'undefined')
             return;
@@ -270,13 +339,13 @@ export class CoAudioPlayer {
         // below `aria-valuenow` the moment playback advances. ARIA 1.2 makes valuemax
         // optional for `slider`, so leaving it off while unknown is well-formed.
         const ariaMax = total ? Math.floor(total) : undefined;
-        const bar = (hFrac, i, played = false) => (h("rect", { key: '997dcefc32f5188c41afa0a7b5135c70cceeed1d', x: i * UNIT, y: H / 2 - (hFrac * H) / 2, width: W, height: Math.max(hFrac * H, 2), rx: R, class: { 'co-audio-player__bar': true, 'co-audio-player__bar--played': played } }));
-        return (h("div", { key: '8ac91ab3f8eb417df5e7cf4d1e016d6ca7eb45a3', class: {
+        const bar = (hFrac, i, played = false) => (h("rect", { key: '7cbeb92ef52ffc865077340d72bae11139ced551', x: i * UNIT, y: H / 2 - (hFrac * H) / 2, width: W, height: Math.max(hFrac * H, 2), rx: R, class: { 'co-audio-player__bar': true, 'co-audio-player__bar--played': played } }));
+        return (h("div", { key: '34078ed0540dc72c87644c3ae830b3a2ff43a99e', class: {
                 'co-audio-player': true,
                 'co-audio-player--compact': this.compact,
                 'co-audio-player--error': this.hasError,
                 'co-audio-player--playing': this.isPlaying,
-            }, part: "player" }, h("button", { key: '0e5897dc64c91ee67432f17d7b0d57a27f44cd0e', type: "button", class: "co-audio-player__play", part: "play", "aria-label": this.hasError ? 'Audio no disponible' : this.isPlaying ? 'Pausar' : 'Reproducir', "aria-busy": this.isLoading ? 'true' : 'false', disabled: this.hasError || !this.src, onClick: this.toggle }, h("co-icon", { key: '4843751a2a3709942a49ae03ff9ba0eb08ab7d97', name: this.hasError ? 'warning-circle' : this.isPlaying ? 'pause' : 'play', weight: "fill", size: this.compact ? 12 : 14 })), h("div", { key: 'b7aebd0e0c5197b0dec6257bbec7c9dd8dd55d6f', class: "co-audio-player__wave", part: "wave", role: "slider", tabindex: "0", "aria-label": "Progreso de reproducci\u00F3n", "aria-valuemin": 0, "aria-valuemax": ariaMax, "aria-valuenow": Math.floor(this.currentTime), ref: (el) => (this.waveEl = el), onClick: (e) => this.seekAt(e.clientX), onKeyDown: this.onWaveKey }, h("svg", { key: 'a504d058a27bb33dd57733ec32db306eb0ed87e9', class: "co-audio-player__svg", viewBox: `0 0 ${vbW} ${H}`, preserveAspectRatio: "none", "aria-hidden": "true" }, this.peaks.map((hFrac, i) => bar(hFrac, i)), h("clipPath", { key: '9cfa69ba28801893baf62c8f66b18a31319fdebe', id: "co-ap-clip" }, h("rect", { key: '6e5cb34baeb2b7dddd6ef7e94f8585ef912e0315', x: "0", y: "0", width: (pct / 100) * vbW, height: H })), h("g", { key: '4b78a29dde762cabc85d7921aacbcd261d8fa6b5', "clip-path": "url(#co-ap-clip)" }, this.peaks.map((hFrac, i) => bar(hFrac, i, true))))), h("span", { key: '9067d22b0e2994e46ef49c60356292ec59f61a21', class: "co-audio-player__time", part: "time" }, formatTime(this.currentTime), " / ", formatTime(this.duration)), !this.compact && (h("button", { key: 'f6149a9996e6ce15230221c2f6fcec95fec5f485', type: "button", class: "co-audio-player__speed", part: "speed", "aria-label": `Velocidad de reproducción ${this.playbackRate}x`, onClick: this.cycleSpeed }, this.playbackRate, "x")), !this.compact && !this.noDownload && (h("button", { key: '73d291d31d92bcb0e18e230fe0ac35d3ab4077b2', type: "button", class: "co-audio-player__dl", part: "download", "aria-label": "Descargar", onClick: () => this.download() }, h("co-icon", { key: '9ab09f5d6b975f4f5544019f70bd2ca1ee521068', name: "download-simple", size: 14 })))));
+            }, part: "player" }, h("button", { key: '7f692d951704a6e101f77512967d4b206f985e18', type: "button", class: "co-audio-player__play", part: "play", "aria-label": this.hasError ? 'Audio no disponible' : this.isPlaying ? 'Pausar' : 'Reproducir', "aria-busy": this.isLoading ? 'true' : 'false', disabled: this.hasError || !this.src, onClick: this.toggle }, h("co-icon", { key: 'fdc0a0a0703189efe10bbc1b1182572d1120a347', name: this.hasError ? 'warning-circle' : this.isPlaying ? 'pause' : 'play', weight: "fill", size: this.compact ? 12 : 14 })), h("div", { key: '6842ce24993895bf70461a28eb837a0558d277d7', class: "co-audio-player__wave", part: "wave", role: "slider", tabindex: "0", "aria-label": "Progreso de reproducci\u00F3n", "aria-valuemin": 0, "aria-valuemax": ariaMax, "aria-valuenow": Math.floor(this.currentTime), ref: (el) => (this.waveEl = el), onClick: (e) => this.seekAt(e.clientX), onKeyDown: this.onWaveKey }, h("svg", { key: 'e75c5e1f78633194608758f43a47987bc28c2081', class: "co-audio-player__svg", viewBox: `0 0 ${vbW} ${H}`, preserveAspectRatio: "none", "aria-hidden": "true" }, this.peaks.map((hFrac, i) => bar(hFrac, i)), h("clipPath", { key: 'c4136dddad555e8b5ef09a81c38433cd2bf39d7c', id: "co-ap-clip" }, h("rect", { key: 'edb79083fbc7d225bd5668443fb6541fe77c8f9d', x: "0", y: "0", width: (pct / 100) * vbW, height: H })), h("g", { key: 'c91b8b285f53b9dc4f6110f9cb73b7f3f892fad6', "clip-path": "url(#co-ap-clip)" }, this.peaks.map((hFrac, i) => bar(hFrac, i, true))))), h("span", { key: '26af75ef91f36d432add06bb636c4d3194902b0a', class: "co-audio-player__time", part: "time" }, formatTime(this.currentTime), " / ", formatTime(this.duration)), !this.compact && (h("button", { key: 'a2093fc2d9c9a9c120e97e59f5e8b91467e1c20c', type: "button", class: "co-audio-player__speed", part: "speed", "aria-label": `Velocidad de reproducción ${this.playbackRate}x`, onClick: this.cycleSpeed }, this.playbackRate, "x")), !this.compact && !this.noDownload && (h("button", { key: '327336de6ad09adac5f8cba6e048b58bbef0008e', type: "button", class: "co-audio-player__dl", part: "download", "aria-label": "Descargar", onClick: () => this.download() }, h("co-icon", { key: '787738fea40ab74531c943f876e20acf6ceb54df', name: "download-simple", size: 14 })))));
     }
     static get is() { return "co-audio-player"; }
     static get encapsulation() { return "shadow"; }
@@ -506,8 +575,65 @@ export class CoAudioPlayer {
                     "resolved": "unknown",
                     "references": {}
                 }
+            }, {
+                "method": "coTimeUpdate",
+                "name": "coTimeUpdate",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Playback position, on the `<audio>` element's own `timeupdate` cadence\n(~4\u00D7/s while playing, plus every seek). Exists so a host can follow the\nplayhead \u2014 a transcript highlighting the line being spoken, for one \u2014\nwithout reaching into this component's shadow DOM for its `<audio>`."
+                },
+                "complexType": {
+                    "original": "{ currentTime: number; duration: number }",
+                    "resolved": "{ currentTime: number; duration: number; }",
+                    "references": {}
+                }
             }];
     }
+    static get methods() {
+        return {
+            "seek": {
+                "complexType": {
+                    "signature": "(seconds: number) => Promise<void>",
+                    "parameters": [{
+                            "name": "seconds",
+                            "type": "number",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Move the playhead. Clamped to `[0, duration]`: `audio.currentTime` takes a\nrestricted double and THROWS on a non-finite value, and a duration that is\nnot known yet reads as 0 (see `knownDuration`).",
+                    "tags": []
+                }
+            },
+            "play": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Start playback if it is not already running (no-op on a failed load).",
+                    "tags": []
+                }
+            }
+        };
+    }
     static get watchers() {
         return [{
                 "propName": "src",

package/dist/collection/components/co-autocomplete/co-autocomplete.js

@@ -418,7 +418,7 @@ export class CoAutocomplete {
                     "references": {
                         "AutocompleteOption": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-rel-20260827-tooltip/packages/core/src/components/co-autocomplete/co-autocomplete.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-autocomplete/co-autocomplete.tsx",
                             "id": "src/components/co-autocomplete/co-autocomplete.tsx::AutocompleteOption"
                         }
                     }

package/dist/collection/components/co-avatar-group/co-avatar-group.js

@@ -87,7 +87,7 @@ export class CoAvatarGroup {
                     "references": {
                         "CoAvatarGroupItem": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-rel-20260827-tooltip/packages/core/src/components/co-avatar-group/co-avatar-group.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-avatar-group/co-avatar-group.tsx",
                             "id": "src/components/co-avatar-group/co-avatar-group.tsx::CoAvatarGroupItem"
                         }
                     }

package/dist/collection/components/co-badge/co-badge.css

@@ -20,3 +20,21 @@
 .co-badge--error   { background: var(--co-semantic-status-error); }
 .co-badge--warning { background: var(--co-semantic-status-warning); }
 .co-badge--info    { background: var(--co-semantic-status-info); }
+
+/* ─── POP DE ENTRADA (opt-in via prop `animated`) ────────────── */
+.co-badge--animated {
+  animation: co-badge-pop var(--co-motion-duration-slower) var(--co-motion-ease-spring) both;
+}
+
+@keyframes co-badge-pop {
+  from {
+    transform: scale(0);
+    opacity: 0;
+    filter: blur(var(--co-motion-blur-sm));
+  }
+  to {
+    transform: scale(1);
+    opacity: 1;
+    filter: none;
+  }
+}

package/dist/collection/components/co-badge/co-badge.js

@@ -8,12 +8,20 @@ export class CoBadge {
         this.size = 'large';
         /** Color — maps to semantic status tokens */
         this.color = 'default';
+        /**
+         * Pop de entrada al montar (spring + blur). Opt-in: un badge estático no
+         * debe animar al render. El host activa `animated` solo donde el énfasis
+         * de entrada se desea; un remonte por `:key` re-popea — comportamiento
+         * aceptado, no una regresión.
+         */
+        this.animated = false;
     }
     render() {
-        return (h("span", { key: 'f0a6e6e5bd63a5ce3ffac291312880ab7baad1be', class: {
+        return (h("span", { key: '18cea751b9be9ae4712f931ab11e00f87adb353a', class: {
                 'co-badge': true,
                 [`co-badge--${this.size}`]: true,
                 [`co-badge--${this.color}`]: true,
+                'co-badge--animated': this.animated,
             }, part: "badge" }));
     }
     static get is() { return "co-badge"; }
@@ -69,6 +77,26 @@ export class CoBadge {
                 "reflect": false,
                 "attribute": "color",
                 "defaultValue": "'default'"
+            },
+            "animated": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Pop de entrada al montar (spring + blur). Opt-in: un badge est\u00E1tico no\ndebe animar al render. El host activa `animated` solo donde el \u00E9nfasis\nde entrada se desea; un remonte por `:key` re-popea \u2014 comportamiento\naceptado, no una regresi\u00F3n."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "animated",
+                "defaultValue": "false"
             }
         };
     }

package/dist/collection/components/co-button/co-button.css

@@ -27,8 +27,8 @@
     background var(--co-motion-duration-fast) var(--co-motion-ease-out),
     transform var(--co-motion-duration-fast) var(--co-motion-ease-out);
   box-sizing: border-box;
-  -webkit-backdrop-filter: blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));
-  backdrop-filter: blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));
+  -webkit-backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
+          backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
 }
 
 /* ─── VARIANTS ─────────────────────────────────────────────── */
@@ -41,10 +41,13 @@
   color: var(--co-semantic-on-primary);
   border-color: color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent);
 }
+/* Knobs (heredan a través del shadow, mismo mecanismo y nombres que
+   --co-icon-button-bg/-color/-border): un consumidor con spec propia cambia la
+   superficie de la variante clara SIN un ::part de color. Defaults = look del DS. */
 .co-button--secondary {
-  background: color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);
-  color: var(--co-semantic-on-secondary);
-  border-color: var(--co-semantic-border-subtle);
+  background: color-mix(in srgb, var(--co-button-bg, var(--co-semantic-surface-secondary)) 55%, transparent);
+  color: var(--co-button-color, var(--co-semantic-on-secondary));
+  border-color: var(--co-button-border, var(--co-semantic-border-subtle));
 }
 .co-button--stroke {
   background: color-mix(in srgb, var(--co-semantic-surface-secondary) 25%, transparent);
@@ -139,8 +142,8 @@
 }
 .co-button--ghost:hover:not(:disabled) {
   background: color-mix(in srgb, var(--co-semantic-surface-hover) 60%, transparent);
-  -webkit-backdrop-filter: blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));
-  backdrop-filter: blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));
+  -webkit-backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
+          backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
 }
 .co-button--danger:hover:not(:disabled),
 .co-button--success:hover:not(:disabled) {

package/dist/collection/components/co-checkbox/co-checkbox.css

@@ -70,10 +70,14 @@
 }
 
 /* ─── UNCHECKED ─────────────────────────────────────────────── */
+/* Sin backdrop-filter (D2, spec intel-perf §7 C3): un checkbox vive sobre un
+   fondo UNIFORME (fila blanca/hover/seleccionada, card kanban, form, isla) y
+   blur() de un color constante es la identidad; saturate(1.3) sobre neutros
+   queda sub-JND. Cada uno pagaba capa + render surface + read-back + máscara
+   redondeada (≈41 por datatable). La translucidez se queda (gratis: sigue el
+   tinte de la fila). Frost real solo en appearance="overlay", más abajo. */
 .co-checkbox:not(.co-checkbox--checked) {
   background: color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);
-  -webkit-backdrop-filter: blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));
-  backdrop-filter: blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));
   border: 1px solid color-mix(in srgb, var(--co-semantic-border-default) 75%, transparent);
 }
 
@@ -117,11 +121,16 @@
   border-radius: 6px;
 }
 
-/* Unchecked → frosted white chip with a hairline inset border */
+/* Unchecked → frosted white chip with a hairline inset border. El frost es
+   EXPLÍCITO acá (antes lo heredaba de la regla unchecked genérica, que ya no
+   lo trae): sobre un thumbnail de Drive SÍ hay imagen que esmerilar. Encadenado
+   a --co-glass-filter (none = opt-out / reduced-transparency). */
 .co-checkbox--overlay:not(.co-checkbox--checked):not(.co-checkbox--indeterminate) {
   background: rgba(255, 255, 255, 0.9);
   box-shadow: inset 0 0 0 1px var(--co-color-opacity-negro-16, rgba(31, 28, 27, 0.16));
   border: none;
+  -webkit-backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
+          backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
 }
 
 /* Checked / indeterminate → solid accent fill (overridable via the on-color prop) */