phia_ui

<svg xmlns="http://www.w3.org/2000/svg" width="900" height="120" viewBox="0 0 900 120">
  <defs>
    <!-- Dark gradient background -->
    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#0d0d1a"/>
      <stop offset="50%" style="stop-color:#12082a"/>
      <stop offset="100%" style="stop-color:#0a0d1f"/>
    </linearGradient>
    <!-- Phi symbol glow -->
    <radialGradient id="phiGlow" cx="50%" cy="50%" r="50%">
      <stop offset="0%" style="stop-color:#a78bfa;stop-opacity:0.6"/>
      <stop offset="100%" style="stop-color:#6d28d9;stop-opacity:0"/>
    </radialGradient>
    <!-- Accent gradient for text -->
    <linearGradient id="textGrad" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" style="stop-color:#c4b5fd"/>
      <stop offset="50%" style="stop-color:#f0abfc"/>
      <stop offset="100%" style="stop-color:#818cf8"/>
    </linearGradient>
    <!-- Subtle grid pattern -->
    <pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse">
      <path d="M 40 0 L 0 0 0 40" fill="none" stroke="#ffffff" stroke-width="0.15" opacity="0.08"/>
    </pattern>
    <!-- Phi glow blur filter -->
    <filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
      <feGaussianBlur stdDeviation="4" result="blur"/>
      <feComposite in="SourceGraphic" in2="blur" operator="over"/>
    </filter>
    <filter id="textGlow" x="-20%" y="-50%" width="140%" height="200%">
      <feGaussianBlur stdDeviation="2.5" result="blur"/>
      <feComposite in="SourceGraphic" in2="blur" operator="over"/>
    </filter>
    <!-- Clip -->
    <clipPath id="clip">
      <rect width="900" height="120" rx="12"/>
    </clipPath>
  </defs>

  <!-- Background -->
  <g clip-path="url(#clip)">
    <rect width="900" height="120" fill="url(#bg)"/>
    <rect width="900" height="120" fill="url(#grid)"/>

    <!-- Decorative left accent line -->
    <line x1="0" y1="0" x2="900" y2="0" stroke="#7c3aed" stroke-width="2" opacity="0.7"/>
    <line x1="0" y1="119" x2="900" y2="119" stroke="#4f46e5" stroke-width="1" opacity="0.4"/>

    <!-- Glow blob behind phi -->
    <ellipse cx="450" cy="60" rx="60" ry="45" fill="url(#phiGlow)"/>

    <!-- Left decorative dots -->
    <circle cx="30" cy="30" r="2" fill="#7c3aed" opacity="0.6"/>
    <circle cx="50" cy="50" r="1.5" fill="#4f46e5" opacity="0.4"/>
    <circle cx="20" cy="80" r="1" fill="#a78bfa" opacity="0.5"/>
    <circle cx="60" cy="90" r="2.5" fill="#6d28d9" opacity="0.3"/>
    <circle cx="80" cy="25" r="1.5" fill="#818cf8" opacity="0.5"/>

    <!-- Right decorative dots -->
    <circle cx="870" cy="30" r="2" fill="#7c3aed" opacity="0.6"/>
    <circle cx="850" cy="50" r="1.5" fill="#4f46e5" opacity="0.4"/>
    <circle cx="880" cy="80" r="1" fill="#a78bfa" opacity="0.5"/>
    <circle cx="840" cy="90" r="2.5" fill="#6d28d9" opacity="0.3"/>
    <circle cx="820" cy="25" r="1.5" fill="#818cf8" opacity="0.5"/>

    <!-- Phi (ϕ) symbol — constructed from SVG paths -->
    <!-- Circle part of phi -->
    <circle cx="450" cy="60" r="22" fill="none" stroke="#c4b5fd" stroke-width="3.5" opacity="0.9" filter="url(#glow)"/>
    <!-- Vertical bar of phi -->
    <line x1="450" y1="24" x2="450" y2="96" stroke="#e0d4ff" stroke-width="3.5" stroke-linecap="round" opacity="0.95" filter="url(#glow)"/>
    <!-- Inner accent dot -->
    <circle cx="450" cy="60" r="4" fill="#f0abfc" opacity="0.8"/>

    <!-- "PhiaUI" text — shadow/glow pass -->
    <text x="450" y="68" text-anchor="middle"
          font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif"
          font-size="0" fill="none" opacity="0">PhiaUI</text>

    <!-- Left "Phia" -->
    <text x="320" y="69"
          font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif"
          font-size="36" font-weight="700" letter-spacing="-0.5"
          fill="#f0abfc" opacity="0.18" filter="url(#textGlow)">Phia</text>
    <text x="320" y="69"
          font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif"
          font-size="36" font-weight="700" letter-spacing="-0.5"
          fill="url(#textGrad)">Phia</text>

    <!-- Right "UI" -->
    <text x="496" y="69"
          font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif"
          font-size="36" font-weight="700" letter-spacing="-0.5"
          fill="#f0abfc" opacity="0.18" filter="url(#textGlow)">UI</text>
    <text x="496" y="69"
          font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif"
          font-size="36" font-weight="700" letter-spacing="-0.5"
          fill="url(#textGrad)">UI</text>

    <!-- Tagline -->
    <text x="450" y="96"
          text-anchor="middle"
          font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif"
          font-size="11" font-weight="400" letter-spacing="2.5"
          fill="#a78bfa" opacity="0.75">534 PHOENIX LIVEVIEW COMPONENTS</text>

    <!-- Subtle corner brackets -->
    <path d="M 18 8 L 8 8 L 8 18" fill="none" stroke="#7c3aed" stroke-width="1.5" opacity="0.5" stroke-linecap="round"/>
    <path d="M 882 8 L 892 8 L 892 18" fill="none" stroke="#7c3aed" stroke-width="1.5" opacity="0.5" stroke-linecap="round"/>
    <path d="M 18 112 L 8 112 L 8 102" fill="none" stroke="#4f46e5" stroke-width="1.5" opacity="0.5" stroke-linecap="round"/>
    <path d="M 882 112 L 892 112 L 892 102" fill="none" stroke="#4f46e5" stroke-width="1.5" opacity="0.5" stroke-linecap="round"/>
  </g>
</svg>