@vibes.diy/base 14.3.114 → 14.3.116

package/components/vibe-menu/parts/SurveyStrip.d.ts

@@ -28,8 +28,10 @@ export declare const SURVEY_COPY: Readonly<{
 }>;
 export declare function surveyCountdownDigit(msLeft: number): number;
 export declare function surveyTileLabel(face: SurveyFace, digit: number | undefined): string;
-export declare const SURVEY_STRIP_CSS = "\n/* Its own container: the aside steps out when the strip itself is narrow, on any host. */\n[data-vibe-menu] .vm-survey { margin: 0 0 var(--space-14); container: vm-survey / inline-size; }\n/* Code mode's card is wide and its pinned top is capped: the strip keeps the card-sized tiles. */\n[data-vibe-menu] .vm-codemode .vm-survey { margin-bottom: 10px; max-width: 420px; }\n[data-vibe-menu] .vm-survey-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); margin: 0 0 var(--space-8); padding: 0 var(--space-2); }\n[data-vibe-menu] .vm-survey-title { font: 600 15px/1.3 var(--font-display); color: var(--ink); }\n[data-vibe-menu] .vm-survey-aside { font: 400 12px/1.3 var(--font-display); color: var(--muted); white-space: nowrap; }\n[data-vibe-menu] .vm-survey-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-8); }\n/* Three readings keep the four-up tile size: the missing tile's column stays empty. */\n[data-vibe-menu] .vm-survey-strip[data-count=\"3\"] { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-right: calc((100% - 24px) / 4 + 8px); }\n[data-vibe-menu] .vm-survey-cell { min-width: 0; }\n[data-vibe-menu] .vm-survey-tile { position: relative; display: block; width: 100%; min-height: 44px; padding: 0; aspect-ratio: 1; border: var(--stroke-rule) solid var(--line-card); border-radius: var(--radius-switch); overflow: hidden; background: var(--card-bg); cursor: pointer; touch-action: manipulation; }\n[data-vibe-menu] .vm-survey-tile[data-on=\"true\"] { outline: var(--stroke-focus) solid var(--accent); outline-offset: 2px; }\n[data-vibe-menu] .vm-survey-tile[aria-disabled=\"true\"] { cursor: default; }\n[data-vibe-menu] .vm-survey[data-selected] .vm-survey-cell:not([data-on=\"true\"]) .vm-survey-tile { opacity: 0.55; }\n[data-vibe-menu] .vm-survey[data-picked] .vm-survey-cell:not([data-on=\"true\"]) .vm-survey-tile { opacity: 0.35; }\n[data-vibe-menu] .vm-survey-art { display: block; width: 100%; height: 100%; object-fit: cover; }\n/* The countdown: a small chip in the corner, so the look stays in full view. */\n[data-vibe-menu] .vm-survey-count { position: absolute; top: 6px; right: 6px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: var(--radius-full); border: var(--stroke-rule) solid var(--line-card); background: var(--accent); color: var(--on-accent); font: 700 14px/1 var(--font-display); font-variant-numeric: tabular-nums; pointer-events: none; }\n[data-vibe-menu] .vm-survey-count b { font: inherit; animation: vm-survey-tick 240ms ease-out; }\n@keyframes vm-survey-tick { from { transform: scale(1.35); } to { transform: scale(1); } }\n@media (prefers-reduced-motion: reduce) { [data-vibe-menu] .vm-survey-count b { animation: none; } }\n[data-vibe-menu] .vm-survey-cap { margin-top: var(--space-6); padding: 0 var(--space-2); font: 700 13px/1.25 var(--font-display); color: var(--ink); }\n[data-vibe-menu] .vm-survey-foot { display: flex; align-items: center; gap: var(--space-12); margin-top: var(--space-10); padding: 0 var(--space-2); }\n[data-vibe-menu] .vm-survey-text { flex: 1 1 auto; min-width: 0; }\n[data-vibe-menu] .vm-survey-label { font: 700 14px/1.3 var(--font-display); color: var(--ink); }\n[data-vibe-menu] .vm-survey-pitch { margin-top: var(--space-2); font: 400 13px/1.4 var(--font-display); color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }\n[data-vibe-menu] .vm-survey-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }\n/* The first build's picker: a two-by-two grid of large tiles, each with its name. */\n[data-vibe-menu] .vm-survey[data-presentation=\"filmstrip\"] { margin-top: var(--space-16); }\n[data-vibe-menu] .vm-survey[data-presentation=\"filmstrip\"] .vm-survey-head { margin-top: var(--space-12); margin-bottom: var(--space-12); }\n[data-vibe-menu] .vm-survey[data-presentation=\"filmstrip\"] .vm-survey-title { font-size: 17px; }\n[data-vibe-menu] .vm-survey[data-presentation=\"filmstrip\"] .vm-survey-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-12) var(--space-10); padding-right: 0; }\n@container vm-survey (max-width: 360px) { [data-vibe-menu] .vm-survey:not([data-presentation=\"filmstrip\"]) .vm-survey-aside { display: none; } }\n";
+export declare const SURVEY_TILE_MAX_PX = 300;
+export declare const SURVEY_STRIP_CSS: string;
 export declare function surveyMinLoaded(count: number): number;
+export declare function useCountdownDigit(endsAtMs: number | undefined): number | undefined;
 export declare function SurveyStrip(props: {
     readonly survey: CodeSurvey;
     readonly presentation?: "filmstrip";

package/components/vibe-menu/parts/SurveyStrip.js

@@ -1,4 +1,5 @@
 import * as React from "react";
+import { MENU_GEOMETRY } from "../geometry.js";
 export const SURVEY_COUNTDOWN_MS = 3000;
 export const SURVEY_COPY = Object.freeze({
     choosing: "Pick a look for your app",
@@ -16,6 +17,7 @@ export function surveyTileLabel(face, digit) {
         ? `${face.label}: ${face.pitch}`
         : `${face.label}: building this look in ${digit}. ${SURVEY_COPY.counting}.`;
 }
+export const SURVEY_TILE_MAX_PX = 300;
 export const SURVEY_STRIP_CSS = `
 /* Its own container: the aside steps out when the strip itself is narrow, on any host. */
 [data-vibe-menu] .vm-survey { margin: 0 0 var(--space-14); container: vm-survey / inline-size; }
@@ -50,12 +52,18 @@ export const SURVEY_STRIP_CSS = `
 [data-vibe-menu] .vm-survey[data-presentation="filmstrip"] .vm-survey-head { margin-top: var(--space-12); margin-bottom: var(--space-12); }
 [data-vibe-menu] .vm-survey[data-presentation="filmstrip"] .vm-survey-title { font-size: 17px; }
 [data-vibe-menu] .vm-survey[data-presentation="filmstrip"] .vm-survey-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-12) var(--space-10); padding-right: 0; }
+/* Past the phone width (owner report 2026-10-14) the 2×2 tiles ran ~400–600px and
+   pushed the card's tabs below the fold: the looks line up four wide, a quarter
+   of the strip each, never wider than ${SURVEY_TILE_MAX_PX}px however wide the card. */
+@container vm-survey (min-width: ${MENU_GEOMETRY.phoneMaxWidth + 1}px) {
+  [data-vibe-menu] .vm-survey[data-presentation="filmstrip"] .vm-survey-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: calc(4 * ${SURVEY_TILE_MAX_PX}px + 3 * var(--space-10)); }
+}
 @container vm-survey (max-width: 360px) { [data-vibe-menu] .vm-survey:not([data-presentation="filmstrip"]) .vm-survey-aside { display: none; } }
 `;
 export function surveyMinLoaded(count) {
     return Math.min(count, Math.max(3, count - 1));
 }
-function useCountdownDigit(endsAtMs) {
+export function useCountdownDigit(endsAtMs) {
     const [digit, setDigit] = React.useState(undefined);
     React.useLayoutEffect(() => {
         if (endsAtMs === undefined)

package/components/vibe-menu/parts/SurveyStrip.js.map

@@ -1 +1 @@
-{"version":3,"file":"SurveyStrip.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/SurveyStrip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsE/B,MAAM,CAAC,MAAM,mBAAmB,GAAG,IAAI,CAAC;AAExC,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC;IACvC,QAAQ,EAAE,0BAA0B;IACpC,KAAK,EAAE,8BAA8B;IACrC,QAAQ,EAAE,qBAAqB;IAC/B,MAAM,EAAE,uBAAuB;IAC/B,MAAM,EAAE,gBAAgB;CAChB,CAAC,CAAC;AAGZ,MAAM,UAAU,oBAAoB,CAAC,MAAc;IACjD,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACrD,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;AAChE,CAAC;AAGD,MAAM,UAAU,eAAe,CAAC,IAAgB,EAAE,KAAyB;IACzE,OAAO,KAAK,KAAK,SAAS;QACxB,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,EAAE;QAChC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,2BAA2B,KAAK,KAAK,WAAW,CAAC,QAAQ,GAAG,CAAC;AAChF,CAAC;AAGD,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmC/B,CAAC;AAIF,MAAM,UAAU,eAAe,CAAC,KAAa;IAC3C,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;AACjD,CAAC;AAID,SAAS,iBAAiB,CAAC,QAA4B;IACrD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAoE,SAAS,CAAC,CAAC;IACvH,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,IAAI,QAAQ,KAAK,SAAS;YAAE,OAAO;QACnC,IAAI,KAAgD,CAAC;QACrD,MAAM,IAAI,GAAG,GAAS,EAAE;YACtB,MAAM,IAAI,GAAG,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;YACnC,QAAQ,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,oBAAoB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAC1D,IAAI,IAAI,GAAG,CAAC;gBAAE,KAAK,GAAG,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,IAAI,IAAI,CAAC,CAAC;QAC9D,CAAC,CAAC;QACF,IAAI,EAAE,CAAC;QACP,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IACf,IAAI,QAAQ,KAAK,SAAS;QAAE,OAAO,SAAS,CAAC;IAC7C,OAAO,KAAK,EAAE,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,mBAAmB,CAAC,CAAC;AAChG,CAAC;AAED,SAAS,eAAe,CAAC,KAA2E;IAClG,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;IAC5E,MAAM,SAAS,GAAG,KAAK,CAAC,YAAY,KAAK,WAAW,CAAC;IACrD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAsB,GAAG,EAAE,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;IACjF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAsB,GAAG,EAAE,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;IAGnF,MAAM,MAAM,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAGnE,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAClE,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,IAAI,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;IAC7G,MAAM,OAAO,GAAG,OAAO,IAAI,MAAM,CAAC;IAElC,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IACzC,UAAU,CAAC,OAAO,GAAG,OAAO,CAAC;IAC7B,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QAGnB,IAAI,OAAO;YAAE,UAAU,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;IAG3B,MAAM,MAAM,GAAG,QAAQ,KAAK,SAAS,CAAC;IACtC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA6B,SAAS,CAAC,CAAC;IAC5E,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IACvC,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,MAAM,IAAI,GAAG,KAAK,SAAS;YAAE,OAAO;QACxC,MAAM,KAAK,GAAG,UAAU,CACtB,GAAG,EAAE;YACH,MAAM,CAAC,SAAS,CAAC,CAAC;YAClB,SAAS,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,EACD,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CACvC,CAAC;QACF,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IAClB,MAAM,MAAM,GAAG,MAAM,KAAK,SAAS,CAAC;IACpC,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC;IAC3E,MAAM,KAAK,GAAG,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAEpD,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IACzB,MAAM,KAAK,GAAG,MAAM,KAAK,SAAS,IAAI,MAAM,CAAC;IAC7C,MAAM,QAAQ,GAAG,MAAM,IAAI,QAAQ,EAAE,KAAK,CAAC;IAC3C,MAAM,IAAI,GAAG,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAClE,MAAM,GAAG,GAAG,CAAC,CAAS,EAAQ,EAAE;QAC9B,IAAI,MAAM,IAAI,CAAC,KAAK;YAAE,OAAO;QAC7B,IAAI,QAAQ,EAAE,KAAK,KAAK,CAAC,EAAE,CAAC;YAC1B,IAAI,MAAM;gBAAE,QAAQ,EAAE,EAAE,CAAC;;gBACpB,MAAM,CAAC,SAAS,CAAC,CAAC;QACzB,CAAC;aAAM,IAAI,MAAM;YAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;;YAC1B,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,mBAAmB,EAAE,CAAC,CAAC;IACxE,CAAC,CAAC;IACF,MAAM,IAAI,GACR,QAAQ,KAAK,SAAS,IAAI,IAAI,KAAK,SAAS;QAC1C,CAAC,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC;QAC9B,CAAC,CAAC,MAAM,IAAI,IAAI,KAAK,SAAS;YAC5B,CAAC,CAAC,GAAG,WAAW,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,GAAG;YACzC,CAAC,CAAC,EAAE,CAAC;IACX,OAAO,CACL,iCACE,SAAS,EAAC,WAAW,uBACF,KAAK,CAAC,YAAY,EACrC,MAAM,EAAE,CAAC,OAAO,iBACH,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,gBAAgB,iBAC3C,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,mBACrB,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,mBACvC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,gBAC1C,WAAW,CAAC,MAAM;QAE9B,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,8BAAM,SAAS,EAAC,iBAAiB,IAAE,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAQ;YAC5F,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACf,8BAAM,SAAS,EAAC,iBAAiB,IAAE,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAQ,CAC7G,CACG;QACN,6BAAK,SAAS,EAAC,iBAAiB,EAAC,IAAI,EAAC,YAAY,gBAAa,WAAW,CAAC,QAAQ,gBAAc,IAAI,CAAC,MAAM,IACzG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;YACd,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,CAAe,CAAC;YACjC,MAAM,EAAE,GAAG,QAAQ,KAAK,CAAC,CAAC;YAC1B,MAAM,KAAK,GAAG,QAAQ,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;YACxD,OAAO,CACL,6BAAK,GAAG,EAAE,CAAC,EAAE,SAAS,EAAC,gBAAgB,aAAU,EAAE;gBACjD,gCACE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,kBACE,EAAE,gBACJ,eAAe,CAAC,CAAC,EAAE,KAAK,CAAC,mBACtB,MAAM,IAAI,CAAC,KAAK,EAC/B,SAAS,EAAC,gBAAgB,aACjB,EAAE,EACX,OAAO,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;oBAErB,6BACE,SAAS,EAAC,eAAe,EACzB,GAAG,EAAE,CAAC,CAAC,GAAG,EACV,GAAG,EAAC,EAAE,EACN,SAAS,EAAE,KAAK,EAChB,MAAM,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EAC9E,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,GAChF;oBACD,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC5B,8BAAM,SAAS,EAAC,iBAAiB,iBAAa,kBAAkB,iBAAa,MAAM;wBACjF,2BAAG,GAAG,EAAE,KAAK,IAAG,KAAK,CAAK,CACrB,CACR,CACM;gBACR,SAAS,CAAC,CAAC,CAAC,6BAAK,SAAS,EAAC,eAAe,IAAE,CAAC,CAAC,KAAK,CAAO,CAAC,CAAC,CAAC,IAAI,CAC9D,CACP,CAAC;QACJ,CAAC,CAAC,CACE;QACL,SAAS,IAAI,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACxC,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,6BAAK,SAAS,EAAC,gBAAgB;gBAC7B,6BAAK,SAAS,EAAC,iBAAiB,IAAE,IAAI,CAAC,KAAK,CAAO;gBACnD,6BAAK,SAAS,EAAC,iBAAiB,IAAE,IAAI,CAAC,KAAK,CAAO,CAC/C,CACF,CACP;QACD,8BAAM,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,QAAQ,eAAW,QAAQ,IAC9D,IAAI,CACA,CACC,CACX,CAAC;AACJ,CAAC;AAID,MAAM,UAAU,WAAW,CAAC,KAG3B;IACC,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IAClD,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,SAAS,CAAC;QAAE,OAAO,IAAI,CAAC;IAC5E,OAAO,oBAAC,eAAe,IAAC,GAAG,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,YAAY,GAAI,CAAC;AACpI,CAAC"}
+{"version":3,"file":"SurveyStrip.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/SurveyStrip.tsx"],"names":[],"mappings":"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"}

package/components/vibe-menu/parts/agent-log-frame.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+export interface AgentLogFrame {
+    readonly tail?: React.ReactNode;
+    readonly fallback?: React.ReactNode;
+    readonly compact?: boolean;
+}
+export declare const AgentLogFrameContext: React.Context<AgentLogFrame>;
+export declare function useAgentLogFrame(): AgentLogFrame;
+export declare function AgentLogFallback(): React.ReactElement | null;

package/components/vibe-menu/parts/agent-log-frame.js

@@ -0,0 +1,10 @@
+import * as React from "react";
+export const AgentLogFrameContext = React.createContext({});
+export function useAgentLogFrame() {
+    return React.useContext(AgentLogFrameContext);
+}
+export function AgentLogFallback() {
+    const frame = useAgentLogFrame();
+    return frame.fallback === undefined ? null : React.createElement(React.Fragment, null, frame.fallback);
+}
+//# sourceMappingURL=agent-log-frame.js.map

package/components/vibe-menu/parts/agent-log-frame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"agent-log-frame.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/agent-log-frame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,MAAM,CAAC,MAAM,oBAAoB,GAAG,KAAK,CAAC,aAAa,CAAgB,EAAE,CAAC,CAAC;AAE3E,MAAM,UAAU,gBAAgB;IAC9B,OAAO,KAAK,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC;AAChD,CAAC;AAGD,MAAM,UAAU,gBAAgB;IAC9B,MAAM,KAAK,GAAG,gBAAgB,EAAE,CAAC;IACjC,OAAO,KAAK,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,0CAAG,KAAK,CAAC,QAAQ,CAAI,CAAC;AACrE,CAAC"}

package/components/vibe-menu/parts/use-composer-draft.js

@@ -10,9 +10,16 @@ export function useComposerDraft(input) {
     const [queued, setQueued] = React.useState([]);
     const [flushAttempt, setFlushAttempt] = React.useState(0);
     const attachments = useAttachments();
+    const submittedRender = React.useRef(false);
+    const pendingSubmit = React.useRef(undefined);
+    React.useLayoutEffect(() => {
+        submittedRender.current = false;
+    });
     const prevResetKey = React.useRef(resetKey);
     if (prevResetKey.current !== resetKey) {
         prevResetKey.current = resetKey;
+        submittedRender.current = false;
+        pendingSubmit.current = undefined;
         setText("");
         setQueued([]);
         setFlushAttempt(0);
@@ -36,6 +43,14 @@ export function useComposerDraft(input) {
         seedSeq.current = seed.seq;
         setText((d) => (d === "" ? seed.text : d));
     }, [seed]);
+    const refill = composer.rewrite?.refill;
+    const refillSeq = React.useRef(undefined);
+    React.useEffect(() => {
+        if (refill === undefined || refill.seq === refillSeq.current)
+            return;
+        refillSeq.current = refill.seq;
+        setText((d) => (d === "" ? refill.text : d));
+    }, [refill]);
     const building = composer.cap === "Stop";
     const { sendsNow } = composer;
     const onSubmitRef = React.useRef(composer.onSubmit);
@@ -62,6 +77,10 @@ export function useComposerDraft(input) {
         return () => clearTimeout(timer);
     }, [building, sendsNow, queued, flushAttempt]);
     function submit() {
+        if (submittedRender.current === true || pendingSubmit.current !== undefined) {
+            composer.onSendBlocked?.("busy");
+            return false;
+        }
         const trimmed = text.trim();
         const ready = attachments.readyAttachments;
         if (attachments.busy === true) {
@@ -78,17 +97,28 @@ export function useComposerDraft(input) {
                 composer.onSendBlocked?.("busy");
                 return false;
             }
+            submittedRender.current = true;
             setQueued([...queued, trimmed]);
             setText("");
             return true;
         }
         const fileText = ready.length === 1 ? ONE_FILE_TEXT : MANY_FILES_TEXT;
         const message = trimmed === "" ? fileText : trimmed;
+        submittedRender.current = true;
         const answer = composer.onSubmit(message, ready);
         if (answer === false) {
+            submittedRender.current = false;
             composer.onSendBlocked?.("other");
             return false;
         }
+        if (answer !== undefined && typeof answer !== "boolean") {
+            pendingSubmit.current = answer;
+            function release() {
+                if (pendingSubmit.current === answer)
+                    pendingSubmit.current = undefined;
+            }
+            void answer.then(release, release);
+        }
         attachments.clear();
         setText("");
         return true;

package/components/vibe-menu/parts/use-composer-draft.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-composer-draft.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/use-composer-draft.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"use-composer-draft.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/use-composer-draft.ts"],"names":[],"mappings":"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"}

package/components/vibe-menu/shell/shell.styles.js

@@ -1,4 +1,4 @@
-import { MENU_GEOMETRY, MENU_TOP_RESERVE_VAR } from "../geometry.js";
+import { MENU_FULL_TABS_MIN_WIDTH, MENU_GEOMETRY, MENU_INLINE_TAB_LABELS_MIN_WIDTH, MENU_TOP_RESERVE_VAR } from "../geometry.js";
 import { MOTION } from "../motion.js";
 const G = MENU_GEOMETRY;
 export const VIBE_MENU_SHELL_CSS = `
@@ -29,7 +29,11 @@ export const VIBE_MENU_SHELL_CSS = `
   --vm-pill-w: ${G.pillW}px;
   --vm-pill-h: ${G.pillH}px;
   --vm-bar-h: ${G.barH}px;
-  --vm-tab-w: ${G.tabW}px;
+  /* Fluid between the phone breakpoint and wide desktop: the tabs give up width
+     until the whole bar (and the card, which is the bar's width) fits between
+     the frame's edges, so neither ever runs off the left of the screen. At
+     full size it is exactly ${G.tabW}px; phones override the bar entirely. */
+  --vm-tab-w: min(${G.tabW}px, calc((100cqw - 2 * var(--vm-edge) - var(--vm-home-extra) - 2 * var(--vm-bar-end) - 2px) / 4));
   --vm-tab-inset: 9px; /* space-9: the bar's rhythm */
   --vm-home-extra: ${G.homeExtra}px;
   --vm-band: ${G.band}px;
@@ -270,6 +274,16 @@ export const VIBE_MENU_SHELL_CSS = `
   font: 600 11px/18px var(--font-tab);
   letter-spacing: 0;
 }
+/* Importing: the same pill, working, its tap waiting on the data. */
+.vm-layer .vm-chip-row .vm-chip-pill[data-chip="examplesCleared"][data-busy] {
+  cursor: progress;
+  animation: vm-chip-busy 1.6s ease-in-out infinite;
+}
+@keyframes vm-chip-busy {
+  50% {
+    opacity: 0.6;
+  }
+}
 .vm-layer .vm-chip-row .vm-chip-more {
   background: var(--ink);
   color: var(--card-bg);
@@ -590,6 +604,60 @@ export const VIBE_MENU_SHELL_CSS = `
     max-height: min(560px, 70cqh, var(--vm-frame-limit));
   }
 }
+/* ---------- between the phone and full desktop: the tabs give up width ----------
+   Past the phone breakpoint the bar keeps its desktop shape but its tabs are
+   fluid (--vm-tab-w). Below MENU_INLINE_TAB_LABELS_MIN_WIDTH
+   (${MENU_INLINE_TAB_LABELS_MIN_WIDTH}px) a 14px label no longer fits beside its
+   icon, so they stack the icon over the phone's small label instead. The phone
+   block above still owns everything at or below ${G.phoneMaxWidth}px; this band
+   starts one pixel past it. */
+@container (min-width: ${G.phoneMaxWidth + 1}px) and (max-width: ${MENU_INLINE_TAB_LABELS_MIN_WIDTH - 0.02}px) {
+  .vm-layer .vm-tab {
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 2px;
+    padding: 4px 2px;
+  }
+  .vm-layer .vm-tab-circle {
+    width: 22px;
+    height: 22px;
+  }
+  .vm-layer .vm-tab[data-section="home"] {
+    padding: 4px 2px 4px calc(2px + var(--vm-home-extra));
+  }
+  .vm-layer .vm-tab[data-section="share"] {
+    padding-right: var(--vm-bar-end);
+  }
+  .vm-layer .vm-tab-label {
+    position: static;
+    display: block;
+    font-size: 9.6px;
+    letter-spacing: 1px;
+    white-space: nowrap;
+    padding: 0 0 0 1px;
+  }
+  .vm-layer .vm-tab svg {
+    width: 12px;
+    height: 12px;
+  }
+}
+/* From MENU_INLINE_TAB_LABELS_MIN_WIDTH to full desktop the tabs keep the
+   desktop's 14px label inline with the icon. Centred over the whole tab (the
+   desktop rule) ACCOUNT would run into its icon below ~818px, so two flex
+   spacers share the slack: the label sits centred while there's room, and the
+   left spacer's floor holds it clear of the icon by the gap it has at full
+   size (9.5px with the label's own 1.9px pad). */
+@container (min-width: ${MENU_INLINE_TAB_LABELS_MIN_WIDTH}px) and (max-width: ${MENU_FULL_TABS_MIN_WIDTH - 0.02}px) {
+  .vm-layer .vm-tab-label::before,
+  .vm-layer .vm-tab-label::after {
+    content: "";
+    flex: 1 1 0;
+  }
+  .vm-layer .vm-tab-label::before {
+    min-width: calc(var(--vm-tab-inset) + var(--size-icon-circle) + 7.5px);
+  }
+}
 @container (max-width: ${G.narrowMaxWidth}px) {
   .vm-layer .vm-tab-label {
     position: absolute;
@@ -611,5 +679,14 @@ export const VIBE_MENU_SHELL_CSS = `
 .vm-layer[data-reduced-motion="true"] .vm-menu *::before {
   transition: none !important;
 }
+/* The importing chip holds still; its words say it is working. */
+@media (prefers-reduced-motion: reduce) {
+  .vm-layer .vm-chip-row .vm-chip-pill[data-busy] {
+    animation: none;
+  }
+}
+.vm-layer[data-reduced-motion="true"] .vm-chip-row .vm-chip-pill[data-busy] {
+  animation: none;
+}
 `;
 //# sourceMappingURL=shell.styles.js.map

package/components/vibe-menu/shell/shell.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"shell.styles.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/shell/shell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAYtC,MAAM,CAAC,GAAG,aAAa,CAAC;AAExB,MAAM,CAAC,MAAM,mBAAmB,GAAG;;;;;;;;;;;;;;;;;;;;;;;eAuBpB,CAAC,CAAC,WAAW;eACb,CAAC,CAAC,IAAI;iBACJ,CAAC,CAAC,KAAK;iBACP,CAAC,CAAC,KAAK;gBACR,CAAC,CAAC,IAAI;gBACN,CAAC,CAAC,IAAI;;qBAED,CAAC,CAAC,SAAS;eACjB,CAAC,CAAC,IAAI;0BACK,CAAC,CAAC,aAAa;;;;;;;;;;;;;qGAa4D,oBAAoB;;kBAEvG,MAAM,CAAC,MAAM;mBACZ,MAAM,CAAC,OAAO;oBACb,MAAM,CAAC,QAAQ;qBACd,MAAM,CAAC,SAAS;qBAChB,MAAM,CAAC,cAAc;oBACtB,MAAM,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBA6dV,CAAC,CAAC,aAAa;;iBAEvB,CAAC,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBA0DH,CAAC,CAAC,cAAc;;;;;;;;;;;;;;;;;;;;;CAqBxC,CAAC"}
+{"version":3,"file":"shell.styles.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/shell/shell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,aAAa,EAAE,gCAAgC,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACjI,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAYtC,MAAM,CAAC,GAAG,aAAa,CAAC;AAExB,MAAM,CAAC,MAAM,mBAAmB,GAAG;;;;;;;;;;;;;;;;;;;;;;;eAuBpB,CAAC,CAAC,WAAW;eACb,CAAC,CAAC,IAAI;iBACJ,CAAC,CAAC,KAAK;iBACP,CAAC,CAAC,KAAK;gBACR,CAAC,CAAC,IAAI;;;;+BAIS,CAAC,CAAC,IAAI;oBACjB,CAAC,CAAC,IAAI;;qBAEL,CAAC,CAAC,SAAS;eACjB,CAAC,CAAC,IAAI;0BACK,CAAC,CAAC,aAAa;;;;;;;;;;;;;qGAa4D,oBAAoB;;kBAEvG,MAAM,CAAC,MAAM;mBACZ,MAAM,CAAC,OAAO;oBACb,MAAM,CAAC,QAAQ;qBACd,MAAM,CAAC,SAAS;qBAChB,MAAM,CAAC,cAAc;oBACtB,MAAM,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAueV,CAAC,CAAC,aAAa;;iBAEvB,CAAC,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA6DtB,gCAAgC;;mDAEa,CAAC,CAAC,aAAa;;yBAEzC,CAAC,CAAC,aAAa,GAAG,CAAC,uBAAuB,gCAAgC,GAAG,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAqCjF,gCAAgC,uBAAuB,wBAAwB,GAAG,IAAI;;;;;;;;;;yBAUtF,CAAC,CAAC,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BxC,CAAC"}

package/components/vibe-menu/slices.d.ts

@@ -11,7 +11,7 @@ import type { AgentLogLine } from "./parts/MomentLine.js";
 import type { ComposerSlice } from "./parts/Composer.js";
 import type { SuggestionFastPath } from "./parts/Chip.js";
 import type { CodeSurvey } from "./parts/SurveyStrip.js";
-import type { StatusChipId } from "./parts/StatusChipRow.js";
+import type { ExamplesChipPhase, StatusChipId } from "./parts/StatusChipRow.js";
 export type Posture = AccessPosture;
 export type DataGrant = GrantData;
 export type RosterMember = MemberRowMember;
@@ -72,7 +72,7 @@ export interface CodeSlice {
     log: readonly AgentLogLine[];
     suggestions: readonly string[];
     goldSuggestion: string | null;
-    onSuggestion(text: string): void;
+    onSuggestion(text: string): unknown;
     suggestionFastPaths: readonly SuggestionFastPath[] | null;
     onToggleFastPath: ((text: string) => void) | null;
     kicker: string;
@@ -221,12 +221,12 @@ export interface VibeMenuProps {
         saveAsk?: boolean;
         examplesCleared?: {
             onTap(): void;
+            readonly phase?: ExamplesChipPhase;
         } | null;
         hidden?: readonly StatusChipId[];
         onHide?(id: StatusChipId): void;
     };
     closedStatus: ReactNode;
-    logOpenSeq?: number;
     onHome(): void;
     homeHref: string;
     myVibesHref: string;
@@ -247,7 +247,6 @@ export interface VibeMenuProps {
     frame?: "viewport" | "contained";
     reducedMotion?: boolean;
     homeTabRow?: boolean;
-    firstBuild?: boolean;
     settledAtMount?: boolean;
 }
 export interface CardNav {

package/components/vibe-menu/slices.js.map

@@ -1 +1 @@
-{"version":3,"file":"slices.js","sourceRoot":"","sources":["../../../jsr/components/vibe-menu/slices.ts"],"names":[],"mappings":"AAyVA,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,CAAC;IAC7C,UAAU,EAAE,qDAAqD;IACjE,eAAe,EAAE,sDAAsD;CAC/D,CAAC,CAAC"}
+{"version":3,"file":"slices.js","sourceRoot":"","sources":["../../../jsr/components/vibe-menu/slices.ts"],"names":[],"mappings":"AAsVA,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,CAAC;IAC7C,UAAU,EAAE,qDAAqD;IACjE,eAAe,EAAE,sDAAsD;CAC/D,CAAC,CAAC"}

package/components/vibe-menu/vibe-menu.styles.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-export declare const VIBE_MENU_LIGHT_VARS = "\n  color-scheme: light;\n  --section-home: oklch(76.02% 0.1832 146.61);\n  --section-account: oklch(57.46% 0.2126 29.55);\n  --section-code: oklch(89.78% 0.1857 98.22);\n  --section-share: oklch(64.39% 0.1304 231.41);\n  --vibes-black: #000000;\n  --vibes-cream: #fffff0;\n  --menu-ink: #1a1a1a;\n  --card-bg: var(--vibes-cream);\n  --ink: #111111;\n  --muted: #555555;\n  --line: #111111;\n  --line-card: #111111;\n  --line-hairline: #1111112e;\n  --placeholder: var(--muted);\n  --suggest-border: #11111173;\n  --share-tint: #009ace1f;\n  --share-tint-strong: #009ace40;\n  --on-home: var(--menu-ink);\n  --on-account: var(--vibes-cream);\n  --on-code: var(--menu-ink);\n  --on-share: var(--menu-ink);\n  --badge: var(--section-account);\n  --on-badge: var(--vibes-cream);\n  --obsidian-fill: rgba(6, 9, 10, 0.94);\n  --obsidian-edge: rgba(255, 255, 255, 0.17);\n  --obsidian-highlight: rgba(255, 255, 255, 0.32);\n  --obsidian-rim: rgba(255, 255, 255, 0.1);\n  --font-display: \"Alte Haas Grotesk\", Inter, sans-serif;\n  --font-tab: Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif;\n  --space-9: 9px;\n  --space-2: 2px;\n  --space-4: 4px;\n  --space-6: 6px;\n  --space-8: 8px;\n  --space-10: 10px;\n  --space-12: 12px;\n  --space-14: 14px;\n  --space-16: 16px;\n  --space-18: 18px;\n  --space-24: 24px;\n  --radius-card: 16px;\n  --radius-full: 999px;\n  --radius-bar-end: 25px;\n  --radius-access-line: 24px;\n  --radius-input: 22px;\n  --radius-done: 21px;\n  --radius-copy: 18px;\n  --radius-chip: 14px;\n  --radius-moment: 12px;\n  --radius-switch: 10px;\n  --radius-meter: 7px;\n  --obsidian-shadow: 0 2px 5px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.16), inset 0 -1px 0 rgba(255, 255, 255, 0.05), inset 0 0 12px rgba(255, 255, 255, 0.02);\n  --swatch-selected: 0 0 0 2px #fffff0, 0 0 0 4px #111111;\n  --stroke-rule: 2px;\n  --stroke-hairline: 1px;\n  --stroke-mini: 1.5px;\n  --stroke-focus: 3px;\n  --stroke-glyph: 2.4px;\n  --size-icon-circle: 28px;\n  --size-icon-circle-phone: 22px;\n  --size-glyph: 14px;\n  --size-glyph-cta: 20px;\n  --size-bar: 50px;\n  --size-tab: 176px;\n  --size-home-extra: 14px;\n  --size-bar-end: 63px;\n  --size-pill-w: 120px;\n  --size-pill-h: 44px;\n  --size-ring: 3px;\n  --size-edge: 24px;\n  --size-edge-phone: 16px;\n  --size-pill-flat-inset: 19px;\n  --size-band: 8px;\n  --size-row: 46px;\n  --size-row-compact: 42px;\n  --size-chip: 28px;\n  --size-copy: 36px;\n  --size-input: 44px;\n  --size-composer: 58px;\n  --size-access-line: 48px;\n  --size-segment: 32px;\n  --size-segment-mini: 24px;\n  --size-switch-w: 36px;\n  --size-meter: 14px;\n  --size-card-max: 480px;\n  --size-card-max-phone: 560px;\n  --size-log-max: 160px;\n  --size-code-mode-max-w: 1200px;\n  --opacity-tab-inactive: 0.73;\n  --opacity-row-disabled: 0.35;";
-export declare const VIBE_MENU_DARK_VARS = "\n  color-scheme: dark;\n  --card-bg: #1a1a1a;\n  --ink: #e0e0e0;\n  --muted: #a3a3a3;\n  --line-card: #e0e0e0;\n  --line-hairline: #e0e0e02e;\n  --suggest-border: #e0e0e073;\n  --swatch-selected: 0 0 0 2px #1a1a1a, 0 0 0 4px #e0e0e0;";
-export declare const VIBE_MENU_CSS = "\n/* ---------- tokens (tokens.json), light, then both dark arms ----------\n   Detached layers (portalled out of the menu root) carry\n   data-vibe-menu-detached, so every token block lists them too. */\n[data-vibe-menu],\n[data-vibe-menu-detached] {\n  color-scheme: light;\n  --section-home: oklch(76.02% 0.1832 146.61);\n  --section-account: oklch(57.46% 0.2126 29.55);\n  --section-code: oklch(89.78% 0.1857 98.22);\n  --section-share: oklch(64.39% 0.1304 231.41);\n  --vibes-black: #000000;\n  --vibes-cream: #fffff0;\n  --menu-ink: #1a1a1a;\n  --card-bg: var(--vibes-cream);\n  --ink: #111111;\n  --muted: #555555;\n  --line: #111111;\n  --line-card: #111111;\n  --line-hairline: #1111112e;\n  --placeholder: var(--muted);\n  --suggest-border: #11111173;\n  --share-tint: #009ace1f;\n  --share-tint-strong: #009ace40;\n  --on-home: var(--menu-ink);\n  --on-account: var(--vibes-cream);\n  --on-code: var(--menu-ink);\n  --on-share: var(--menu-ink);\n  --badge: var(--section-account);\n  --on-badge: var(--vibes-cream);\n  --obsidian-fill: rgba(6, 9, 10, 0.94);\n  --obsidian-edge: rgba(255, 255, 255, 0.17);\n  --obsidian-highlight: rgba(255, 255, 255, 0.32);\n  --obsidian-rim: rgba(255, 255, 255, 0.1);\n  --font-display: \"Alte Haas Grotesk\", Inter, sans-serif;\n  --font-tab: Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif;\n  --space-9: 9px;\n  --space-2: 2px;\n  --space-4: 4px;\n  --space-6: 6px;\n  --space-8: 8px;\n  --space-10: 10px;\n  --space-12: 12px;\n  --space-14: 14px;\n  --space-16: 16px;\n  --space-18: 18px;\n  --space-24: 24px;\n  --radius-card: 16px;\n  --radius-full: 999px;\n  --radius-bar-end: 25px;\n  --radius-access-line: 24px;\n  --radius-input: 22px;\n  --radius-done: 21px;\n  --radius-copy: 18px;\n  --radius-chip: 14px;\n  --radius-moment: 12px;\n  --radius-switch: 10px;\n  --radius-meter: 7px;\n  --obsidian-shadow: 0 2px 5px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.16), inset 0 -1px 0 rgba(255, 255, 255, 0.05), inset 0 0 12px rgba(255, 255, 255, 0.02);\n  --swatch-selected: 0 0 0 2px #fffff0, 0 0 0 4px #111111;\n  --stroke-rule: 2px;\n  --stroke-hairline: 1px;\n  --stroke-mini: 1.5px;\n  --stroke-focus: 3px;\n  --stroke-glyph: 2.4px;\n  --size-icon-circle: 28px;\n  --size-icon-circle-phone: 22px;\n  --size-glyph: 14px;\n  --size-glyph-cta: 20px;\n  --size-bar: 50px;\n  --size-tab: 176px;\n  --size-home-extra: 14px;\n  --size-bar-end: 63px;\n  --size-pill-w: 120px;\n  --size-pill-h: 44px;\n  --size-ring: 3px;\n  --size-edge: 24px;\n  --size-edge-phone: 16px;\n  --size-pill-flat-inset: 19px;\n  --size-band: 8px;\n  --size-row: 46px;\n  --size-row-compact: 42px;\n  --size-chip: 28px;\n  --size-copy: 36px;\n  --size-input: 44px;\n  --size-composer: 58px;\n  --size-access-line: 48px;\n  --size-segment: 32px;\n  --size-segment-mini: 24px;\n  --size-switch-w: 36px;\n  --size-meter: 14px;\n  --size-card-max: 480px;\n  --size-card-max-phone: 560px;\n  --size-log-max: 160px;\n  --size-code-mode-max-w: 1200px;\n  --opacity-tab-inactive: 0.73;\n  --opacity-row-disabled: 0.35;\n}\n@media (prefers-color-scheme: dark) {\n  [data-vibe-menu],\n  [data-vibe-menu-detached] {\n  color-scheme: dark;\n  --card-bg: #1a1a1a;\n  --ink: #e0e0e0;\n  --muted: #a3a3a3;\n  --line-card: #e0e0e0;\n  --line-hairline: #e0e0e02e;\n  --suggest-border: #e0e0e073;\n  --swatch-selected: 0 0 0 2px #1a1a1a, 0 0 0 4px #e0e0e0;\n  }\n}\n.dark [data-vibe-menu],\n.dark [data-vibe-menu-detached] {\n  color-scheme: dark;\n  --card-bg: #1a1a1a;\n  --ink: #e0e0e0;\n  --muted: #a3a3a3;\n  --line-card: #e0e0e0;\n  --line-hairline: #e0e0e02e;\n  --suggest-border: #e0e0e073;\n  --swatch-selected: 0 0 0 2px #1a1a1a, 0 0 0 4px #e0e0e0;\n}\n\n/* ---------- the root: the phone container ---------- */\n[data-vibe-menu] {\n  container-name: vibe-menu;\n  container-type: inline-size;\n  color: var(--ink);\n  font-family: var(--font-display);\n}\n\n/* Scrollbars (smoke F15): thin, in the menu's hairline, both themes, never the\n   native dark bar inside the cream card. The colour is set on the root AND\n   every descendant, for every scroller the menu hosts (drills, the Embed box,\n   injected panels): the app's global sheet sets scrollbar-color on *, which\n   beats a colour only inherited from the root. The width rule has zero\n   specificity so a part that hides its bar (the Code mode tab strip) still\n   wins. The webkit arm is for engines without the standard properties; Chrome\n   ignores it once they are set. */\n[data-vibe-menu],\n[data-vibe-menu] *,\n[data-vibe-menu-detached],\n[data-vibe-menu-detached] * {\n  scrollbar-color: var(--line-hairline) transparent;\n}\n:where([data-vibe-menu]),\n:where([data-vibe-menu]) :where(*) {\n  scrollbar-width: thin;\n}\n:where([data-vibe-menu]) ::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n  background: transparent;\n}\n:where([data-vibe-menu]) ::-webkit-scrollbar-thumb {\n  border-radius: var(--radius-full);\n  background: var(--line-hairline);\n}\n\n/* A section is set by data-section on any ancestor (or the root), using the\n   code keys: home | settings (Account) | vibe (Code) | share. It sets --accent\n   (the section colour) and --on-accent (its label colour). */\n[data-vibe-menu][data-section=\"home\"],\n[data-vibe-menu] [data-section=\"home\"] {\n  --accent: var(--section-home);\n  --on-accent: var(--on-home);\n}\n[data-vibe-menu][data-section=\"settings\"],\n[data-vibe-menu] [data-section=\"settings\"] {\n  --accent: var(--section-account);\n  --on-accent: var(--on-account);\n}\n[data-vibe-menu][data-section=\"vibe\"],\n[data-vibe-menu] [data-section=\"vibe\"] {\n  --accent: var(--section-code);\n  --on-accent: var(--on-code);\n}\n[data-vibe-menu][data-section=\"share\"],\n[data-vibe-menu] [data-section=\"share\"] {\n  --accent: var(--section-share);\n  --on-accent: var(--on-share);\n}\n\n[data-vibe-menu],\n[data-vibe-menu] * {\n  box-sizing: border-box;\n}\n/* the card's surface and side padding, so rows can bleed edge to edge */\n[data-vibe-menu] .vm-card-body {\n  position: relative;\n  padding: var(--space-14) var(--space-16) var(--space-16);\n  background: var(--card-bg);\n  color: var(--ink);\n  font: 400 14px/20px var(--font-display);\n}\n[data-vibe-menu] .vm-card-body.is-framed {\n  border: var(--stroke-rule) solid var(--line);\n  border-radius: var(--radius-card) var(--radius-card) 0 0;\n  overflow: hidden;\n}\n\n/* ---------- shared ---------- */\n/* Zero specificity: every vm-* rule wins over it, and so does any utility\n   class on content a host injects into the card (slots). */\n:where([data-vibe-menu]) :where(button) {\n  font: inherit;\n  color: inherit;\n  background: none;\n  border: 0;\n  padding: 0;\n  cursor: pointer;\n  text-align: left;\n  touch-action: manipulation;\n}\n[data-vibe-menu] .vm-glyph {\n  width: var(--size-glyph);\n  height: var(--size-glyph);\n  fill: none;\n  stroke: currentColor;\n  stroke-width: var(--stroke-glyph);\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  flex: none;\n}\n[data-vibe-menu] .vm-label,\n[data-vibe-menu] .vm-seg button,\n[data-vibe-menu] .vm-chip {\n  font: 700 14px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n[data-vibe-menu] .vm-label.is-plain {\n  font: 700 16px/1.1 var(--font-display);\n  letter-spacing: 0;\n  text-transform: none;\n}\n[data-vibe-menu] .vm-kicker,\n[data-vibe-menu] .vm-subhead {\n  margin: 0 0 var(--space-8);\n  font: 700 10.5px/1.3 var(--font-tab);\n  letter-spacing: 0.14em;\n  text-transform: uppercase;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-subhead {\n  margin: var(--space-16) 0 0;\n  padding-bottom: var(--space-8);\n}\n[data-vibe-menu] .vm-sub {\n  margin: var(--space-8) 0 var(--space-14);\n  font-size: 13px;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-app-name {\n  white-space: nowrap;\n}\n/* ---------- SectionStrip: the bar ---------- */\n[data-vibe-menu] .vm-menu {\n  position: relative;\n}\n[data-vibe-menu] .vm-strip {\n  position: relative;\n  width: calc(var(--size-tab) * 4 + var(--size-home-extra) + var(--size-bar-end) + 2px);\n  height: var(--size-bar);\n}\n[data-vibe-menu] .vm-strip-slide {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: flex-end;\n  border: var(--stroke-rule) solid var(--line);\n  border-right: 0;\n  border-radius: var(--bar-tl, var(--radius-bar-end)) 0 0 var(--radius-bar-end);\n  overflow: hidden;\n  background: var(--card-bg);\n}\n[data-vibe-menu] .vm-tab {\n  position: relative;\n  width: var(--size-tab);\n  flex: none;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  border: 0;\n  padding: 0 0 0 var(--space-9);\n  cursor: pointer;\n  background: var(--accent);\n}\n[data-vibe-menu] .vm-tab-circle {\n  width: var(--size-icon-circle);\n  height: var(--size-icon-circle);\n  border-radius: 50%;\n  background: var(--menu-ink);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: none;\n}\n[data-vibe-menu] .vm-tab svg {\n  width: calc(var(--size-icon-circle) / 2);\n  height: calc(var(--size-icon-circle) / 2);\n  fill: none;\n  stroke: var(--vibes-cream);\n  stroke-width: 2.5;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  flex: none;\n}\n[data-vibe-menu] .vm-tab-label {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 0 0 1.9px;\n  font-family: var(--font-tab);\n  font-size: 14px;\n  font-weight: 700;\n  letter-spacing: 1.9px;\n  text-transform: uppercase;\n  white-space: nowrap;\n  pointer-events: none;\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-tab[data-section=\"home\"] {\n  width: calc(var(--size-tab) + var(--size-home-extra));\n  padding-left: calc(var(--space-9) + var(--size-home-extra) / 2);\n}\n[data-vibe-menu] .vm-tab[data-section=\"home\"] .vm-tab-label {\n  left: calc(var(--size-home-extra) / 2);\n}\n[data-vibe-menu] .vm-tab[data-section=\"share\"] {\n  width: calc(var(--size-tab) + var(--size-bar-end));\n}\n[data-vibe-menu] .vm-tab[data-section=\"share\"] .vm-tab-label {\n  right: var(--size-bar-end);\n}\n[data-vibe-menu] .vm-tab:focus-visible {\n  outline: var(--stroke-focus) solid var(--line);\n  outline-offset: -3px;\n}\n/* Port change (smoke F5): the DS inset line ring vanished on the black pill\n   and drew square corners. The pill's ring is cream, sits in the obsidian\n   glass's 3px rim (offset 0), and follows the stadium (the pill's radius). */\n[data-vibe-menu] .vm-pill:focus-visible {\n  outline: var(--stroke-focus) solid var(--vibes-cream);\n  outline-offset: 0;\n}\n[data-vibe-menu] .vm-menu.has-card .vm-tab:not(.is-active) {\n  opacity: var(--opacity-tab-inactive);\n}\n[data-vibe-menu] .vm-badge {\n  position: absolute;\n  top: -4px;\n  right: 6px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  border-radius: var(--radius-full);\n  background: var(--badge);\n  color: var(--on-badge);\n  font: 700 11px/18px var(--font-display);\n  text-align: center;\n}\n/* the bar sits against the pill: it runs half the glass under it */\n[data-vibe-menu] .vm-bar-anchor {\n  position: relative;\n  height: var(--size-bar);\n}\n[data-vibe-menu] .vm-bar-anchor .vm-strip {\n  position: absolute;\n  left: 0;\n  bottom: 0;\n}\n[data-vibe-menu] .vm-bar-anchor .vm-glass {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n}\n/* phones: the bar spans the width; tabs sized to their content, icon above label */\n[data-vibe-menu] .vm-strip.is-phone {\n  width: 100%;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab {\n  width: auto;\n  flex: 1 1 auto;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--space-2);\n  min-width: 0;\n  padding: 4px 2px;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab-circle {\n  width: var(--size-icon-circle-phone);\n  height: var(--size-icon-circle-phone);\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab svg {\n  width: 12px;\n  height: 12px;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab[data-section=\"home\"] {\n  padding: 4px 2px 4px calc(2px + var(--size-home-extra) * 0.7);\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab[data-section=\"share\"] {\n  padding-right: var(--size-bar-end);\n  flex-grow: 1;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab-label {\n  position: static;\n  display: block;\n  font-size: 9.6px;\n  letter-spacing: 1px;\n  padding: 0 0 0 1px;\n}\n\n/* ---------- VibesSwitch: the pill in its obsidian glass ---------- */\n[data-vibe-menu] .vm-glass {\n  position: relative;\n  width: calc(var(--size-pill-w) + 2 * var(--size-ring));\n  height: calc(var(--size-pill-h) + 2 * var(--size-ring));\n  border-radius: var(--radius-full);\n  flex: none;\n  background:\n    linear-gradient(to right, transparent, var(--obsidian-highlight), transparent) top / 100% 1px no-repeat,\n    linear-gradient(to bottom, var(--obsidian-highlight), transparent, var(--obsidian-edge)) left / 1px 100% no-repeat,\n    var(--obsidian-fill);\n  box-shadow: var(--obsidian-shadow);\n}\n[data-vibe-menu] .vm-pill {\n  position: absolute;\n  left: var(--size-ring);\n  top: var(--size-ring);\n  width: var(--size-pill-w);\n  height: var(--size-pill-h);\n  padding: 0;\n  border: 0;\n  border-radius: var(--radius-full);\n  background: none;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-switch-art {\n  width: 100%;\n  height: 100%;\n  display: block;\n}\n[data-vibe-menu] .vm-pill .vm-badge {\n  top: -6px;\n  right: 4px;\n}\n/* #7079: the guest maker's save-time ask: a dot, not a count. */\n[data-vibe-menu] .vm-badge.is-dot {\n  min-width: 10px;\n  width: 10px;\n  height: 10px;\n  padding: 0;\n}\n[data-vibe-menu] .vm-chiclet {\n  display: inline-block;\n  padding: 2px 8px;\n  border-radius: var(--radius-full);\n  background: var(--section-code);\n  /* Port change: bundle.css writes #111111 (ink); text on a section colour is\n     menu-ink (Global Constraints), which --on-code resolves to in both themes. */\n  color: var(--on-code);\n  font: 700 11px/18px var(--font-display);\n  letter-spacing: 0.06em;\n}\n/* #4291. The chiclet's shape, so the two read as one row \u2014 but in the badge\n   colour (the identity lane) so elevation never looks like a publish state. */\n[data-vibe-menu] .vm-admin-badge {\n  display: inline-block;\n  padding: 2px 8px;\n  border-radius: var(--radius-full);\n  background: var(--badge);\n  color: var(--on-badge);\n  font: 700 11px/18px var(--font-display);\n  letter-spacing: 0.06em;\n}\n\n/* ---------- MenuCard: the card, its band and the folder-tab join, drawn once ---------- */\n[data-vibe-menu] .vm-frame {\n  position: relative;\n}\n[data-vibe-menu] .vm-frame .vm-card {\n  position: absolute;\n  left: 0;\n  top: 0;\n  background: var(--card-bg);\n  color: var(--ink);\n  overflow: hidden;\n  border-radius: var(--radius-card) var(--radius-card) 0 0;\n}\n[data-vibe-menu] .vm-frame .vm-card .vm-card-body {\n  padding-bottom: calc(var(--space-16) + var(--size-band));\n}\n[data-vibe-menu] .vm-outline {\n  position: absolute;\n  left: 0;\n  top: 0;\n  overflow: visible;\n  pointer-events: none;\n}\n[data-vibe-menu] .vm-outline .vm-band,\n[data-vibe-menu] .vm-outline .vm-cover {\n  fill: var(--accent);\n}\n[data-vibe-menu] .vm-outline .vm-edge {\n  fill: none;\n  stroke: var(--line);\n  stroke-width: 2;\n  stroke-linejoin: miter;\n}\n\n/* ---------- ActionPill: the card's one main action ---------- */\n[data-vibe-menu] .vm-ask {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--space-12);\n  width: 100%;\n  padding: var(--space-14) var(--space-18);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  background: var(--accent);\n  color: var(--on-accent);\n  font: 700 21px/1 var(--font-display);\n  letter-spacing: -0.02em;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-ask.is-solo {\n  margin-bottom: var(--space-14);\n}\n[data-vibe-menu] .vm-ask .vm-glyph {\n  width: var(--size-glyph-cta);\n  height: var(--size-glyph-cta);\n  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-vibe-menu] .vm-ask:hover .vm-glyph {\n  transform: translateX(4px);\n}\n[data-vibe-menu] .vm-ask.is-phone {\n  font-size: 18px;\n}\n[data-vibe-menu] .vm-sub:has(.vm-copy) {\n  display: flex;\n  align-items: center;\n  gap: var(--space-8);\n}\n[data-vibe-menu] .vm-sub:has(.vm-copy) > span {\n  flex: 1;\n}\n\n/* ---------- Chip ---------- */\n[data-vibe-menu] .vm-chip {\n  height: var(--size-chip);\n  padding: 0 var(--space-12);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-chip);\n  background: var(--accent);\n  color: var(--on-accent);\n  font-size: 11px;\n  flex: none;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-chip.is-ghost {\n  background: transparent;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-chip.is-name {\n  font: 700 14px/1 var(--font-display);\n  letter-spacing: 0;\n  text-transform: none;\n}\n[data-vibe-menu] .vm-chip.vm-copy {\n  height: var(--size-copy);\n  padding: 0 var(--space-14);\n  border-radius: var(--radius-copy);\n  flex-shrink: 0;\n  align-self: center;\n  white-space: nowrap;\n}\n[data-vibe-menu] .vm-suggestions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--space-6);\n}\n/* Port change (smoke F9): codegen writes long chips, so a chip wraps inside\n   the card (DS \"text that can outgrow its track wraps\") instead of running\n   past its edge; a one-line chip keeps the 28px chip height. */\n[data-vibe-menu] .vm-suggest {\n  min-height: var(--size-chip);\n  max-width: 100%;\n  min-width: 0;\n  padding: var(--space-2) var(--space-12);\n  text-align: left;\n  overflow-wrap: anywhere;\n  border: var(--stroke-mini) solid var(--suggest-border);\n  border-radius: var(--radius-chip);\n  background: none;\n  color: var(--ink);\n  font: 400 13px/20px var(--font-display);\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-suggest:hover,\n[data-vibe-menu] .vm-suggest.is-hover {\n  border-color: var(--line-card);\n  background: color-mix(in srgb, var(--accent) 35%, transparent);\n}\n/* The gold option (#6768): the one capability the agent offered, a chip in the\n   same row and the same order as the others. It wears the lit state the others\n   take on hover, a full-ink outline and a filled star before the label, so it\n   reads as the offer without a second colour on the card. */\n[data-vibe-menu] .vm-suggest.is-gold {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-6);\n  border-color: var(--line-card);\n  background: color-mix(in srgb, var(--accent) 35%, transparent);\n}\n[data-vibe-menu] .vm-suggest.is-gold .vm-glyph {\n  flex: none;\n  fill: currentColor;\n}\n[data-vibe-menu] .vm-picks {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-6);\n}\n\n/* ---------- Composer: the logo pill's shape ---------- */\n[data-vibe-menu] .vm-composer {\n  display: flex;\n  align-items: stretch;\n  min-height: var(--size-composer);\n  margin-bottom: var(--space-16);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  overflow: hidden;\n  background: var(--card-bg);\n}\n[data-vibe-menu] .vm-composer:focus-within,\n[data-vibe-menu] .vm-composer.is-focus {\n  box-shadow: 0 0 0 3px var(--accent);\n}\n[data-vibe-menu] .vm-composer textarea {\n  flex: 1;\n  min-width: 0;\n  align-self: center;\n  margin: 0 var(--space-12) 0 2px;\n  padding: 0;\n  resize: none;\n  border: 0;\n  outline: 0;\n  background: transparent;\n  color: var(--ink);\n  font: 700 18px/1.2 var(--font-display);\n  letter-spacing: -0.02em;\n  field-sizing: content;\n  max-height: 2.4em;\n}\n[data-vibe-menu] .vm-composer textarea::placeholder {\n  color: var(--placeholder);\n}\n[data-vibe-menu] .vm-composer .vm-attach {\n  order: -1;\n  width: var(--size-copy);\n  height: var(--size-copy);\n  margin-left: var(--space-10);\n  align-self: center;\n  border-radius: 50%;\n  display: grid;\n  place-items: center;\n  flex: none;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-composer .vm-attach:hover {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-composer .vm-glyph {\n  width: 16px;\n  height: 16px;\n}\n[data-vibe-menu] .vm-cap {\n  flex: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 var(--space-24) 0 20px;\n  border-left: var(--stroke-rule) solid var(--line-card);\n  background: var(--section-code);\n  color: var(--on-code);\n  font: 700 14px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  white-space: nowrap;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-cap:hover {\n  background: color-mix(in oklch, var(--section-code), var(--menu-ink) 10%);\n}\n[data-vibe-menu] .vm-composer.is-building .vm-cap[data-send],\n[data-vibe-menu] .vm-composer.is-building:has(textarea:not(:placeholder-shown)) .vm-cap[data-stop] {\n  display: none;\n}\n[data-vibe-menu] .vm-composer.is-building:has(textarea:not(:placeholder-shown)) .vm-cap[data-send] {\n  display: flex;\n}\n[data-vibe-menu] .vm-queue-note {\n  display: none;\n  margin: -10px 0 12px 18px;\n  font-size: 12px;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-composer:has(textarea:not(:placeholder-shown)) + .vm-queue-note {\n  display: block;\n}\n[data-vibe-menu] .vm-composer.is-phone textarea {\n  margin-right: var(--space-6);\n  font-size: 16px;\n}\n[data-vibe-menu] .vm-composer.is-phone .vm-attach {\n  margin-left: 4px;\n  width: 28px;\n}\n[data-vibe-menu] .vm-composer.is-phone .vm-cap {\n  padding: 0 var(--space-18) 0 var(--space-14);\n}\n\n/* ---------- Row: the bar's tab grammar inside the card ---------- */\n[data-vibe-menu] .vm-group {\n  border-top: var(--stroke-rule) solid var(--line-card);\n  margin: 0 calc(-1 * var(--space-16));\n}\n[data-vibe-menu] .vm-group.is-flush {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-row {\n  display: flex;\n  align-items: center;\n  gap: var(--space-12);\n  width: 100%;\n  height: var(--size-row);\n  padding: 0 var(--space-16);\n}\n[data-vibe-menu] .vm-row.is-compact {\n  height: var(--size-row-compact);\n}\n[data-vibe-menu] .vm-row + .vm-row {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-row .vm-label {\n  flex: 1;\n}\n[data-vibe-menu] .vm-dot {\n  width: var(--size-icon-circle);\n  height: var(--size-icon-circle);\n  border-radius: 50%;\n  background: var(--ink);\n  color: var(--card-bg);\n  display: grid;\n  place-items: center;\n  flex: none;\n}\n[data-vibe-menu] button.vm-row:hover .vm-dot:not(.vm-app),\n[data-vibe-menu] .vm-row.is-hover .vm-dot:not(.vm-app) {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-row.is-quiet .vm-dot {\n  background: transparent;\n  color: var(--ink);\n  box-shadow: inset 0 0 0 2px var(--line-card);\n}\n[data-vibe-menu] .vm-row[aria-disabled=\"true\"] {\n  opacity: 0.35;\n  cursor: default;\n}\n[data-vibe-menu] .vm-row[aria-disabled=\"true\"] .vm-dot {\n  background: var(--ink) !important;\n  color: var(--card-bg) !important;\n}\n[data-vibe-menu] .vm-app,\n[data-vibe-menu] .vm-initial {\n  font: 700 12px/1 var(--font-tab);\n  box-shadow: inset 0 0 0 2px var(--line-card);\n}\n[data-vibe-menu] .vm-app {\n  background: var(--app);\n  color: var(--menu-ink);\n}\n[data-vibe-menu] .vm-initial {\n  background: transparent;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-chev {\n  display: grid;\n  color: var(--muted);\n  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-vibe-menu] .vm-chev.is-open {\n  transform: rotate(90deg);\n}\n[data-vibe-menu] .vm-count {\n  font: 700 12px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-count.is-handle {\n  max-width: 45%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  letter-spacing: 0.02em;\n}\n[data-vibe-menu] .vm-switch {\n  position: relative;\n  width: var(--size-switch-w);\n  height: 20px;\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-switch);\n  flex: none;\n}\n[data-vibe-menu] .vm-switch::after {\n  content: \"\";\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n  background: var(--ink);\n}\n[data-vibe-menu] .vm-switch.is-on {\n  background: var(--accent);\n}\n[data-vibe-menu] .vm-switch.is-on::after {\n  left: 18px;\n}\n\n/* ---------- BackRow and DoneButton: a drill-in's frame ---------- */\n[data-vibe-menu] .vm-back {\n  display: flex;\n  align-items: center;\n  gap: var(--space-12);\n  width: calc(100% + 2 * var(--space-16));\n  height: var(--size-row-compact);\n  margin: 0 calc(-1 * var(--space-16));\n  padding: 0 var(--space-16);\n  border-top: var(--stroke-rule) solid var(--line-card);\n  border-bottom: var(--stroke-hairline) solid var(--line-hairline);\n}\n/* A drill that replaces the whole card body (Share, Account) sits on the card's\n   top edge, which the outline already draws: no rule, and it takes the body's\n   top padding so no empty band shows above it (cards-hero.css .card-title + .h-back). */\n[data-vibe-menu] .vm-back.is-top {\n  margin-top: calc(-1 * var(--space-14));\n  border-top: 0;\n}\n[data-vibe-menu] .vm-back .vm-label {\n  flex: none;\n}\n[data-vibe-menu] .vm-back-name {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font: 400 16px/1.1 var(--font-display);\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-back:hover .vm-dot,\n[data-vibe-menu] .vm-back.is-hover .vm-dot {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-drill {\n  padding-top: var(--space-14);\n}\n[data-vibe-menu] .vm-drill-sec + .vm-drill-sec {\n  margin-top: var(--space-14);\n}\n[data-vibe-menu] .vm-drill-line {\n  margin: 0 0 var(--space-14);\n  font: 700 18px/1.25 var(--font-display);\n  letter-spacing: -0.01em;\n}\n[data-vibe-menu] .vm-done {\n  display: block;\n  width: 100%;\n  height: var(--size-row-compact);\n  margin-top: var(--space-16);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-done);\n  background: var(--accent);\n  color: var(--on-accent);\n  text-align: center;\n  font: 700 14px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-textbtn {\n  display: block;\n  width: 100%;\n  height: 40px;\n  margin-top: var(--space-4);\n  text-align: center;\n  font: 700 12px/1 var(--font-tab);\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-textbtn:hover {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-faq {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--space-12);\n  width: 100%;\n  padding: var(--space-12) 0;\n  font: 400 16px/1.3 var(--font-display);\n}\n[data-vibe-menu] .vm-faq + .vm-faq {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n\n/* ---------- MomentLine: the current moment ---------- */\n[data-vibe-menu] .vm-moments {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-8);\n}\n[data-vibe-menu] .vm-moment {\n  margin: 0;\n  font: 400 16px/1.3 var(--font-display);\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-moment.is-pinned {\n  padding: var(--space-10) var(--space-12) var(--space-12) var(--space-14);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-left: var(--size-band) solid var(--accent);\n  border-radius: var(--radius-moment);\n}\n[data-vibe-menu] .vm-moment-text {\n  margin: 0 0 var(--space-10);\n}\n[data-vibe-menu] .vm-moment-actions {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-6);\n}\n[data-vibe-menu] .vm-moment-hint {\n  font-size: 12px;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-moment.is-progress,\n[data-vibe-menu] .vm-moment.is-summary {\n  display: flex;\n  align-items: center;\n  gap: var(--space-10);\n  padding: 0 var(--space-2);\n}\n[data-vibe-menu] .vm-moment.is-summary {\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-moment.is-expander {\n  width: 100%;\n  gap: var(--space-8);\n}\n[data-vibe-menu] .vm-moment.is-expander:hover {\n  color: var(--ink);\n}\n/* The live line's link (the first build's real address, #6451 S9c): pointer\n   events back on, since the layer takes no hits of its own. */\n[data-vibe-menu] .vm-moment-link {\n  display: inline-block;\n  margin: 0 var(--space-2);\n  font: 400 14px/1.3 var(--font-display);\n  color: var(--ink);\n  text-decoration: underline;\n  text-underline-offset: 3px;\n  overflow-wrap: anywhere;\n  pointer-events: auto;\n}\n[data-vibe-menu] .vm-live .vm-chev {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-log-clip {\n  overflow: hidden;\n}\n/* Port addition (RULINGS R1): the log clip is always rendered (RECONCILE \u00A75c),\n   so the base stylesheet owns its shut and open states. The shell's per-frame\n   tween (T11) writes an inline height, which overrides these during motion.\n   C's VIBE_MENU_SHELL_CSS does not repeat them. */\n[data-vibe-menu] .vm-log-clip[data-open=\"false\"] {\n  height: 0;\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-log-clip[data-open=\"true\"] {\n  height: auto;\n  /* Known adjustment (plan header): room for .vm-log's own 160px cap plus its\n     8px margin-top and two hairline borders, so the clip never scrolls on top\n     of the log. */\n  max-height: calc(var(--size-log-max, 160px) + var(--space-8) + 2 * var(--stroke-hairline));\n  overflow: auto;\n  /* Smoke F15: the shell's height tween makes the clip overflow for a moment;\n     .vm-log scrolls itself, so the clip never shows a bar. */\n  scrollbar-width: none;\n}\n[data-vibe-menu] .vm-log-clip[data-open=\"true\"]::-webkit-scrollbar {\n  display: none;\n}\n[data-vibe-menu] .vm-log {\n  max-height: var(--size-log-max);\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-6);\n  margin-top: var(--space-8);\n  padding: var(--space-10) 4px var(--space-10) var(--space-24);\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n  border-bottom: var(--stroke-hairline) solid var(--line-hairline);\n  font-size: 13.5px;\n  line-height: 1.35;\n}\n[data-vibe-menu] .vm-log-line {\n  margin: 0;\n}\n[data-vibe-menu] .vm-log-line:first-child {\n  margin-top: auto;\n}\n[data-vibe-menu] .vm-log-line b {\n  font: 700 10px/1 var(--font-tab);\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  color: var(--muted);\n  margin-right: 4px;\n}\n\n/* ---------- AccessToggle: Restricted | Public and its line ---------- */\n[data-vibe-menu] .vm-access {\n  display: flex;\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-access button {\n  flex: 1;\n  height: var(--size-bar);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--space-10);\n  text-align: center;\n  font: 700 24px/1 var(--font-display);\n  letter-spacing: -0.02em;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-access button + button {\n  border-left: var(--stroke-rule) solid var(--line-card);\n}\n[data-vibe-menu] .vm-access button.is-active {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-access button:not(.is-active):hover {\n  background: color-mix(in srgb, var(--accent) 20%, transparent);\n}\n/* Settings still loading (preflight ruling P14): dimmed and inert. */\n[data-vibe-menu] .vm-access[aria-disabled=\"true\"] {\n  opacity: var(--opacity-row-disabled);\n}\n[data-vibe-menu] .vm-access[aria-disabled=\"true\"] button {\n  cursor: default;\n}\n[data-vibe-menu] .vm-access[aria-disabled=\"true\"] button:not(.is-active):hover {\n  background: transparent;\n}\n[data-vibe-menu] .vm-access-line {\n  display: flex;\n  align-items: center;\n  gap: var(--space-10);\n  min-height: var(--size-access-line);\n  margin: var(--space-10) 0 var(--space-12);\n  padding: var(--space-6) var(--space-6) var(--space-6) var(--space-14);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-access-line);\n  background: var(--share-tint);\n  font-size: 16.5px;\n  line-height: 1.25;\n}\n[data-vibe-menu] .vm-access-line > span {\n  flex: 1;\n  min-width: 0;\n}\n[data-vibe-menu] .vm-access-line .vm-glyph {\n  width: 16px;\n  height: 16px;\n}\n[data-vibe-menu] .vm-publish {\n  display: flex;\n  align-items: center;\n  gap: var(--space-8);\n  padding: 5px 5px 5px var(--space-10);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-left: var(--size-band) solid var(--accent);\n  border-radius: var(--radius-moment);\n}\n[data-vibe-menu] .vm-publish b {\n  font: 700 11px/1 var(--font-tab);\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n}\n[data-vibe-menu] .vm-publish span {\n  flex: 1;\n  min-width: 0;\n  font-size: 13px;\n  line-height: 1.25;\n  color: var(--muted);\n}\n\n/* ---------- GrantControls ---------- */\n[data-vibe-menu] .vm-seg {\n  display: flex;\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-seg button {\n  flex: 1;\n  height: var(--size-segment);\n  text-align: center;\n  font-size: 11px;\n}\n[data-vibe-menu] .vm-seg button + button {\n  border-left: var(--stroke-rule) solid var(--line-card);\n}\n[data-vibe-menu] .vm-seg button.is-active {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-seg.is-mini {\n  margin: 0;\n  border-width: var(--stroke-mini);\n}\n[data-vibe-menu] .vm-seg.is-mini button {\n  flex: none;\n  height: var(--size-segment-mini);\n  padding: 0 var(--space-8);\n  font-size: 10px;\n}\n[data-vibe-menu] .vm-seg.is-mini button + button {\n  border-left-width: var(--stroke-mini);\n}\n[data-vibe-menu] .vm-grants {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-6) var(--space-12);\n}\n[data-vibe-menu] .vm-grant-ctl {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n}\n[data-vibe-menu] .vm-grant-name {\n  font: 700 10px/1 var(--font-tab);\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-grant-fixed {\n  font: 700 10px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  color: var(--ink);\n}\n\n/* ---------- MemberRow ---------- */\n[data-vibe-menu] .vm-input {\n  width: 100%;\n  height: var(--size-input);\n  margin-bottom: var(--space-14);\n  padding: 0 var(--space-18);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-input);\n  background: transparent;\n  color: var(--ink);\n  font: inherit;\n}\n[data-vibe-menu] .vm-members-head {\n  margin-top: 0;\n  padding: 2px 0 var(--space-8);\n}\n[data-vibe-menu] .vm-members-head + .vm-input {\n  height: 40px;\n  margin-bottom: var(--space-8);\n}\n[data-vibe-menu] .vm-person {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-8) var(--space-12);\n  padding: var(--space-6) 0;\n}\n[data-vibe-menu] .vm-person + .vm-person {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-person .vm-label {\n  flex: 1;\n  min-width: 0;\n}\n[data-vibe-menu] .vm-request {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-8) var(--space-12);\n  margin-bottom: 2px;\n  padding: var(--space-10) var(--space-12);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-card);\n  background: var(--share-tint-strong);\n}\n[data-vibe-menu] .vm-request-top {\n  flex: 1 0 auto;\n}\n[data-vibe-menu] .vm-request-actions {\n  display: flex;\n  gap: var(--space-6);\n  margin-left: auto;\n}\n[data-vibe-menu] .vm-who-block > .vm-row {\n  width: calc(100% + 2 * var(--space-16));\n  margin: 2px calc(-1 * var(--space-16)) 0;\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-narrow .vm-person .vm-grants,\n[data-vibe-menu] .vm-narrow .vm-request-top {\n  flex-basis: 100%;\n}\n[data-vibe-menu] .vm-narrow .vm-person .vm-grants,\n[data-vibe-menu] .vm-narrow .vm-request .vm-grants {\n  column-gap: var(--space-10);\n}\n/* stacking, as the prototype: card < bar < outline < glass and pill */\n[data-vibe-menu] .vm-frame .vm-card {\n  z-index: 1;\n}\n[data-vibe-menu] .vm-frame .vm-strip {\n  z-index: 2;\n}\n[data-vibe-menu] .vm-frame .vm-outline {\n  z-index: 3;\n}\n[data-vibe-menu] .vm-frame .vm-glass {\n  z-index: 4;\n}\n[data-vibe-menu] .vm-refresh {\n  display: grid;\n  place-items: center;\n  width: var(--size-icon-circle);\n  height: var(--size-icon-circle);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: 50%;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-refresh:hover {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n\n/* ---------- port additions: not in bundle.css ---------- */\n/* Rows and the action pill can be links (Home's rows, the credits action). */\n[data-vibe-menu] :where(a.vm-row, a.vm-ask) {\n  color: inherit;\n  text-decoration: none;\n}\n[data-vibe-menu] a.vm-row:hover .vm-dot:not(.vm-app) {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n/* A member's name drills into that member (spec \u00A78). */\n[data-vibe-menu] .vm-person button.vm-label {\n  text-align: left;\n}\n[data-vibe-menu] .vm-chip[aria-disabled=\"true\"],\n[data-vibe-menu] .vm-cap:disabled,\n[data-vibe-menu] .vm-composer .vm-attach:disabled {\n  opacity: var(--opacity-row-disabled);\n  cursor: default;\n}\n/* Staged attachments above the composer: name chips, no emoji. */\n[data-vibe-menu] .vm-attachments {\n  margin-bottom: var(--space-8);\n}\n[data-vibe-menu] .vm-attachments .vm-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-6);\n  max-width: 220px;\n}\n[data-vibe-menu] .vm-attachments .vm-chip > span:last-child {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n[data-vibe-menu] .vm-attachments .vm-chip[data-status=\"error\"] {\n  border-color: var(--section-account);\n}\n/* A suggestion's fast-path marks (RULINGS O4, production #2917 decorateChip).\n   Siblings of .vm-suggest, since a button can't nest a button. The owner's\n   toggle (FastPathToggle) is outline when not blessed, filled when blessed\n   (aria-pressed); the badges are the marks every viewer sees. */\n[data-vibe-menu] .vm-suggest-item {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-2);\n  max-width: 100%;\n  min-width: 0;\n}\n[data-vibe-menu] .vm-suggest-item > * {\n  flex: none;\n}\n[data-vibe-menu] .vm-suggest-item > .vm-suggest {\n  flex: 0 1 auto;\n}\n[data-vibe-menu] .vm-suggest-shield {\n  width: var(--size-chip);\n  height: var(--size-chip);\n  display: inline-grid;\n  place-items: center;\n  border-radius: var(--radius-full);\n  background: none;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-suggest-shield:hover {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-suggest-shield[aria-pressed=\"true\"] {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-suggest-shield[aria-pressed=\"true\"] .vm-glyph {\n  fill: currentColor;\n}\n/* The non-interactive marks every viewer sees (production ChipShieldBadge,\n   ChipJumpBadge): a filled shield (\"stays in this app\", server-authoritative)\n   or an arrow (\"opens another app\"). Never both on one chip. */\n[data-vibe-menu] .vm-suggest-badge {\n  width: var(--size-chip);\n  height: var(--size-chip);\n  display: inline-grid;\n  place-items: center;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-suggest-badge.is-shield .vm-glyph {\n  fill: currentColor;\n}\n[data-vibe-menu] .vm-suggest-badge.is-jump {\n  color: var(--muted);\n}\n\n/* ---------- phones (cards-hero.css): the menu's width, not the viewport ---------- */\n@container vibe-menu (max-width: 480px) {\n  [data-vibe-menu] .vm-ask {\n    font-size: 18px;\n  }\n  /* the field keeps 16px (iOS zooms smaller fields); attach slims instead */\n  [data-vibe-menu] .vm-composer textarea {\n    margin-right: var(--space-6);\n    font-size: 16px;\n  }\n  [data-vibe-menu] .vm-composer .vm-attach {\n    margin-left: 4px;\n    width: 28px;\n  }\n  [data-vibe-menu] .vm-cap {\n    padding: 0 var(--space-18) 0 var(--space-14);\n  }\n  [data-vibe-menu] .vm-access button {\n    font-size: 21px;\n  }\n  /* the access line keeps its sentence to two lines beside the chip */\n  [data-vibe-menu] .vm-access-line {\n    padding-left: 12px;\n    gap: 8px;\n    font-size: 15.5px;\n  }\n  [data-vibe-menu] .vm-access-line .vm-chip.vm-copy {\n    padding: 0 10px;\n  }\n  /* Data and Code drop under the handle on one line (two on the narrowest) */\n  [data-vibe-menu] .vm-person .vm-grants {\n    flex-basis: 100%;\n    column-gap: var(--space-10);\n  }\n  [data-vibe-menu] .vm-request .vm-grants {\n    column-gap: var(--space-10);\n  }\n  [data-vibe-menu] .vm-request-top {\n    flex-basis: 100%;\n  }\n  [data-vibe-menu] .vm-input {\n    font-size: 16px;\n  }\n}\n@container vibe-menu (max-width: 359px) {\n  [data-vibe-menu] .vm-access button {\n    font-size: 19px;\n  }\n  /* the line drops its icon here: the enclosure already marks it */\n  [data-vibe-menu] .vm-access-line > .vm-glyph {\n    display: none;\n  }\n  [data-vibe-menu] .vm-access-line {\n    margin: 8px 0 10px;\n    font-size: 14.5px;\n  }\n  [data-vibe-menu] .vm-access-line .vm-chip.vm-copy {\n    padding: 0 8px;\n  }\n  /* the cap and attach slim so the field keeps room (REMIX THIS stays one line) */\n  [data-vibe-menu] .vm-cap {\n    padding: 0 13px 0 10px;\n    letter-spacing: 0.05em;\n  }\n  [data-vibe-menu] .vm-composer .vm-attach {\n    margin-left: 3px;\n    width: 24px;\n  }\n  /* 16px, not the prototype's 14px: no text field under 16px on phones (spec \u00A74.5) */\n  [data-vibe-menu] .vm-composer textarea {\n    margin: 0 4px 0 0;\n    font-size: 16px;\n  }\n  [data-vibe-menu] .vm-chip.vm-copy {\n    padding: 0 10px;\n    letter-spacing: 0.06em;\n  }\n}\n";
+export declare const VIBE_MENU_LIGHT_VARS = "\n  color-scheme: light;\n  --section-home: oklch(76.02% 0.1832 146.61);\n  --section-account: oklch(57.46% 0.2126 29.55);\n  --section-code: oklch(89.78% 0.1857 98.22);\n  --section-share: oklch(64.39% 0.1304 231.41);\n  --vibes-black: #000000;\n  --vibes-cream: #fffff0;\n  --menu-ink: #1a1a1a;\n  --card-bg: var(--vibes-cream);\n  --ink: #111111;\n  --muted: #555555;\n  --line: #111111;\n  --line-card: #111111;\n  --line-hairline: #1111112e;\n  --placeholder: var(--muted);\n  --suggest-border: #11111173;\n  --share-tint: #009ace1f;\n  --share-tint-strong: #009ace40;\n  --on-home: var(--menu-ink);\n  --on-account: var(--vibes-cream);\n  --on-code: var(--menu-ink);\n  --on-share: var(--menu-ink);\n  --badge: var(--section-account);\n  --on-badge: var(--vibes-cream);\n  --cancel-cap: #f3d6d2;\n  --on-cancel-cap: #9c2318;\n  --obsidian-fill: rgba(6, 9, 10, 0.94);\n  --obsidian-edge: rgba(255, 255, 255, 0.17);\n  --obsidian-highlight: rgba(255, 255, 255, 0.32);\n  --obsidian-rim: rgba(255, 255, 255, 0.1);\n  --font-display: \"Alte Haas Grotesk\", Inter, sans-serif;\n  --font-tab: Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif;\n  --space-9: 9px;\n  --space-2: 2px;\n  --space-4: 4px;\n  --space-6: 6px;\n  --space-8: 8px;\n  --space-10: 10px;\n  --space-12: 12px;\n  --space-14: 14px;\n  --space-16: 16px;\n  --space-18: 18px;\n  --space-24: 24px;\n  --radius-card: 16px;\n  --radius-full: 999px;\n  --radius-bar-end: 25px;\n  --radius-access-line: 24px;\n  --radius-input: 22px;\n  --radius-done: 21px;\n  --radius-copy: 18px;\n  --radius-chip: 14px;\n  --radius-moment: 12px;\n  --radius-switch: 10px;\n  --radius-meter: 7px;\n  --obsidian-shadow: 0 2px 5px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.16), inset 0 -1px 0 rgba(255, 255, 255, 0.05), inset 0 0 12px rgba(255, 255, 255, 0.02);\n  --swatch-selected: 0 0 0 2px #fffff0, 0 0 0 4px #111111;\n  --stroke-rule: 2px;\n  --stroke-hairline: 1px;\n  --stroke-mini: 1.5px;\n  --stroke-focus: 3px;\n  --stroke-glyph: 2.4px;\n  --size-icon-circle: 28px;\n  --size-icon-circle-phone: 22px;\n  --size-glyph: 14px;\n  --size-glyph-cta: 20px;\n  --size-bar: 50px;\n  --size-tab: 176px;\n  --size-home-extra: 14px;\n  --size-bar-end: 63px;\n  --size-pill-w: 120px;\n  --size-pill-h: 44px;\n  --size-ring: 3px;\n  --size-edge: 24px;\n  --size-edge-phone: 16px;\n  --size-pill-flat-inset: 19px;\n  --size-band: 8px;\n  --size-row: 46px;\n  --size-row-compact: 42px;\n  --size-chip: 28px;\n  --size-copy: 36px;\n  --size-input: 44px;\n  --size-composer: 58px;\n  --size-access-line: 48px;\n  --size-segment: 32px;\n  --size-segment-mini: 24px;\n  --size-switch-w: 36px;\n  --size-meter: 14px;\n  --size-card-max: 480px;\n  --size-card-max-phone: 560px;\n  --size-log-max: 160px;\n  --size-code-mode-max-w: 1200px;\n  --opacity-tab-inactive: 0.73;\n  --opacity-row-disabled: 0.35;";
+export declare const VIBE_MENU_DARK_VARS = "\n  color-scheme: dark;\n  --card-bg: #1a1a1a;\n  --ink: #e0e0e0;\n  --muted: #a3a3a3;\n  --line-card: #e0e0e0;\n  --line-hairline: #e0e0e02e;\n  --suggest-border: #e0e0e073;\n  --cancel-cap: #4a2420;\n  --on-cancel-cap: #f1b5ad;\n  --swatch-selected: 0 0 0 2px #1a1a1a, 0 0 0 4px #e0e0e0;";
+export declare const VIBE_MENU_CSS = "\n/* ---------- tokens (tokens.json), light, then both dark arms ----------\n   Detached layers (portalled out of the menu root) carry\n   data-vibe-menu-detached, so every token block lists them too. */\n[data-vibe-menu],\n[data-vibe-menu-detached] {\n  color-scheme: light;\n  --section-home: oklch(76.02% 0.1832 146.61);\n  --section-account: oklch(57.46% 0.2126 29.55);\n  --section-code: oklch(89.78% 0.1857 98.22);\n  --section-share: oklch(64.39% 0.1304 231.41);\n  --vibes-black: #000000;\n  --vibes-cream: #fffff0;\n  --menu-ink: #1a1a1a;\n  --card-bg: var(--vibes-cream);\n  --ink: #111111;\n  --muted: #555555;\n  --line: #111111;\n  --line-card: #111111;\n  --line-hairline: #1111112e;\n  --placeholder: var(--muted);\n  --suggest-border: #11111173;\n  --share-tint: #009ace1f;\n  --share-tint-strong: #009ace40;\n  --on-home: var(--menu-ink);\n  --on-account: var(--vibes-cream);\n  --on-code: var(--menu-ink);\n  --on-share: var(--menu-ink);\n  --badge: var(--section-account);\n  --on-badge: var(--vibes-cream);\n  --cancel-cap: #f3d6d2;\n  --on-cancel-cap: #9c2318;\n  --obsidian-fill: rgba(6, 9, 10, 0.94);\n  --obsidian-edge: rgba(255, 255, 255, 0.17);\n  --obsidian-highlight: rgba(255, 255, 255, 0.32);\n  --obsidian-rim: rgba(255, 255, 255, 0.1);\n  --font-display: \"Alte Haas Grotesk\", Inter, sans-serif;\n  --font-tab: Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif;\n  --space-9: 9px;\n  --space-2: 2px;\n  --space-4: 4px;\n  --space-6: 6px;\n  --space-8: 8px;\n  --space-10: 10px;\n  --space-12: 12px;\n  --space-14: 14px;\n  --space-16: 16px;\n  --space-18: 18px;\n  --space-24: 24px;\n  --radius-card: 16px;\n  --radius-full: 999px;\n  --radius-bar-end: 25px;\n  --radius-access-line: 24px;\n  --radius-input: 22px;\n  --radius-done: 21px;\n  --radius-copy: 18px;\n  --radius-chip: 14px;\n  --radius-moment: 12px;\n  --radius-switch: 10px;\n  --radius-meter: 7px;\n  --obsidian-shadow: 0 2px 5px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.16), inset 0 -1px 0 rgba(255, 255, 255, 0.05), inset 0 0 12px rgba(255, 255, 255, 0.02);\n  --swatch-selected: 0 0 0 2px #fffff0, 0 0 0 4px #111111;\n  --stroke-rule: 2px;\n  --stroke-hairline: 1px;\n  --stroke-mini: 1.5px;\n  --stroke-focus: 3px;\n  --stroke-glyph: 2.4px;\n  --size-icon-circle: 28px;\n  --size-icon-circle-phone: 22px;\n  --size-glyph: 14px;\n  --size-glyph-cta: 20px;\n  --size-bar: 50px;\n  --size-tab: 176px;\n  --size-home-extra: 14px;\n  --size-bar-end: 63px;\n  --size-pill-w: 120px;\n  --size-pill-h: 44px;\n  --size-ring: 3px;\n  --size-edge: 24px;\n  --size-edge-phone: 16px;\n  --size-pill-flat-inset: 19px;\n  --size-band: 8px;\n  --size-row: 46px;\n  --size-row-compact: 42px;\n  --size-chip: 28px;\n  --size-copy: 36px;\n  --size-input: 44px;\n  --size-composer: 58px;\n  --size-access-line: 48px;\n  --size-segment: 32px;\n  --size-segment-mini: 24px;\n  --size-switch-w: 36px;\n  --size-meter: 14px;\n  --size-card-max: 480px;\n  --size-card-max-phone: 560px;\n  --size-log-max: 160px;\n  --size-code-mode-max-w: 1200px;\n  --opacity-tab-inactive: 0.73;\n  --opacity-row-disabled: 0.35;\n}\n@media (prefers-color-scheme: dark) {\n  [data-vibe-menu],\n  [data-vibe-menu-detached] {\n  color-scheme: dark;\n  --card-bg: #1a1a1a;\n  --ink: #e0e0e0;\n  --muted: #a3a3a3;\n  --line-card: #e0e0e0;\n  --line-hairline: #e0e0e02e;\n  --suggest-border: #e0e0e073;\n  --cancel-cap: #4a2420;\n  --on-cancel-cap: #f1b5ad;\n  --swatch-selected: 0 0 0 2px #1a1a1a, 0 0 0 4px #e0e0e0;\n  }\n}\n.dark [data-vibe-menu],\n.dark [data-vibe-menu-detached] {\n  color-scheme: dark;\n  --card-bg: #1a1a1a;\n  --ink: #e0e0e0;\n  --muted: #a3a3a3;\n  --line-card: #e0e0e0;\n  --line-hairline: #e0e0e02e;\n  --suggest-border: #e0e0e073;\n  --cancel-cap: #4a2420;\n  --on-cancel-cap: #f1b5ad;\n  --swatch-selected: 0 0 0 2px #1a1a1a, 0 0 0 4px #e0e0e0;\n}\n\n/* ---------- the root: the phone container ---------- */\n[data-vibe-menu] {\n  container-name: vibe-menu;\n  container-type: inline-size;\n  color: var(--ink);\n  font-family: var(--font-display);\n}\n\n/* Scrollbars (smoke F15): thin, in the menu's hairline, both themes, never the\n   native dark bar inside the cream card. The colour is set on the root AND\n   every descendant, for every scroller the menu hosts (drills, the Embed box,\n   injected panels): the app's global sheet sets scrollbar-color on *, which\n   beats a colour only inherited from the root. The width rule has zero\n   specificity so a part that hides its bar (the Code mode tab strip) still\n   wins. The webkit arm is for engines without the standard properties; Chrome\n   ignores it once they are set. */\n[data-vibe-menu],\n[data-vibe-menu] *,\n[data-vibe-menu-detached],\n[data-vibe-menu-detached] * {\n  scrollbar-color: var(--line-hairline) transparent;\n}\n:where([data-vibe-menu]),\n:where([data-vibe-menu]) :where(*) {\n  scrollbar-width: thin;\n}\n:where([data-vibe-menu]) ::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n  background: transparent;\n}\n:where([data-vibe-menu]) ::-webkit-scrollbar-thumb {\n  border-radius: var(--radius-full);\n  background: var(--line-hairline);\n}\n\n/* A section is set by data-section on any ancestor (or the root), using the\n   code keys: home | settings (Account) | vibe (Code) | share. It sets --accent\n   (the section colour) and --on-accent (its label colour). */\n[data-vibe-menu][data-section=\"home\"],\n[data-vibe-menu] [data-section=\"home\"] {\n  --accent: var(--section-home);\n  --on-accent: var(--on-home);\n}\n[data-vibe-menu][data-section=\"settings\"],\n[data-vibe-menu] [data-section=\"settings\"] {\n  --accent: var(--section-account);\n  --on-accent: var(--on-account);\n}\n[data-vibe-menu][data-section=\"vibe\"],\n[data-vibe-menu] [data-section=\"vibe\"] {\n  --accent: var(--section-code);\n  --on-accent: var(--on-code);\n}\n[data-vibe-menu][data-section=\"share\"],\n[data-vibe-menu] [data-section=\"share\"] {\n  --accent: var(--section-share);\n  --on-accent: var(--on-share);\n}\n\n[data-vibe-menu],\n[data-vibe-menu] * {\n  box-sizing: border-box;\n}\n/* the card's surface and side padding, so rows can bleed edge to edge */\n[data-vibe-menu] .vm-card-body {\n  position: relative;\n  padding: var(--space-14) var(--space-16) var(--space-16);\n  background: var(--card-bg);\n  color: var(--ink);\n  font: 400 14px/20px var(--font-display);\n}\n[data-vibe-menu] .vm-card-body.is-framed {\n  border: var(--stroke-rule) solid var(--line);\n  border-radius: var(--radius-card) var(--radius-card) 0 0;\n  overflow: hidden;\n}\n\n/* ---------- shared ---------- */\n/* Zero specificity: every vm-* rule wins over it, and so does any utility\n   class on content a host injects into the card (slots). */\n:where([data-vibe-menu]) :where(button) {\n  font: inherit;\n  color: inherit;\n  background: none;\n  border: 0;\n  padding: 0;\n  cursor: pointer;\n  text-align: left;\n  touch-action: manipulation;\n}\n[data-vibe-menu] .vm-glyph {\n  width: var(--size-glyph);\n  height: var(--size-glyph);\n  fill: none;\n  stroke: currentColor;\n  stroke-width: var(--stroke-glyph);\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  flex: none;\n}\n[data-vibe-menu] .vm-label,\n[data-vibe-menu] .vm-seg button,\n[data-vibe-menu] .vm-chip {\n  font: 700 14px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n[data-vibe-menu] .vm-label.is-plain {\n  font: 700 16px/1.1 var(--font-display);\n  letter-spacing: 0;\n  text-transform: none;\n}\n[data-vibe-menu] .vm-kicker,\n[data-vibe-menu] .vm-subhead {\n  margin: 0 0 var(--space-8);\n  font: 700 10.5px/1.3 var(--font-tab);\n  letter-spacing: 0.14em;\n  text-transform: uppercase;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-subhead {\n  margin: var(--space-16) 0 0;\n  padding-bottom: var(--space-8);\n}\n[data-vibe-menu] .vm-sub {\n  margin: var(--space-8) 0 var(--space-14);\n  font-size: 13px;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-app-name {\n  white-space: nowrap;\n}\n/* ---------- SectionStrip: the bar ---------- */\n[data-vibe-menu] .vm-menu {\n  position: relative;\n}\n[data-vibe-menu] .vm-strip {\n  position: relative;\n  width: calc(var(--size-tab) * 4 + var(--size-home-extra) + var(--size-bar-end) + 2px);\n  height: var(--size-bar);\n}\n[data-vibe-menu] .vm-strip-slide {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: flex-end;\n  border: var(--stroke-rule) solid var(--line);\n  border-right: 0;\n  border-radius: var(--bar-tl, var(--radius-bar-end)) 0 0 var(--radius-bar-end);\n  overflow: hidden;\n  background: var(--card-bg);\n}\n[data-vibe-menu] .vm-tab {\n  position: relative;\n  width: var(--size-tab);\n  flex: none;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  border: 0;\n  padding: 0 0 0 var(--space-9);\n  cursor: pointer;\n  background: var(--accent);\n}\n[data-vibe-menu] .vm-tab-circle {\n  width: var(--size-icon-circle);\n  height: var(--size-icon-circle);\n  border-radius: 50%;\n  background: var(--menu-ink);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: none;\n}\n[data-vibe-menu] .vm-tab svg {\n  width: calc(var(--size-icon-circle) / 2);\n  height: calc(var(--size-icon-circle) / 2);\n  fill: none;\n  stroke: var(--vibes-cream);\n  stroke-width: 2.5;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  flex: none;\n}\n[data-vibe-menu] .vm-tab-label {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 0 0 1.9px;\n  font-family: var(--font-tab);\n  font-size: 14px;\n  font-weight: 700;\n  letter-spacing: 1.9px;\n  text-transform: uppercase;\n  white-space: nowrap;\n  pointer-events: none;\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-tab[data-section=\"home\"] {\n  width: calc(var(--size-tab) + var(--size-home-extra));\n  padding-left: calc(var(--space-9) + var(--size-home-extra) / 2);\n}\n[data-vibe-menu] .vm-tab[data-section=\"home\"] .vm-tab-label {\n  left: calc(var(--size-home-extra) / 2);\n}\n[data-vibe-menu] .vm-tab[data-section=\"share\"] {\n  width: calc(var(--size-tab) + var(--size-bar-end));\n}\n[data-vibe-menu] .vm-tab[data-section=\"share\"] .vm-tab-label {\n  right: var(--size-bar-end);\n}\n[data-vibe-menu] .vm-tab:focus-visible {\n  outline: var(--stroke-focus) solid var(--line);\n  outline-offset: -3px;\n}\n/* Port change (smoke F5): the DS inset line ring vanished on the black pill\n   and drew square corners. The pill's ring is cream, sits in the obsidian\n   glass's 3px rim (offset 0), and follows the stadium (the pill's radius). */\n[data-vibe-menu] .vm-pill:focus-visible {\n  outline: var(--stroke-focus) solid var(--vibes-cream);\n  outline-offset: 0;\n}\n[data-vibe-menu] .vm-menu.has-card .vm-tab:not(.is-active) {\n  opacity: var(--opacity-tab-inactive);\n}\n[data-vibe-menu] .vm-badge {\n  position: absolute;\n  top: -4px;\n  right: 6px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  border-radius: var(--radius-full);\n  background: var(--badge);\n  color: var(--on-badge);\n  font: 700 11px/18px var(--font-display);\n  text-align: center;\n}\n/* the bar sits against the pill: it runs half the glass under it */\n[data-vibe-menu] .vm-bar-anchor {\n  position: relative;\n  height: var(--size-bar);\n}\n[data-vibe-menu] .vm-bar-anchor .vm-strip {\n  position: absolute;\n  left: 0;\n  bottom: 0;\n}\n[data-vibe-menu] .vm-bar-anchor .vm-glass {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n}\n/* phones: the bar spans the width; tabs sized to their content, icon above label */\n[data-vibe-menu] .vm-strip.is-phone {\n  width: 100%;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab {\n  width: auto;\n  flex: 1 1 auto;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--space-2);\n  min-width: 0;\n  padding: 4px 2px;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab-circle {\n  width: var(--size-icon-circle-phone);\n  height: var(--size-icon-circle-phone);\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab svg {\n  width: 12px;\n  height: 12px;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab[data-section=\"home\"] {\n  padding: 4px 2px 4px calc(2px + var(--size-home-extra) * 0.7);\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab[data-section=\"share\"] {\n  padding-right: var(--size-bar-end);\n  flex-grow: 1;\n}\n[data-vibe-menu] .vm-strip.is-phone .vm-tab-label {\n  position: static;\n  display: block;\n  font-size: 9.6px;\n  letter-spacing: 1px;\n  padding: 0 0 0 1px;\n}\n\n/* ---------- VibesSwitch: the pill in its obsidian glass ---------- */\n[data-vibe-menu] .vm-glass {\n  position: relative;\n  width: calc(var(--size-pill-w) + 2 * var(--size-ring));\n  height: calc(var(--size-pill-h) + 2 * var(--size-ring));\n  border-radius: var(--radius-full);\n  flex: none;\n  background:\n    linear-gradient(to right, transparent, var(--obsidian-highlight), transparent) top / 100% 1px no-repeat,\n    linear-gradient(to bottom, var(--obsidian-highlight), transparent, var(--obsidian-edge)) left / 1px 100% no-repeat,\n    var(--obsidian-fill);\n  box-shadow: var(--obsidian-shadow);\n}\n[data-vibe-menu] .vm-pill {\n  position: absolute;\n  left: var(--size-ring);\n  top: var(--size-ring);\n  width: var(--size-pill-w);\n  height: var(--size-pill-h);\n  padding: 0;\n  border: 0;\n  border-radius: var(--radius-full);\n  background: none;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-switch-art {\n  width: 100%;\n  height: 100%;\n  display: block;\n}\n[data-vibe-menu] .vm-pill .vm-badge {\n  top: -6px;\n  right: 4px;\n}\n/* #7079: the guest maker's save-time ask: a dot, not a count. */\n[data-vibe-menu] .vm-badge.is-dot {\n  min-width: 10px;\n  width: 10px;\n  height: 10px;\n  padding: 0;\n}\n[data-vibe-menu] .vm-chiclet {\n  display: inline-block;\n  padding: 2px 8px;\n  border-radius: var(--radius-full);\n  background: var(--section-code);\n  /* Port change: bundle.css writes #111111 (ink); text on a section colour is\n     menu-ink (Global Constraints), which --on-code resolves to in both themes. */\n  color: var(--on-code);\n  font: 700 11px/18px var(--font-display);\n  letter-spacing: 0.06em;\n}\n/* #4291. The chiclet's shape, so the two read as one row \u2014 but in the badge\n   colour (the identity lane) so elevation never looks like a publish state. */\n[data-vibe-menu] .vm-admin-badge {\n  display: inline-block;\n  padding: 2px 8px;\n  border-radius: var(--radius-full);\n  background: var(--badge);\n  color: var(--on-badge);\n  font: 700 11px/18px var(--font-display);\n  letter-spacing: 0.06em;\n}\n\n/* ---------- MenuCard: the card, its band and the folder-tab join, drawn once ---------- */\n[data-vibe-menu] .vm-frame {\n  position: relative;\n}\n[data-vibe-menu] .vm-frame .vm-card {\n  position: absolute;\n  left: 0;\n  top: 0;\n  background: var(--card-bg);\n  color: var(--ink);\n  overflow: hidden;\n  border-radius: var(--radius-card) var(--radius-card) 0 0;\n}\n[data-vibe-menu] .vm-frame .vm-card .vm-card-body {\n  padding-bottom: calc(var(--space-16) + var(--size-band));\n}\n[data-vibe-menu] .vm-outline {\n  position: absolute;\n  left: 0;\n  top: 0;\n  overflow: visible;\n  pointer-events: none;\n}\n[data-vibe-menu] .vm-outline .vm-band,\n[data-vibe-menu] .vm-outline .vm-cover {\n  fill: var(--accent);\n}\n[data-vibe-menu] .vm-outline .vm-edge {\n  fill: none;\n  stroke: var(--line);\n  stroke-width: 2;\n  stroke-linejoin: miter;\n}\n\n/* ---------- ActionPill: the card's one main action ---------- */\n[data-vibe-menu] .vm-ask {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--space-12);\n  width: 100%;\n  padding: var(--space-14) var(--space-18);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  background: var(--accent);\n  color: var(--on-accent);\n  font: 700 21px/1 var(--font-display);\n  letter-spacing: -0.02em;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-ask.is-solo {\n  margin-bottom: var(--space-14);\n}\n[data-vibe-menu] .vm-ask .vm-glyph {\n  width: var(--size-glyph-cta);\n  height: var(--size-glyph-cta);\n  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-vibe-menu] .vm-ask:hover .vm-glyph {\n  transform: translateX(4px);\n}\n[data-vibe-menu] .vm-ask.is-phone {\n  font-size: 18px;\n}\n[data-vibe-menu] .vm-sub:has(.vm-copy) {\n  display: flex;\n  align-items: center;\n  gap: var(--space-8);\n}\n[data-vibe-menu] .vm-sub:has(.vm-copy) > span {\n  flex: 1;\n}\n\n/* ---------- Chip ---------- */\n[data-vibe-menu] .vm-chip {\n  height: var(--size-chip);\n  padding: 0 var(--space-12);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-chip);\n  background: var(--accent);\n  color: var(--on-accent);\n  font-size: 11px;\n  flex: none;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-chip.is-ghost {\n  background: transparent;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-chip.is-name {\n  font: 700 14px/1 var(--font-display);\n  letter-spacing: 0;\n  text-transform: none;\n}\n[data-vibe-menu] .vm-chip.vm-copy {\n  height: var(--size-copy);\n  padding: 0 var(--space-14);\n  border-radius: var(--radius-copy);\n  flex-shrink: 0;\n  align-self: center;\n  white-space: nowrap;\n}\n[data-vibe-menu] .vm-suggestions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--space-6);\n}\n/* Port change (smoke F9): codegen writes long chips, so a chip wraps inside\n   the card (DS \"text that can outgrow its track wraps\") instead of running\n   past its edge; a one-line chip keeps the 28px chip height. */\n[data-vibe-menu] .vm-suggest {\n  min-height: var(--size-chip);\n  max-width: 100%;\n  min-width: 0;\n  padding: var(--space-2) var(--space-12);\n  text-align: left;\n  overflow-wrap: anywhere;\n  border: var(--stroke-mini) solid var(--suggest-border);\n  border-radius: var(--radius-chip);\n  background: none;\n  color: var(--ink);\n  font: 400 13px/20px var(--font-display);\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-suggest:hover,\n[data-vibe-menu] .vm-suggest.is-hover,\n[data-vibe-menu] .vm-suggest[aria-busy=\"true\"] {\n  border-color: var(--line-card);\n  background: color-mix(in srgb, var(--accent) 35%, transparent);\n}\n/* A pressed chip holds the row while its answer is on the way (a lookup, a\n   fork): it stays lit, and the row takes no second press. */\n[data-vibe-menu] .vm-suggest:disabled {\n  cursor: default;\n}\n[data-vibe-menu] .vm-suggest:disabled:not([aria-busy=\"true\"]) {\n  opacity: 0.5;\n}\n/* The pressed one is disabled too (the row takes no second press), so it\n   must outrank the app's global button:disabled dim (theme/global-styles.ts). */\n[data-vibe-menu] .vm-suggest[aria-busy=\"true\"] {\n  opacity: 1;\n}\n/* The same hold on the inline links at the end of the chat: the pressed link\n   keeps its lit underline, the others read as disabled (dimmed above). */\n[data-vibe-menu] .vm-suggestions.is-inline .vm-suggest[aria-busy=\"true\"] {\n  text-decoration-color: currentColor;\n}\n/* The gold option (#6768): the one capability the agent offered, a chip in the\n   same row and the same order as the others. It wears the lit state the others\n   take on hover, a full-ink outline and a filled star before the label, so it\n   reads as the offer without a second colour on the card. */\n[data-vibe-menu] .vm-suggest.is-gold {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-6);\n  border-color: var(--line-card);\n  background: color-mix(in srgb, var(--accent) 35%, transparent);\n}\n[data-vibe-menu] .vm-suggest.is-gold .vm-glyph {\n  flex: none;\n  fill: currentColor;\n}\n[data-vibe-menu] .vm-picks {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-6);\n}\n\n/* ---------- Composer: the logo pill's shape ---------- */\n[data-vibe-menu] .vm-composer {\n  display: flex;\n  align-items: stretch;\n  min-height: var(--size-composer);\n  margin-bottom: var(--space-16);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  overflow: hidden;\n  background: var(--card-bg);\n}\n[data-vibe-menu] .vm-composer:focus-within,\n[data-vibe-menu] .vm-composer.is-focus {\n  box-shadow: 0 0 0 3px var(--accent);\n}\n[data-vibe-menu] .vm-composer textarea {\n  flex: 1;\n  min-width: 0;\n  align-self: center;\n  margin: 0 var(--space-12) 0 2px;\n  padding: 0;\n  resize: none;\n  border: 0;\n  outline: 0;\n  background: transparent;\n  color: var(--ink);\n  font: 700 18px/1.2 var(--font-display);\n  letter-spacing: -0.02em;\n  field-sizing: content;\n  max-height: 2.4em;\n}\n[data-vibe-menu] .vm-composer textarea::placeholder {\n  color: var(--placeholder);\n}\n[data-vibe-menu] .vm-composer .vm-attach {\n  order: -1;\n  width: var(--size-copy);\n  height: var(--size-copy);\n  margin-left: var(--space-10);\n  align-self: center;\n  border-radius: 50%;\n  display: grid;\n  place-items: center;\n  flex: none;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-composer .vm-attach:hover {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-composer .vm-glyph {\n  width: 16px;\n  height: 16px;\n}\n[data-vibe-menu] .vm-cap {\n  flex: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 var(--space-24) 0 20px;\n  border-left: var(--stroke-rule) solid var(--line-card);\n  background: var(--section-code);\n  color: var(--on-code);\n  font: 700 14px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  white-space: nowrap;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-cap:hover {\n  background: color-mix(in oklch, var(--section-code), var(--menu-ink) 10%);\n}\n[data-vibe-menu] .vm-composer.is-building .vm-cap[data-send],\n[data-vibe-menu] .vm-composer.is-building:has(textarea:not(:placeholder-shown)) .vm-cap[data-stop] {\n  display: none;\n}\n[data-vibe-menu] .vm-composer.is-building:has(textarea:not(:placeholder-shown)) .vm-cap[data-send] {\n  display: flex;\n}\n/* Rewrite mode (the settings tab's sharing rewrite): no attach button, so the\n   field takes the attach's inset; a dim red X cap sits left of the action cap. */\n[data-vibe-menu] .vm-composer.is-rewrite {\n  position: relative;\n}\n[data-vibe-menu] .vm-composer.is-rewrite textarea {\n  margin-left: var(--space-24);\n}\n[data-vibe-menu] .vm-cap[data-cancel] {\n  padding: 0 var(--space-16);\n  background: var(--cancel-cap);\n  color: var(--on-cancel-cap);\n}\n[data-vibe-menu] .vm-cap[data-cancel]:hover {\n  background: color-mix(in oklch, var(--cancel-cap), var(--on-cancel-cap) 12%);\n}\n[data-vibe-menu] .vm-rewrite-shimmer {\n  position: absolute;\n  left: var(--space-24);\n  top: 50%;\n  width: 28%;\n  height: var(--space-12);\n  margin-top: calc(var(--space-12) / -2);\n  border-radius: var(--radius-full);\n  background: var(--placeholder);\n  opacity: 0.3;\n  pointer-events: none;\n  animation: vm-rewrite-shimmer 1.4s ease-in-out infinite;\n}\n@keyframes vm-rewrite-shimmer {\n  50% {\n    opacity: 0.12;\n  }\n}\n@media (prefers-reduced-motion: reduce) {\n  [data-vibe-menu] .vm-rewrite-shimmer {\n    animation: none;\n  }\n}\n[data-vibe-menu] .vm-queue-note {\n  display: none;\n  margin: -10px 0 12px 18px;\n  font-size: 12px;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-composer:has(textarea:not(:placeholder-shown)) + .vm-queue-note {\n  display: block;\n}\n[data-vibe-menu] .vm-composer.is-phone textarea {\n  margin-right: var(--space-6);\n  font-size: 16px;\n}\n[data-vibe-menu] .vm-composer.is-phone .vm-attach {\n  margin-left: 4px;\n  width: 28px;\n}\n[data-vibe-menu] .vm-composer.is-phone .vm-cap {\n  padding: 0 var(--space-18) 0 var(--space-14);\n}\n\n/* ---------- Row: the bar's tab grammar inside the card ---------- */\n[data-vibe-menu] .vm-group {\n  border-top: var(--stroke-rule) solid var(--line-card);\n  margin: 0 calc(-1 * var(--space-16));\n}\n[data-vibe-menu] .vm-group.is-flush {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-row {\n  display: flex;\n  align-items: center;\n  gap: var(--space-12);\n  width: 100%;\n  height: var(--size-row);\n  padding: 0 var(--space-16);\n}\n[data-vibe-menu] .vm-row.is-compact {\n  height: var(--size-row-compact);\n}\n[data-vibe-menu] .vm-row + .vm-row {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-row .vm-label {\n  flex: 1;\n}\n[data-vibe-menu] .vm-dot {\n  width: var(--size-icon-circle);\n  height: var(--size-icon-circle);\n  border-radius: 50%;\n  background: var(--ink);\n  color: var(--card-bg);\n  display: grid;\n  place-items: center;\n  flex: none;\n}\n[data-vibe-menu] button.vm-row:hover .vm-dot:not(.vm-app),\n[data-vibe-menu] .vm-row.is-hover .vm-dot:not(.vm-app) {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-row.is-quiet .vm-dot {\n  background: transparent;\n  color: var(--ink);\n  box-shadow: inset 0 0 0 2px var(--line-card);\n}\n[data-vibe-menu] .vm-row[aria-disabled=\"true\"] {\n  opacity: 0.35;\n  cursor: default;\n}\n[data-vibe-menu] .vm-row[aria-disabled=\"true\"] .vm-dot {\n  background: var(--ink) !important;\n  color: var(--card-bg) !important;\n}\n[data-vibe-menu] .vm-app,\n[data-vibe-menu] .vm-initial {\n  font: 700 12px/1 var(--font-tab);\n  box-shadow: inset 0 0 0 2px var(--line-card);\n}\n[data-vibe-menu] .vm-app {\n  background: var(--app);\n  color: var(--menu-ink);\n}\n[data-vibe-menu] .vm-initial {\n  background: transparent;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-chev {\n  display: grid;\n  color: var(--muted);\n  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-vibe-menu] .vm-chev.is-open {\n  transform: rotate(90deg);\n}\n[data-vibe-menu] .vm-count {\n  font: 700 12px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-count.is-handle {\n  max-width: 45%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  letter-spacing: 0.02em;\n}\n[data-vibe-menu] .vm-switch {\n  position: relative;\n  width: var(--size-switch-w);\n  height: 20px;\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-switch);\n  flex: none;\n}\n[data-vibe-menu] .vm-switch::after {\n  content: \"\";\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n  background: var(--ink);\n}\n[data-vibe-menu] .vm-switch.is-on {\n  background: var(--accent);\n}\n[data-vibe-menu] .vm-switch.is-on::after {\n  left: 18px;\n}\n\n/* ---------- BackRow and DoneButton: a drill-in's frame ---------- */\n[data-vibe-menu] .vm-back {\n  display: flex;\n  align-items: center;\n  gap: var(--space-12);\n  width: calc(100% + 2 * var(--space-16));\n  height: var(--size-row-compact);\n  margin: 0 calc(-1 * var(--space-16));\n  padding: 0 var(--space-16);\n  border-top: var(--stroke-rule) solid var(--line-card);\n  border-bottom: var(--stroke-hairline) solid var(--line-hairline);\n}\n/* A drill that replaces the whole card body (Share, Account) sits on the card's\n   top edge, which the outline already draws: no rule, and it takes the body's\n   top padding so no empty band shows above it (cards-hero.css .card-title + .h-back). */\n[data-vibe-menu] .vm-back.is-top {\n  margin-top: calc(-1 * var(--space-14));\n  border-top: 0;\n}\n[data-vibe-menu] .vm-back .vm-label {\n  flex: none;\n}\n[data-vibe-menu] .vm-back-name {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font: 400 16px/1.1 var(--font-display);\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-back:hover .vm-dot,\n[data-vibe-menu] .vm-back.is-hover .vm-dot {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-drill {\n  padding-top: var(--space-14);\n}\n[data-vibe-menu] .vm-drill-sec + .vm-drill-sec {\n  margin-top: var(--space-14);\n}\n[data-vibe-menu] .vm-drill-line {\n  margin: 0 0 var(--space-14);\n  font: 700 18px/1.25 var(--font-display);\n  letter-spacing: -0.01em;\n}\n[data-vibe-menu] .vm-done {\n  display: block;\n  width: 100%;\n  height: var(--size-row-compact);\n  margin-top: var(--space-16);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-done);\n  background: var(--accent);\n  color: var(--on-accent);\n  text-align: center;\n  font: 700 14px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  cursor: pointer;\n}\n[data-vibe-menu] .vm-textbtn {\n  display: block;\n  width: 100%;\n  height: 40px;\n  margin-top: var(--space-4);\n  text-align: center;\n  font: 700 12px/1 var(--font-tab);\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-textbtn:hover {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-faq {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--space-12);\n  width: 100%;\n  padding: var(--space-12) 0;\n  font: 400 16px/1.3 var(--font-display);\n}\n[data-vibe-menu] .vm-faq + .vm-faq {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n\n/* ---------- MomentLine: the current moment ---------- */\n[data-vibe-menu] .vm-moments {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-8);\n}\n[data-vibe-menu] .vm-moment {\n  margin: 0;\n  font: 400 16px/1.3 var(--font-display);\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-moment.is-pinned {\n  padding: var(--space-10) var(--space-12) var(--space-12) var(--space-14);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-left: var(--size-band) solid var(--accent);\n  border-radius: var(--radius-moment);\n}\n[data-vibe-menu] .vm-moment-text {\n  margin: 0 0 var(--space-10);\n}\n[data-vibe-menu] .vm-moment-actions {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-6);\n}\n[data-vibe-menu] .vm-moment-hint {\n  font-size: 12px;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-moment.is-progress,\n[data-vibe-menu] .vm-moment.is-summary {\n  display: flex;\n  align-items: center;\n  gap: var(--space-10);\n  padding: 0 var(--space-2);\n}\n[data-vibe-menu] .vm-moment.is-summary {\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-moment.is-expander {\n  width: 100%;\n  gap: var(--space-8);\n}\n[data-vibe-menu] .vm-moment.is-expander:hover {\n  color: var(--ink);\n}\n/* The live line's link (the first build's real address, #6451 S9c): pointer\n   events back on, since the layer takes no hits of its own. */\n[data-vibe-menu] .vm-moment-link {\n  display: inline-block;\n  margin: 0 var(--space-2);\n  font: 400 14px/1.3 var(--font-display);\n  color: var(--ink);\n  text-decoration: underline;\n  text-underline-offset: 3px;\n  overflow-wrap: anywhere;\n  pointer-events: auto;\n}\n[data-vibe-menu] .vm-live .vm-chev {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-log-clip {\n  overflow: hidden;\n}\n/* Port addition (RULINGS R1): the log clip is always rendered (RECONCILE \u00A75c),\n   so the base stylesheet owns its shut and open states. The shell's per-frame\n   tween (T11) writes an inline height, which overrides these during motion.\n   C's VIBE_MENU_SHELL_CSS does not repeat them. */\n[data-vibe-menu] .vm-log-clip[data-open=\"false\"] {\n  height: 0;\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-log-clip[data-open=\"true\"] {\n  height: auto;\n  /* Known adjustment (plan header): room for .vm-log's own 160px cap plus its\n     8px margin-top and two hairline borders, so the clip never scrolls on top\n     of the log. */\n  max-height: calc(var(--size-log-max, 160px) + var(--space-8) + 2 * var(--stroke-hairline));\n  overflow: auto;\n  /* Smoke F15: the shell's height tween makes the clip overflow for a moment;\n     .vm-log scrolls itself, so the clip never shows a bar. */\n  scrollbar-width: none;\n}\n[data-vibe-menu] .vm-log-clip[data-open=\"true\"]::-webkit-scrollbar {\n  display: none;\n}\n/* The fold over the full chat (slots.agentLog): the history caps and scrolls\n   itself (AgentLogHistory's compact box), so the clip drops the flat log's cap. */\n[data-vibe-menu] .vm-log-clip[data-open=\"true\"][data-history] {\n  max-height: none;\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-log-history {\n  margin-top: var(--space-8);\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n  border-bottom: var(--stroke-hairline) solid var(--line-hairline);\n}\n/* One scroller: the tab-row card with the full chat open. The history's own\n   cap (AgentLogHistory's compact box) knows nothing of what else the card\n   holds, and the first build's request headline can take a third of it: the\n   card then overflowed and scrolled too, the composer slid under the row, and\n   the chat's end was out of reach. Here the card is a column whose fold gives\n   up exactly what the card lacks, so the history scrolls and the card never\n   does. Everything else in the card keeps its own height. */\n[data-vibe-menu] .vm-card:has(.vm-ctab .vm-log-clip[data-open=\"true\"][data-history]) {\n  display: flex;\n  flex-direction: column;\n}\n[data-vibe-menu] .vm-card:has(.vm-ctab .vm-log-clip[data-open=\"true\"][data-history])::before {\n  flex: none;\n}\n[data-vibe-menu] .vm-card:has(.vm-ctab .vm-log-clip[data-open=\"true\"][data-history]) .vm-card-body,\n[data-vibe-menu] .vm-ctab:has(.vm-log-clip[data-open=\"true\"][data-history]),\n[data-vibe-menu] .vm-ctab .vm-moments:has(.vm-log-clip[data-open=\"true\"][data-history]),\n[data-vibe-menu] .vm-ctab .vm-live:has(.vm-log-clip[data-open=\"true\"][data-history]),\n[data-vibe-menu] .vm-ctab .vm-log-clip[data-open=\"true\"][data-history],\n[data-vibe-menu] .vm-ctab .vm-log-clip[data-open=\"true\"][data-history] .vm-log-history {\n  display: flex;\n  flex-direction: column;\n  flex: 0 1 auto;\n  min-height: 0;\n}\n[data-vibe-menu] .vm-ctab .vm-log-clip[data-open=\"true\"][data-history] .vm-log-history > * {\n  min-height: 0;\n}\n[data-vibe-menu] .vm-ctab:has(.vm-log-clip[data-open=\"true\"][data-history]) > :not(.vm-moments),\n[data-vibe-menu] .vm-ctab .vm-live:has(.vm-log-clip[data-open=\"true\"][data-history]) > :not(.vm-log-clip) {\n  flex-shrink: 0;\n}\n[data-vibe-menu] .vm-agent-history-tail {\n  padding: var(--space-10) 4px var(--space-14) var(--space-24);\n}\n/* Suggestions at the end of the chat: wrapped inline links, not chips. */\n[data-vibe-menu] .vm-suggestions.is-inline {\n  gap: var(--space-6) var(--space-14);\n  margin-bottom: 0;\n}\n[data-vibe-menu] .vm-suggestions.is-inline .vm-suggest {\n  min-height: 0;\n  padding: 0;\n  border: none;\n  border-radius: 0;\n  background: none;\n  text-decoration: underline;\n  text-decoration-color: var(--suggest-border);\n  text-decoration-thickness: 1px;\n  text-underline-offset: 3px;\n}\n[data-vibe-menu] .vm-suggestions.is-inline .vm-suggest:hover,\n[data-vibe-menu] .vm-suggestions.is-inline .vm-suggest.is-hover,\n[data-vibe-menu] .vm-suggestions.is-inline .vm-suggest.is-gold {\n  background: none;\n  text-decoration-color: currentColor;\n}\n[data-vibe-menu] .vm-log {\n  max-height: var(--size-log-max);\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-6);\n  margin-top: var(--space-8);\n  padding: var(--space-10) 4px var(--space-10) var(--space-24);\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n  border-bottom: var(--stroke-hairline) solid var(--line-hairline);\n  font-size: 13.5px;\n  line-height: 1.35;\n}\n[data-vibe-menu] .vm-log-line {\n  margin: 0;\n}\n[data-vibe-menu] .vm-log-line:first-child {\n  margin-top: auto;\n}\n[data-vibe-menu] .vm-log-line b {\n  font: 700 10px/1 var(--font-tab);\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  color: var(--muted);\n  margin-right: 4px;\n}\n\n/* ---------- AccessToggle: Restricted | Public and its line ---------- */\n[data-vibe-menu] .vm-access {\n  display: flex;\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-access button {\n  flex: 1;\n  height: var(--size-bar);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--space-10);\n  text-align: center;\n  font: 700 24px/1 var(--font-display);\n  letter-spacing: -0.02em;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-access button + button {\n  border-left: var(--stroke-rule) solid var(--line-card);\n}\n[data-vibe-menu] .vm-access button.is-active {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-access button:not(.is-active):hover {\n  background: color-mix(in srgb, var(--accent) 20%, transparent);\n}\n/* Settings still loading (preflight ruling P14): dimmed and inert. */\n[data-vibe-menu] .vm-access[aria-disabled=\"true\"] {\n  opacity: var(--opacity-row-disabled);\n}\n[data-vibe-menu] .vm-access[aria-disabled=\"true\"] button {\n  cursor: default;\n}\n[data-vibe-menu] .vm-access[aria-disabled=\"true\"] button:not(.is-active):hover {\n  background: transparent;\n}\n[data-vibe-menu] .vm-access-line {\n  display: flex;\n  align-items: center;\n  gap: var(--space-10);\n  min-height: var(--size-access-line);\n  margin: var(--space-10) 0 var(--space-12);\n  padding: var(--space-6) var(--space-6) var(--space-6) var(--space-14);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-access-line);\n  background: var(--share-tint);\n  font-size: 16.5px;\n  line-height: 1.25;\n}\n[data-vibe-menu] .vm-access-line > span {\n  flex: 1;\n  min-width: 0;\n}\n[data-vibe-menu] .vm-access-line .vm-glyph {\n  width: 16px;\n  height: 16px;\n}\n[data-vibe-menu] .vm-publish {\n  display: flex;\n  align-items: center;\n  gap: var(--space-8);\n  padding: 5px 5px 5px var(--space-10);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-left: var(--size-band) solid var(--accent);\n  border-radius: var(--radius-moment);\n}\n[data-vibe-menu] .vm-publish b {\n  font: 700 11px/1 var(--font-tab);\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n}\n[data-vibe-menu] .vm-publish span {\n  flex: 1;\n  min-width: 0;\n  font-size: 13px;\n  line-height: 1.25;\n  color: var(--muted);\n}\n\n/* ---------- GrantControls ---------- */\n[data-vibe-menu] .vm-seg {\n  display: flex;\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-full);\n  overflow: hidden;\n}\n[data-vibe-menu] .vm-seg button {\n  flex: 1;\n  height: var(--size-segment);\n  text-align: center;\n  font-size: 11px;\n}\n[data-vibe-menu] .vm-seg button + button {\n  border-left: var(--stroke-rule) solid var(--line-card);\n}\n[data-vibe-menu] .vm-seg button.is-active {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n[data-vibe-menu] .vm-seg.is-mini {\n  margin: 0;\n  border-width: var(--stroke-mini);\n}\n[data-vibe-menu] .vm-seg.is-mini button {\n  flex: none;\n  height: var(--size-segment-mini);\n  padding: 0 var(--space-8);\n  font-size: 10px;\n}\n[data-vibe-menu] .vm-seg.is-mini button + button {\n  border-left-width: var(--stroke-mini);\n}\n[data-vibe-menu] .vm-grants {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-6) var(--space-12);\n}\n[data-vibe-menu] .vm-grant-ctl {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n}\n[data-vibe-menu] .vm-grant-name {\n  font: 700 10px/1 var(--font-tab);\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-grant-fixed {\n  font: 700 10px/1 var(--font-tab);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  color: var(--ink);\n}\n\n/* ---------- MemberRow ---------- */\n[data-vibe-menu] .vm-input {\n  width: 100%;\n  height: var(--size-input);\n  margin-bottom: var(--space-14);\n  padding: 0 var(--space-18);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-input);\n  background: transparent;\n  color: var(--ink);\n  font: inherit;\n}\n[data-vibe-menu] .vm-members-head {\n  margin-top: 0;\n  padding: 2px 0 var(--space-8);\n}\n[data-vibe-menu] .vm-members-head + .vm-input {\n  height: 40px;\n  margin-bottom: var(--space-8);\n}\n[data-vibe-menu] .vm-person {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-8) var(--space-12);\n  padding: var(--space-6) 0;\n}\n[data-vibe-menu] .vm-person + .vm-person {\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-person .vm-label {\n  flex: 1;\n  min-width: 0;\n}\n[data-vibe-menu] .vm-request {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-8) var(--space-12);\n  margin-bottom: 2px;\n  padding: var(--space-10) var(--space-12);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: var(--radius-card);\n  background: var(--share-tint-strong);\n}\n[data-vibe-menu] .vm-request-top {\n  flex: 1 0 auto;\n}\n[data-vibe-menu] .vm-request-actions {\n  display: flex;\n  gap: var(--space-6);\n  margin-left: auto;\n}\n[data-vibe-menu] .vm-who-block > .vm-row {\n  width: calc(100% + 2 * var(--space-16));\n  margin: 2px calc(-1 * var(--space-16)) 0;\n  border-top: var(--stroke-hairline) solid var(--line-hairline);\n}\n[data-vibe-menu] .vm-narrow .vm-person .vm-grants,\n[data-vibe-menu] .vm-narrow .vm-request-top {\n  flex-basis: 100%;\n}\n[data-vibe-menu] .vm-narrow .vm-person .vm-grants,\n[data-vibe-menu] .vm-narrow .vm-request .vm-grants {\n  column-gap: var(--space-10);\n}\n/* stacking, as the prototype: card < bar < outline < glass and pill */\n[data-vibe-menu] .vm-frame .vm-card {\n  z-index: 1;\n}\n[data-vibe-menu] .vm-frame .vm-strip {\n  z-index: 2;\n}\n[data-vibe-menu] .vm-frame .vm-outline {\n  z-index: 3;\n}\n[data-vibe-menu] .vm-frame .vm-glass {\n  z-index: 4;\n}\n[data-vibe-menu] .vm-refresh {\n  display: grid;\n  place-items: center;\n  width: var(--size-icon-circle);\n  height: var(--size-icon-circle);\n  border: var(--stroke-rule) solid var(--line-card);\n  border-radius: 50%;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-refresh:hover {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n\n/* ---------- port additions: not in bundle.css ---------- */\n/* Rows and the action pill can be links (Home's rows, the credits action). */\n[data-vibe-menu] :where(a.vm-row, a.vm-ask) {\n  color: inherit;\n  text-decoration: none;\n}\n[data-vibe-menu] a.vm-row:hover .vm-dot:not(.vm-app) {\n  background: var(--accent);\n  color: var(--on-accent);\n}\n/* A member's name drills into that member (spec \u00A78). */\n[data-vibe-menu] .vm-person button.vm-label {\n  text-align: left;\n}\n[data-vibe-menu] .vm-chip[aria-disabled=\"true\"],\n[data-vibe-menu] .vm-cap:disabled,\n[data-vibe-menu] .vm-composer .vm-attach:disabled {\n  opacity: var(--opacity-row-disabled);\n  cursor: default;\n}\n/* Staged attachments above the composer: name chips, no emoji. */\n[data-vibe-menu] .vm-attachments {\n  margin-bottom: var(--space-8);\n}\n[data-vibe-menu] .vm-attachments .vm-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-6);\n  max-width: 220px;\n}\n[data-vibe-menu] .vm-attachments .vm-chip > span:last-child {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n[data-vibe-menu] .vm-attachments .vm-chip[data-status=\"error\"] {\n  border-color: var(--section-account);\n}\n/* A suggestion's fast-path marks (RULINGS O4, production #2917 decorateChip).\n   Siblings of .vm-suggest, since a button can't nest a button. The owner's\n   toggle (FastPathToggle) is outline when not blessed, filled when blessed\n   (aria-pressed); the badges are the marks every viewer sees. */\n[data-vibe-menu] .vm-suggest-item {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-2);\n  max-width: 100%;\n  min-width: 0;\n}\n[data-vibe-menu] .vm-suggest-item > * {\n  flex: none;\n}\n[data-vibe-menu] .vm-suggest-item > .vm-suggest {\n  flex: 0 1 auto;\n}\n[data-vibe-menu] .vm-suggest-shield {\n  width: var(--size-chip);\n  height: var(--size-chip);\n  display: inline-grid;\n  place-items: center;\n  border-radius: var(--radius-full);\n  background: none;\n  color: var(--muted);\n}\n[data-vibe-menu] .vm-suggest-shield:hover {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-suggest-shield[aria-pressed=\"true\"] {\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-suggest-shield[aria-pressed=\"true\"] .vm-glyph {\n  fill: currentColor;\n}\n/* The non-interactive marks every viewer sees (production ChipShieldBadge,\n   ChipJumpBadge): a filled shield (\"stays in this app\", server-authoritative)\n   or an arrow (\"opens another app\"). Never both on one chip. */\n[data-vibe-menu] .vm-suggest-badge {\n  width: var(--size-chip);\n  height: var(--size-chip);\n  display: inline-grid;\n  place-items: center;\n  color: var(--ink);\n}\n[data-vibe-menu] .vm-suggest-badge.is-shield .vm-glyph {\n  fill: currentColor;\n}\n[data-vibe-menu] .vm-suggest-badge.is-jump {\n  color: var(--muted);\n}\n\n/* ---------- phones (cards-hero.css): the menu's width, not the viewport ---------- */\n@container vibe-menu (max-width: 480px) {\n  [data-vibe-menu] .vm-ask {\n    font-size: 18px;\n  }\n  /* the field keeps 16px (iOS zooms smaller fields); attach slims instead */\n  [data-vibe-menu] .vm-composer textarea {\n    margin-right: var(--space-6);\n    font-size: 16px;\n  }\n  [data-vibe-menu] .vm-composer .vm-attach {\n    margin-left: 4px;\n    width: 28px;\n  }\n  [data-vibe-menu] .vm-cap {\n    padding: 0 var(--space-18) 0 var(--space-14);\n  }\n  [data-vibe-menu] .vm-access button {\n    font-size: 21px;\n  }\n  /* the access line keeps its sentence to two lines beside the chip */\n  [data-vibe-menu] .vm-access-line {\n    padding-left: 12px;\n    gap: 8px;\n    font-size: 15.5px;\n  }\n  [data-vibe-menu] .vm-access-line .vm-chip.vm-copy {\n    padding: 0 10px;\n  }\n  /* Data and Code drop under the handle on one line (two on the narrowest) */\n  [data-vibe-menu] .vm-person .vm-grants {\n    flex-basis: 100%;\n    column-gap: var(--space-10);\n  }\n  [data-vibe-menu] .vm-request .vm-grants {\n    column-gap: var(--space-10);\n  }\n  [data-vibe-menu] .vm-request-top {\n    flex-basis: 100%;\n  }\n  [data-vibe-menu] .vm-input {\n    font-size: 16px;\n  }\n}\n@container vibe-menu (max-width: 359px) {\n  [data-vibe-menu] .vm-access button {\n    font-size: 19px;\n  }\n  /* the line drops its icon here: the enclosure already marks it */\n  [data-vibe-menu] .vm-access-line > .vm-glyph {\n    display: none;\n  }\n  [data-vibe-menu] .vm-access-line {\n    margin: 8px 0 10px;\n    font-size: 14.5px;\n  }\n  [data-vibe-menu] .vm-access-line .vm-chip.vm-copy {\n    padding: 0 8px;\n  }\n  /* the cap and attach slim so the field keeps room (REMIX THIS stays one line) */\n  [data-vibe-menu] .vm-cap {\n    padding: 0 13px 0 10px;\n    letter-spacing: 0.05em;\n  }\n  [data-vibe-menu] .vm-composer .vm-attach {\n    margin-left: 3px;\n    width: 24px;\n  }\n  /* 16px, not the prototype's 14px: no text field under 16px on phones (spec \u00A74.5) */\n  [data-vibe-menu] .vm-composer textarea {\n    margin: 0 4px 0 0;\n    font-size: 16px;\n  }\n  [data-vibe-menu] .vm-chip.vm-copy {\n    padding: 0 10px;\n    letter-spacing: 0.06em;\n  }\n}\n";
 export declare function VibeMenuStyles(): React.ReactElement;