/* Brida — wordmark. El acento de marca es el puntito (tittle) de la "i",
   coloreado. Se adapta a color/tipografía de los Tweaks. */
function Wordmark({ size = 44, tone = "light", style }) {
  const dotColor = tone === "dark" ? "var(--sky)" : "var(--primary)";
  const color = tone === "dark" ? "#fff" : "var(--text)";
  return (
    <span style={{ fontFamily: "var(--font-ui)", fontWeight: 800, letterSpacing: "-0.035em", fontSize: size, lineHeight: 0.95, color, whiteSpace: "nowrap", display: "inline-block", ...style }}>
      Br<span style={{ position: "relative", display: "inline-block" }}>
        {/* "i" sin punto (dotless i) para que el único punto sea el de la marca */}
        {"\u0131"}
        <span style={{ position: "absolute", top: size * 0.05, left: "50%", transform: "translateX(-50%)", width: size * 0.155, height: size * 0.155, borderRadius: "50%", background: dotColor }} />
      </span>da
    </span>
  );
}

/* Compatibilidad: Logo/LogoMark delegan en el wordmark */
function Logo({ size = 40, tone = "light" }) { return <Wordmark size={size} tone={tone} />; }
function LogoMark({ size = 40, tone = "light" }) { return <Wordmark size={size * 0.62} tone={tone} />; }

Object.assign(window, { Wordmark, Logo, LogoMark });