feat(ui): add reusable GlassPanel component

[Spagero763]

Summary

Implements the reusable GlassPanel wrapper component requested in #32.

New file: frontend/src/app/components/GlassPanel.tsx

interface GlassPanelProps {
  children: React.ReactNode;
  className?: string;
}

export function GlassPanel({ children, className }: GlassPanelProps) {
  return (
    <div className={`glass-panel${className ? ` ${className}` : ""}`}>
      {children}
    </div>
  );
}

• Accepts children and an optional className prop (merged after glass-panel)
• Applies .glass-panel internally — the class in globals.css already enforces:
  • backdrop-filter: blur(16px) / -webkit-backdrop-filter: blur(16px)
  • background: rgba(24, 24, 27, 0.7) via --glass-bg
  • border: 1px solid rgba(255, 255, 255, 0.08) via --glass-border
  • hover: transform: translateY(-2px) + deepened box-shadow

Updated: frontend/src/app/page.tsx

Both raw <div className="glass-panel"> elements replaced with <GlassPanel>.

Acceptance Criteria

• GlassPanel correctly renders its children
• page.tsx uses GlassPanel instead of raw div tags with className="glass-panel"

Closes #32

[drips-wave]

@Spagero763 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

[Copilot]

Pull request overview

Adds a reusable GlassPanel wrapper component to standardize usage of the existing .glass-panel styling across the UI (per issue #32), and migrates the home page to use it.

Changes:

• Added GlassPanel component that renders a .glass-panel wrapper with optional className merging.
• Replaced two raw <div className="glass-panel"> wrappers in page.tsx with <GlassPanel>.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File	Description
frontend/src/app/components/GlassPanel.tsx	Introduces the reusable wrapper component for consistent glass panel styling.
frontend/src/app/page.tsx	Updates the home page to use GlassPanel instead of repeated raw .glass-panel divs.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.