agentvibes 2.0.20 → 2.0.22

package/agentvibes.org/app/css/additional-styles/theme.css

@@ -1,82 +0,0 @@
-/* Custom AOS animations */
-@media screen {
-  html:not(.no-js) body [data-aos="fade-up"] {
-    -webkit-transform: translate3d(0, 10px, 0);
-    transform: translate3d(0, 10px, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-down"] {
-    -webkit-transform: translate3d(0, -10px, 0);
-    transform: translate3d(0, -10px, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-right"] {
-    -webkit-transform: translate3d(-10px, 0, 0);
-    transform: translate3d(-10px, 0, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-left"] {
-    -webkit-transform: translate3d(10px, 0, 0);
-    transform: translate3d(10px, 0, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-up-right"] {
-    -webkit-transform: translate3d(-10px, 10px, 0);
-    transform: translate3d(-10px, 10px, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-up-left"] {
-    -webkit-transform: translate3d(10px, 10px, 0);
-    transform: translate3d(10px, 10px, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-down-right"] {
-    -webkit-transform: translate3d(-10px, -10px, 0);
-    transform: translate3d(-10px, -10px, 0);
-  }
-
-  html:not(.no-js) body [data-aos="fade-down-left"] {
-    -webkit-transform: translate3d(10px, -10px, 0);
-    transform: translate3d(10px, -10px, 0);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-in-up"] {
-    -webkit-transform: translate3d(0, 10px, 0) scale(0.6);
-    transform: translate3d(0, 10px, 0) scale(0.6);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-in-down"] {
-    -webkit-transform: translate3d(0, -10px, 0) scale(0.6);
-    transform: translate3d(0, -10px, 0) scale(0.6);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-in-right"] {
-    -webkit-transform: translate3d(-10px, 0, 0) scale(0.6);
-    transform: translate3d(-10px, 0, 0) scale(0.6);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-in-left"] {
-    -webkit-transform: translate3d(10px, 0, 0) scale(0.6);
-    transform: translate3d(10px, 0, 0) scale(0.6);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-out-up"] {
-    -webkit-transform: translate3d(0, 10px, 0) scale(1.2);
-    transform: translate3d(0, 10px, 0) scale(1.2);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-out-down"] {
-    -webkit-transform: translate3d(0, -10px, 0) scale(1.2);
-    transform: translate3d(0, -10px, 0) scale(1.2);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-out-right"] {
-    -webkit-transform: translate3d(-10px, 0, 0) scale(1.2);
-    transform: translate3d(-10px, 0, 0) scale(1.2);
-  }
-
-  html:not(.no-js) body [data-aos="zoom-out-left"] {
-    -webkit-transform: translate3d(10px, 0, 0) scale(1.2);
-    transform: translate3d(10px, 0, 0) scale(1.2);
-  }
-}

package/agentvibes.org/app/css/additional-styles/utility-patterns.css

@@ -1,55 +0,0 @@
-/* Buttons */
-.btn,
-.btn-sm {
-    @apply inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium transition-all;
-}
-
-.btn {
-    @apply px-4 py-[11px];
-}
-
-.btn-sm {
-    @apply px-3 py-[7px];
-}
-
-/* Forms */
-input[type='search']::-webkit-search-decoration,
-input[type='search']::-webkit-search-cancel-button,
-input[type='search']::-webkit-search-results-button,
-input[type='search']::-webkit-search-results-decoration {
-    -webkit-appearance: none;
-}
-
-.form-input,
-.form-textarea,
-.form-multiselect,
-.form-select,
-.form-checkbox,
-.form-radio {
-    @apply border border-gray-700 bg-gray-900/50 focus:border-gray-600 focus:ring-0 focus:ring-offset-0;
-}
-
-.form-input,
-.form-textarea,
-.form-multiselect,
-.form-select {
-    @apply rounded-lg px-4 py-2.5 text-sm text-gray-200;
-}
-
-.form-input,
-.form-textarea {
-    @apply placeholder-gray-600;
-}
-
-.form-select {
-    @apply pr-10;
-}
-
-.form-checkbox,
-.form-radio {
-    @apply text-indigo-500;
-}
-
-.form-checkbox {
-    @apply rounded-xs;
-}

package/agentvibes.org/app/css/style.css

@@ -1,100 +0,0 @@
-@import 'tailwindcss';
-
-/* Additional styles */
-@import './additional-styles/utility-patterns.css' layer(components);
-@import './additional-styles/theme.css';
-
-@plugin "@tailwindcss/forms" {
-  strategy: base;
-}
-
-@theme {
-  /* AgentVibes Brand Colors */
-  --color-agent-cyan: #00d9ff;
-  --color-agent-magenta: #ff00ff;
-  --color-agent-dark: #1a1a1a;
-  --color-agent-cyan-light: #5ce1e6;
-  --color-agent-magenta-light: #ff66ff;
-
-  --font-inter: var(--font-inter), sans-serif;
-  --font-nacelle: var(--font-nacelle), sans-serif;
-
-  --text-xs: 0.8125rem;
-  --text-xs--line-height: 1.5384;
-  --text-sm: 0.875rem;
-  --text-sm--line-height: 1.5715;
-  --text-base: 0.9375rem;
-  --text-base--line-height: 1.5333;
-  --text-base--letter-spacing: -0.0125em;
-  --text-lg: 1.125rem;
-  --text-lg--line-height: 1.5;
-  --text-lg--letter-spacing: -0.0125em;
-  --text-xl: 1.25rem;
-  --text-xl--line-height: 1.5;
-  --text-xl--letter-spacing: -0.0125em;
-  --text-2xl: 1.5rem;
-  --text-2xl--line-height: 1.415;
-  --text-2xl--letter-spacing: -0.0268em;
-  --text-3xl: 1.75rem;
-  --text-3xl--line-height: 1.3571;
-  --text-3xl--letter-spacing: -0.0268em;
-  --text-4xl: 2.5rem;
-  --text-4xl--line-height: 1.1;
-  --text-4xl--letter-spacing: -0.0268em;
-  --text-5xl: 3.5rem;
-  --text-5xl--line-height: 1;
-  --text-5xl--letter-spacing: -0.0268em;
-  --text-6xl: 4rem;
-  --text-6xl--line-height: 1;
-  --text-6xl--letter-spacing: -0.0268em;
-  --text-7xl: 4.5rem;
-  --text-7xl--line-height: 1;
-  --text-7xl--letter-spacing: -0.0268em;
-
-  --animate-shine: shine 5s ease-in-out 500ms infinite;
-  --animate-gradient: gradient 6s linear infinite;
-
-  @keyframes shine {
-    0% {
-      top: 0;
-      transform: scaleY(5);
-      opacity: 0;
-    }
-    10% {
-      opacity: 0.8;
-    }
-    20% {
-      top: 100%;
-      transform: scaleY(10);
-      opacity: 0;
-    }
-    100% {
-      top: 100%;
-      transform: scaleY(1);
-      opacity: 0;
-    }
-  }
-  @keyframes gradient {
-    to {
-      background-position: 200% center;
-    }
-  }
-}
-
-/*
-  The default border color has changed to `currentColor` in Tailwind CSS v4,
-  so we've added these compatibility styles to make sure everything still
-  looks the same as it did with Tailwind CSS v3.
-
-  If we ever want to remove these styles, we need to add an explicit border
-  color utility to any element that depends on these defaults.
-*/
-@layer base {
-  *,
-  ::after,
-  ::before,
-  ::backdrop,
-  ::file-selector-button {
-    border-color: var(--color-gray-200, currentColor);
-  }
-}

package/agentvibes.org/app/layout.tsx

@@ -1,63 +0,0 @@
-import "./css/style.css";
-
-import { Inter } from "next/font/google";
-import localFont from "next/font/local";
-
-import Header from "@/components/ui/header";
-
-const inter = Inter({
-  subsets: ["latin"],
-  variable: "--font-inter",
-  display: "swap",
-});
-
-const nacelle = localFont({
-  src: [
-    {
-      path: "../public/fonts/nacelle-regular.woff2",
-      weight: "400",
-      style: "normal",
-    },
-    {
-      path: "../public/fonts/nacelle-italic.woff2",
-      weight: "400",
-      style: "italic",
-    },
-    {
-      path: "../public/fonts/nacelle-semibold.woff2",
-      weight: "600",
-      style: "normal",
-    },
-    {
-      path: "../public/fonts/nacelle-semibolditalic.woff2",
-      weight: "600",
-      style: "italic",
-    },
-  ],
-  variable: "--font-nacelle",
-  display: "swap",
-});
-
-export const metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
-};
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <html lang="en">
-      <body
-        className={`${inter.variable} ${nacelle.variable} bg-gray-950 font-inter text-base text-gray-200 antialiased`}
-      >
-        <div className="flex min-h-screen flex-col overflow-hidden supports-[overflow:clip]:overflow-clip">
-          <Header />
-          {children}
-        </div>
-      </body>
-    </html>
-  );
-}

package/agentvibes.org/components/code-block.tsx

@@ -1,27 +0,0 @@
-'use client';
-
-import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
-import { vscDarkPlus } from 'react-syntax-highlighter/dist/esm/styles/prism';
-
-interface CodeBlockProps {
-  language: string;
-  children: string;
-}
-
-export function CodeBlock({ language, children }: CodeBlockProps) {
-  return (
-    <SyntaxHighlighter
-      language={language}
-      style={vscDarkPlus}
-      customStyle={{
-        margin: '1.5rem 0',
-        borderRadius: '0.75rem',
-        fontSize: '0.875rem',
-        border: '1px solid rgb(31 41 55)', // gray-800
-        padding: '1.5rem',
-      }}
-    >
-      {children}
-    </SyntaxHighlighter>
-  );
-}

package/agentvibes.org/components/cta.tsx

@@ -1,58 +0,0 @@
-import Image from "next/image";
-import BlurredShape from "@/public/images/blurred-shape.svg";
-
-export default function Cta() {
-  return (
-    <section className="relative overflow-hidden">
-      <div
-        className="pointer-events-none absolute bottom-0 left-1/2 -z-10 -mb-24 ml-20 -translate-x-1/2"
-        aria-hidden="true"
-      >
-        <Image
-          className="max-w-none"
-          src={BlurredShape}
-          width={760}
-          height={668}
-          alt="Blurred shape"
-        />
-      </div>
-      <div className="max-w6xl mx-auto px-4 sm:px-6">
-        <div className="bg-linear-to-r from-transparent via-gray-800/50 py-12 md:py-20">
-          <div className="mx-auto max-w-3xl text-center">
-            <h2
-              className="animate-[gradient_6s_linear_infinite] bg-[linear-gradient(to_right,var(--color-gray-200),var(--color-indigo-200),var(--color-gray-50),var(--color-indigo-300),var(--color-gray-200))] bg-[length:200%_auto] bg-clip-text pb-8 font-nacelle text-3xl font-semibold text-transparent md:text-4xl"
-              data-aos="fade-up"
-            >
-              Join the Discussion
-            </h2>
-            <div className="mx-auto max-w-xs sm:flex sm:max-w-none sm:justify-center">
-              <div data-aos="fade-up" data-aos-delay={400}>
-                <a
-                  className="btn group mb-4 w-full bg-linear-to-t from-indigo-600 to-indigo-500 bg-[length:100%_100%] bg-[bottom] text-white shadow-[inset_0px_1px_0px_0px_--theme(--color-white/.16)] hover:bg-[length:100%_150%] sm:mb-0 sm:w-auto"
-                  href="https://github.com/paulpreibisch/AgentVibes/discussions"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                >
-                  <span className="relative inline-flex items-center">
-                    GitHub Discussions
-                    <span className="ml-1 tracking-normal text-white/50 transition-transform group-hover:translate-x-0.5">
-                      -&gt;
-                    </span>
-                  </span>
-                </a>
-              </div>
-              <div data-aos="fade-up" data-aos-delay={600}>
-                <a
-                  className="btn relative w-full bg-linear-to-b from-gray-800 to-gray-800/60 bg-[length:100%_100%] bg-[bottom] text-gray-300 before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)] hover:bg-[length:100%_150%] sm:ml-4 sm:w-auto"
-                  href="mailto:paul@agentvibes.org"
-                >
-                  Contact paul@agentvibes.org
-                </a>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}

package/agentvibes.org/components/features.tsx

@@ -1,256 +0,0 @@
-import Image from "next/image";
-import BlurredShapeGray from "@/public/images/blurred-shape-gray.svg";
-import BlurredShape from "@/public/images/blurred-shape.svg";
-import FeaturesImage from "@/public/images/features.png";
-
-export default function Features() {
-  return (
-    <section className="relative">
-      <div
-        className="pointer-events-none absolute left-1/2 top-0 -z-10 -mt-20 -translate-x-1/2"
-        aria-hidden="true"
-      >
-        <Image
-          className="max-w-none"
-          src={BlurredShapeGray}
-          width={760}
-          height={668}
-          alt="Blurred shape"
-        />
-      </div>
-      <div
-        className="pointer-events-none absolute bottom-0 left-1/2 -z-10 -mb-80 -translate-x-[120%] opacity-50"
-        aria-hidden="true"
-      >
-        <Image
-          className="max-w-none"
-          src={BlurredShape}
-          width={760}
-          height={668}
-          alt="Blurred shape"
-        />
-      </div>
-      <div className="mx-auto max-w-6xl px-4 sm:px-6">
-        <div className="border-t py-12 [border-image:linear-gradient(to_right,transparent,--theme(--color-slate-400/.25),transparent)1] md:py-20">
-          {/* Section header */}
-          <div id="products" className="mx-auto max-w-3xl pb-4 text-center md:pb-12">
-            <div className="inline-flex items-center gap-3 pb-3 before:h-px before:w-8 before:bg-linear-to-r before:from-transparent before:to-indigo-200/50 after:h-px after:w-8 after:bg-linear-to-l after:from-transparent after:to-indigo-200/50">
-              <span className="inline-flex bg-linear-to-r from-indigo-500 to-indigo-200 bg-clip-text text-transparent">
-                Products
-              </span>
-            </div>
-            <h2 className="animate-[gradient_6s_linear_infinite] bg-[linear-gradient(to_right,var(--color-gray-200),var(--color-indigo-200),var(--color-gray-50),var(--color-indigo-300),var(--color-gray-200))] bg-[length:200%_auto] bg-clip-text pb-4 font-nacelle text-3xl font-semibold text-transparent md:text-4xl">
-              AgentVibes v2.0
-            </h2>
-            <p className="text-lg text-indigo-200/65">
-              The Multi-Provider Revolution - Choose between ElevenLabs (150+ premium AI voices) or Piper TTS (50+ free voices).
-              200+ total voices, 30+ languages, 19 personalities, and seamless provider switching.
-            </p>
-          </div>
-          <div className="flex justify-center pb-4 md:pb-12" data-aos="fade-up">
-            <Image
-              className="max-w-none"
-              src={FeaturesImage}
-              width={1104}
-              height={384}
-              alt="Features"
-            />
-          </div>
-          {/* Items */}
-          <div className="mx-auto grid max-w-sm gap-12 sm:max-w-none sm:grid-cols-2 md:gap-x-14 md:gap-y-16 lg:grid-cols-3">
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path d="M0 0h14v17H0V0Zm2 2v13h10V2H2Z" />
-                <path
-                  fillOpacity=".48"
-                  d="m16.295 5.393 7.528 2.034-4.436 16.412L5.87 20.185l.522-1.93 11.585 3.132 3.392-12.55-5.597-1.514.522-1.93Z"
-                />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                Multi-Provider Support
-              </h3>
-              <p className="text-indigo-200/65">
-                Choose between ElevenLabs (150+ premium AI voices) or Piper TTS (50+ free, offline neural voices).
-                Switch providers seamlessly with /agent-vibes:provider switch command.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path fillOpacity=".48" d="M7 8V0H5v8h2Zm12 16v-4h-2v4h2Z" />
-                <path d="M19 6H0v2h17v8H7v-6H5v8h19v-2h-5V6Z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                27+ Professional Voices
-              </h3>
-              <p className="text-indigo-200/65">
-                Curated library of premium ElevenLabs voices including Aria, Archer, Cowboy Bob, Pirate Marshal,
-                and Grandpa Spuds. Character voices, accents, and unique personalities.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path d="M23.414 6 18 .586 16.586 2l3 3H7a6 6 0 0 0-6 6h2a4 4 0 0 1 4-4h12.586l-3 3L18 11.414 23.414 6Z" />
-                <path
-                  fillOpacity=".48"
-                  d="M13.01 12.508a2.5 2.5 0 0 0-3.502.482L1.797 23.16.203 21.952l7.71-10.17a4.5 4.5 0 1 1 7.172 5.437l-4.84 6.386-1.594-1.209 4.841-6.385a2.5 2.5 0 0 0-.482-3.503Z"
-                />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                19 Built-in Personalities
-              </h3>
-              <p className="text-indigo-200/65">
-                Sarcastic, flirty, pirate, grandpa, zen, angry, robot, millennial, surfer-dude, and more!
-                Each personality combines a dedicated voice with unique speaking style.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path
-                  fillOpacity=".48"
-                  d="m3.031 9.05-.593-.805 1.609-1.187.594.804a6.966 6.966 0 0 1 0 8.276l-.594.805-1.61-1.188.594-.805a4.966 4.966 0 0 0 0-5.9Z"
-                />
-                <path d="m7.456 6.676-.535-.845 1.69-1.07.534.844a11.944 11.944 0 0 1 0 12.789l-.535.845-1.69-1.071.536-.845a9.944 9.944 0 0 0 0-10.647Z" />
-                <path
-                  d="m11.888 4.35-.514-.858 1.717-1.027.513.858a16.9 16.9 0 0 1 2.4 8.677 16.9 16.9 0 0 1-2.4 8.676l-.513.859-1.717-1.028.514-.858A14.9 14.9 0 0 0 14.003 12a14.9 14.9 0 0 0-2.115-7.65Z"
-                  opacity=".48"
-                />
-                <path d="m16.321 2-.5-.866 1.733-1 .5.866A22 22 0 0 1 21 12c0 3.852-1.017 7.636-2.948 10.97l-.502.865-1.73-1.003.501-.865A19.878 19.878 0 0 0 19 12a20 20 0 0 0-2.679-10Z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                30+ Languages Supported
-              </h3>
-              <p className="text-indigo-200/65">
-                Multilingual voices including Spanish, French, German, Italian, Portuguese, Chinese, Japanese, Korean,
-                Polish, Dutch, Turkish, Russian, and more with native quality.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path
-                  fillOpacity=".48"
-                  d="M12 8.8a3 3 0 1 0 0 6 3 3 0 0 0 0-6Zm-5 3a5 5 0 1 1 10 0 5 5 0 0 1-10 0Z"
-                />
-                <path d="m7.454 2.891.891-.454L7.437.655l-.891.454a12 12 0 0 0 0 21.382l.89.454.91-1.781-.892-.455a10 10 0 0 1 0-17.818ZM17.456 1.11l-.891-.454-.909 1.782.891.454a10 10 0 0 1 0 17.819l-.89.454.908 1.781.89-.454a12 12 0 0 0 0-21.382Z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                BMAD Plugin Integration
-              </h3>
-              <p className="text-indigo-200/65">
-                Auto-detects{" "}
-                <a
-                  href="https://github.com/bmad-code-org/BMAD-METHOD"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-indigo-400 underline hover:text-indigo-300"
-                >
-                  BMAD agents
-                </a>{" "}
-                and switches voices automatically. Each agent role
-                (PM, Dev, QA, Architect) gets its own dedicated voice for immersive multi-agent sessions.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path
-                  fillOpacity=".48"
-                  d="M19 8h5v2h-5V8Zm-4 5h9v2h-9v-2Zm9 5H11v2h13v-2Z"
-                />
-                <path d="M19.406 3.844 6.083 20.497.586 15 2 13.586l3.917 3.917L17.844 2.595l1.562 1.25Z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                One-Command Install
-              </h3>
-              <p className="text-indigo-200/65">
-                Get started in seconds with npx agentvibes install. Seamless Claude Code integration,
-                instant voice setup, persistent configuration, and automatic updates.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                Sentiment System
-              </h3>
-              <p className="text-indigo-200/65">
-                Apply personality styles to ANY voice without changing it. Keep your favorite voice
-                and add sarcastic, flirty, or zen speaking styles on demand.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path fillOpacity=".48" d="M8 2v6H2V2h6zm0 8v6H2v-6h6z" />
-                <path d="M22 2v6h-6V2h6zm0 8v6h-6v-6h6zm0 8v6h-6v-6h6zM8 18v6H2v-6h6z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                Voice Preview & Replay
-              </h3>
-              <p className="text-indigo-200/65">
-                Preview voices with /agent-vibes:preview before switching. Replay the last 10 TTS messages
-                with /agent-vibes:replay. Test any voice with /agent-vibes:sample.
-              </p>
-            </article>
-            <article>
-              <svg
-                className="mb-3 fill-indigo-500"
-                xmlns="http://www.w3.org/2000/svg"
-                width={24}
-                height={24}
-              >
-                <path d="M12 2L2 7v10c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V7l-10-5z" fillOpacity=".48" />
-                <path d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z" />
-              </svg>
-              <h3 className="mb-1 font-nacelle text-[1rem] font-semibold text-gray-200">
-                Custom Voice & Personalities
-              </h3>
-              <p className="text-indigo-200/65">
-                Add your own ElevenLabs voices with /agent-vibes:add. Create custom personalities
-                with unique speaking styles. Full markdown-based personality editor included.
-              </p>
-            </article>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}