@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&display=swap";:root{--bg-dark: #07090e;--accent-blue: #3b82f6}body{font-family:Inter,sans-serif;background-color:var(--bg-dark);background-image:radial-gradient(circle at 20% 20%,rgba(59,130,246,.05) 0%,transparent 40%),radial-gradient(circle at 80% 80%,rgba(99,102,241,.05) 0%,transparent 40%)}.glass-effect{background:#ffffff03;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.05);box-shadow:0 8px 32px #0000005e}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px);filter:blur(10px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}.spectral-card{display:flex;align-items:center;gap:1.25rem;padding:1rem;border-radius:1.5rem;background:#ffffff08;border:1px solid rgba(255,255,255,.04);transition:all .5s cubic-bezier(.2,1,.2,1);cursor:pointer;opacity:0;animation:fadeInUp .7s cubic-bezier(.2,1,.2,1) forwards;animation-delay:var(--delay, 0s);position:relative;overflow:hidden}.spectral-card:hover{background:#3b82f60d;transform:translate(12px);border-color:#3b82f666}.color-swatch{width:5rem;height:5rem;border-radius:1rem;border:1px solid rgba(255,255,255,.1);transition:transform .4s ease}.spectral-card:hover .color-swatch{transform:scale(1.05) rotate(2deg)}.color-hex{display:block;color:#fff;font-family:JetBrains Mono,monospace;font-weight:700;font-size:1.25rem;letter-spacing:-.02em}.copy-label{font-size:9px;color:#64748b;text-transform:uppercase;font-weight:800;letter-spacing:.15em;transition:all .3s ease}.color-rgb{font-size:10px;color:#475569;font-family:JetBrains Mono,monospace;margin-top:2px;opacity:.6}.copy-icon{opacity:0;transform:translate(10px);transition:all .3s ease;color:#64748b}.spectral-card:hover .copy-icon{opacity:1;transform:translate(0)}.is-dragging{border-color:var(--accent-blue)!important;background:#3b82f60d!important;transform:scale(.99)}
