:root { color-scheme: dark; }
body {
  font-family: 'Inter', sans-serif;
  background: radial-gradient(circle at top, rgba(0, 247, 255, 0.12), transparent 40%), linear-gradient(135deg, #020617 0%, #030712 60%, #020617 100%);
}
.mono { font-family: 'Roboto Mono', monospace; font-feature-settings: "zero" 0; }
.glass { background: rgba(2, 6, 23, 0.9); backdrop-filter: blur(20px); }
.facelet { width: 14px; height: 14px; border-radius: 2px; border: 1px solid rgba(0,0,0,0.4); }
@media (min-width: 640px) { .facelet { width: 16px; height: 16px; } }
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: rgba(51, 65, 85, 0.5); border-radius: 10px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: rgba(0, 247, 255, 0.4); }

.facelet-glow {
  box-shadow: 0 0 10px 3px rgba(0, 247, 255, 0.18), 0 0 28px 6px rgba(0, 247, 255, 0.06);
  transform: translateZ(0);
  animation: faceletPulse 1s ease-out;
}

@keyframes faceletPulse {
  0% { box-shadow: 0 0 8px 2px rgba(0, 247, 255, 0.18); }
  50% { box-shadow: 0 0 14px 4px rgba(0, 247, 255, 0.26); }
  100% { box-shadow: 0 0 8px 2px rgba(0, 247, 255, 0.18); }
}