prism-glass-pro-redesignlisted

# Prism Glass Pro Redesign ## When to use When transforming a Tailwind + React app to a dark glassmorphism aesthetic with cyan/purple neon accents, frameless window, Material Symbols icons, and Three.js globe. ## Core colors - `background-deep`: `#05050A` - `primary-fixed` (cyan): `#14fbfb` - `secondary-container` (purple): `#7000ff` - `accent-magenta`: `#FF0055` - `status-success`: `#4ade80` - `on-surface` (text): `#dbe4e3` - `on-surface-variant` (muted): `#b9cac9` - `text-muted`: `#8B949E` - `border-glass`: `rgba(255, 255, 255, 0.15)` - `surface-glass`: `rgba(255, 255, 255, 0.05)` - `surface-glass-hover`: `rgba(255, 255, 255, 0.1)` ## Essential CSS classes (globals.css) ```css .glass-panel { background: rgba(255,255,255,0.05); backdrop-filter: blur(24px); border: 1px solid rgba(255,255,255,0.15); } .glass-header { same as glass-panel but border-bottom } .glass-nav { same as glass-panel but border-right } .shimmer { position:relative; overflow:hidden; } .shimmer::after { content:''; position:absolute; top:0; left:-150%; width:50%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.06),transparent); animation:shimmer 4s infinite linear; } .input-glass { color:#dbe4e3 !important; background-color:rgba(0,0,0,0.2) !important; border:1px solid rgba(255,255,255,0.1); border-radius:12px; padding:0.5rem 1rem; font-family:'Outfit',sans-serif; } .input-glass:focus { border-color:rgba(20,251,251,0.5); box-shadow:0 0 0 3px rgba(20,251,251,0.1); } .btn-cyan {